<% # 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>