staticbook.html 3.64 KB
Newer Older
1 2
<%! from django.utils.translation import ugettext as _ %>

Piotr Mitros committed
3
<%inherit file="main.html" />
4
<%namespace name='static' file='static_content.html'/>
5
<%block name="pagetitle">${_("{course_number} Textbook").format(course_number=course.display_number_with_default) | h}</%block>
6

7
<%block name="headextra">
8 9 10
<%static:css group='style-course-vendor'/>
<%static:css group='style-course'/>

Matthew Mongeau committed
11
<%static:js group='courseware'/>
12 13
</%block>

14
<%block name="js_extra">
Kyle Fiedler committed
15
  <script type="text/javascript" src="${static.url('js/jquery.treeview.js')}"></script>
Piotr Mitros committed
16 17 18 19
<script>
var page=${ page };

$(document).ready(function(){
20 21 22 23 24 25
   if(!page) {
     cookie_page = $.cookie("book_page");
     if(cookie_page) {
       goto_page(cookie_page);
     }
   }
Piotr Mitros committed
26 27 28 29
   $("#booknav").treeview({collapsed:true, unique:true/*, cookieId: "treeview-book-nav", persist: "cookie"*/});
});

function goto_page(n) {
30
  Logger.log("book", {"type":"gotopage","old":page,"new":n});
Piotr Mitros committed
31
  page=n;
Piotr Mitros committed
32 33 34 35 36 37 38
  var prefix = "";
  if(n<100) {
    prefix="0";
  }
  if(n<10) {
    prefix="00";
  }
39
  $("#bookpage").attr("src","${ book_url }p"+prefix+n+".png");
40
  $.cookie("book_page", n, {'expires':3650, 'path':'/'});
Piotr Mitros committed
41 42 43
};

function prev_page() {
Piotr Mitros committed
44
  var newpage=page-1;
45
  if(newpage< ${start_page}) newpage=${start_page};
Piotr Mitros committed
46
  goto_page(newpage);
47
  Logger.log("book", {"type":"prevpage","new":page});
Piotr Mitros committed
48 49 50
}

function next_page() {
Piotr Mitros committed
51
  var newpage=page+1;
52
  if(newpage> ${end_page}) newpage=${end_page};
Piotr Mitros committed
53
  goto_page(newpage);
54
  Logger.log("book", {"type":"nextpage","new":page});
Piotr Mitros committed
55
}
56 57 58 59 60 61 62 63 64

$("#open_close_accordion a").click(function(){
  if ($(".book-wrapper").hasClass("closed")){
    $(".book-wrapper").removeClass("closed");
  } else {
    $(".book-wrapper").addClass("closed");
  }
});

Piotr Mitros committed
65
</script>
66
</%block>
67

Victor Shnayder committed
68
<%include file="/courseware/course_navigation.html" args="active_page='textbook/{0}'.format(book_index)" />
69

70
<section class="container">
71 72
  <div class="book-wrapper">

73
    <section aria-label="${_('Textbook Navigation')}" class="book-sidebar">
74 75 76 77 78
      <header id="open_close_accordion">
        <a href="#">close</a>
      </header>

      <ul id="booknav" class="treeview-booknav">
79 80 81
          <%def name="print_entry(entry)">
              <li>
                  <a href="javascript:goto_page(${entry.get('page')})">
82 83 84 85 86 87 88 89
                      <span class="chapter">
                        %if entry.get('chapter'):
                          <span class="chapter-number">${entry.get('chapter')}.</span> ${entry.get('name')}
                        %else:
                          ${entry.get('name')}
                        %endif
                      </span>
                      <span class="page-number">${entry.get('page_label')}</span>
90 91 92 93 94 95 96 97 98 99 100 101 102 103
                  </a>
                  % if len(entry) > 0:
                      <ul>
                          % for child in entry:
                              ${print_entry(child)}
                          % endfor
                      </ul>
                  % endif
              </li>
          </%def>

          % for entry in table_of_contents:
            ${print_entry(entry)}
          % endfor
104

105 106
        ## Don't delete this empty list item. Without it, Jquery.TreeView won't
        ## render the last list item as expandable.
107
        <li></li>
108 109
      </ul>
    </section>
110

111
    <section class="book">
112 113 114 115
      <section class="page">
        <nav>
          <ul>
            <li class="last">
116
              <a href="javascript:prev_page()">${_('Previous page')}</a>
117 118
            </li>
            <li class="next">
119
              <a href="javascript:next_page()">${_('Next page')}</a>
120 121 122 123
            </li>
          </ul>
        </nav>

124
        <img id="bookpage" src="${ book_url }p${ "%03i"%(page) }.png">
125
      </section>
126
    </section>
127
  </div>
128
</section>