- Sensownie działający mechanizm paneli.

 - Dodanie panelu z galerią skanów.

diff --git a/apps/explorer/views.py b/apps/explorer/views.py
index 8d80d02..3b3fdb1 100644 (file)
--- a/apps/explorer/views.py
+++ b/apps/explorer/views.py
@@ -39,13 +39,32 @@ def file_xml(request, path):
     })
 
 
+# ===============
+# = Panel views =
+# ===============
+def xmleditor_panel(request, path):
+    form = forms.BookForm()
+    text = repo.get_file(path).data()
+    
+    return direct_to_template(request, 'explorer/panels/xmleditor.html', extra_context={
+        'text': text,
+    })
+    
+
+def gallery_panel(request, path):
+    return direct_to_template(request, 'explorer/panels/gallery.html', extra_context={
+        'form': forms.ImageFoldersForm(),
+    })
+
+
 def file_html(request, path):
     return direct_to_template(request, 'explorer/file_html.html', extra_context={
         'object': html.transform(repo.get_file(path).data(), is_file=False),
         'hash': path,
         'image_folders_form': forms.ImageFoldersForm(),
     })
-  
+ 
+
 def folder_images(request, folder):
     return direct_to_template(request, 'explorer/folder_images.html', extra_context={
         'images': models.get_images_from_folder(folder),

diff --git a/project/static/css/master.css b/project/static/css/master.css
index c983589..a9c0a41 100644 (file)
--- a/project/static/css/master.css
+++ b/project/static/css/master.css
@@ -78,7 +78,6 @@ label {
 /* = Panels = */
 /* ========== */
 .panel-wrap {
-    position: relative;
     overflow: hidden;
 }
 
@@ -121,3 +120,12 @@ label {
     background-color: #999;
     cursor: col-resize;
 }
+
+/* ================= */
+/* = Gallery panel = */
+/* ================= */
+.images-wrap {
+    overflow-x: hidden;
+    overflow-y: scroll;
+}
+

diff --git a/project/static/js/panels.js b/project/static/js/panels.js
index eb1380d..2f20a28 100644 (file)
--- a/project/static/js/panels.js
+++ b/project/static/js/panels.js
@@ -5,7 +5,9 @@ function loadPanel(target, url) {
         url: url,
         dataType: 'html',
         success: function(data, textStatus) {
+            console.log(target, 'ajax success');
             $(target).html(data);
+            console.log(target, 'triggering panel:load');
             $(document).trigger('panel:load', target);
             // panel(target);
         },
@@ -22,15 +24,21 @@ function panel(load, unload) {
     
     unloadHandler = function(event, panel) {
         if (self && self == panel) {
-            $(document).unbind('panel:unload.' + eventId, unloadHandler);
+            console.log('Panel', panel, 'unloading');
+            $(document).unbind('panel:unload.' + eventId);
+            $(panel).html('');
             unload(event, panel);
+            console.log('Panel', panel, 'unloaded');
+            return false;
         }
     };
     
     $(document).one('panel:load', function(event, panel) {
         self = panel;
+        console.log('Panel', panel, 'loading');
         $(document).bind('panel:unload.' + eventId, unloadHandler);
         load(event, panel);
+        console.log('Panel', panel, 'loaded');
     });
 }
 
@@ -40,6 +48,7 @@ $(function() {
     // ========================
     function resizePanels() {
         $('.panel').height($(window).height() - $('.panel').position().top);
+        $('.panel-contents').height($(window).height() - $('.panel-contents').position().top);
         $('#right-panel-wrap').width($(window).width() - $('#left-panel-wrap').outerWidth());
     }
     

diff --git a/project/templates/explorer/file_xml.html b/project/templates/explorer/file_xml.html
index f57d9ea..992bb8d 100644 (file)
--- a/project/templates/explorer/file_xml.html
+++ b/project/templates/explorer/file_xml.html
@@ -21,8 +21,8 @@
                         <div id="left-panel-toolbar" class="panel-toolbar">
                             <label for="select-left-panel">Lewy panel:</label>
                             <select name="select-left-panel" id="select-left-panel">
-                                <option value="{% url xmleditor %}">Edytor XML</option>
-                                <option value="panel2">Panel 2</option>                            
+                                <option value="{% url xmleditor_panel hash %}">Edytor XML</option>
+                                <option value="{% url gallery_panel hash %}">Galeria skanów</option>                            
                             </select>
                         </div>
                         <div id="left-panel-contents" class="panel-contents">
@@ -35,8 +35,8 @@
                     <div id="right-panel-toolbar" class="panel-toolbar">
                         <label for="select-right-panel">Prawy panel:</label>
                         <select name="select-right-panel" id="select-right-panel">
-                            <option value="{% url xmleditor %}">Edytor XML</option>
-                            <option value="panel2">Panel 2</option>                            
+                            <option value="{% url xmleditor_panel hash %}">Edytor XML</option>
+                            <option value="{% url gallery_panel hash %}">Galeria skanów</option>                            
                         </select>
                     </div>
                     <div id="right-panel-contents" class="panel-contents">

diff --git a/project/templates/explorer/panels/gallery.html b/project/templates/explorer/panels/gallery.html
new file mode 100644 (file)
index 0000000..d35366e
--- /dev/null
+++ b/project/templates/explorer/panels/gallery.html
@@ -0,0 +1,33 @@
+<div class="panel">
+    <div class="images-wrap">
+        <div class="images">
+            <p>Aby zobaczyć obrazki wybierz folder poniżej:</p>
+            <p><select name="folders" class="id_folders">
+            <option value="" selected="selected">-- Wybierz folder z obrazkami --</option>
+            <option value="andersen_basnie">andersen_basnie</option>
+            </select></p>
+        </div>
+    </div>
+</div>
+<script type="text/javascript" charset="utf-8">
+    (function() {
+        function resizeEditor(event, panel) {
+            var panel = panel || event.data.panel;
+            $('.images-wrap', panel).height($(panel).height());
+        }
+
+        panel(function(event, panel) {
+            $('.id_folders', panel).change(function() {
+                $('.images', panel).load('{% url folder_image_ajax %}' + $('.id_folders', panel).val() + '/', function() {
+                    $('.images-wrap', panel).data('lazyload:lastCheckedScrollTop', -10000);
+                });
+            });
+            $('.images-wrap', panel).lazyload('.image-box', {threshold: 640 * 10, scrollTreshold: 640 * 5});
+            
+            $(window).bind('resize', {'panel': panel}, resizeEditor);
+            resizeEditor(null, panel);  
+        }, function(event, panel) {
+            console.log('unloaded gallery panel', panel);
+        });
+    })()
+</script>

diff --git a/project/templates/explorer/panels/xmleditor.html b/project/templates/explorer/panels/xmleditor.html
index 6bdcc30..f8d3fef 100644 (file)
--- a/project/templates/explorer/panels/xmleditor.html
+++ b/project/templates/explorer/panels/xmleditor.html
@@ -1,19 +1,28 @@
 <div class="panel">
-    <textarea name="text" width="480px"><ala><ma></ma></ala></textarea>
+    <textarea name="text" width="480px">{{ text }}</textarea>
 </div>
 <script type="text/javascript" charset="utf-8">
-    panel(function(event, panel) {
-        console.log('loading panel', panel);
-        var textareaId = 'xmleditor-' + Math.ceil(Math.random() * 1000000000);
-        $('textarea', panel).attr('id', textareaId);
-        var editor = CodeMirror.fromTextArea(textareaId, {
-            parserfile: 'parsexml.js',
-            path: "/static/js/codemirror/",
-            stylesheet: "/static/css/xmlcolors.css",
-            parserConfig: {useHTMLKludges: false},
-            initCallback: function() {}
+    (function() {
+        function resizeEditor(event, panel) {
+            var panel = panel || event.data.panel;
+            $('iframe', panel).height($(panel).height());
+        }
+        
+        panel(function(event, panel) {
+            console.log('loading panel', panel);
+            var textareaId = 'xmleditor-' + Math.ceil(Math.random() * 1000000000);
+            $('textarea', panel).attr('id', textareaId);
+            var editor = CodeMirror.fromTextArea(textareaId, {
+                parserfile: 'parsexml.js',
+                path: "/static/js/codemirror/",
+                stylesheet: "/static/css/xmlcolors.css",
+                parserConfig: {useHTMLKludges: false},
+                initCallback: function() {}
+            })
+            $(window).bind('resize', {'panel': panel}, resizeEditor);
+            resizeEditor(null, panel);
+        }, function(event, panel) {
+            console.log('unloaded xmleditor panel', panel);
         })
-    }, function(event, panel) {
-        console.log('unloaded panel', panel);
-    })
+    })();
 </script>

diff --git a/project/urls.py b/project/urls.py
index 47a4274..7a90ed1 100644 (file)
--- a/project/urls.py
+++ b/project/urls.py
@@ -14,8 +14,10 @@ urlpatterns = patterns('',
     url(r'^images/(?P<folder>[^/]+)/$', 'explorer.views.folder_images', name='folder_image'),
     url(r'^images/$', 'explorer.views.folder_images', {'folder': '.'}, name='folder_image_ajax'),
     
-    url(r'^panels/xmleditor$', 'django.views.generic.simple.direct_to_template', 
-        {'template': 'explorer/panels/xmleditor.html'}, name='xmleditor'),
+    # Editor panels
+    url(r'^editor/(?P<path>[^/]+)/panels/xmleditor$', 'explorer.views.xmleditor_panel', name='xmleditor_panel'),
+    url(r'^editor/(?P<path>[^/]+)/panels/gallery$', 'explorer.views.gallery_panel', name='gallery_panel'),
+    
     # Admin panel
     url(r'^admin/doc/', include('django.contrib.admindocs.urls')),
     url(r'^admin/(.*)', admin.site.root),