index.mustache

<!--working:-->
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.4.1/jspdf.debug.js"></script>

<div id='pdfannotator_index' class='pdfannotator_index'>

    <div class="row">
        <div id="pdftoolbar" class="toolbar col-md-12">
            <div id="toolbarContent"> 
                <button id="pdfannotator_cursor" class="cursor" type="button" title="Cursor" data-tooltype="cursor"><i class="fa fa-hand-pointer-o" aria-hidden="true"></i></button>
                <div class="spacer"></div>
                <button class="comment" type="button" title="{{# str }} point, pdfannotator {{/ str }}" data-tooltype="point">{{# pix }}pinbild,pdfannotator, {{# str }} point, pdfannotator {{/ str }} {{/ pix}}</button>           
                <button class="pdfannotator_rectangle" type="button" title="{{# str }} rectangle, pdfannotator {{/ str }}" data-tooltype="area">{{# pix }}i/completion-manual-n,core, {{# str }} rectangle, pdfannotator {{/ str }} {{/ pix}}</button>
                <button class="pdfannotator_highlight" type="button" title="{{# str }} highlight, pdfannotator {{/ str }}" data-tooltype="highlight">{{# pix }}text_highlight_picker,pdfannotator, {{# str }} highlight, pdfannotator {{/ str }} {{/ pix}}</button>
                <button class="pdfannotator_strikeout" type="button" title="{{# str }} strikeout, pdfannotator {{/ str }}" data-tooltype="strikeout">{{# pix }}strikethrough,pdfannotator, {{# str }} strikeout, pdfannotator {{/ str }} {{/ pix}}</button>
                <div class="spacer"></div>

                {{#usestudenttextbox}}
                    <span class="toolbaritem">
                        <button class="text" type="button" title="{{# str }} text, pdfannotator {{/ str }}" data-tooltype="text">{{# pix }}text_color_picker,pdfannotator, {{# str }} text, pdfannotator {{/ str }} {{/ pix}}</button>
                        <select class="text-size"></select>
                        <div class="text-color"></div>
                    </span>
                    <div class="spacer"></div>
                {{/usestudenttextbox}}

                {{#usestudentdrawing}}
                    <span class="toolbaritem">
                        <button class="pen" type="button" title="{{# str }} drawing, pdfannotator {{/ str }}" data-tooltype="draw">{{# pix }}editstring,pdfannotator, {{# str }} drawing, pdfannotator {{/ str }} {{/ pix}}</button>
                        <select class="pen-size"></select>
                        <div class="pen-color"></div>
                    </span>
                    <div class="spacer"></div>
                {{/usestudentdrawing}}

                <span class="toolbaritem">
                    <button id="scaleMinus" class="" title="{{# str }} zoomout, pdfannotator {{/ str }}" alt="{{# str }} zoomout, pdfannotator {{/ str }}">
                        <i class="icon fa fa-minus-circle fa-lg" title="{{# str }} zoomout, pdfannotator {{/ str }}" alt="{{# str }} zoomout, pdfannotator {{/ str }}"></i>
                    </button><!--
                 --><button id="scalePlus" class="" title="{{# str }} zoomin, pdfannotator {{/ str }}" alt="{{# str }} zoomin, pdfannotator {{/ str }}">
                        <i class="icon fa fa-plus-circle fa-lg" title="{{# str }} zoomin, pdfannotator {{/ str }}" alt="{{# str }} zoomin, pdfannotator {{/ str }}"></i>
                    </button>
                </span>
                <select class="scale" title="{{# str }} zoom, pdfannotator {{/ str }}">
                    <option value="0.5">50%</option>
                    <option value="0.75">75%</option>
                    <option value="1">100%</option>
                    <option value="1.33">133%</option>
                    <option value="1.5">150%</option>
                    <option value="2">200%</option>
                </select>

                <!--<a href="javascript://" class="rotate-ccw" title="Rotate Counter Clockwise">⟲</a>-->
                <!--<a href="javascript://" class="rotate-cw" title="Rotate Clockwise">⟳</a>-->

                <div class="spacer"></div>

                <a href="javascript://" class="hideComments" title="{{# str }} hideAnnotations, pdfannotator {{/ str }}"><img class="icon " alt="{{# str }} hideAnnotations, pdfannotator {{/ str }}" title="{{# str }} hideAnnotations, pdfannotator {{/ str }}" src={{{pixhide}}}></a><!--"/moodle/theme/image.php/clean/core/1504678549/e/accessibility_checker"-->
                <a href="javascript://" title="{{# str}}fullscreen,pdfannotator{{/str}}" onclick="makeFullScreen()">{{# pix}}fullscreen,pdfannotator,{{# str}}fullscreen,pdfannotator{{/str}}{{/ pix}}</a>
                <div class="spacer"></div>

                <span class="toolbaritem">
                    <button id="prevPage" class="" title="{{# str }} prevPage, pdfannotator {{/ str }}" alt="{{# str }} prevPage, pdfannotator {{/ str }}">
                        <i class="icon fa fa-arrow-circle-up fa-lg" title="{{# str }} prevPage, pdfannotator {{/ str }}" alt="{{# str }} prevPage, pdfannotator {{/ str }}"></i>
                    </button><!--
                  --><button id="nextPage" class="" title="{{# str }} nextPage, pdfannotator {{/ str }}" alt="{{# str }} nextPage, pdfannotator {{/ str }}">
                        <i class="icon fa fa-arrow-circle-down fa-lg" title="{{# str }} nextPage, pdfannotator {{/ str }}" alt="{{# str }} nextPage, pdfannotator {{/ str }}"></i>
                     </button>
                    <input id="currentPage" title="{{# str }} currentPage, pdfannotator {{/ str }}" type="number" min="1" value="1"> / 
                    <span id="sumPages" title="{{# str }} sumPages, pdfannotator {{/ str }}">1</span>