basically it works
[mkgallery.git] / include / showwin.js
1 /*
2         $Id$
3
4         This is a part of mkgallery.pl suite
5         http://www.average.org/mkgallery/
6
7         Uses mootools (1.2) http://www.mootools.net/
8         Uses slideshow http://www.phatfusion.net/slideshow/
9 */
10
11 /*
12         Hidable "fullscreen" Window for Slideshow
13 */
14
15 var showWindow = new Class({
16
17         getOptions: function(){
18                 return {
19                         zIndex: 2,
20                         container: document.body,
21                         tohide: '',
22                         onClick: $empty,
23                 }
24         },
25
26         initialize: function(name,options){
27                 this.setOptions(this.getOptions(), options);
28
29                 this.options.container = $(this.options.container);
30                 this.options.tohide = $(this.options.tohide);
31
32                 this.container = new Element('div').addClass(name).
33                 setProperties({
34                         id: name,
35                         name: name,
36                 }).setStyles({
37                         position: 'absolute',
38                         left: '0px',
39                         top: '0px',
40                         width: '100%',
41                         zIndex: this.options.zIndex,
42                         overflow: 'hidden',
43                         display: 'none'
44                 }).addEvent('click', function(){
45                         this.options.onClick()
46                 }.bind(this)).injectInside(this.options.container);
47
48                 this.position();
49
50                 window.addEvent('resize', this.position.bind(this));
51                 window.addEvent('scroll', this.position.bind(this));
52         },
53
54         position: function(){
55                 if(this.options.container == document.body){
56                         this.w = window.getWidth();
57                         this.h = window.getHeight();
58                         this.s = window.getScrollTop();
59                 }else{
60                         var myCoords = this.options.container.getCoordinates();
61                         this.w = myCoords.width;
62                         this.h = myCoords.height;
63                         this.s = myCoords.top;
64                 }
65                 this.container.setStyles({
66                         top: this.s+'px',
67                         height: this.h+'px'
68                 })
69         },
70
71         getCoordinates: function(){
72                 return {
73                         width: this.w,
74                         height: this.h,
75                         top: this.s,
76                 };
77         },
78
79         show: function(){
80                 if (this.options.tohide) {
81                         this.hiddenstyles = this.options.tohide.getStyles(
82                                 'display'
83                         );
84                         this.options.tohide.setStyles({
85                                 display: 'none',
86                         });
87                 }
88                 this.bodystyles = document.body.getStyles(
89                         'overflow', 'overflow-x', 'overflow-y'
90                 );
91                 document.body.setStyles({
92                         overflow: 'hidden',
93                         'overflow-x': 'hidden',
94                         'overflow-y': 'hidden',
95                 });
96                 this.container.setStyle('display', 'block');
97         },
98
99         hide: function(){
100                 if (this.options.tohide) {
101                         this.options.tohide.setStyles(this.hiddenstyles);
102                 }
103                 document.body.setStyles(this.bodystyles);
104                 this.container.setStyle('display', 'none');
105         }
106 })
107 showWindow.implement(new Options);
108