add extjs 6.0.1 sources

[extjs.git] / extjs / modern / modern / src / viewport / Viewport.js

/**\r
 * This class acts as a factory for environment-specific viewport implementations.\r
 *\r
 * Please refer to the {@link Ext.Viewport} documentation about using the global instance.\r
 * @private\r
 */\r
Ext.define('Ext.viewport.Viewport', {\r
    requires: [\r
        'Ext.viewport.Ios',\r
        'Ext.viewport.Android',\r
        'Ext.viewport.WindowsPhone'\r
    ],\r
    singleton: true,\r
\r
    setup: function (config) {\r
        var osName = Ext.os.name,\r
            viewportName;\r
\r
        switch (osName) {\r
            case 'Android':\r
                viewportName = (Ext.browser.name === 'ChromeMobile') ? 'Default' : 'Android';\r
                break;\r
\r
            case 'iOS':\r
                viewportName = 'Ios';\r
                break;\r
\r
            case 'Windows':\r
                viewportName = (Ext.browser.name === 'IE') ? 'WindowsPhone' : 'Default';\r
                break;\r
\r
            case 'WindowsPhone':\r
                viewportName = 'WindowsPhone';\r
                break;\r
\r
            default:\r
                viewportName = 'Default';\r
                break;\r
        }\r
\r
        Ext.Viewport = Ext.create('Ext.viewport.' + viewportName, config);\r
    }\r
});\r
\r
// Docs for the singleton instance created by above factory:\r
\r
/**\r
 * @class Ext.Viewport\r
 * @extends Ext.viewport.Default\r
 * @singleton\r
 *\r
 * Ext.Viewport is a instance created when you use {@link Ext#setup}. Because {@link Ext.Viewport} extends from\r
 * {@link Ext.Container}, it has as {@link #layout} (which defaults to {@link Ext.layout.Card}). This means you\r
 * can add items to it at any time, from anywhere in your code. The {@link Ext.Viewport} {@link #cfg-fullscreen}\r
 * configuration is `true` by default, so it will take up your whole screen.\r
 *\r
 *     @example raw\r
 *     Ext.setup({\r
 *         onReady: function() {\r
 *             Ext.Viewport.add({\r
 *                 xtype: 'container',\r
 *                 html: 'My new container!'\r
 *             });\r
 *         }\r
 *     });\r
 *\r
 * If you want to customize anything about this {@link Ext.Viewport} instance, you can do so by adding a property\r
 * called `viewport` into your {@link Ext#setup} object:\r
 *\r
 *     @example raw\r
 *     Ext.setup({\r
 *         viewport: {\r
 *             layout: 'vbox'\r
 *         },\r
 *         onReady: function() {\r
 *             //do something\r
 *         }\r
 *     });\r
 *\r
 * **Note** if you use {@link Ext#onReady}, this instance of {@link Ext.Viewport} will **not** be created. Though, in most cases,\r
 * you should **not** use {@link Ext#onReady}.\r
 */\r