Docstoc

Seaside hot

Document Sample
Seaside hot Powered By Docstoc
					                       h ot
                Seaside                                            Why should I upgrade?
                  Web 2.0
                      Lukas Renggli
                  renggli@iam.unibe.ch


Lukas Renggli              1             Seaside   Lukas Renggli             2             Seaside




                Collaboration                                             Design



Lukas Renggli              3             Seaside   Lukas Renggli             4             Seaside




                  Liveliness                                              Sharing



Lukas Renggli              5             Seaside   Lukas Renggli             6             Seaside
                    Usability                                              How can I upgrade?
                                                                               Can I do it with Seaside?




Lukas Renggli               7                    Seaside   Lukas Renggli                   8                   Seaside




                                             !                                                             !
                    XHTML                                                              CSS
                Semantically valid markup                                        Cascading Style-Sheets




Lukas Renggli               9                    Seaside   Lukas Renggli                  10                   Seaside




                                             !
                        RSS
                 Really Simple Syndication


                                                                                     AJAX
                                                                            Asynchronous JavaScript and XML

Lukas Renggli              11                    Seaside   Lukas Renggli                  12                   Seaside
                    COMET                                                     Seaside
                HTTP Streaming, Server Push                                   Web 2.0


Lukas Renggli              13                  Seaside   Lukas Renggli            14              Seaside




                                                                                           ye s
                                                                          Concentrate onto
                   Challenge
                                                                         the Web application


Lukas Renggli              15                  Seaside   Lukas Renggli            16              Seaside




                                          no                                               no
                    Browser                                                   Browser
                      Bugs                                                   Differences


Lukas Renggli              17                  Seaside   Lukas Renggli            18              Seaside
                                no
                    Browser
                Incompatibilities


Lukas Renggli           19           Seaside   Lukas Renggli          20          Seaside




Lukas Renggli           21           Seaside   Lukas Renggli          22          Seaside




                Tight Integration                              Feature Complete



Lukas Renggli           23           Seaside   Lukas Renggli          24          Seaside
                     Up-To-Date                                       Say it in Smalltalk



Lukas Renggli             25            Seaside   Lukas Renggli                    26                   Seaside




                     Avi Bryant
                www.smallthought.com
                                                                      Say it in Smalltalk
                   Lukas Renggli
                 www.lukas-renggli.ch
Lukas Renggli             27            Seaside   Lukas Renggli                    28                   Seaside




                    No JavaScript                                  Still, you need to be aware that
                    Programming                                   your code will result in JavaScript




Lukas Renggli             29            Seaside   Lukas Renggli                    30                   Seaside
                     Think of it as Magic                                                        Adding JavaScript Events
                                html effect
                                  id: ‘hint’;
                                  shake                                                           html div
                                                                                                    onClick: (html effect toggle);
                                                                                                    with: [ ... ]

                       new Effect.Shake(‘hint’)

Lukas Renggli                          31                              Seaside   Lukas Renggli                           32                      Seaside




                    AJAX – Step by Step                                                                   AJAX Strategies
                             Choose a strategy

         html (updater|periodical|request|evaluator)                                             •    Request
           [ OPTIONS; ]*
           [ HANDLER; ]*               Define options                                             •    Updater
           [ TRIGGER; ]*                                                                             – Insertion
           [ CALLBACK; ]*                     Assign http                                            – Periodical
                                                      event handlers                             •    Evaluator
       Define primary (and                Set triggers to
       secondary) callbacks           serialize client state

Lukas Renggli                          33                              Seaside   Lukas Renggli                           34                      Seaside




                          AJAX Request                                                                     AJAX Updater

                •   Perform a request and evaluate the callback
                                                                                                 •   Replace the contents of the DOM element
                    ajaxCallback on the server.
                                                                                                     named domId with XHTML rendered by
                •   Note: A bug in your code doesn’t show up in
                                                                                                     renderAjaxOn:.
                    the Web browser, but directly as a debugger
                    within your development image.                                                   html updater
                                                                                                       id: domId;
                    html request                                                                       callback: [ :r | self renderAjaxOn: r ]
                      callback: [ self ajaxCallback ]


Lukas Renggli                          35                              Seaside   Lukas Renggli                           36                      Seaside
                                Triggers                                                                 In Place Editing

                •   triggerForm: aDomId
                    Trigger the form aDomId and all containing
                    form-fields and associated callbacks.
                • triggerFormElement: aDomId
                    Trigger the callback of the form element                                  html paragraph
                    named aDomId. Does not work for checkbox                                    script: (html inPlaceEditor
                    and multi-select list.                                                         triggerInPlaceEditor: [ :v | text := v ];
                                                                                              ! ! callback: [ :r | r render: text ]);
                                                                                              ! ! with: text
Lukas Renggli                            37                               Seaside   Lukas Renggli                       38                     Seaside




                            Sortable List                                                                  Drag & Drop
                                                                                                                 html div
                               html unorderedList                                                                  class: ‘shape’;
                                 id: ‘list’;                                                                       passenger: aCircle;
                                 script: (html sortable                                                            script: html draggable
                                    onUpdate: (html request                            html div
                                        triggerSortable: ‘list’                          id: ‘dropbox’;
                                        callback: [ :v | list := v ]));                  script: (html droppable
                                 with: [                                                   accept: ‘shape’;
                                    list do: [ :each |                                     onDrop: (html updater
                                         html listItem                                         id: ‘dropbox’;
                                             passenger: each;                                  triggerPassenger: [ :v | box add: v ];
                                             with: each label ] ]                              callback: [ :r | self renderBox: r ]));
                                                                                         with: [ html renderBox: r ]
Lukas Renggli                            39                               Seaside   Lukas Renggli                       40                     Seaside




                What about debugging?



Lukas Renggli                            41                               Seaside   Lukas Renggli                       42                     Seaside
Lukas Renggli          43                 Seaside   Lukas Renggli          44         Seaside




                                                                    “It‘s more like
        scriptaculous.seasidehosting.st
                                                                       Web 3.0”

Lukas Renggli          45                 Seaside   Lukas Renggli          46         Seaside

				
DOCUMENT INFO
Shared By:
Categories:
Stats:
views:6
posted:5/15/2011
language:English
pages:8