X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/ee06f37b0f6f6d94cd05a6ffae556660f7c4a2bc..c930e9176a5a85509c5b0230e2bff5c22a591432:/examples/init.js

diff --git a/examples/init.js b/examples/init.js
new file mode 100644
index 00000000..b161eb4a
--- /dev/null
+++ b/examples/init.js
@@ -0,0 +1,161 @@
+/*!
+ * Ext JS Library 3.0.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.ns('Ext.samples');
+
+(function() {
+
+SamplePanel = Ext.extend(Ext.DataView, {
+    autoHeight   : true,
+    frame        : true,
+    cls          : 'demos',
+    itemSelector : 'dd',
+    overClass    : 'over',
+    tpl          : new Ext.XTemplate(
+        '<div id="sample-ct">',
+            '<tpl for=".">',
+            '<div><a name="{id}"></a><h2><div>{title}</div></h2>',
+            '<dl>',
+                '<tpl for="samples">',
+                    '<dd ext:url="{url}"><img src="shared/screens/{icon}"/>',
+                        '<div><h4>{text}',
+                            '<tpl if="this.isNew(values.status)">',
+                                '<span class="new-sample"> (New)</span>',
+                            '</tpl>',
+                            '<tpl if="this.isUpdated(values.status)">',
+                                '<span class="updated-sample"> (Updated)</span>',
+                            '</tpl>',
+                            '<tpl if="this.isExperimental(values.status)">',
+                                '<span class="new-sample"> (Experimental)</span>',
+                            '</tpl>',
+                        '</h4><p>{desc}</p></div>',
+                    '</dd>',
+                '</tpl>',
+            '<div style="clear:left"></div></dl></div>',
+            '</tpl>',
+        '</div>', {
+         isExperimental: function(status){
+             return status == 'experimental';
+         },
+         isNew: function(status){
+             return status == 'new';
+         },
+         isUpdated: function(status){
+             return status == 'updated';
+         }
+    }),
+
+
+    onClick : function(e){
+        var group = e.getTarget('h2', 3, true);
+        if(group){
+            group.up('div').toggleClass('collapsed');
+        }else {
+            var t = e.getTarget('dd', 5, true);
+            if(t && !e.getTarget('a', 2)){
+                var url = t.getAttributeNS('ext', 'url');
+                window.open(url);
+            }
+        }
+        return SamplePanel.superclass.onClick.apply(this, arguments);
+    }
+});
+Ext.samples.SamplePanel = SamplePanel;
+Ext.reg('samplespanel', Ext.samples.SamplePanel);
+})();
+
+Ext.onReady(function(){
+
+
+// Instantiate Ext.App instance
+    App = new Ext.App({});
+
+    var catalog = Ext.samples.samplesCatalog;
+
+    for(var i = 0, c; c = catalog[i]; i++){
+        c.id = 'sample-' + i;
+    }
+
+    var store = new Ext.data.JsonStore({
+        idProperty : 'id',
+        fields     : ['id', 'title', 'samples'],
+        data       : catalog
+    });
+
+    var panel = new Ext.Panel({
+        frame      : true,
+        renderTo   : 'all-demos',
+        height     : 300,
+        autoScroll : true,
+        items      : new SamplePanel({
+            store : store
+        })
+    });
+
+    var tpl = new Ext.XTemplate(
+        '<tpl for="."><li><a href="#{id}">{title:stripTags}</a></li></tpl>'
+    );
+    tpl.overwrite('sample-menu', catalog);
+
+    Ext.select('#sample-spacer').remove();
+
+    var headerEl  = Ext.get('hd'),
+        footerEl  = Ext.get('ft'),
+        bodyEl    = Ext.get('bd'),
+        sideBoxEl = bodyEl.child('div[class=side-box]'),
+        titleEl   = bodyEl.child('h3:first-child');
+
+    var doResize = function() {
+        var windowHeight = Ext.getDoc().getViewSize().height;
+
+        var footerHeight  = footerEl.getHeight() + footerEl.getMargins().top,
+            titleElHeight = titleEl.getHeight() + titleEl.getMargins().top,
+            brElHeight    = bodyEl.child('br').getHeight(),
+            headerHeight  = headerEl.getHeight() + titleElHeight + brElHeight;
+
+        var warnEl = Ext.get('fb');
+        var warnHeight = warnEl ? warnEl.getHeight() : 0;
+
+        var availHeight = windowHeight - ( footerHeight + headerHeight + 14) - warnHeight;
+        var sideBoxHeight = sideBoxEl.getHeight();
+
+        panel.setHeight((availHeight > sideBoxHeight) ? availHeight : sideBoxHeight);
+    }
+
+    // Resize on demand
+    Ext.EventManager.onWindowResize(doResize);
+
+    var firebugWarning = function () {
+        var cp = new Ext.state.CookieProvider();
+
+        if(window.console && window.console.firebug && ! cp.get('hideFBWarning')){
+            var tpl = new Ext.Template(
+                '<div id="fb" style="border: 1px solid #FF0000; background-color:#FFAAAA; display:none; padding:15px; color:#000000;"><b>Warning: </b> Firebug is known to cause performance issues with Ext JS. <a href="#" id="hideWarning">[ Hide ]</a></div>'
+            );
+            var newEl = tpl.insertFirst('all-demos');
+
+            Ext.fly('hideWarning').on('click', function() {
+                Ext.fly(newEl).slideOut('t',{remove:true});
+                cp.set('hideFBWarning', true);
+                doResize();
+            });
+            Ext.fly(newEl).slideIn();
+            doResize();
+        }
+    }
+
+    var hideMask = function () {
+        Ext.get('loading').remove();
+        Ext.fly('loading-mask').fadeOut({
+            remove:true,
+            callback : firebugWarning
+        });
+    }
+
+    hideMask.defer(250);
+    doResize();
+
+});
\ No newline at end of file