Created
May 7, 2014 22:13
-
-
Save mauritslamers/2591cc2304e306df1e1c to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<% | |
// # SPROUTCORE DEFAULT INDEX TEMPLATE | |
// # This template provide provides a basic wrapper for a SproutCore client. | |
// # Most of the time, it will be sufficient for your own needs. However, if | |
// # you need to create your own template, you can do so by copying this file | |
// # into your client, naming it 'index.rhtml' and then adding the options | |
// # :layout => 'lib/index' to your Buildfile. | |
// # | |
// # See the comments in this file for more information on what you can | |
// # change. | |
// As this is the EJS template, we are going to change a few things | |
// one of those things is that this document has to be fed a single hash with all the data contained | |
// what follows here is a specification of that hash | |
// { | |
// config: { | |
// contentForHtml5Manifest: "", | |
// useChromeFrame: false, | |
// statusBarStyle: "default", | |
// touchEnabled: true, | |
// precomposedIcon: "", // an url to an icon | |
// icon: "", //url to an icon, which is not precomposed (what is the difference?) | |
// startupImagePortrait: "", | |
// startupImageLandscape: "", | |
// favicon: "", | |
// bootStrap: "", // string with script tags | |
// buildMode: "" // "debug", or "build" (perhaps more options?) BT.runMode =>!! | |
// | |
// }, | |
// // should appData not simply be the app itself? | |
// appData: { | |
// scripts: [], // array of urls | |
// stylesheets: [] // array of urls, | |
// title: "", | |
// buildNumber: "", // build number | |
// language: "en", | |
// } | |
// | |
// a few other things: | |
// - sc_static: a function which looks up the url of a specific static resource | |
// - | |
// | |
-%> | |
<!DOCTYPE html> | |
<html <% if (app.useHtml5Manifest) { %> manifest="manifest.appcache" <% } %> class="no-js" lang="<%= app.language %>"> | |
<head> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge<%= app.useChromeFrame ? ',chrome=1' : '' %>" > | |
<script> | |
var SC_benchmarkPreloadEvents = { headStart: new Date().getTime() }; | |
var docElem = window.documentElement || document.documentElement; | |
if(docElem) { | |
docElem.className = docElem.className.replace(/(^|\s)no-js(\s|$)/, '$1js$2'); | |
docElem = null; | |
} | |
</script> | |
<meta http-equiv="Content-type" content="text/html; charset=utf-8" > | |
<meta http-equiv="Content-Script-Type" content="text/javascript" > | |
<meta name="apple-mobile-web-app-capable" content="yes" > | |
<meta name="apple-mobile-web-app-status-bar-style" content="<%= app.statusBarStyle || 'default' %>" > | |
<meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui" > | |
<% if (app.touchEnabled) { %> | |
<% if (app.precomposedIcon) { %> | |
<link rel="apple-touch-icon-precomposed" href="<%- sc_static(app.precomposedIcon) %>" > | |
<% } else if (app.icon) { %> | |
<link rel="apple-touch-icon" href="<%- sc_static(app.icon) %>" > | |
<% } %> | |
<% if (app.startupImagePortrait) { %> | |
<link rel="apple-touch-startup-image" media="screen and (orientation:portrait)" href="<%- sc_static(app.startup_image_portrait) %>" > | |
<% } %> | |
<% if (app.startupImageLandscape) { %> | |
<link rel="apple-touch-startup-image" media="screen and (orientation:landscape)" href="<%- sc_static(config.startup_image_landscape) %>" > | |
<% } %> | |
<% } %> | |
<% if (app.favicon) { %> | |
<link rel="shortcut icon" href="<%- sc_static(config.favicon) %>" type="image/x-icon" > | |
<% } %> | |
<% | |
//Set the 'title' in your config to alter this setting | |
%> | |
<title><%= app.get('title') %></title> | |
<% // | |
// You may choose to load one or more bootstrap resources. These are | |
// JS targets that you would like to load at the top of the page. Specify | |
// these in your Buildfile with the 'bootstrap' config. | |
%> | |
<script> | |
window.SC = window.SC || { MODULE_INFO: {}, LAZY_INSTANTIATION: {} }; | |
SC.buildMode = '<%= BT.runMode %>'; | |
SC.buildNumber = '<%= app.get("buildNumber") %>'; | |
SC.buildLocale = '<%= app.get("language") %>'; | |
</script> | |
<%- app.get('bootstrap') %> | |
<% // This line should appear in your head area to include the stylesheets | |
// generated by your client. If you need to include your own | |
// stylesheets, you don't need to change it here. Instead use the | |
// required option in your config. | |
%> | |
<script> | |
(function() { | |
var styles = []; | |
if (window.devicePixelRatio > 1 || window.location.search.indexOf("2x") > -1) { | |
styles = <%- app.stylesheetUrls({ x2: true }) %>; | |
SC.APP_IMAGE_ASSETS = <%- app.imageUrls({ sprited: true, x2: true }) %>; | |
} else { | |
styles = <%- app.stylesheetUrls() %>; | |
SC.APP_IMAGE_ASSETS = <%- app.imageUrls({ sprited: true }) %>; | |
} | |
var head = document.getElementsByTagName("head")[0], | |
len = styles.length, idx, css; | |
for (idx = 0; idx < len; idx++) { | |
css = document.createElement('link'); | |
css.rel = 'stylesheet'; | |
css.type = 'text/css'; | |
css.href = styles[idx]; | |
css.media = 'screen' | |
head.appendChild(css); | |
} | |
})(); | |
</script> | |
<%- app.contentForPageStyles %> | |
<script> | |
SC.benchmarkPreloadEvents['headEnd'] = new Date().getTime(); | |
</script> | |
</head> | |
<% | |
// The theme CSS class is added automatically based on your chosen theme. | |
// If you need to specify a custom theme name, use app.themeName | |
%> | |
<body class="<%= [app.get('themeName'), 'sc-focus'].join(' ') %>"> | |
<script> | |
SC.benchmarkPreloadEvents['bodyStart'] = new Date().getTime(); | |
</script> | |
<% | |
// This section is used to setup additional optional class names on the | |
// body content based on JS-selected conditions. Use this to make sure you | |
// show the proper CSS as soon as the page appears. | |
%> | |
<%- app.get('bootstrapSetupBodyClassNames') %> | |
<% | |
// | |
// This is where you root body element will appear. To cause your | |
// content to appear here, just declare content_for('body') in one of | |
// your partials. (??) | |
%> | |
<%- app.get('contentForBody') || "" %> | |
<% // | |
// This is where your loading screen will appear. To add a loading screen | |
// just declare content_for('loading') in one of your partials. If you use | |
// sc-gen to generate your app, it will create a file called loading.rhtml | |
// under english.lproj. You can insert the desired content there. | |
%> | |
<% if (app.get('contentForLoading')) { %> | |
<div id="loading"> | |
<%- app.get('contentForLoading') %> | |
</div> | |
<% } %> | |
<% // | |
// This is where the resources you declare will appear. By default anything | |
// you add to partials will be added to this section unless you specify | |
// otherwise. Note that resources are initially hidden so you can pull them | |
// apart as needed on page load. | |
%> | |
<% if (app.get('contentForResources')) { %> | |
<!-- Resources to be removed from DOM on page load --> | |
<div id="resources" style="display:none; visibility: hidden;"> | |
<%- app.get('contentForResources') %> | |
</div> | |
<% } %> | |
<% // | |
// This line should appear at the bottom of your page to include your | |
// generated JavaScript and any libraries you reference. If you need | |
// to include other javascripts, add them to the :requires option of | |
// your client in routes.rb instead of changing it here. | |
%> | |
<% app.get('scripts').forEach(function (script) { %> | |
<script type="text/javascript" src="<%= script.get('relativePath') %>"> </script> | |
<% }) %> | |
<% if (app.get('contentForPageJavascript')) { %> | |
<%- app.get('contentForPageJavascript') %> | |
<% } %> | |
<% // If config.html5_history is true, HTML5 history will be activated for | |
// SC.routes and the SC.routes.baseURI setting will be automatically | |
// set. | |
%> | |
<% if (app.get('html5History')) { %> | |
<% // TODO: Can we check for the framework in Ruby instead? | |
%> | |
<script> | |
if (SC.routes) { | |
SC.routes.wantsHistory = true; | |
SC.routes.baseURI = <%= "" /*"#{@bundle.index_root}/#{language}".to_json */ %>; | |
} | |
</script> | |
<% } %> | |
<% // | |
// If you use old-style view helpers in your page, this method must be | |
// called to actually add the page views to your HTML. Normally this will | |
// not generate any content. | |
%> | |
<% | |
//render_page_views | |
%> | |
<% // Older SproutCore applications need SC.didLoad to be called after onload. | |
// This is no longer required by SproutCore so it is off by default. To | |
// reenable set use_window_onload = true in yur config. | |
%> | |
<% if (app.get('useWindowOnLoad')) { %> | |
<!-- Start SproutCore on Page Load --> | |
<script type="text/javascript">window.onload = SC.didLoad;</script> | |
<% } %> | |
<% // | |
// The final content section can be used to add any last minute setup you | |
// need to do before the page ends. This is required for loading unit | |
// tests among other things. | |
%> | |
<%= app.get('contentForFinal') %> | |
<% | |
//disable main if the application is loaded in design mode | |
%> | |
<%= app.get('contentForDesigner') %> | |
<script> | |
SC.benchmarkPreloadEvents['bodyEnd'] = new Date().getTime(); | |
</script> | |
</body> | |
</html> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment