~deryck/lazr-js/morphing-window-dialog

« back to all changes in this revision

Viewing changes to examples/formoverlay/index.html

  • Committer: Launchpad Patch Queue Manager
  • Date: 2009-11-20 06:31:36 UTC
  • mfrom: (81.6.10 combo-service)
  • Revision ID: launchpad@pqm.canonical.com-20091120063136-l0c6tx95299yc2kr
[r=mars] Add a sample combo service for the YUI loader.

Show diffs side-by-side

added added

removed removed

Lines of Context:
5
5
  <title>LAZR JS Examples: lazr.formoverlay</title>
6
6
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
7
7
 
8
 
  <script type="text/javascript" src="../../build/yui/current/build/yui/yui.js"></script>
9
 
  <script type="text/javascript" src="../../build/lazr/lazr.js"></script>
10
 
  <script type="text/javascript" src="../../build/overlay/overlay.js"></script>
11
 
  <script type="text/javascript" src="../../build/formoverlay/formoverlay.js"></script>
12
 
 
13
 
  <link rel="stylesheet" href="../../build/yui/current/build/cssreset/reset.css"/>
14
 
  <link rel="stylesheet" href="../../build/yui/current/build/cssfonts/fonts.css"/>
15
 
  <link rel="stylesheet" href="../../build/yui/current/build/cssbase/base.css"/>
16
 
  <link rel="stylesheet" href="../../build/overlay/assets/pretty-overlay-core.css"/>
17
 
  <link rel="stylesheet" href="../../build/overlay/assets/skins/sam/pretty-overlay-skin.css"/>
18
 
  <link rel="stylesheet" href="../../build/formoverlay/assets/formoverlay.css"/>
19
 
 
20
 
  <script type="text/javascript">
21
 
 
22
 
YUI({
23
 
    base: "../../build/yui/current/build/",
24
 
    filter: 'raw',
25
 
}).use('lazr.formoverlay', 'node', 'event', 'dump', function(Y) {
 
8
  <script type="text/javascript" src="../../build/yui/yui-min.js"></script>
 
9
  <script type="text/javascript" src="../../build/lazr/lazr-meta.js"></script>
 
10
  <script type="text/javascript">
 
11
    var LAZR_YUI_CONFIG = {
 
12
        filter: "min",
 
13
        base: "../../build/",
 
14
        modules: LAZR_MODULES,
 
15
    };
 
16
  </script>
 
17
 
 
18
  <script type="text/javascript">
 
19
 
 
20
YUI(LAZR_YUI_CONFIG).use('cssreset', 'cssfonts', 'cssbase',
 
21
                         'lazr.formoverlay', 'node', 'event',
 
22
                         'dump', function(Y) {
26
23
 
27
24
    var big_error = [
28
25
        'Traceback (most recent call last):',
126
123
 
127
124
  <h3>Javascript</h3>
128
125
  <pre>
129
 
    &lt;script type=&quot;text/javascript&quot; src=&quot;../../build/yui/current/build/yui/yui.js&quot;&gt;&lt;/script&gt;
130
 
    &lt;script type=&quot;text/javascript&quot; src=&quot;../../build/overlay/overlay.js&quot;&gt;&lt;/script&gt;
131
 
    &lt;script type=&quot;text/javascript&quot; src=&quot;../../build/formoverlay/formoverlay.js&quot;&gt;&lt;/script&gt;
132
 
  </pre>
133
 
 
134
 
  <h3>CSS</h3>
135
 
  <pre>
136
 
    &lt;link rel=&quot;stylesheet&quot; href=&quot;../../build/overlay/assets/pretty-overlay-core.css&quot; /&gt;
137
 
    &lt;link rel=&quot;stylesheet&quot; href=&quot;../../build/overlay/assets/skins/sam/pretty-overlay-skin.css&quot; /&gt;
138
 
    &lt;link rel=&quot;stylesheet&quot; href=&quot;../../build/formoverlay/assets/formoverlay.css&quot; /&gt;
 
126
    &lt;script type=&quot;text/javascript&quot; src=&quot;../../build/yui/current/build/yui/yui-min.js&quot;&gt;&lt;/script&gt;
 
127
    &lt;script type=&quot;text/javascript&quot; src=&quot;../../build/lazr/lazr-meta.js&quot;&gt;&lt;/script&gt;
139
128
  </pre>
140
129
 
141
130
  <h2>Widget Setup</h2>
143
132
     The normal Overlay attributes (such as headerContent) can be used
144
133
     as expected.</p>
145
134
  <pre><code>
 
135
    var LAZR_YUI_CONFIG = {
 
136
        filter: "min",
 
137
        base: "../../build/",
 
138
        modules: LAZR_MODULES,
 
139
    };
 
140
    YUI(LAZR_YUI_CONFIG).use("lazr.formoverlay", function(Y){
146
141
      var form_content = 'Enter name: &lt;input type=&quot;text&quot; name=&quot;username&quot; /&gt;';
147
142
      var formoverlay = new Y.lazr.FormOverlay({
148
143
          headerContent: '&lt;h2&gt;Your Form Title&lt;/h2&gt;',
149
144
          form_content: form_content});
150
145
      formoverlay.render();
 
146
    });
151
147
  </code></pre>
152
148
  <p><strong>Note:</strong> The form content can be passed as either a string
153
149
     of HTML (as is useful if the form is obtained via an AJAX request) or