<%! from django.utils.translation import ugettext as _ %>
<%inherit file="/main.html" />
<%namespace name='static' file='/static_content.html'/>
<%block name="bodyclass">courseware ${course.css_class}</%block>
<%block name="title"><title>${_("{course_number} Courseware").format(course_number=course.display_number_with_default) | h}</title></%block>

<%block name="headextra">
  <%static:css group='course'/>
  <%include file="../discussion/_js_head_dependencies.html" />
  % if show_chat:
    <link rel="stylesheet" href="${static.url('css/vendor/ui-lightness/jquery-ui-1.8.22.custom.css')}" />
    ## It'd be better to have this in a place like lms/css/vendor/candy,
    ## but the candy_res/ folder contains images and other junk, and it
    ## all needs to stay together for the Candy.js plugin to work.
    <link rel="stylesheet" href="${static.url('candy_res/candy_full.css')}" />
  % endif
</%block>

<%block name="js_extra">
  <script type="text/javascript" src="${static.url('js/vendor/jquery.scrollTo-1.4.2-min.js')}"></script>
  <script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js')}"></script>

  ## codemirror
  <script type="text/javascript" src="${static.url('js/vendor/codemirror-compressed.js')}"></script>

  ## alternate codemirror
  ##  <script type="text/javascript" src="${static.url('js/vendor/CodeMirror-2.25/lib/codemirror.js')}"></script>
  ##  <script type="text/javascript" src="${static.url('js/vendor/CodeMirror-2.25/mode/xml/xml.js')}"></script>
  ##  <script type="text/javascript" src="${static.url('js/vendor/CodeMirror-2.25/mode/python/python.js')}"></script>


  <%static:js group='courseware'/>
  <%static:js group='discussion'/>

  <%include file="../discussion/_js_body_dependencies.html" />
  % if staff_access:
  	<%include file="xqa_interface.html"/>
  % endif

  <!-- TODO: http://docs.jquery.com/Plugins/Validation -->
  <script type="text/javascript">
    document.write('\x3Cscript type="text/javascript" src="' +
        document.location.protocol + '//www.youtube.com/iframe_api">\x3C/script>');
  </script>

  <script type="text/javascript">
    var $$course_id = "${course.id}";

    $(function(){
        $(".ui-accordion-header a, .ui-accordion-content .subtitle").each(function() {
          var elemText = $(this).text().replace(/^\s+|\s+$/g,''); // Strip leading and trailing whitespace
          var wordArray = elemText.split(" ");
          var finalTitle = "";
          if (wordArray.length > 0) {
            for (i=0;i<=wordArray.length-1;i++) {
              finalTitle += wordArray[i];
              if (i == (wordArray.length-2)) {
                finalTitle += "&nbsp;";
              } else if (i == (wordArray.length-1)) {
                // Do nothing
              } else {
                finalTitle += " ";
              }
            }
          }
          $(this).html(finalTitle);
        });
      });
  </script>

% if timer_expiration_duration:
  <script type="text/javascript">
    var timer = {
      timer_inst : null,
      end_time : null,
      get_remaining_secs : function(endTime) {
        var currentTime = new Date();
        var remaining_secs = Math.floor((endTime - currentTime)/1000);
        return remaining_secs;
      },
      get_time_string : function() {
        function pretty_time_string(num) {
          return ( num < 10 ? "0" : "" ) + num;
        }
        // count down in terms of hours, minutes, and seconds:
        var hours = pretty_time_string(Math.floor(remaining_secs / 3600));
        remaining_secs = remaining_secs % 3600;
        var minutes = pretty_time_string(Math.floor(remaining_secs / 60));
        remaining_secs = remaining_secs % 60;
        var seconds = pretty_time_string(Math.floor(remaining_secs));

        var remainingTimeString = hours + ":" + minutes + ":" + seconds;
        return remainingTimeString;
      },
      update_time : function(self) {
        remaining_secs = self.get_remaining_secs(self.end_time);
        if (remaining_secs <= 0) {
          self.end(self);
        }
        $('#exam_timer').text(self.get_time_string(remaining_secs));
      },
      start : function() { var that = this;
        // set the end time when the template is rendered.
        // This value should be UTC time as number of milliseconds since epoch.
        this.end_time = new Date((new Date()).getTime() + ${timer_expiration_duration});
        this.timer_inst = setInterval(function(){ that.update_time(that); }, 1000);
      },
      end : function(self) {
        clearInterval(self.timer_inst);
        // redirect to specified URL:
        window.location = "${time_expired_redirect_url}";
      }
    }
    // start timer right away:
    timer.start();
  </script>
