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

diff --git a/examples/grid/paging.js b/examples/grid/paging.js
index 41b3a799..d4516a5a 100644
--- a/examples/grid/paging.js
+++ b/examples/grid/paging.js
@@ -1,156 +1,121 @@
-/*
- * Ext JS Library 2.2.1
- * Copyright(c) 2006-2009, Ext JS, LLC.
- * licensing@extjs.com
- * 
- * http://extjs.com/license
- */
-
-Ext.onReady(function(){
-
-    // create the Data Store
-    var store = new Ext.data.JsonStore({
-        root: 'topics',
-        totalProperty: 'totalCount',
-        idProperty: 'threadid',
-        remoteSort: true,
-
-        fields: [
-            'title', 'forumtitle', 'forumid', 'author',
-            {name: 'replycount', type: 'int'},
-            {name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
-            'lastposter', 'excerpt'
-        ],
-
-        // load using script tags for cross domain, if the data in on the same domain as
-        // this page, an HttpProxy would be better
-        proxy: new Ext.data.ScriptTagProxy({
-            url: 'http://extjs.com/forum/topics-browse-remote.php'
-        })
-    });
-    store.setDefaultSort('lastpost', 'desc');
-
-
-    // pluggable renders
-    function renderTopic(value, p, record){
-        return String.format(
-                '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
-                value, record.data.forumtitle, record.id, record.data.forumid);
-    }
-    function renderLast(value, p, r){
-        return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
-    }
-
-    var pagingBar = new Ext.PagingToolbar({
-        pageSize: 25,
-        store: store,
-        displayInfo: true,
-        displayMsg: 'Displaying topics {0} - {1} of {2}',
-        emptyMsg: "No topics to display",
-        
-        items:[
-            '-', {
-            pressed: true,
-            enableToggle:true,
-            text: 'Show Preview',
-            cls: 'x-btn-text-icon details',
-            toggleHandler: function(btn, pressed){
-                var view = grid.getView();
-                view.showPreview = pressed;
-                view.refresh();
-            }
-        }]
-    });
-
-    var grid = new Ext.grid.GridPanel({
-        el:'topic-grid',
-        width:700,
-        height:500,
-        title:'ExtJS.com - Browse Forums',
-        store: store,
-        trackMouseOver:false,
-        disableSelection:true,
-        loadMask: true,
-
-        // grid columns
-        columns:[{
-            id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
-            header: "Topic",
-            dataIndex: 'title',
-            width: 420,
-            renderer: renderTopic,
-            sortable: true
-        },{
-            header: "Author",
-            dataIndex: 'author',
-            width: 100,
-            hidden: true,
-            sortable: true
-        },{
-            header: "Replies",
-            dataIndex: 'replycount',
-            width: 70,
-            align: 'right',
-            sortable: true
-        },{
-            id: 'last',
-            header: "Last Post",
-            dataIndex: 'lastpost',
-            width: 150,
-            renderer: renderLast,
-            sortable: true
-        }],
-
-        // customize view config
-        viewConfig: {
-            forceFit:true,
-            enableRowBody:true,
-            showPreview:true,
-            getRowClass : function(record, rowIndex, p, store){
-                if(this.showPreview){
-                    p.body = '<p>'+record.data.excerpt+'</p>';
-                    return 'x-grid3-row-expanded';
-                }
-                return 'x-grid3-row-collapsed';
-            }
-        },
-
-        // paging bar on the bottom
-        bbar: pagingBar
-    });
-
-    // render it
-    grid.render();
-
-    // trigger the data store load
-    store.load({params:{start:0, limit:25}});
-});
-
-
-
-/**
- * @class Ext.ux.SliderTip
- * @extends Ext.Tip
- * Simple plugin for using an Ext.Tip with a slider to show the slider value
- */
-Ext.ux.SliderTip = Ext.extend(Ext.Tip, {
-    minWidth: 10,
-    offsets : [0, -10],
-    init : function(slider){
-        slider.on('dragstart', this.onSlide, this);
-        slider.on('drag', this.onSlide, this);
-        slider.on('dragend', this.hide, this);
-        slider.on('destroy', this.destroy, this);
-    },
-
-    onSlide : function(slider){
-        this.show();
-        this.body.update(this.getText(slider));
-        this.doAutoWidth();
-        this.el.alignTo(slider.thumb, 'b-t?', this.offsets);
-    },
-
-    getText : function(slider){
-        return slider.getValue();
-    }
-});
+/*!
+ * Ext JS Library 3.0.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.onReady(function(){
+
+    // create the Data Store
+    var store = new Ext.data.JsonStore({
+        root: 'topics',
+        totalProperty: 'totalCount',
+        idProperty: 'threadid',
+        remoteSort: true,
+
+        fields: [
+            'title', 'forumtitle', 'forumid', 'author',
+            {name: 'replycount', type: 'int'},
+            {name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
+            'lastposter', 'excerpt'
+        ],
+
+        // load using script tags for cross domain, if the data in on the same domain as
+        // this page, an HttpProxy would be better
+        proxy: new Ext.data.ScriptTagProxy({
+            url: 'http://extjs.com/forum/topics-browse-remote.php'
+        })
+    });
+    store.setDefaultSort('lastpost', 'desc');
+
+
+    // pluggable renders
+    function renderTopic(value, p, record){
+        return String.format(
+                '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
+                value, record.data.forumtitle, record.id, record.data.forumid);
+    }
+    function renderLast(value, p, r){
+        return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
+    }
+
+    var grid = new Ext.grid.GridPanel({
+        width:700,
+        height:500,
+        title:'ExtJS.com - Browse Forums',
+        store: store,
+        trackMouseOver:false,
+        disableSelection:true,
+        loadMask: true,
+
+        // grid columns
+        columns:[{
+            id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
+            header: "Topic",
+            dataIndex: 'title',
+            width: 420,
+            renderer: renderTopic,
+            sortable: true
+        },{
+            header: "Author",
+            dataIndex: 'author',
+            width: 100,
+            hidden: true,
+            sortable: true
+        },{
+            header: "Replies",
+            dataIndex: 'replycount',
+            width: 70,
+            align: 'right',
+            sortable: true
+        },{
+            id: 'last',
+            header: "Last Post",
+            dataIndex: 'lastpost',
+            width: 150,
+            renderer: renderLast,
+            sortable: true
+        }],
+
+        // customize view config
+        viewConfig: {
+            forceFit:true,
+            enableRowBody:true,
+            showPreview:true,
+            getRowClass : function(record, rowIndex, p, store){
+                if(this.showPreview){
+                    p.body = '<p>'+record.data.excerpt+'</p>';
+                    return 'x-grid3-row-expanded';
+                }
+                return 'x-grid3-row-collapsed';
+            }
+        },
+
+        // paging bar on the bottom
+        bbar: new Ext.PagingToolbar({
+            pageSize: 25,
+            store: store,
+            displayInfo: true,
+            displayMsg: 'Displaying topics {0} - {1} of {2}',
+            emptyMsg: "No topics to display",
+            items:[
+                '-', {
+                pressed: true,
+                enableToggle:true,
+                text: 'Show Preview',
+                cls: 'x-btn-text-icon details',
+                toggleHandler: function(btn, pressed){
+                    var view = grid.getView();
+                    view.showPreview = pressed;
+                    view.refresh();
+                }
+            }]
+        })
+    });
+
+    // render it
+    grid.render('topic-grid');
+
+    // trigger the data store load
+    store.load({params:{start:0, limit:25}});
+});