fix image centering issue
[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         Hideable "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                         onKeypress: $empty,
24                 }
25         },
26
27         initialize: function(name,options){
28                 this.setOptions(this.getOptions(), options);
29
30                 this.options.container = $(this.options.container);
31                 this.options.tohide = $(this.options.tohide);
32
33                 this.container = new Element('div').addClass(name).
34                 setProperties({
35                         id: name,
36                         name: name,
37                 }).setStyles({
38                         position: 'absolute',
39                         left: '0px',
40                         top: '0px',
41                         width: '100%',
42                         zIndex: this.options.zIndex,
43                         overflow: 'hidden',
44                         display: 'none'
45                 }).addEvent('click', function(){
46                         this.options.onClick()
47                 }.bind(this)).addEvent('keypress', function(){
48                         this.options.onKeypress()
49                 }.bind(this)).injectInside(this.options.container);
50
51                 window.addEvent('resize', this.position.bind(this));
52                 window.addEvent('scroll', this.position.bind(this));
53         },
54
55         position: function(){
56                 if(this.options.container == document.body){
57                         this.w = window.getWidth();
58                         this.h = window.getHeight();
59                         this.s = window.getScrollTop();
60                 }else{
61                         var myCoords = this.options.container.getCoordinates();
62                         this.w = myCoords.width;
63                         this.h = myCoords.height;
64                         this.s = myCoords.top;
65                 }
66                 this.container.setStyles({
67                         top: this.s+'px',
68                         height: this.h+'px'
69                 })
70         },
71
72         getCoordinates: function(){
73                 return {
74                         width: this.w,
75                         height: this.h,
76                         top: this.s,
77                 };
78         },
79
80         show: function(){
81                 if (this.options.tohide) {
82                         this.hiddenstyles = this.options.tohide.getStyles(
83                                 'display'
84                         );
85                         this.options.tohide.setStyles({
86                                 display: 'none',
87                         });
88                 }
89                 this.bodystyles = document.body.getStyles(
90                         'overflow', 'overflow-x', 'overflow-y'
91                 );
92                 document.body.setStyles({
93                         overflow: 'hidden',
94                         'overflow-x': 'hidden',
95                         'overflow-y': 'hidden',
96                 });
97                 this.position();
98                 this.container.setStyle('display', 'block');
99         },
100
101         hide: function(){
102                 if (this.options.tohide) {
103                         this.options.tohide.setStyles(this.hiddenstyles);
104                 }
105                 document.body.setStyles(this.bodystyles);
106                 this.container.setStyle('display', 'none');
107         }
108 })
109 showWindow.implement(new Options);
110