Bienvenue à Blogs CodeS-SourceS Identification | Inscription | Aide

Atteint de JavaScriptite Aiguë [Cyril Durand]

Expert ASP.net Ajax et WCF, Cyril Durand parle dans son blog de point techniques sur ASP.net, ASP.net Ajax, JavaScript, WCF et .net en général. Cyril est également consultant indépendant, n'hésitez pas à le contacter pour de l'assistance sur vos projets

Actualités

  • Blog de Cyril DURAND, passionné de JavaScript, Ajax, ASP.net et tout ce qui touche au developpement Web Client-Side.

    N'hésitez pas à me contacter pour vos projets .net : architecture, accompagnement, formation, ...

    View Cyril Durand's profile on LinkedIn
    hit counters


    Expertise Commerce server et BizTalk

Atlas ? mais kesako ?
 
On entend souvent parlé de Atlas mais finalement peu de personnes savent réélement ce que c'est !
 
 
Atlas est le nom de code d'un projet Microsoft qui va révolutionner le ClientSide en asp.net. L'annonce de ce projet a été fait le 28 juin 2005 par Scott Guthries (le "patron" d'asp.net) : Atlas Project (voir aussi le post d'Aurélien la dessus).
 
Depuis cette annonce le projet a beaucoup évolué et en bien ! :-). Avec la version de mars, Atlas possede une licence go-live (ie : on peut s'en servir en production) les bases du projet devront donc moins bouger, c'est pour cela que je suis en train d'appronfondir ce projet ! De plus on apprend aujourd'hui que toutes les futures versions d'Atlas seront aussi en go-live.
 
Mais Atlas c'est quoi ? à quoi ça sert ?
 
Tout d'abord un peu d'histoire : ASP .net 1.x et Visual Studio 2003 permettait de faire des choses trés sympa, facilement. Mais il ne fallait surtout pas regarder le code HTML généré, s'attendre à avoir une bonne experience utilisateur, etc... Cette version d'asp.net était surtout déstiné à faire des sites intranets.
 
Avec la version ASP .net 2 et Visual Studio 2005, Microsoft commence à s'interesser au site web "grand public", les sites qui ont besoin d'une experience utilisateur sympa peuvent enfin le faire. Contrairement à Visual Studio 2003, Visual Studio 2005 ou Visual Web Dev Express (gratuit) ne modifie pas le code HTML lors du passage entre le mode design et le mode "source", il possede de l'intellisense de partout (dans le html, le CSS, le XML, ...) qui varie suivant le doctype que l'on choisie, asp.net 2 génére du code xHTML valide et propre ! Il intégre Ajax grace au ClientCallBack ( voir mon article : Le clientCallBack dans nos CustomControls) bref asp.net 2 commence à s'ouvrir au web.
 
Atlas est l'évolution de tout ca ! c'est un Framework qui permet de faire des applications web riches. Il se décompose en 2 parties, la partie serveur et la partie cliente.
La partie serveur est sympa (je détaillerais peut etre plus tard, mais mon petit doigt me dit que cela risque encore d'évoluer, du moins d'être étoffé ;))  
 
La partie cliente est par contre ENORME ! + de 13 000 lignes de JavaScript, compatible sur les principaux navigateurs du marché. Une approche du web complétement révolutionnaire, complétement gratuit, n'importe quel technologies coté serveur peut etre utilisé, certes l'intégration de Atlas dans ASP.net est trés appréciable mais pas indispensable.
J'ai étudié pas mal de frameworks javascript et celui ci est vraiment révolutionnaire !
 
Ce qui me plait le plus est l'approche de la technologie, tout en déclaratif (XML), c'est un grand pas vers XAML !
 
En gros, ca fonctionne comment ?
 
Une application Atlas n'est rien de plus qu'une page web xHTML classique a laquelle on a rajouté des fichiers javascript. Ce qu'il y a de révolutionnaire c'est que pour définir nos comportements on le fait via une syntaxe XML.
 
Pour clarifier tout ca voici un schéma de ma création :-)
 
AtlasSchema.jpg
On voit donc qu'il y a une séparation trés claire, entre la sémantique HTML, le comportement des controles HTML (le XML-Script : la grande idée !), le framework Atlas Client et bien sur toujours le CSS.
 
