err.no Git - sope/blob - sope-appserver/WEPrototype/README

   1 WEPrototype
   2 ===========
   3
   4 This framework contains dynamic elements wrapping and connecting the
   5 excellent Prototype JavaScript library.
   6
   7 http://api.rubyonrails.com/classes/ActionView/Helpers/JavaScriptHelper.html#M000394
   8
   9 Prototype functions
  10 ===================
  11
  12 Prototype
  13 =========
  14
  15 Prototype
  16 - 'Version' property
  17
  18 Class
  19   .create()
  20
  21 Abstract
  22
  23 [Object]
  24   .extend(otherobject) - copy properties of 'otherobject' to receiver
  25
  26 [Function]
  27   .bind(object)
  28   .bindAsEventListener(object)
  29
  30 [Number]
  31   .toColorPart()
  32
  33 Try
  34
  35 PeriodicalExecuter
  36   .initialize(callback, frequency)
  37   .registerCallback()
  38   .onTimerEvent
  39
  40 $(...)
  41 - run getElementById() for arguments
  42 - return array for multiple, a single for one
  43
  44
  45 Form
  46 ====
  47
  48 Field
  49   .clear(...)        - resolve names using $() and reset value
  50     eg: Field.clear("sender", "from", "to")
  51   .present(...)      - check whether all elements have values
  52   .focus(element)    - lookup element using $() and focus
  53   .select(element)   - lookup element using $() and select
  54   .activate(element) - lookup element using $() and focus+select
  55
  56 Form
  57   .serialize(form)
  58   .getElements(form)
  59   .disable(form)
  60   .focusFirstElement(form)
  61   .reset(form)
  62
  63 Form.Element
  64   .serialize(element)
  65   .getValue(element)
  66
  67 Form.Element.Serializers
  68
  69 Abstract.TimedObserver
  70   .initialize(element, frequency, callback)
  71
  72 Form.Element.Observer : Abstract.TimedObserver
  73   .getValue
  74
  75 Form.Observer : Abstract.TimedObserver
  76   .getValue
  77
  78
  79 AJAX
  80 ====
  81
  82 Ajax.getTransport()
  83 - return XMLHTTP object depending on browser
  84
  85 Ajax.Base()
  86   .setOptions(dict)
  87     method       - post
  88     asynchronous - true
  89     parameters   - ''
  90
  91 Ajax.Request()
  92   - states: Uninitialized, Loading, Loaded, Interactive, Complete
  93   .initialize(url, options)
  94
  95 Ajax.Updater()
  96   .initialize(container, url, options)
  97    options:
  98    - Base options
  99    'insertion' => function(container, responseText) => default: .innerHTML
 100
 101
 102 Effects
 103 =======
 104 TODO
 105
 106
 107 DOM
 108 ===
 109
 110 document.getElementsByClasName(className)
 111
 112 Element
 113   .toggle(...)         - toggle style between "None" and ""
 114   .hide(...)
 115   .show(...)
 116   .remove(elemName)    - removed named element (lookup using $())
 117   .getHeight(elemName)
 118
 119 Toggle
 120   .display(..)         - same like Element.toggle()
 121
 122 Abstract.Insertion(adjacency)
 123   .initialize(element, content)
 124
 125 Insertion.Before : Abstract.Insertion
 126
 127 Insertion.Top    : Abstract.Insertion
 128
 129 Insertion.Bottom : Abstract.Insertion
 130
 131 Insertion.After  : Abstract.Insertion
 132
 133
 134 Compat
 135 ======
 136 TODO
 137
 138
 139 RoR
 140 ===
 141 <form action="/articles/comment/46"
 142       class="commentform"
 143       id="commentform" method="post"
 144       onsubmit="new Ajax.Updater('commentList', '/articles/comment/46', {onLoading:function(request){item_loading()}, onComplete:function(request){item_added()}, parameters:Form.serialize(this), insertion:Insertion.Bottom, evalScripts:true, asynchronous:true}); return false;"
 145 >
 146
 147
 148         <td> <input id="comment_author" name="comment[author]" size="20" type="text" value="" /> <small><a href="javascript:Element.toggle('guest_url')">(leave url &#187;)</a></small></td>
 149
 150
 151 link_to_remote word,
 152       :url => { :action => "action" },
 153       404 => "alert('Not found...? Wrong URL...?')",
 154       :failure => "alert('HTTP Error ' + request.status + '!')"
 155
 156
 157 link_to_remove
 158   :url
 159   :update
 160     :update => "emails"
 161     or
 162     :update => { :success => "posts", :failure => "error" }
 163   :position
 164     - :before, :top, :bottom, :after
 165  Callbacks
 166   :complete
 167   :loading
 168   :loaded
 169   :interactive
 170   :failure
 171   :confirm     - add confirmation dialog
 172   :condition
 173   :before      - before request is initiated
 174   :after       - after request was initiated and before :loading