X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/8daaa89eca8bd7d5fa7d20469486bd8610c7bc32..6fe62383022267b9c4a23a64f124205a3525f1e7:/project/static/js/panels.js?ds=sidebyside diff --git a/project/static/js/panels.js b/project/static/js/panels.js index e5028619..abbd2182 100644 --- a/project/static/js/panels.js +++ b/project/static/js/panels.js @@ -1,9 +1,54 @@ +function loadPanel(target, url) { + console.log('ajax', url, 'into', target); + $(document).trigger('panel:unload', target); + $.ajax({ + 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); + }, + error: function(request, textStatus, errorThrown) { + console.log('ajax', url, target, 'error:', textStatus, errorThrown); + } + }); +} + +// Funkcja do tworzenia nowych paneli +function panel(load, unload) { + var self = null; + var eventId = Math.ceil(Math.random() * 1000000000); + + unloadHandler = function(event, panel) { + if (self && self == panel) { + 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'); + }); +} + $(function() { // ======================== // = Resizable panels = // ======================== 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()); } @@ -11,13 +56,13 @@ $(function() { resizePanels(); }) - $('#left-panel-wrap').bind('resizable:resize', resizePanels) + $('#left-panel-wrap').bind('resizable:stop', resizePanels) .resizable('#slider', {minWidth: 8}); resizePanels(); $('.panel-toolbar select').change(function() { - console.log('loading panel', $(this).val(), 'into', $('.panel-contents', $(this).parent())); + loadPanel($('.panel-contents', $(this).parent().parent()), $(this).val()) }); // $('#id_folders').change(function() { // $('#images').load('{% url folder_image_ajax %}' + $('#id_folders').val() + '/', function() {