开通博客赚积分
发布资源赚积分
分类

源码开发语言/平台
当前位置：首页 > 源码/资料 > 中间件编程 > 查看源码
Viewport.js
资源名称：ext-3.0.0.zip　[点击查看]
上传用户：shuoshiled
上传日期：2018-01-28
资源大小：10124k
文件大小：4k
源码类别：

中间件编程

开发平台：

JavaScript

Viewport.js：源码内容
  1. /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ /**
  2.  * @class Ext.Viewport
  3.  * @extends Ext.Container
  4.  * <p>A specialized container representing the viewable application area (the browser viewport).</p>
  5.  * <p>The Viewport renders itself to the document body, and automatically sizes itself to the size of
  6.  * the browser viewport and manages window resizing. There may only be one Viewport created
  7.  * in a page. Inner layouts are available by virtue of the fact that all {@link Ext.Panel Panel}s
  8.  * added to the Viewport, either through its {@link #items}, or through the items, or the {@link #add}
  9.  * method of any of its child Panels may themselves have a layout.</p>
  10.  * <p>The Viewport does not provide scrolling, so child Panels within the Viewport should provide
  11.  * for scrolling if needed using the {@link #autoScroll} config.</p>
  12.  * <p>An example showing a classic application border layout:</p><pre><code>
  13. new Ext.Viewport({
  14.     layout: 'border',
  15.     items: [{
  16.         region: 'north',
  17.         html: '&lt;h1 class="x-panel-header">Page Title&lt;/h1>',
  18.         autoHeight: true,
  19.         border: false,
  20.         margins: '0 0 5 0'
  21.     }, {
  22.         region: 'west',
  23.         collapsible: true,
  24.         title: 'Navigation',
  25.         width: 200
  26.         // the west region might typically utilize a {@link Ext.tree.TreePanel TreePanel} or a Panel with {@link Ext.layout.AccordionLayout Accordion layout} 
  27.     }, {
  28.         region: 'south',
  29.         title: 'Title for Panel',
  30.         collapsible: true,
  31.         html: 'Information goes here',
  32.         split: true,
  33.         height: 100,
  34.         minHeight: 100
  35.     }, {
  36.         region: 'east',
  37.         title: 'Title for the Grid Panel',
  38.         collapsible: true,
  39.         split: true,
  40.         width: 200,
  41.         xtype: 'grid',
  42.         // remaining grid configuration not shown ...
  43.         // notice that the GridPanel is added directly as the region
  44.         // it is not "overnested" inside another Panel
  45.     }, {
  46.         region: 'center',
  47.         xtype: 'tabpanel', // TabPanel itself has no title
  48.         items: {
  49.             title: 'Default Tab',
  50.             html: 'The first tab's content. Others may be added dynamically'
  51.         }
  52.     }]
  53. });
  54. </code></pre>
  55.  * @constructor
  56.  * Create a new Viewport
  57.  * @param {Object} config The config object
  58.  * @xtype viewport
  59.  */
  60. Ext.Viewport = Ext.extend(Ext.Container, {
  61. /*
  62.  * Privatize config options which, if used, would interfere with the
  63.  * correct operation of the Viewport as the sole manager of the
  64.  * layout of the document body.
  65.  */
  66.     /**
  67.      * @cfg {Mixed} applyTo @hide
  68.  */
  69.     /**
  70.      * @cfg {Boolean} allowDomMove @hide
  71.  */
  72.     /**
  73.      * @cfg {Boolean} hideParent @hide
  74.  */
  75.     /**
  76.      * @cfg {Mixed} renderTo @hide
  77.  */
  78.     /**
  79.      * @cfg {Boolean} hideParent @hide
  80.  */
  81.     /**
  82.      * @cfg {Number} height @hide
  83.  */
  84.     /**
  85.      * @cfg {Number} width @hide
  86.  */
  87.     /**
  88.      * @cfg {Boolean} autoHeight @hide
  89.  */
  90.     /**
  91.      * @cfg {Boolean} autoWidth @hide
  92.  */
  93.     /**
  94.      * @cfg {Boolean} deferHeight @hide
  95.  */
  96.     /**
  97.      * @cfg {Boolean} monitorResize @hide
  98.  */
  99.     initComponent : function() {
  100.         Ext.Viewport.superclass.initComponent.call(this);
  101.         document.getElementsByTagName('html')[0].className += ' x-viewport';
  102.         this.el = Ext.getBody();
  103.         this.el.setHeight = Ext.emptyFn;
  104.         this.el.setWidth = Ext.emptyFn;
  105.         this.el.setSize = Ext.emptyFn;
  106.         this.el.dom.scroll = 'no';
  107.         this.allowDomMove = false;
  108.         this.autoWidth = true;
  109.         this.autoHeight = true;
  110.         Ext.EventManager.onWindowResize(this.fireResize, this);
  111.         this.renderTo = this.el;
  112.     },
  114.     fireResize : function(w, h){
  115.         this.fireEvent('resize', this, w, h, w, h);
  116.     }
  117. });
  118. Ext.reg('viewport', Ext.Viewport);