<% # 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.
-%> <!DOCTYPE html> <html<% unless @content_for_html5_manifest.blank? %> manifest=“manifest.appcache”<% end %> class=“no-js” lang=“<%=language%>”>
<head> <meta http-equiv="X-UA-Compatible" content="IE=edge<%= config.chrome_frame ? ',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="<%= config.status_bar_style || 'default' %>" > <meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui" > <% if config.touch_enabled %> <% if config.precomposed_icon %> <link rel="apple-touch-icon-precomposed" href="<%= sc_static(config.precomposed_icon) %>" > <% elsif config.icon %> <link rel="apple-touch-icon" href="<%= sc_static(config.icon) %>" > <% end %> <% if config.startup_image_portrait %> <link rel="apple-touch-startup-image" media="screen and (orientation:portrait)" href="<%= sc_static(config.startup_image_portrait) %>" > <% end %> <% if config.startup_image_landscape %> <link rel="apple-touch-startup-image" media="screen and (orientation:landscape)" href="<%= sc_static(config.startup_image_landscape) %>" > <% end %> <% end %> <% if config.favicon %> <link rel="shortcut icon" href="<%= sc_static(config.favicon) %>" type="image/x-icon" > <% end %>
<% # Set the 'title' in your config to alter this setting %>
<title><%= 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 = '<%=SC.build_mode%>'; SC.buildNumber = '<%=target[:build_number]%>'; SC.buildLocale = '<%=language%>'; </script> <%= 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 = <%= stylesheet_urls_for_client(nil, { :x2 => true }).to_json %>; SC.APP_IMAGE_ASSETS = <%= image_urls_for_client(nil, { :sprited => true, :x2 => true }).to_json %>; } else { styles = <%= stylesheet_urls_for_client.to_json %>; SC.APP_IMAGE_ASSETS = <%= image_urls_for_client(nil, { :sprited => true }).to_json %>; } 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> <%= @content_for_page_styles %> <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 CONFIG.theme_name
-%>
<body class="<%= [theme_name(:default => 'sc-theme'), 'sc-focus'].compact.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.
-%> <%= inline_javascript('sproutcore/bootstrap:setup_body_class_names') %>
<% #
# 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.
-%> <%= @content_for_body %> <% #
# 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.
-%> <% unless @content_for_loading.blank? %> <div id=“loading”> <%= @content_for_loading %> </div> <% end -%> <% #
# 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.
-%> <% unless @content_for_resources.blank? %>
<!-- Resources to be removed from DOM on page load --> <div id="resources" style="display:none; visibility: hidden;"> <%= @content_for_resources -%> </div>
<% end -%> <% #
# 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.
-%> <%= javascripts_for_client %> <% unless @content_for_page_javascript.blank? %> <%= @content_for_page_javascript %> <% end -%> <% # 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 config.html5_history %> <%# 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> <% end %> <% #
# 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 config.use_window_onload %> <!– Start SproutCore
on Page Load –>
<script type="text/javascript">window.onload = SC.didLoad;</script>
<% end -%> <% #
# 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.
-%> <%= @content_for_final -%> <%
#disable main if the application is loaded in design mode
%> <%= @content_for_designer -%>
<script> SC.benchmarkPreloadEvents['bodyEnd'] = new Date().getTime(); </script> </body>
</html>