Par exemple imaginons une page ayant ce code HTML
 
        <div id="left">
            <div class="CSPart" id="CSPart1">
                <div id="title1" class="CSPart_Title">Title</div>
                <div class="CSPart_Content">Contenu de la CSPart</div>
            </div>
        </div>
   
        <div id="right">
 
        </div>
 
        <div class="templates">
            <div id="dropCueTemplate" class="dropCueTemp">
            </div>
            <div id="emptyTemplate" class="emptyTemp">
                AN EMPTY SPACE TO DROP THE BOX</div>
        </div>
 
Nous avons alors une page avec 2 colonnes et un pavé (CSPart), maintenant si l'on veut déplacer le CSPart1 de la colonne de droite vers la colonne de gauche, il faudra écrire du XML-Script à la fin de notre page XHTML (cette syntaxe est parfaitement valide W3C).
 
    <script type="text/xml-script">
        <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
            <references>
            </references>
            <components>
               

                <control id="left">
                    <behaviors>
                        <dragDropList dataType="HTML" acceptedDataTypes="'HTML'" dragMode="Move" direction="Vertical">
                            <dropCueTemplate>
                                <template layoutElement="dropCueTemplate" />
                            </dropCueTemplate>
                            <emptyTemplate>
                                <template layoutElement="emptyTemplate" />
                            </emptyTemplate>
                        </dragDropList>
                    </behaviors>
                </control>
               
                <control id="right">
                    <behaviors>
                        <dragDropList dataType="HTML" acceptedDataTypes="'HTML'" dragMode="Move" direction="Vertical">
                            <dropCueTemplate>
                                <template layoutElement="dropCueTemplate" />
                            </dropCueTemplate>
                            <emptyTemplate>
                                <template layoutElement="emptyTemplate" />
                            </emptyTemplate>
                        </dragDropList>
                    </behaviors>
                </control>
               
                <control id="CSPart1">
                    <behaviors>
                        <draggableListItem handle="title1"/>
                    </behaviors>
                </control>               
                             
            </components>
        </page>
    </script>
Je ne vais pas détailler ce que fais ce bout de XML. Pour l'instant il n'y a pas de designer pour écrire tout ca, mais Expression Web Designer devrait réglé ce problème.
 
Une fois que le navigateur aura chargé la page, Atlas va déserialisé ce xml pour créer 1 instance d'un "draggableListItem" lié avec le composant HTML d'id "CSPart1" (ce controle peut etre déplacable dans des controles "dragDropList") ainsi que de 2 instances d'un "dragDropList" associé aux éléments HTML d'id "right" et "left".
 
Malgré qu'Atlas soit un framework client écrit en javascript, il vous sera inutile d'écrire du JavaScript pour l'utiliser.
Posted: jeudi 30 mars 2006 11:57 par cyril
Classé sous :
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :

Commentaires

badrbadr a dit :

t es vraiment doué Cyril
chapeau
# mars 30, 2006 18:59

Fred D a dit :

Dur le retour, remarque quand on fait des remarques sur la forme c'est que le fond est bon ;-)
# mars 31, 2006 10:34

Nurgle a dit :

oui, en plus c'est vrai, le fond est génial :D
(vive Atlas !)
# avril 3, 2006 21:07

Netah a dit :

Nous en avons d&#233;j&#224; parl&#233;... Pour ceux que le Web 2 int&#233;resse (AJAX), Atlas devrait en r&#233;volutionner l'approche...
# avril 5, 2006 10:59

Cyril 's Blog a dit :



&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; I.&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;...
# avril 12, 2006 19:03

Cyril 's Blog a dit :

Depuis quelques jours je suis en train de diss&#233;quer Atlas c&#244;t&#233; client&amp;nbsp;: je confirme, c'est vraiment...
# avril 19, 2006 21:42

Cyril 's Blog a dit :

Depuis quelques jours je suis en train de diss&#233;quer Atlas c&#244;t&#233; client&#160;: je confirme, c'est vraiment &#233;norme...
# avril 19, 2006 22:37

Cyril 's Blog a dit :

Depuis quelques jours je suis en train de diss&#233;quer Atlas c&#244;t&#233; client&#160;: je confirme, c'est vraiment &#233;norme...
# avril 19, 2006 22:40

Cyril 's Blog a dit :

Depuis quelques jours je suis en train de diss&#233;quer Atlas c&#244;t&#233; client&#160;: je confirme, c'est vraiment &#233;norme...
# avril 19, 2006 22:43

Jeremie a dit :

Salut,