% endif

% if show_chat:
  <script type="text/javascript" src="${static.url('js/vendor/candy_libs/libs.min.js')}"></script>
  <script type="text/javascript" src="${static.url('js/vendor/candy.min.js')}"></script>

  <script type="text/javascript">
    // initialize the Candy.js plugin
    $(document).ready(function() {
      Candy.init("http://${chat['domain']}:5280/http-bind/", {
        core: { debug: true, autojoin: ["${chat['room']}@conference.${chat['domain']}"] },
        view: { resources: "${static.url('candy_res/')}"}
      });
      Candy.Core.connect("${chat['username']}", "${chat['password']}");

      // show/hide the chat widget
      $('#chat-toggle').click(function() {
        var toggle = $(this);
        if (toggle.hasClass('closed')) {
          $('#chat-block').show().animate({height: '400px'}, 'slow', function() {
            $('#chat-open').hide();
            $('#chat-close').show();
          });
        } else {
          $('#chat-block').animate({height: '0px'}, 'slow', function() {
            $('#chat-open').show();
            $('#chat-close').hide();
            $(this).hide(); // do this at the very end
          });
        }
        toggle.toggleClass('closed');
      });
    });
  </script>
% endif

</%block>

% if timer_expiration_duration:
<div class="timer-main">
  <div id="timer_wrapper">
    % if timer_navigation_return_url:
    <a href="${timer_navigation_return_url}" class="timer_return_url">${_("Return to Exam")}</a>
    % endif
    <div class="timer_label">Time Remaining:</div> <div id="exam_timer" class="timer_value">&nbsp;</div>
  </div>
</div>
% endif

% if accordion:
 <%include file="/courseware/course_navigation.html" args="active_page='courseware'" />
% endif

<section class="container">
  <div class="course-wrapper">

% if accordion:
    <section aria-label="${_('Course Navigation')}" class="course-index">
      <header id="open_close_accordion">
        <a href="#">${_("close")}</a>
      </header>

      <div id="accordion" style="display: none">
        <nav>
          ${accordion}
        </nav>
      </div>
    </section>
% endif

    <section class="course-content">
      ${content}
    </section>
  </div>
</section>

% if show_chat:
  <div id="chat-wrapper">
    <div id="chat-toggle" class="closed">
      <span id="chat-open">Open Chat <em class="icon-chevron-up"></em></span>
      <span id="chat-close">Close Chat <em class="icon-chevron-down"></em></span>
    </div>
    <div id="chat-block">
      ## The Candy.js plugin wants to render in an element with #candy
      <div id="candy"></div>
    </div>
  </div>
% endif

% if course.show_calculator:
    <div class="calc-main">
        <a aria-label="${_('Open Calculator')}" href="#" class="calc">${_("Calculator")}</a>

        <div id="calculator_wrapper">
            <form id="calculator">
                <div class="input-wrapper">
                    <input type="text" id="calculator_input" title="Calculator Input Field" />

                    <div class="help-wrapper">
                        <a href="#">${_("Hints")}</a>
                        <dl class="help">
                            <dt>${_("Suffixes:")}</dt>
                            <dd> %kMGTcmunp</dd>
                            <dt>${_("Operations:")}</dt>
                            <dd>^ * / + - ()</dd>
                            <dt>${_("Functions:")}</dt>
                            <dd>sin, cos, tan, sqrt, log10, log2, ln, arccos, arcsin, arctan, abs </dd>
                            <dt>${_("Constants")}</dt>
                            <dd>e, pi</dd>

                            <!-- Students won't know what parallel means at this time.  Complex numbers aren't well tested in the courseware, so we would prefer to not expose them.  If you read the comments in the source, feel free to use them. If you run into a bug, please let us know. But we can't officially support them right now.

                            <dt>Unsupported:</dt> <dd>||, j </dd>  -->
                        </dl>
                    </div>
                </div>
                <input id="calculator_button" type="submit" title="Calculate" value="="/>
                <input type="text" id="calculator_output" title="Calculator Output Field" readonly />
            </form>

        </div>
    </div>
% endif
