Diffstat (limited to 'frontend/beta/js/Clipperz/YUI/Drawer.js') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/beta/js/Clipperz/YUI/Drawer.js | 22 |
1 files changed, 10 insertions, 12 deletions
diff --git a/frontend/beta/js/Clipperz/YUI/Drawer.js b/frontend/beta/js/Clipperz/YUI/Drawer.js index 508bfe5..2105363 100644 --- a/frontend/beta/js/Clipperz/YUI/Drawer.js +++ b/frontend/beta/js/Clipperz/YUI/Drawer.js | |||
@@ -1,214 +1,212 @@ | |||
1 | /* | 1 | /* |
2 | 2 | ||
3 | Copyright 2008-2011 Clipperz Srl | 3 | Copyright 2008-2013 Clipperz Srl |
4 | 4 | ||
5 | This file is part of Clipperz Community Edition. | 5 | This file is part of Clipperz, the online password manager. |
6 | Clipperz Community Edition is an online password manager. | ||
7 | For further information about its features and functionalities please | 6 | For further information about its features and functionalities please |
8 | refer to http://www.clipperz.com. | 7 | refer to http://www.clipperz.com. |
9 | 8 | ||
10 | * Clipperz Community Edition is free software: you can redistribute | 9 | * Clipperz is free software: you can redistribute it and/or modify it |
11 | it and/or modify it under the terms of the GNU Affero General Public | 10 | under the terms of the GNU Affero General Public License as published |
12 | License as published by the Free Software Foundation, either version | 11 | by the Free Software Foundation, either version 3 of the License, or |
13 | 3 of the License, or (at your option) any later version. | 12 | (at your option) any later version. |
14 | 13 | ||
15 | * Clipperz Community Edition is distributed in the hope that it will | 14 | * Clipperz is distributed in the hope that it will be useful, but |
16 | be useful, but WITHOUT ANY WARRANTY; without even the implied | 15 | WITHOUT ANY WARRANTY; without even the implied warranty of |
17 | warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. | 16 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. |
18 | See the GNU Affero General Public License for more details. | 17 | See the GNU Affero General Public License for more details. |
19 | 18 | ||
20 | * You should have received a copy of the GNU Affero General Public | 19 | * You should have received a copy of the GNU Affero General Public |
21 | License along with Clipperz Community Edition. If not, see | 20 | License along with Clipperz. If not, see http://www.gnu.org/licenses/. |
22 | <http://www.gnu.org/licenses/>. | ||
23 | 21 | ||
24 | */ | 22 | */ |
25 | 23 | ||
26 | if (typeof(Clipperz) == 'undefined') { Clipperz = {}; } | 24 | if (typeof(Clipperz) == 'undefined') { Clipperz = {}; } |
27 | if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; } | 25 | if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; } |
28 | 26 | ||
29 | 27 | ||
30 | Clipperz.YUI.Drawer = function(anElement, aRegion) { | 28 | Clipperz.YUI.Drawer = function(anElement, aRegion) { |
31 | this._status = 'slideIn'; | 29 | this._status = 'slideIn'; |
32 | 30 | ||
33 | this._element = YAHOO.ext.Element.get(anElement); | 31 | this._element = YAHOO.ext.Element.get(anElement); |
34 | this._region = aRegion || null; | 32 | this._region = aRegion || null; |
35 | 33 | ||
36 | this._collapsedElement = this.element().getChildrenByClassName("drawer-collapsed")[0]; | 34 | this._collapsedElement = this.element().getChildrenByClassName("drawer-collapsed")[0]; |
37 | this._contentElement = this.element().getChildrenByClassName("drawer-content")[0]; | 35 | this._contentElement = this.element().getChildrenByClassName("drawer-content")[0]; |
38 | 36 | ||
39 | 37 | ||
40 | this._wholeCollapedElement = this.enhanceCollapsedElement(); | 38 | this._wholeCollapedElement = this.enhanceCollapsedElement(); |
41 | this._wholeCollapedElement.setWidth(this.region().element().getWidth()); | 39 | this._wholeCollapedElement.setWidth(this.region().element().getWidth()); |
42 | this._wholeCollapedElement.setHeight(this.region().element().getHeight()); | 40 | this._wholeCollapedElement.setHeight(this.region().element().getHeight()); |
43 | 41 | ||
44 | this._contentWrapper = this.enhanceContentElement(); | 42 | this._contentWrapper = this.enhanceContentElement(); |
45 | this._contentElementActor = new YAHOO.ext.Actor(this.contentWrapper().dom); | 43 | this._contentElementActor = new YAHOO.ext.Actor(this.contentWrapper().dom); |
46 | this.contentElementActor().hide(); | 44 | this.contentElementActor().hide(); |
47 | 45 | ||
48 | this._contentWidth = 200; | 46 | this._contentWidth = 200; |
49 | }; | 47 | }; |
50 | 48 | ||
51 | YAHOO.extendX(Clipperz.YUI.Drawer, YAHOO.ext.util.Observable, { | 49 | YAHOO.extendX(Clipperz.YUI.Drawer, YAHOO.ext.util.Observable, { |
52 | 50 | ||
53 | 'element': function() { | 51 | 'element': function() { |
54 | return this._element; | 52 | return this._element; |
55 | }, | 53 | }, |
56 | 54 | ||
57 | //----------------------------------------------------- | 55 | //----------------------------------------------------- |
58 | 56 | ||
59 | 'status': function() { | 57 | 'status': function() { |
60 | return this._status; | 58 | return this._status; |
61 | }, | 59 | }, |
62 | 60 | ||
63 | 'setStatus': function(aValue) { | 61 | 'setStatus': function(aValue) { |
64 | this._status = aValue; | 62 | this._status = aValue; |
65 | }, | 63 | }, |
66 | 64 | ||
67 | //----------------------------------------------------- | 65 | //----------------------------------------------------- |
68 | 66 | ||
69 | 'collapsedElement': function() { | 67 | 'collapsedElement': function() { |
70 | return this._collapsedElement; | 68 | return this._collapsedElement; |
71 | }, | 69 | }, |
72 | 70 | ||
73 | //----------------------------------------------------- | 71 | //----------------------------------------------------- |
74 | 72 | ||
75 | 'contentElement': function() { | 73 | 'contentElement': function() { |
76 | return this._contentElement; | 74 | return this._contentElement; |
77 | }, | 75 | }, |
78 | 76 | ||
79 | //----------------------------------------------------- | 77 | //----------------------------------------------------- |
80 | 78 | ||
81 | 'contentElementActor': function() { | 79 | 'contentElementActor': function() { |
82 | return this._contentElementActor; | 80 | return this._contentElementActor; |
83 | }, | 81 | }, |
84 | 82 | ||
85 | //----------------------------------------------------- | 83 | //----------------------------------------------------- |
86 | 84 | ||
87 | 'contentWrapper': function() { | 85 | 'contentWrapper': function() { |
88 | return this._contentWrapper; | 86 | return this._contentWrapper; |
89 | }, | 87 | }, |
90 | 88 | ||
91 | //----------------------------------------------------- | 89 | //----------------------------------------------------- |
92 | 90 | ||
93 | 'contentWidth': function() { | 91 | 'contentWidth': function() { |
94 | return this._contentWidth; | 92 | return this._contentWidth; |
95 | }, | 93 | }, |
96 | 94 | ||
97 | //----------------------------------------------------- | 95 | //----------------------------------------------------- |
98 | 96 | ||
99 | 'region': function() { | 97 | 'region': function() { |
100 | return this._region; | 98 | return this._region; |
101 | }, | 99 | }, |
102 | 100 | ||
103 | //----------------------------------------------------- | 101 | //----------------------------------------------------- |
104 | 102 | ||
105 | 'enhanceCollapsedElement': function() { | 103 | 'enhanceCollapsedElement': function() { |
106 | varwrapper; | 104 | varwrapper; |
107 | var link; | 105 | var link; |
108 | 106 | ||
109 | wrapper = this.collapsedElement().wrap({tag:'div', cls:'drawer-collapsedElement-wrapper', children:[ | 107 | wrapper = this.collapsedElement().wrap({tag:'div', cls:'drawer-collapsedElement-wrapper', children:[ |
110 | {tag:'div', cls:'drawer-pin-button', children:[ | 108 | {tag:'div', cls:'drawer-pin-button', children:[ |
111 | {tag:'a', cls:'drawer-pin-button', href:"#", children:[ | 109 | {tag:'a', cls:'drawer-pin-button', href:"#", children:[ |
112 | {tag:'img', src:'./images/directLogins/drawer/mm-expand.gif'} | 110 | {tag:'img', src:'./images/directLogins/drawer/mm-expand.gif'} |
113 | ]} | 111 | ]} |
114 | ]} | 112 | ]} |
115 | ]}); | 113 | ]}); |
116 | 114 | ||
117 | link = wrapper.getChildrenByClassName('drawer-pin-button', 'a')[0]; | 115 | link = wrapper.getChildrenByClassName('drawer-pin-button', 'a')[0]; |
118 | MochiKit.Signal.connect(link.dom, 'onclick', this, 'pinDrawer'); | 116 | MochiKit.Signal.connect(link.dom, 'onclick', this, 'pinDrawer'); |
119 | 117 | ||
120 | this.collapsedElement().setHeight('100%'); | 118 | this.collapsedElement().setHeight('100%'); |
121 | this.collapsedElement().setStyle('cursor', 'pointer'); | 119 | this.collapsedElement().setStyle('cursor', 'pointer'); |
122 | MochiKit.Signal.connect(this.collapsedElement().dom, 'onclick', this, 'showDrawer'); | 120 | MochiKit.Signal.connect(this.collapsedElement().dom, 'onclick', this, 'showDrawer'); |
123 | 121 | ||
124 | return wrapper; | 122 | return wrapper; |
125 | }, | 123 | }, |
126 | 124 | ||
127 | //----------------------------------------------------- | 125 | //----------------------------------------------------- |
128 | 126 | ||
129 | 'enhanceContentElement': function() { | 127 | 'enhanceContentElement': function() { |
130 | var wrapper; | 128 | var wrapper; |
131 | 129 | ||
132 | wrapper = this.contentElement().wrap({tag:'div', cls:'drawer-content-wrapper', children:[ | 130 | wrapper = this.contentElement().wrap({tag:'div', cls:'drawer-content-wrapper', children:[ |
133 | {tag:'div', cls:'drawer-content-header', html:'direct login', style:'width:100%;'} | 131 | {tag:'div', cls:'drawer-content-header', html:'direct login', style:'width:100%;'} |
134 | ]}); | 132 | ]}); |
135 | 133 | ||
136 | MochiKit.Signal.connect(wrapper.dom, 'onclick', this, 'hideDrawer'); | 134 | MochiKit.Signal.connect(wrapper.dom, 'onclick', this, 'hideDrawer'); |
137 | return wrapper; | 135 | return wrapper; |
138 | }, | 136 | }, |
139 | 137 | ||
140 | //----------------------------------------------------- | 138 | //----------------------------------------------------- |
141 | 139 | ||
142 | 'pinDrawer': function() { | 140 | 'pinDrawer': function() { |
143 | alert("pin drawer"); | 141 | alert("pin drawer"); |
144 | }, | 142 | }, |
145 | 143 | ||
146 | //----------------------------------------------------- | 144 | //----------------------------------------------------- |
147 | 145 | ||
148 | 'showDrawer': function() { | 146 | 'showDrawer': function() { |
149 | if (this.status() == 'slideIn') { | 147 | if (this.status() == 'slideIn') { |
150 | var actor; | 148 | var actor; |
151 | 149 | ||
152 | this.setStatus('slidingOut'); | 150 | this.setStatus('slidingOut'); |
153 | actor = this.contentElementActor(); | 151 | actor = this.contentElementActor(); |
154 | actor.setHeight(this.region().element().getHeight()); | 152 | actor.setHeight(this.region().element().getHeight()); |
155 | 153 | ||
156 | actor.startCapture(true); | 154 | actor.startCapture(true); |
157 | actor.alignTo(this.element(), 'tr'); | 155 | actor.alignTo(this.element(), 'tr'); |
158 | actor.blindShow('left', this.contentWidth(), .35); | 156 | actor.blindShow('left', this.contentWidth(), .35); |
159 | actor.play(this.onSlideOut.createDelegate(this)); | 157 | actor.play(this.onSlideOut.createDelegate(this)); |
160 | } | 158 | } |
161 | }, | 159 | }, |
162 | 160 | ||
163 | //----------------------------------------------------- | 161 | //----------------------------------------------------- |
164 | 162 | ||
165 | 'onSlideOut': function() { | 163 | 'onSlideOut': function() { |
166 | this.setStatus('slideOut'); | 164 | this.setStatus('slideOut'); |
167 | MochiKit.Logging.logDebug(">>> onSlideOut"); | 165 | MochiKit.Logging.logDebug(">>> onSlideOut"); |
168 | // alert("done"); | 166 | // alert("done"); |
169 | }, | 167 | }, |
170 | 168 | ||
171 | //----------------------------------------------------- | 169 | //----------------------------------------------------- |
172 | /* | 170 | /* |
173 | 'showContentElement': function() { | 171 | 'showContentElement': function() { |
174 | var top, left, width, height; | 172 | var top, left, width, height; |
175 | 173 | ||
176 | MochiKit.Logging.logDebug(">>> showContentElement"); | 174 | MochiKit.Logging.logDebug(">>> showContentElement"); |
177 | 175 | ||
178 | 176 | ||
179 | top = this.element().getTop(true); | 177 | top = this.element().getTop(true); |
180 | left = this.element().getRight(); | 178 | left = this.element().getRight(); |
181 | width = this.contentWidth(); | 179 | width = this.contentWidth(); |
182 | height = this.element().getHeight(); | 180 | height = this.element().getHeight(); |
183 | 181 | ||
184 | this.contentWrapper().setStyle('position', 'absolute'); | 182 | this.contentWrapper().setStyle('position', 'absolute'); |
185 | this.contentWrapper().setStyle('overflow', 'none'); | 183 | this.contentWrapper().setStyle('overflow', 'none'); |
186 | this.contentWrapper().setStyle('visibility', 'visible'); | 184 | this.contentWrapper().setStyle('visibility', 'visible'); |
187 | this.contentWrapper().setStyle('z-index', '10'); | 185 | this.contentWrapper().setStyle('z-index', '10'); |
188 | 186 | ||
189 | this.contentWrapper().setLeft(left); | 187 | this.contentWrapper().setLeft(left); |
190 | this.contentWrapper().setTop(top); | 188 | this.contentWrapper().setTop(top); |
191 | this.contentWrapper().setHeight(height); | 189 | this.contentWrapper().setHeight(height); |
192 | this.contentWrapper().setWidth(width); | 190 | this.contentWrapper().setWidth(width); |
193 | 191 | ||
194 | this.contentWrapper().show(); | 192 | this.contentWrapper().show(); |
195 | }, | 193 | }, |
196 | */ | 194 | */ |
197 | //----------------------------------------------------- | 195 | //----------------------------------------------------- |
198 | 196 | ||
199 | 'hideDrawer': function() { | 197 | 'hideDrawer': function() { |
200 | if (this.status() == 'slideOut') { | 198 | if (this.status() == 'slideOut') { |
201 | var actor; | 199 | var actor; |
202 | 200 | ||
203 | this.setStatus('slidingIn'); | 201 | this.setStatus('slidingIn'); |
204 | 202 | ||
205 | actor = this.contentElementActor(); | 203 | actor = this.contentElementActor(); |
206 | actor.setHeight(this.region().element().getHeight()); | 204 | actor.setHeight(this.region().element().getHeight()); |
207 | 205 | ||
208 | actor.startCapture(true); | 206 | actor.startCapture(true); |
209 | actor.alignTo(this.element(), 'tr'); | 207 | actor.alignTo(this.element(), 'tr'); |
210 | actor.blindHide('left', .35); | 208 | actor.blindHide('left', .35); |
211 | actor.setVisible(false); | 209 | actor.setVisible(false); |
212 | actor.play(this.onSlideIn.createDelegate(this)); | 210 | actor.play(this.onSlideIn.createDelegate(this)); |
213 | } | 211 | } |
214 | }, | 212 | }, |