//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); //>>description: Loader doing theme loading, viewport setting, globalize loading, etc. //>>label: Loader //>>group: Tizen:Core define( [ 'jquery.mobile.tizen.core' ], function ( ) { //>>excludeEnd("jqmBuildExclude"); /** * @class core * loader.js * * Youmin Ha * * */ /* Web UI scaling concept in Tizen Web UI Generally, web applications must be designed to be showed acceptable on various size and resolution of screens, and web winsets have to be scaled well. Tizen Web UI Framework supports various viewport settings, and Tizen Web UI widgets are designed to be scalable on various screen sizes. In order to make web applications scalable on many devices which have different screen size, it is necessary to understand how mobile web browsers deal with screen resolution, and how Tizen Web UI Framework supports scaling for web applications. * Viewport on mobile web browser Viewport is an area showing web content on the browser. Unlike desktop browsers, mobile browsers support logical viewport seting, which means that application can set viewport width/height and zoom level by itself. The very important thing that to be remembered is that the viewport resolution in pixel is 'Logical', not physical. For example, if the viewport width is set to 480 on a mobile device having 720px screen width, the viewport width is considered to 480px logically. All elements put on right side from 480px horizontal position will not be shown on the viewport. Most mobile browsers set viewport with given content attribute with tag in section in the application source html, whereas desktop browsers ignore the tag. Detailed usage of viewport meta tag is found in here: http://www.w3.org/TR/mwabp/#bp-viewport * Viewport setting by application developers When developers write in the section of the web application HTML file, Tizen Web UI Framework does not add another viewport meta tag, nor modify developer-defined viewport. * Automatic viewport setting by Tizen Web UI Framework If developers do not give a viewport meta tag, Tizen Web UI Framework automatically add a viewport meta tag with default viewport setting. * Portrait/landscape mode * Tizen Web UI widgets scaling */ ( function ($, Globalize, window, undefined) { var tizen = { libFileName : "tizen-web-ui-fw(.min)?.js", frameworkData : { rootDir: '/usr/lib/tizen-web-ui-fw', version: '0.1', theme: "tizen-white", viewportWidth: "device-width", viewportScale: false, defaultFontSize: 22, minified: false, debug: false }, log : { debug : function ( msg ) { if ( tizen.frameworkData.debug ) { console.log( msg ); } }, warn : function ( msg ) { console.warn( msg ); }, error : function ( msg ) { console.error( msg ); }, alert : function ( msg ) { window.alert( msg ); } }, util : { loadScriptSync : function ( scriptPath, successCB, errorCB ) { $.ajax( { url: scriptPath, dataType: 'script', async: false, crossDomain: false, success: successCB, error: function ( jqXHR, textStatus, errorThrown ) { if ( errorCB ) { errorCB( jqXHR, textStatus, errorThrown ); } else { var ignoreStatusList = [ 404 ], // 404: not found errmsg = ( 'Error while loading ' + scriptPath + '\n' + jqXHR.status + ':' + jqXHR.statusText ); if ( -1 == $.inArray( jqXHR.status, ignoreStatusList ) ) { tizen.log.alert( errmsg ); } else { tizen.log.warn( errmsg ); } } } } ); }, isMobileBrowser: function ( ) { var mobileIdx = window.navigator.appVersion.indexOf("Mobile"), isMobile = -1 < mobileIdx; return isMobile; } }, css : { cacheBust: ( document.location.href.match( /debug=true/ ) ) ? '?cacheBust=' + ( new Date( ) ).getTime( ) : '', addElementToHead : function ( elem ) { var head = document.getElementsByTagName( 'head' )[0]; if ( head ) { $( head ).prepend( elem ); } }, makeLink : function ( href ) { var cssLink = document.createElement( 'link' ); cssLink.setAttribute( 'rel', 'stylesheet' ); cssLink.setAttribute( 'href', href ); cssLink.setAttribute( 'name', 'tizen-theme' ); return cssLink; }, load: function ( path ) { var head = document.getElementsByTagName( 'head' )[0], cssLinks = head.getElementsByTagName( 'link' ), idx, l = null; // Find css link element for ( idx = 0; idx < cssLinks.length; idx++ ) { if ( cssLinks[idx].getAttribute( 'rel' ) != "stylesheet" ) { continue; } if ( cssLinks[idx].getAttribute( 'name' ) == "tizen-theme" || cssLinks[idx].getAttribute( 'href' ) == path ) { l = cssLinks[idx]; break; } } if ( l ) { // Found the link element! if ( l.getAttribute( 'href' ) == path ) { tizen.log.warn( "Theme is already loaded. Skip theme loading in the framework." ); } else { l.setAttribute( 'href', path ); } } else { this.addElementToHead( this.makeLink( path ) ); } } }, getParams: function ( ) { /* Get data-* params from