X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/a1982d4e37d348ca0f58d41e1d4ce6022ca09b4d..bf542e5c5ebf5c3df36601630414c8bdfffc7862:/project/templates/explorer/file_xml.html?ds=sidebyside diff --git a/project/templates/explorer/file_xml.html b/project/templates/explorer/file_xml.html index c774fe1e..b906512c 100644 --- a/project/templates/explorer/file_xml.html +++ b/project/templates/explorer/file_xml.html @@ -1,65 +1,107 @@ {% extends "base.html" %} +{% load toolbar_tags %} {% block extrahead %} - <script src="/static/js/jquery.fieldselection.js" type="text/javascript" charset="utf-8"></script> <script src="/static/js/jquery.lazyload.js" type="text/javascript" charset="utf-8"></script> <script src="/static/js/codemirror/codemirror.js" type="text/javascript" charset="utf-8"></script> - <script type="text/javascript" charset="utf-8"> - function addEditorButton(label, fn) { - $('<button type="button">' + label + '</button>').click(function(event) { - var text = $('#id_text').getSelection().text; - $('#id_text').replaceSelection(fn(text)); - event.preventDefault(); - }).appendTo('#buttons'); - } - + <script src="/static/js/jquery.autoscroll.js" type="text/javascript" charset="utf-8"></script> + <script src="/static/js/jquery.wtooltip.js" type="text/javascript" charset="utf-8"></script> + <script src="/static/js/jquery.resizable.js" type="text/javascript" charset="utf-8"></script> + <script type="text/javascript" charset="utf-8"> $(function() { - $('#id_folders').change(function() { - $('#images').load('/images/' + $('#id_folders').val() + '/', function() { - $('#images').data('lastScroll', -1000); - }); - }); - + // ======================== + // = Two resizable panels = + // ======================== function resizePanels() { - $('iframe').width($(window).width() - $('#sidebar').outerWidth()); - $('iframe').height($(window).height() - 100); - $('#images-wrap, #toggle-sidebar').height($(window).height() - 100); + $('.panel').height($(window).height() - $('.panel').position().top); + $('#right-panel-wrap').width($(window).width() - $('#right-panel-wrap').position().left); } - $('#toggle-sidebar').toggle(function() { - $('#images-wrap').width(480); - $('#sidebar').width(488); - resizePanels(); - }, function() { - $('#images-wrap').width(0); - $('#sidebar').width(8); - resizePanels(); - }) - $(window).resize(function() { resizePanels(); }) - var editor = CodeMirror.fromTextArea("id_text", { - parserfile: 'parsexml.js', - path: "/static/js/codemirror/", - stylesheet: "/static/css/xmlcolors.css", - parserConfig: {useHTMLKludges: false} - }); + $('#left-panel-wrap').bind('resizable:resize', resizePanels) + .resizable('#slider', {minWidth: 8}); - $('iframe').load(function() { - $($('iframe').contents()).scroll(function() { - var percentScrolled = $('body', this).scrollTop() / $('body', this).height(); - $('#images-wrap').scrollTop(percentScrolled * $('#images').height()); - }); - - setTimeout(function() {resizePanels();}, 10); - }) + resizePanels(); - addEditorButton('utwór', function(text) { return '<utwor>' + text + '</utwor>'; }); - addEditorButton('akap', function(text) { return '<akap>' + text + '</akap>'; }); + // $('#id_folders').change(function() { + // $('#images').load('{% url folder_image_ajax %}' + $('#id_folders').val() + '/', function() { + // $('#images-wrap').data('lazyload:lastCheckedScrollTop', -10000); + // }); + // }); + // + // - $('#images-wrap').lazyload('.image-box', {threshold: 640 * 10, scrollTreshold: 640 * 5}); + // var editor = CodeMirror.fromTextArea("id_text", { + // parserfile: 'parsexml.js', + // path: "/static/js/codemirror/", + // stylesheet: "/static/css/xmlcolors.css", + // parserConfig: {useHTMLKludges: false}, + // initCallback: function() { + // $('#images').autoscroll('iframe'); + // $('.toggleAutoscroll').toggle(function() { + // $(this).html('Synchronizuj przewijanie'); + // $('#images').disableAutoscroll(); + // }, function() { + // $(this).html('Nie synchronizuj przewijania'); + // $('#images').enableAutoscroll(); + // }) + // + // // Toolbar + // $('#toolbar-tabs li').click(function() { + // var id = $(this).attr('p:button-list'); + // $('#toolbar-tabs li').removeClass('active'); + // $(this).addClass('active'); + // if (!$('#' + id).is(':visible')) { + // $('#toolbar-buttons ol').not('#' + id).hide(); + // $('#' + id).show(); + // } + // }) + // + // var keys = {}; + // $('#toolbar-buttons li').each(function() { + // var tag = $(this).attr('p:tag'); + // var handler = function() { + // var text = editor.selection(); + // editor.replaceSelection('<' + tag + '>' + text + '</' + tag + '>'); + // if (text.length == 0) { + // var pos = editor.cursorPosition(); + // editor.selectLines(pos.line, pos.character + tag.length + 2); + // } + // } + // if ($(this).attr('p:key')) { + // keys[$(this).attr('p:key')] = handler; + // } + // $(this).click(handler) + // }); + // + // editor.grabKeys(function(event) { + // if (keys[event.keyCode]) { + // keys[event.keyCode](); + // } + // }, function(event) { + // return event.altKey && keys[event.keyCode]; + // }); + // } + // }); + + + + + + // $('#toolbar-buttons li').wTooltip({ + // delay: 1000, + // style: { + // border: "1px solid #7F7D67", + // opacity: 0.9, + // background: "#FBFBC6", + // padding: "1px", + // fontSize: "12px", + // }}); + + // $('#images-wrap').lazyload('.image-box', {threshold: 640 * 10, scrollTreshold: 640 * 5}); }); </script> @@ -68,25 +110,36 @@ {% block breadcrumbs %}<a href="{% url file_list %}">Platforma Redakcyjna</a> ⯠plik {{ hash }}{% endblock breadcrumbs %} {% block maincontent %} - <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="clear: both; height: 0; width: 0"> </div></div> - - <form action="." method="post" accept-charset="utf-8"> <div id="panels"> - <div id="sidebar"> - <div id="images-wrap"> - <div id="images"> - <p>Aby zobaczyÄ obrazki wybierz folder poniżej:</p> - <p>{{ image_folders_form.folders }}</p> - </div> + <div id="left-panel-wrap" class="panel-wrap"> + <div id="left-panel" class="panel"> + <div id="slider" style="float: right"></div> </div> - <div id="toggle-sidebar"></div> </div> - <textarea id="id_text" name="text" width="480px">{{ form.text.field.initial }}</textarea> - </div> - - <div id="status-bar"> - {{ form.user.errors }} {{ form.commit_message.errors }} - <p>Użytkownik: {{ form.user }} Opis zmian: {{ form.commit_message }} <input type="submit" value="Zapisz"/></p> + <div id="right-panel-wrap" class="panel-wrap"> + <div id="right-panel" class="panel"> + {# <textarea id="id_text" name="text" width="480px">{{ form.text.field.initial }}</textarea> #} + </div> + </div> + {# #} + {# <div id="toggle-sidebar" style="float: right"></div> #} + {# <div id="whatever"> #} + {# <div id="sidebar-toolbar"> #} + {# <ol id="sidebar-tabs"> #} + {# <li>Tab</li> #} + {# <li>Tab 2</li> #} + {# </ol> #} + {# </div> #} + {# <div id="images-wrap"> #} + {# #} + {# <div style="clear: both; height: 0; width: 0"> </div> #} + {# <div id="images"> #} + {# <p>Aby zobaczyÄ obrazki wybierz folder poniżej:</p> #} + {# <p>{{ image_folders_form.folders }}</p> #} + {# </div> #} + {# </div> #} + {# </div> #} + {# </div> #} + {# {% toolbar %} #} </div> - </form> {% endblock maincontent %}