was.wm.js – Diff between revs 1 and 4
?pathlinks?
Rev 1 | Rev 4 | |||
---|---|---|---|---|
Line 3... | Line 3... | |||
3 | // Search and load all nucleons. |
3 | // Search and load all nucleons. |
|
4 | $.get(path, function(nucleons) { |
4 | $.get(path, function(nucleons) { |
|
5 | var ix = 0, iy = 0; |
5 | var ix = 0, iy = 0; |
|
6 | var states = {}; |
6 | var states = {}; |
|
7 | var cookie = Cookies.get('window-manager-icons'); |
7 | var cookie = Cookies.get('window-manager-icons'); |
|
8 | if(cookie) |
8 | if(cookie) { |
|
9 | states = JSON.parse(cookie); |
9 | states = JSON.parse(cookie); |
|
- | 10 | } |
||
10 | $.each(nucleons, function(index, file) { |
11 | $.each(nucleons, function(index, file) { |
|
11 | // Skip files starting with full stop (POSIX). |
12 | // Skip files starting with full stop (POSIX). |
|
12 | if (/^\./.test(file)) return; |
13 | if (/^\./.test(file)) { |
|
- | 14 | return; |
||
- | 15 | } |
||
13 | $.get(path + '/' + file, function(data) { |
16 | $.get(path + '/' + file, function(data) { |
|
14 | data = $(data).get(0); |
17 | data = $(data).get(0); |
|
15 | var nucleon = data.getAttribute('data-target'); |
18 | var nucleon = data.getAttribute('data-target'); |
|
Line 16... | Line 19... | |||
16 | |
19 | |
|
Line 48... | Line 51... | |||
48 | } |
51 | } |
|
Line 49... | Line 52... | |||
49 | |
52 | |
|
50 | // Open a window manager window. |
53 | // Open a window manager window. |
|
51 | function openWindowManagerWindow(nucleon) { |
54 | function openWindowManagerWindow(nucleon) { |
|
52 | // If the nucleon already exists, then do not append the content again. |
55 | // If the nucleon already exists, then do not append the content again. |
|
53 | if($('#' + nucleon).length) |
56 | if($('#' + nucleon).length) { |
|
- | 57 | return; |
||
Line 54... | Line 58... | |||
54 | return; |
58 | } |
|
55 | |
59 | |
|
Line 56... | Line 60... | |||
56 | // Store the icon. |
60 | // Store the icon. |
|
Line 69... | Line 73... | |||
69 | |
73 | |
|
70 | // Select all new scripts that have to be inserted into the DOM. |
74 | // Select all new scripts that have to be inserted into the DOM. |
|
71 | var nucleonScripts = []; |
75 | var nucleonScripts = []; |
|
72 | $(data).find('script').each(function() { |
76 | $(data).find('script').each(function() { |
|
73 | var src = $(this).attr('src'); |
77 | var src = $(this).attr('src'); |
|
74 | if(src === undefined) |
78 | if(src === undefined) { |
|
- | 79 | return; |
||
75 | return; |
80 | } |
|
76 | nucleonScripts[src] = $(this); |
81 | nucleonScripts[src] = $(this); |
|
77 | }); |
82 | }); |
|
78 | // Remove scripts from the nucleon if they are already added to the DOM. |
83 | // Remove scripts from the nucleon if they are already added to the DOM. |
|
79 | $(document).find('script').each(function() { |
84 | $(document).find('script').each(function() { |
|
80 | var src = $(this).attr('src'); |
85 | var src = $(this).attr('src'); |
|
81 | if(nucleonScripts[src] === undefined) |
86 | if(nucleonScripts[src] === undefined) { |
|
- | 87 | return; |
||
82 | return; |
88 | } |
|
83 | nucleonScripts[src].remove(); |
89 | nucleonScripts[src].remove(); |
|
Line 84... | Line 90... | |||
84 | }); |
90 | }); |
|
85 | |
91 | |
|
Line 112... | Line 118... | |||
112 | |
118 | |
|
113 | // Retrieve the top-most window manager window z-index. |
119 | // Retrieve the top-most window manager window z-index. |
|
114 | function getTopWindowIndex() { |
120 | function getTopWindowIndex() { |
|
115 | return Math.max.apply(null, |
121 | return Math.max.apply(null, |
|
116 | $.map($('.window-manager-window'), function(e, n) { |
122 | $.map($('.window-manager-window'), function(e, n) { |
|
117 | if ($(e).css('position') != 'static') |
123 | if ($(e).css('position') !== 'static') { |
|
- | 124 | return parseInt($(e).css('z-index')) || 1; |
||
118 | return parseInt($(e).css('z-index')) || 1; |
125 | } |
|
119 | }) |
126 | }) |
|
120 | ); |
127 | ); |
|
Line 121... | Line 128... | |||
121 | } |
128 | } |
|
122 | |
129 | |
|
- | 130 | // Draggable and moveable windows. |
||
- | 131 | $(document).ready(() => { |
||
- | 132 | function dragMoveListener (event) { |
||
- | 133 | var target = event.target, states, cookie, |
||
- | 134 | // keep the dragged position in the data-x/data-y attributes |
||
- | 135 | x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, |
||
- | 136 | y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; |
||
- | 137 | |
||
- | 138 | // translate the element |
||
- | 139 | target.style.webkitTransform = |
||
- | 140 | target.style.transform = |
||
- | 141 | 'translate(' + x + 'px, ' + y + 'px)'; |
||
- | 142 | |
||
- | 143 | // update the position attributes |
||
- | 144 | target.setAttribute('data-x', x); |
||
- | 145 | target.setAttribute('data-y', y); |
||
- | 146 | |
||
- | 147 | if(target.classList.contains('window-manager-window')) { |
||
- | 148 | // Save the window position. |
||
- | 149 | states = {}; |
||
- | 150 | cookie = Cookies.get('window-manager-windows'); |
||
- | 151 | if(cookie) { |
||
- | 152 | states = JSON.parse(cookie); |
||
- | 153 | } |
||
- | 154 | |
||
- | 155 | states[$(event.target).data('target')] = { |
||
- | 156 | x: x, |
||
- | 157 | y: y |
||
- | 158 | }; |
||
- | 159 | |
||
- | 160 | Cookies.set('window-manager-windows', states, { path: '' }); |
||
- | 161 | } |
||
- | 162 | |
||
- | 163 | if(target.classList.contains('window-manager-icon')) { |
||
- | 164 | // Save the icon position. |
||
- | 165 | states = {}; |
||
- | 166 | cookie = Cookies.get('window-manager-icons'); |
||
- | 167 | if(cookie) { |
||
- | 168 | states = JSON.parse(cookie); |
||
- | 169 | } |
||
- | 170 | |
||
- | 171 | states[$(event.target).data('target')] = { |
||
- | 172 | x: x, |
||
- | 173 | y: y |
||
- | 174 | }; |
||
- | 175 | |
||
- | 176 | Cookies.set('window-manager-icons', states, { path: '' }); |
||
- | 177 | } |
||
123 | // Draggable and moveable windows. |
178 | } |
|
124 | $(document).ready(() => { |
179 | |
|
125 | // Window manager windows. |
180 | // Window manager windows. |
|
126 | interact('.window-manager-window') |
181 | interact('.window-manager-window') |
|
127 | .draggable({ |
182 | .draggable({ |
|
Line 191... | Line 246... | |||
191 | $(document).on('click', '.window-manager-window', function(event) { |
246 | $(document).on('click', '.window-manager-window', function(event) { |
|
192 | $(event.target) |
247 | $(event.target) |
|
193 | .closest('.window-manager-window') |
248 | .closest('.window-manager-window') |
|
194 | .css('z-index', getTopWindowIndex() + 1); |
249 | .css('z-index', getTopWindowIndex() + 1); |
|
195 | }); |
250 | }); |
|
196 | |
- | ||
197 | function dragMoveListener (event) { |
- | ||
198 | var target = event.target, |
- | ||
199 | // keep the dragged position in the data-x/data-y attributes |
- | ||
200 | x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, |
- | ||
201 | y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; |
- | ||
202 | |
- | ||
203 | // translate the element |
- | ||
204 | target.style.webkitTransform = |
- | ||
205 | target.style.transform = |
- | ||
206 | 'translate(' + x + 'px, ' + y + 'px)'; |
- | ||
207 | |
- | ||
208 | // update the position attributes |
- | ||
209 | target.setAttribute('data-x', x); |
- | ||
210 | target.setAttribute('data-y', y); |
- | ||
211 | |
- | ||
212 | if(target.classList.contains('window-manager-window')) { |
- | ||
213 | // Save the window position. |
- | ||
214 | var states = {}; |
- | ||
215 | var cookie = Cookies.get('window-manager-windows'); |
- | ||
216 | if(cookie) |
- | ||
217 | states = JSON.parse(cookie); |
- | ||
218 | |
- | ||
219 | states[$(event.target).data('target')] = { |
- | ||
220 | x: x, |
- | ||
221 | y: y |
- | ||
222 | }; |
- | ||
223 | |
- | ||
224 | Cookies.set('window-manager-windows', states, { path: '' }); |
- | ||
225 | } |
- | ||
226 | |
- | ||
227 | if(target.classList.contains('window-manager-icon')) { |
- | ||
228 | // Save the icon position. |
- | ||
229 | var states = {}; |
- | ||
230 | var cookie = Cookies.get('window-manager-icons'); |
- | ||
231 | if(cookie) |
- | ||
232 | states = JSON.parse(cookie); |
- | ||
233 | |
- | ||
234 | states[$(event.target).data('target')] = { |
- | ||
235 | x: x, |
- | ||
236 | y: y |
- | ||
237 | }; |
- | ||
238 | |
- | ||
239 | Cookies.set('window-manager-icons', states, { path: '' }); |
- | ||
240 | } |
- | ||
241 | } |
- | ||
Line 242... | Line 251... | |||
242 | |
251 | |
|
243 | // this is used later in the resizing and gesture demos |
252 | // this is used later in the resizing and gesture demos |
|
244 | window.dragMoveListener = dragMoveListener; |
253 | window.dragMoveListener = dragMoveListener; |