was.wm.js – Blame information for rev 7

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