project/templates/explorer/file_xml.html

   1 {% extends "base.html" %}
   2
   3 {% block extrahead %}
   4     <script src="/static/js/jquery.fieldselection.js" type="text/javascript" charset="utf-8"></script>
   5     <script type="text/javascript" charset="utf-8">
   6         function aboveViewport(container, element, treshold) {
   7             return $(container).offset().top >= $(element).offset().top + $(element).height() + treshold;
   8         }
   9
  10         function belowViewport(container, element, treshold) {
  11             return $(container).offset().top + $(container).height() + treshold <= $(element).offset().top;
  12         }
  13
  14         var TRESHOLD = 600;
  15         var lastScroll = -1000;
  16
  17         function checkScroll() {
  18             if (Math.abs($('#images').scrollTop() - lastScroll) > 300) {
  19                 var container = $('#images');
  20                 lastScroll = container.scrollTop();
  21
  22                 $('#images .image-box').each(function() {
  23                     if (aboveViewport(container, this, TRESHOLD)) {
  24                         $(this).html('loading...');
  25                     } else if (belowViewport(container, this, TRESHOLD)) {
  26                         $(this).html('loading...');
  27                     } else {
  28                         $(this).html('<img src="' + $(this).attr('src') + '" width="460" height="460"/>');
  29                     }
  30                 })
  31             }
  32             setTimeout(checkScroll, 2000);
  33         }
  34
  35         function addEditorButton(label, fn) {
  36             $('<button type="button">' + label + '</button>').click(function(event) {
  37                 var text = $('#id_text').getSelection().text;
  38                 $('#id_text').replaceSelection(fn(text));
  39                 event.preventDefault();
  40             }).appendTo('#buttons');
  41         }
  42
  43         $(function() {
  44             $('#id_folders').change(function() {
  45                 $('#images').load('/images/' + $('#id_folders').val() + '/', function() {
  46                     lastScroll = -1000;
  47                 });
  48             });
  49
  50             addEditorButton('utwór', function(text) { return '<utwor>' + text + '</utwor>'; });
  51             addEditorButton('akap', function(text) { return '<akap>' + text + '</akap>'; });
  52
  53             setTimeout(checkScroll, 2000);
  54         });
  55     </script>
  56 {% endblock extrahead %}
  57
  58 {% block breadcrumbs %}<a href="/">Platforma Redakcyjna</a> ❯ plik {{ hash }}{% endblock breadcrumbs %}
  59
  60 {% block maincontent %}
  61     <div id="tabs"><a href="{% url file_xml hash %}" class="active">Źródło</a><a href="{% url file_html hash %}">HTML</a>    <div style="padding: 3px; margin-left: 10px">{{ image_folders_form.folders }}</div><div style="clear: both; height: 0; width: 0">&nbsp;</div></div>
  62
  63     <div id="images">
  64         <p>Aby zobaczyć obrazki wybierz folder z obrazkami powyżej.</p>
  65     </div>
  66     <form action="." method="post" accept-charset="utf-8">
  67         <div id="buttons"></div>
  68         {{ form.text }}
  69         {{ form.user.errors }}
  70         <p>Użytkownik: {{ form.user }}</p>
  71         {{ form.commit_message.errors }}
  72         <p>Opis zmian: {{ form.commit_message }} <input type="submit" value="Zapisz"/></p>
  73     </form>
  74 {% endblock maincontent %}