portal.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:4k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ Ext.onReady(function(){
  2.     // NOTE: This is an example showing simple state management. During development,
  3.     // it is generally best to disable state management as dynamically-generated ids
  4.     // can change across page loads, leading to unpredictable results.  The developer
  5.     // should ensure that stable state ids are set for stateful components in real apps.
  6.     Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
  7.     // create some portlet tools using built in Ext tool ids
  8.     var tools = [{
  9.         id:'gear',
  10.         handler: function(){
  11.             Ext.Msg.alert('Message', 'The Settings tool was clicked.');
  12.         }
  13.     },{
  14.         id:'close',
  15.         handler: function(e, target, panel){
  16.             panel.ownerCt.remove(panel, true);
  17.         }
  18.     }];
  19.     var viewport = new Ext.Viewport({
  20.         layout:'border',
  21.         items:[{
  22.             region:'west',
  23.             id:'west-panel',
  24.             title:'West',
  25.             split:true,
  26.             width: 200,
  27.             minSize: 175,
  28.             maxSize: 400,
  29.             collapsible: true,
  30.             margins:'35 0 5 5',
  31.             cmargins:'35 5 5 5',
  32.             layout:'accordion',
  33.             layoutConfig:{
  34.                 animate:true
  35.             },
  36.             items: [{
  37.                 html: Ext.example.shortBogusMarkup,
  38.                 title:'Navigation',
  39.                 autoScroll:true,
  40.                 border:false,
  41.                 iconCls:'nav'
  42.             },{
  43.                 title:'Settings',
  44.                 html: Ext.example.shortBogusMarkup,
  45.                 border:false,
  46.                 autoScroll:true,
  47.                 iconCls:'settings'
  48.             }]
  49.         },{
  50.             xtype:'portal',
  51.             region:'center',
  52.             margins:'35 5 5 0',
  53.             items:[{
  54.                 columnWidth:.33,
  55.                 style:'padding:10px 0 10px 10px',
  56.                 items:[{
  57.                     title: 'Grid in a Portlet',
  58.                     layout:'fit',
  59.                     tools: tools,
  60.                     items: new SampleGrid([0, 2, 3])
  61.                 },{
  62.                     title: 'Another Panel 1',
  63.                     tools: tools,
  64.                     html: Ext.example.shortBogusMarkup
  65.                 }]
  66.             },{
  67.                 columnWidth:.33,
  68.                 style:'padding:10px 0 10px 10px',
  69.                 items:[{
  70.                     title: 'Panel 2',
  71.                     tools: tools,
  72.                     html: Ext.example.shortBogusMarkup
  73.                 },{
  74.                     title: 'Another Panel 2',
  75.                     tools: tools,
  76.                     html: Ext.example.shortBogusMarkup
  77.                 }]
  78.             },{
  79.                 columnWidth:.33,
  80.                 style:'padding:10px',
  81.                 items:[{
  82.                     title: 'Panel 3',
  83.                     tools: tools,
  84.                     html: Ext.example.shortBogusMarkup
  85.                 },{
  86.                     title: 'Another Panel 3',
  87.                     tools: tools,
  88.                     html: Ext.example.shortBogusMarkup
  89.                 }]
  90.             }]
  91.             
  92.             /*
  93.              * Uncomment this block to test handling of the drop event. You could use this
  94.              * to save portlet position state for example. The event arg e is the custom 
  95.              * event defined in Ext.ux.Portal.DropZone.
  96.              */
  97. //            ,listeners: {
  98. //                'drop': function(e){
  99. //                    Ext.Msg.alert('Portlet Dropped', e.panel.title + '<br />Column: ' + 
  100. //                        e.columnIndex + '<br />Position: ' + e.position);
  101. //                }
  102. //            }
  103.         }]
  104.     });
  105. });