Quelqu'un sait comment ca marche les
DataSourceDropTarget !

Je marrache un peu les cheveux avec :(

'ci d'avance :)
# mai 25, 2006 23:25

ddev a dit :

Je n'arrive pas à faire tourner l'exemple.

J'ai rajouté dans un page aspx tout ça avec une ligne dans le head

<atlas:ScriptManager ID="ScriptManager1" runat="server" />

 Hover Example

               Title

               Contenu de la CSPart

               AN EMPTY SPACE TO DROP THE BOX

     <![CDATA[

       <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">

           <references>

           </references>

           <components>

               <control id="left">

                   <behaviors>

                       <dragDropList dataType="HTML" acceptedDataTypes="'HTML'" dragMode="Move" direction="Vertical">

                           <dropCueTemplate>

                               <template layoutElement="dropCueTemplate" />

                           </dropCueTemplate>

                           <emptyTemplate>

                               <template layoutElement="emptyTemplate" />

                           </emptyTemplate>

                       </dragDropList>

                   </behaviors>

               </control>

               <control id="right">

                   <behaviors>

                       <dragDropList dataType="HTML" acceptedDataTypes="'HTML'" dragMode="Move" direction="Vertical">

                           <dropCueTemplate>

                               <template layoutElement="dropCueTemplate" />

                           </dropCueTemplate>

                           <emptyTemplate>

                               <template layoutElement="emptyTemplate" />

                           </emptyTemplate>

                       </dragDropList>

                   </behaviors>

               </control>

               <control id="CSPart1">

                   <behaviors>

                       <draggableListItem handle="title1"/>

                   </behaviors>

               </control>              

           </components>

       </page>

   ]]>

# juillet 29, 2008 14:53

ddev a dit :

Je n'arrive pas à faire tourner l'exemple.

J'ai rajouté dans un page aspx tout ça avec une ligne dans le head

<atlas:ScriptManager ID="ScriptManager1" runat="server" />

# juillet 29, 2008 14:54

ddev a dit :

Je n'arrive pas à faire tourner l'exemple.

J'ai rajouté dans un page aspx tout ça avec une ligne dans le head

   <atlas:ScriptManager ID="ScriptManager1" runat="server" ...

Mais j'ai plein de message :

Assertion Failed : unrecognized tag script:dragDropList

Break into debugger :

>>> source : pas possible de coller

# juillet 29, 2008 14:54

cyril a dit :

Ce post parle d'un produit en beta en 2006, il est donc obsolete, je te conseille de regarder du coté de ASP.net Ajax quiest la version RTM de Atlas.

# juillet 29, 2008 14:58
Les commentaires anonymes sont désactivés

Les 10 derniers blogs postés

- Office 365: Script PowerShell pour auditer l’usage des Office Groups de votre tenant par Blog Technique de Romelard Fabrice le 04-26-2019, 11:02

- Office 365: Script PowerShell pour auditer l’usage de Microsoft Teams de votre tenant par Blog Technique de Romelard Fabrice le 04-26-2019, 10:39

- Office 365: Script PowerShell pour auditer l’usage de OneDrive for Business de votre tenant par Blog Technique de Romelard Fabrice le 04-25-2019, 15:13

- Office 365: Script PowerShell pour auditer l’usage de SharePoint Online de votre tenant par Blog Technique de Romelard Fabrice le 02-27-2019, 13:39

- Office 365: Script PowerShell pour auditer l’usage d’Exchange Online de votre tenant par Blog Technique de Romelard Fabrice le 02-25-2019, 15:07

- Office 365: Script PowerShell pour auditer le contenu de son Office 365 Stream Portal par Blog Technique de Romelard Fabrice le 02-21-2019, 17:56

- Office 365: Script PowerShell pour auditer le contenu de son Office 365 Video Portal par Blog Technique de Romelard Fabrice le 02-18-2019, 18:56

- Office 365: Script PowerShell pour extraire les Audit Log basés sur des filtres fournis par Blog Technique de Romelard Fabrice le 01-28-2019, 16:13

- SharePoint Online: Script PowerShell pour désactiver l’Option IRM des sites SPO non autorisés par Blog Technique de Romelard Fabrice le 12-14-2018, 13:01

- SharePoint Online: Script PowerShell pour supprimer une colonne dans tous les sites d’une collection par Blog Technique de Romelard Fabrice le 11-27-2018, 18:01