corrade-nucleus-nucleons – Diff between revs 42 and 43

Subversion Repositories:
Rev:
Only display areas with differencesRegard whitespace
Rev 42 Rev 43
1 // Load the window manager desktop icons. 1 // Load the window manager desktop icons.
2 function loadWindowManagerIcons(path) { 2 function loadWindowManagerIcons(path) {
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 $.each(nucleons, function(index, file) { 10 $.each(nucleons, function(index, file) {
11 // Skip files starting with full stop (POSIX). 11 // Skip files starting with full stop (POSIX).
12 if (/^\./.test(file)) return; 12 if (/^\./.test(file)) return;
13 $.get(path + '/' + file, function(data) { 13 $.get(path + '/' + file, function(data) {
14 data = $(data).get(0); 14 data = $(data).get(0);
15 var nucleon = data.getAttribute('data-target'); 15 var nucleon = data.getAttribute('data-target');
16 16
17 if(typeof states[nucleon] !== 'undefined') { 17 if(typeof states[nucleon] !== 'undefined') {
18 var sx = states[nucleon].x, 18 var sx = states[nucleon].x,
19 sy = states[nucleon].y; 19 sy = states[nucleon].y;
20 20
21 data.style.webkitTransform = 21 data.style.webkitTransform =
22 data.style.transform = 22 data.style.transform =
23 'translate(' + sx + 'px, ' + sy + 'px)'; 23 'translate(' + sx + 'px, ' + sy + 'px)';
24 24
25 // Update the position attributes 25 // Update the position attributes
26 data.setAttribute('data-x', sx); 26 data.setAttribute('data-x', sx);
27 data.setAttribute('data-y', sy); 27 data.setAttribute('data-y', sy);
28 28
29 $('#window-manager-desktop').append(data); 29 $('#window-manager-desktop').append(data);
30 return; 30 return;
31 } 31 }
32 32
33 // Translate the desktop icons so they do not overlap. 33 // Translate the desktop icons so they do not overlap.
34 data.style.webkitTransform = 34 data.style.webkitTransform =
35 data.style.transform = 35 data.style.transform =
36 'translate(' + ix + 'px, ' + iy + 'px)'; 36 'translate(' + ix + 'px, ' + iy + 'px)';
37   37  
38 // Update the position attributes 38 // Update the position attributes
39 data.setAttribute('data-x', ix); 39 data.setAttribute('data-x', ix);
40 data.setAttribute('data-y', iy); 40 data.setAttribute('data-y', iy);
41 41
42 $('#window-manager-desktop').append(data); 42 $('#window-manager-desktop').append(data);
43 // Translate by the desktop icon size. 43 // Translate by the desktop icon size.
44 ix += 64; 44 ix += 64;
45 }); 45 });
46 }); 46 });
47 }); 47 });
48 } 48 }
49   49  
50 // Open a window manager window. 50 // Open a window manager window.
51 function openWindowManagerWindow(nucleon) { 51 function openWindowManagerWindow(nucleon) {
52 // If the nucleon already exists, then do not append the content again. 52 // If the nucleon already exists, then do not append the content again.
53 if($('#' + nucleon).length) 53 if($('#' + nucleon).length)
54 return; 54 return;
55 55
56 // Store the icon. 56 // Store the icon.
57 var nucleon_icon = $('#' + nucleon + '-window-manager-button-icon').attr('src'); 57 var nucleon_icon = $('#' + nucleon + '-window-manager-button-icon').attr('src');
58 58
59 // Change the nucleon icon to a loading icon. 59 // Change the nucleon icon to a loading icon.
60 $('#' + nucleon + '-window-manager-button-icon').attr('src', '/img/loader.gif'); 60 $('#' + nucleon + '-window-manager-button-icon').attr('src', '/img/loader.gif');
61 61
62 // Disable button for successive clicks. 62 // Disable button for successive clicks.
63 $('#' + nucleon + '-window-manager-button').prop('disabled', true); 63 $('#' + nucleon + '-window-manager-button').prop('disabled', true);
64 64
65 // Load the nucleon. 65 // Load the nucleon.
66 $.get('/' + nucleon + '/index.html', function(data) { 66 $.get('/' + nucleon + '/index.html', function(data) {
67 // Get the DOM object. 67 // Get the DOM object.
68 data = $(data).get(0); 68 data = $(data).get(0);
69 69
70 // Select all new scripts that have to be inserted into the DOM. 70 // Select all new scripts that have to be inserted into the DOM.
71 var nucleonScripts = []; 71 var nucleonScripts = [];
72 $(data).find('script').each(function() { 72 $(data).find('script').each(function() {
73 var src = $(this).attr('src'); 73 var src = $(this).attr('src');
74 if(src === undefined) 74 if(src === undefined)
75 return; 75 return;
76 nucleonScripts[src] = $(this); 76 nucleonScripts[src] = $(this);
77 }); 77 });
78 // Remove scripts from the nucleon if they are already added to the DOM. 78 // Remove scripts from the nucleon if they are already added to the DOM.
79 $(document).find('script').each(function() { 79 $(document).find('script').each(function() {
80 var src = $(this).attr('src'); 80 var src = $(this).attr('src');
81 if(nucleonScripts[src] === undefined) 81 if(nucleonScripts[src] === undefined)
82 return; 82 return;
83 nucleonScripts[src].remove(); 83 nucleonScripts[src].remove();
84 }); 84 });
85 85
86 // Restore windows to their saved position. 86 // Restore windows to their saved position.
87 var cookie = Cookies.get('window-manager-windows'); 87 var cookie = Cookies.get('window-manager-windows');
88 if(cookie) { 88 if(cookie) {
89 var states = JSON.parse(cookie); 89 var states = JSON.parse(cookie);
90 if(typeof states[nucleon] !== 'undefined') { 90 if(typeof states[nucleon] !== 'undefined') {
91 var x = states[nucleon].x, 91 var x = states[nucleon].x,
92 y = states[nucleon].y, 92 y = states[nucleon].y,
93 wm = $(data).find('.window-manager-window').get(0); 93 wm = $(data).find('.window-manager-window').get(0);
94 -  
95 if(typeof wm !== 'undefined') { 94
96 wm.style.webkitTransform = 95 wm.style.webkitTransform =
97 wm.style.transform = 96 wm.style.transform =
98 'translate(' + x + 'px, ' + y + 'px)'; 97 'translate(' + x + 'px, ' + y + 'px)';
99 98
100 // Update the position attributes 99 // Update the position attributes
101 wm.setAttribute('data-x', x); 100 wm.setAttribute('data-x', x);
102 wm.setAttribute('data-y', y); 101 wm.setAttribute('data-y', y);
103 } 102 }
104 } 103 }
105 } -  
106 $(data).hide().appendTo('#window-manager-desktop').fadeIn(750); 104 $(data).hide().appendTo('#window-manager-desktop').fadeIn(750);
107 }).done(function(data) { 105 }).done(function(data) {
108 // Change the nucleon icon back. 106 // Change the nucleon icon back.
109 $('#' + nucleon + '-window-manager-button-icon').attr('src', nucleon_icon); 107 $('#' + nucleon + '-window-manager-button-icon').attr('src', nucleon_icon);
110 // Enable the button. 108 // Enable the button.
111 $('#' + nucleon + '-window-manager-button').prop('disabled', false); 109 $('#' + nucleon + '-window-manager-button').prop('disabled', false);
112 }); 110 });
113 } 111 }
114   112  
115 // Retrieve the top-most window manager window z-index. 113 // Retrieve the top-most window manager window z-index.
116 function getTopWindowIndex() { 114 function getTopWindowIndex() {
117 return Math.max.apply(null, 115 return Math.max.apply(null,
118 $.map($('.window-manager-window'), function(e, n) { 116 $.map($('.window-manager-window'), function(e, n) {
119 if ($(e).css('position') != 'static') 117 if ($(e).css('position') != 'static')
120 return parseInt($(e).css('z-index')) || 1; 118 return parseInt($(e).css('z-index')) || 1;
121 }) 119 })
122 ); 120 );
123 } 121 }
124   122  
125 // Draggable and moveable windows. 123 // Draggable and moveable windows.
126 $(document).ready(() => { 124 $(document).ready(() => {
127 // Window manager windows. 125 // Window manager windows.
128 interact('.window-manager-window') 126 interact('.window-manager-window')
129 .draggable({ 127 .draggable({
130 // enable inertial throwing 128 // enable inertial throwing
131 inertia: true, 129 inertia: true,
132 // keep the element within the area of it's parent 130 // keep the element within the area of it's parent
133 restrict: { 131 restrict: {
134 restriction: $('#window-manager-desktop').get(0), 132 restriction: $('#window-manager-desktop').get(0),
135 endOnly: true, 133 endOnly: true,
136 elementRect: { top: 0, left: 0, bottom: 1, right: 1 } 134 elementRect: { top: 0, left: 0, bottom: 1, right: 1 }
137 }, 135 },
138 136
139 // enable autoScroll 137 // enable autoScroll
140 autoScroll: true, 138 autoScroll: true,
141 139
142 onmove: dragMoveListener, 140 onmove: dragMoveListener,
143 onend: function (event) { 141 onend: function (event) {
144 event.target.style.opacity = 1; 142 event.target.style.opacity = 1;
145 -  
146 // Save the window position. -  
147 var states = {}; -  
148 var cookie = Cookies.get('window-manager-windows'); -  
149 if(cookie) -  
150 states = JSON.parse(cookie); -  
151 -  
152 $('.window-manager-window').each(function(i, wm) { -  
153 states[$(wm).data('target')] = { -  
154 x: $(wm).data('x'), -  
155 y: $(wm).data('y') -  
156 }; -  
157 }); -  
158   -  
159 Cookies.set('window-manager-windows', states, { path: '' }); -  
160 }, 143 },
161 onstart: function(event) { 144 onstart: function(event) {
162 // Move windows to top on drag. 145 // Move windows to top on drag.
163 event.target.style.zIndex = getTopWindowIndex() + 1; 146 event.target.style.zIndex = getTopWindowIndex() + 1;
164 event.target.style.opacity = 0.5; 147 event.target.style.opacity = 0.5;
165 } 148 }
166 }) 149 })
167 .allowFrom('.panel-heading'); 150 .allowFrom('.panel-heading');
168 151
169 // Window manager icons. 152 // Window manager icons.
170 interact('.window-manager-icon') 153 interact('.window-manager-icon')
171 .draggable({ 154 .draggable({
172 // enable inertial throwing 155 // enable inertial throwing
173 inertia: false, 156 inertia: false,
174 // keep the element within the area of it's parent 157 // keep the element within the area of it's parent
175 restrict: { 158 restrict: {
176 restriction: $('#window-manager-desktop').get(0), 159 restriction: $('#window-manager-desktop').get(0),
177 endOnly: true, 160 endOnly: true,
178 elementRect: { top: 0, left: 0, bottom: 1, right: 1 } 161 elementRect: { top: 0, left: 0, bottom: 1, right: 1 }
179 }, 162 },
180 snap: { 163 snap: {
181 targets: [ 164 targets: [
182 interact.createSnapGrid({ x: 64, y: 64 }) 165 interact.createSnapGrid({ x: 64, y: 64 })
183 ], 166 ],
184 range: Infinity, 167 range: Infinity,
185 relativePoints: [ { x: 0, y: 0 } ] 168 relativePoints: [ { x: 0, y: 0 } ]
186 }, 169 },
187 // enable autoScroll 170 // enable autoScroll
188 autoScroll: true, 171 autoScroll: true,
189 172
190 onmove: dragMoveListener, 173 onmove: dragMoveListener,
191 onend: function (event) { 174 onend: function (event) {
192 event.target.style.opacity = 1; 175 event.target.style.opacity = 1;
193 -  
194 // Save the icon position. -  
195 var states = {}; -  
196 var cookie = Cookies.get('window-manager-icons'); -  
197 if(cookie) -  
198 states = JSON.parse(cookie); -  
199 -  
200 $('.window-manager-icon').each(function(i, wm) { -  
201 states[$(wm).data('target')] = { -  
202 x: $(wm).data('x'), -  
203 y: $(wm).data('y') -  
204 }; -  
205 }); -  
206 -  
207 Cookies.set('window-manager-icons', states, { path: '' }); -  
208 }, 176 },
209 onstart: function(event) { 177 onstart: function(event) {
210 event.target.style.opacity = 0.5; 178 event.target.style.opacity = 0.5;
211 } 179 }
212 }); 180 });
213   181  
214 // Closing windows. 182 // Closing windows.
215 $(document).on('click', '.window-manager-close-button', function(event) { 183 $(document).on('click', '.window-manager-close-button', function(event) {
216 var wm = $('#' + $(this).data('target')); 184 var wm = $('#' + $(this).data('target'));
217 wm.fadeOut(750, function() { 185 wm.fadeOut(750, function() {
218 wm.remove(); 186 wm.remove();
219 }); 187 });
220 }); 188 });
221 189
222 // Windows clicking brings to front. 190 // Windows clicking brings to front.
223 $(document).on('click', '.window-manager-window', function(event) { 191 $(document).on('click', '.window-manager-window', function(event) {
224 $(event.target) 192 $(event.target)
225 .closest('.window-manager-window') 193 .closest('.window-manager-window')
226 .css('z-index', getTopWindowIndex() + 1); 194 .css('z-index', getTopWindowIndex() + 1);
227 }); 195 });
228 196
229 function dragMoveListener (event) { 197 function dragMoveListener (event) {
230 var target = event.target, 198 var target = event.target,
231 // keep the dragged position in the data-x/data-y attributes 199 // keep the dragged position in the data-x/data-y attributes
232 x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx, 200 x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx,
233 y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy; 201 y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy;
234   202  
235 // translate the element 203 // translate the element
236 target.style.webkitTransform = 204 target.style.webkitTransform =
237 target.style.transform = 205 target.style.transform =
238 'translate(' + x + 'px, ' + y + 'px)'; 206 'translate(' + x + 'px, ' + y + 'px)';
239   207  
240 // update the position attributes 208 // update the position attributes
241 target.setAttribute('data-x', x); 209 target.setAttribute('data-x', x);
242 target.setAttribute('data-y', y); 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 }
243 } 241 }
244   242  
245 // this is used later in the resizing and gesture demos 243 // this is used later in the resizing and gesture demos
246 window.dragMoveListener = dragMoveListener; 244 window.dragMoveListener = dragMoveListener;
247 }); 245 });
248   246  
249
Generated by GNU Enscript 1.6.5.90.
247
Generated by GNU Enscript 1.6.5.90.
250   248  
251   249  
252   250