1ad0d17ff2e142a43cba067d04cd03941ccd2c09
[redakcja.git] / project / static / js / lib / jquery.hpanel.js
1 (function($){
2     
3         /* behaviour */
4         $.hpanel = {
5         settings: {},
6                 current_data: {},
7         resize_start: function(event, mydata) {
8                         $(document).bind('mousemove', mydata, $.hpanel.resize_changed).
9                                 bind('mouseup', mydata, $.hpanel.resize_stop); 
10
11                         $('.panel-overlay', mydata.root).css('display', 'block');
12                         return false;
13                 },
14         resize_changed: function(event) {
15                         var old_width = parseInt(event.data.overlay.css('width'));
16                         var delta = event.pageX + event.data.hotspot_x - old_width;
17                         event.data.overlay.css({'width': old_width + delta});
18
19                         if(event.data.overlay.next) {
20                                 var left = parseInt(event.data.overlay.next.css('left'));
21                                 event.data.overlay.next.css('left', left+delta);
22                         }
23
24             return false; 
25         },
26         resize_stop: function(event) {
27             $(document).unbind('mousemove', $.hpanel.resize_changed).unbind('mouseup', $.hpanel.resize_stop);
28                         // $('.panel-content', event.data.root).css('display', 'block');
29                         var overlays = $('.panel-content-overlay', event.data.root);
30                         $('.panel-content-overlay', event.data.root).each(function(i) {
31                                 if( $(this).data('panel').hasClass('last-panel') )
32                                         $(this).data('panel').css({
33                                                 'left': $(this).css('left'), 'right': $(this).css('right')}); 
34                                 else
35                                         $(this).data('panel').css({
36                                                 'left': $(this).css('left'), 'width': $(this).css('width')}); 
37                         });
38                         $('.panel-overlay', event.data.root).css('display', 'none');
39             $(event.data.root).trigger('stopResize');
40         }
41     };
42     
43     $.fn.makeHorizPanel = function(options) 
44         {
45                 var root = $(this)
46
47                 /* create an overlay */
48                 var overlay_root = $("<div class='panel-overlay'></div>");
49                 root.append(overlay_root);
50
51                 var prev = null;
52
53                 $('*.panel-wrap', root).each( function() 
54         {
55                         var panel = $(this);
56                         var handle = $('.panel-slider', panel);
57                         var overlay = $("<div class='panel-content-overlay panel-wrap'>&nbsp;</div>");
58                         overlay_root.append(overlay);
59                         overlay.data('panel', panel);
60                         overlay.data('next', null);
61
62                         if (prev) prev.next = overlay;
63
64                         if( panel.hasClass('last-panel') )                              
65             {
66                                 overlay.css({'left': panel.css('left'), 'right': panel.css('right')});
67             }
68                         else {
69                                 overlay.css({'left': panel.css('left'), 'width': panel.css('width')});
70                                 $.log('Has handle: ' + panel.attr('id'));
71                                 overlay.append(handle.clone());
72                                 /* attach the trigger */
73                                 handle.mousedown(function(event) {
74                                         var touch_data = {
75                                                 root: root, overlay: overlay,
76                                                 hotspot_x: event.pageX - handle.position().left
77                                         };
78
79                                         $(this).trigger('hpanel:panel-resize-start', touch_data);
80                                         return false;
81                                 });
82                                 $('.panel-content', panel).css('right', 
83                                         (handle.outerWidth() || 10) + 'px');
84                                 $('.panel-content-overlay', panel).css('right',
85                                         (handle.outerWidth() || 10) + 'px');
86                         };                              
87
88                         prev = overlay;
89         });
90
91         root.bind('hpanel:panel-resize-start', $.hpanel.resize_start);
92     };
93 })(jQuery);
94