<%page expression_filter="h"/>
<%!
from django.utils.translation import ugettext as _

from openedx.core.djangolib.markup import HTML
from openedx.core.djangolib.js_utils import (
    dump_js_escaped_json, js_escaped_string
)
%>

<%inherit file="main.html" />
<%namespace name='static' file='static_content.html'/>
<%block name="pagetitle">${_('{course_number} Textbook').format(course_number=course.display_number_with_default)}</%block>

<%block name="headextra">
<%static:css group='style-course-vendor'/>
<%static:css group='style-course'/>
<%static:js group='courseware'/>
</%block>

<%block name="js_extra">
  <script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/tinymce.full.min.js')}"></script>
  <script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/jquery.tinymce.min.js')}"></script>
  <script type="text/javascript">
(function($) {
    $.fn.myHTMLViewer = function(options) {
        var urlToLoad = null;
        if (options.url) {
            urlToLoad = options.url;
        }
        var chapterUrls = null;
        if (options.chapters) {
            chapterUrls = options.chapters;
        }
        var chapterToLoad = 1;
        if (options.chapterNum) {
            // TODO: this should only be specified if there are
            // chapters, and it should be in-bounds.
            chapterToLoad = options.chapterNum;
        }

        var onComplete = function() {};
        if(options.notesEnabled) {
            onComplete = function(url) {
                return function() {
                    $('#viewerContainer').trigger('notes:init', [url, "${storage | n, js_escaped_string}", "${token | n, js_escaped_string}"]);
                }
            };
        }

        loadUrl = function htmlViewLoadUrl(url) {
            // clear out previous load, if any:
            parentElement = document.getElementById('bookpage');
            while (parentElement.hasChildNodes())
                parentElement.removeChild(parentElement.lastChild);
            // load new URL in:
            $('#bookpage').load(url, null, onComplete(url));

        };

        loadChapterUrl = function htmlViewLoadChapterUrl(chapterNum) {
            if (chapterNum < 1 || chapterNum > chapterUrls.length) {
                return;
            }
            var chapterUrl = chapterUrls[chapterNum-1];
            loadUrl(chapterUrl);
        };

        // define navigation links for chapters:
        if (chapterUrls != null) {
            var loadChapterUrlHelper = function(i) {
                return function(event) {
                    // when opening a new chapter, always open to the top:
                    loadChapterUrl(i);
                };
            };
            for (var index = 1; index <= chapterUrls.length; index += 1) {
                $("#htmlchapter-" + index).click(loadChapterUrlHelper(index));
            }
        }

        // finally, load the appropriate url/page
        if (urlToLoad != null) {
            loadUrl(urlToLoad);
        } else {
            loadChapterUrl(chapterToLoad);
        }

    }
})(jQuery);

    $(document).ready(function() {
        var options = {};
        %if 'url' in textbook:
            options.url = "${textbook['url'] | n, js_escaped_string}";
        %endif
        %if 'chapters' in textbook:
            var chptrs = [];
            %for chap in textbook['chapters']:
                chptrs.push("${chap['url'] | n, js_escaped_string}");
            %endfor
            options.chapters = chptrs;
        %endif
        %if chapter is not None:
            options.chapterNum = ${int(chapter) | n, dump_js_escaped_json};
        %endif

        options.notesEnabled = false;
        %if notes_enabled is not UNDEFINED and notes_enabled:
            options.notesEnabled = true;
        %endif

        $('#outerContainer').myHTMLViewer(options);
    });
  </script>
</%block>

<%include file="/courseware/course_navigation.html" args="active_page='htmltextbook/{0}'.format(book_index)" />

    <div id="outerContainer">
        <main id="main" aria-label="${_('Content')}" tabindex="-1">
          <div id="mainContainer" class="book-wrapper">

            %if 'chapters' in textbook:
            <section aria-label="${_('Textbook Navigation')}" class="book-sidebar">
              <ul id="booknav" class="treeview-booknav">
                <%def name="print_entry(entry, index_value)">
                  <li id="htmlchapter-${index_value}">
                    <a href="#bookpage" class="chapter">
                      ${entry.get('title')}
                    </a>
                  </li>
                </%def>

                %for (index, entry) in enumerate(textbook['chapters']):
                  ${HTML(print_entry(entry, index+1))}
                % endfor
              </ul>
            </section>
            %endif

            <section id="viewerContainer" class="book">
              <section class="page">
                <div id="bookpage" />
              </section>
            </section>
    		<span class="idU" style="display:none">${student.id}</span>
    		<span class="idDU" style="display:none">${student.username}</span>
          </div>
      </main>
    </div>