Skip to content

Commit e14e1ac

Browse files
jelvehjelveh
authored
Revert "feat(gui): Add animation effects to the taskbar (#1365)" (#1366)
This reverts commit 212bc88.
1 parent 212bc88 commit e14e1ac

File tree

4 files changed

+152
-222
lines changed

4 files changed

+152
-222
lines changed

‎src/gui/src/UI/UITaskBarCreateCurve.js‎

Lines changed: 0 additions & 24 deletions
This file was deleted.

‎src/gui/src/UI/UITaskbar.js‎

Lines changed: 57 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -7,22 +7,21 @@
77
* it under the terms of the GNU Affero General Public License as published
88
* by the Free Software Foundation, either version 3 of the License, or
99
* (at your option) any later version.
10-
*
10+
*
1111
* This program is distributed in the hope that it will be useful,
1212
* but WITHOUT ANY WARRANTY; without even the implied warranty of
1313
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
1414
* GNU Affero General Public License for more details.
15-
*
15+
*
1616
* You should have received a copy of the GNU Affero General Public License
1717
* along with this program. If not, see <https://www.gnu.org/licenses/>.
1818
*/
1919

2020
import UITaskbarItem from './UITaskbarItem.js'
2121
import UIPopover from './UIPopover.js'
2222
import launch_app from "../helpers/launch_app.js"
23-
import {UITaskBarCreateCurve, UITaskBarLayout} from './UITaskBarCreateCurve.js'
2423

25-
async function UITaskbar(options) {
24+
async function UITaskbar(options){
2625
window.global_element_id++;
2726

2827
options = options ?? {};
@@ -35,18 +34,16 @@ async function UITaskbar(options) {
3534
async: true,
3635
contentType: "application/json",
3736
headers: {
38-
"Authorization": "Bearer " + window.auth_token
37+
"Authorization": "Bearer "+window.auth_token
3938
},
40-
success: function (apps) {
39+
success: function (apps){
4140
window.launch_apps = apps;
4241
}
4342
});
4443

4544
let h = '';
4645
h += `<div id="ui-taskbar_${window.global_element_id}" class="taskbar" style="height:${window.taskbar_height}px;">`;
47-
h += `<div class="taskbar-menu">`;
48-
h += `<div class="taskbar-sortable" style="display: flex; justify-content: center;align-items: flex-end; z-index: 99999;"></div>`;
49-
h += `</div>`;
46+
h += `<div class="taskbar-sortable" style="display: flex; justify-content: center; z-index: 99999;"></div>`;
5047
h += `</div>`;
5148

5249

@@ -62,9 +59,9 @@ async function UITaskbar(options) {
6259
sortable: false,
6360
keep_in_taskbar: true,
6461
disable_context_menu: true,
65-
onClick: async function (item) {
62+
onClick: async function(item){
6663
// skip if popover already open
67-
if ($(item).hasClass('has-open-popover'))
64+
if($(item).hasClass('has-open-popover'))
6865
return;
6966

7067
// show popover
@@ -80,30 +77,30 @@ async function UITaskbar(options) {
8077

8178
// In the rare case that launch_apps is not populated yet, get it from the server
8279
// then populate the popover
83-
if (!window.launch_apps || !window.launch_apps.recent || window.launch_apps.recent.length === 0) {
80+
if(!window.launch_apps || !window.launch_apps.recent || window.launch_apps.recent.length === 0){
8481
// get launch apps
8582
window.launch_apps = await $.ajax({
8683
url: window.api_origin + "/get-launch-apps?icon_size=64",
8784
type: 'GET',
8885
async: true,
8986
contentType: "application/json",
9087
headers: {
91-
"Authorization": "Bearer " + window.auth_token
88+
"Authorization": "Bearer "+window.auth_token
9289
},
9390
});
9491
}
95-
92+
9693
let apps_str = '';
9794

9895
apps_str += `<div class="launch-search-wrapper">`
99-
apps_str += `<input style="background-image:url('${window.icons['magnifier-outline.svg']}');" class="launch-search">`;
100-
apps_str += `<img class="launch-search-clear" src="${window.icons['close.svg']}">`;
96+
apps_str += `<input style="background-image:url('${window.icons['magnifier-outline.svg']}');" class="launch-search">`;
97+
apps_str += `<img class="launch-search-clear" src="${window.icons['close.svg']}">`;
10198
apps_str += `</div>`;
10299

103100
// -------------------------------------------
104101
// Recent apps
105102
// -------------------------------------------
106-
if (window.launch_apps.recent.length > 0) {
103+
if(window.launch_apps.recent.length > 0){
107104
// heading
108105
apps_str += `<h1 class="start-section-heading start-section-heading-recent">${i18n('recent')}</h1>`;
109106

@@ -112,29 +109,29 @@ async function UITaskbar(options) {
112109
for (let index = 0; index < window.launch_recent_apps_count && index < window.launch_apps.recent.length; index++) {
113110
const app_info = window.launch_apps.recent[index];
114111
apps_str += `<div title="${html_encode(app_info.title)}" data-name="${html_encode(app_info.name)}" class="start-app-card">`;
115-
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
116-
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
117-
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
118-
apps_str += `</div>`;
112+
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
113+
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
114+
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
115+
apps_str += `</div>`;
119116
apps_str += `</div>`;
120117
}
121118
apps_str += `</div>`;
122119
}
123120
// -------------------------------------------
124121
// Reccomended apps
125122
// -------------------------------------------
126-
if (window.launch_apps.recommended.length > 0) {
123+
if(window.launch_apps.recommended.length > 0){
127124
// heading
128125
apps_str += `<h1 class="start-section-heading start-section-heading-recommended" style="${window.launch_apps.recent.length > 0 ? 'padding-top: 30px;' : ''}">${i18n('recommended')}</h1>`;
129126
// apps
130127
apps_str += `<div class="launch-apps-recommended">`;
131128
for (let index = 0; index < window.launch_apps.recommended.length; index++) {
132129
const app_info = window.launch_apps.recommended[index];
133130
apps_str += `<div title="${html_encode(app_info.title)}" data-name="${html_encode(app_info.name)}" class="start-app-card">`;
134-
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
135-
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
136-
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
137-
apps_str += `</div>`;
131+
apps_str += `<div class="start-app" data-app-name="${html_encode(app_info.name)}" data-app-uuid="${html_encode(app_info.uuid)}" data-app-icon="${html_encode(app_info.icon)}" data-app-title="${html_encode(app_info.title)}">`;
132+
apps_str += `<img class="start-app-icon" src="${html_encode(app_info.icon ? app_info.icon : window.icons['app.svg'])}">`;
133+
apps_str += `<span class="start-app-title">${html_encode(app_info.title)}</span>`;
134+
apps_str += `</div>`;
138135
apps_str += `</div>`;
139136
}
140137
apps_str += `</div>`;
@@ -144,7 +141,7 @@ async function UITaskbar(options) {
144141
$(popover).find('.launch-popover').append(apps_str);
145142

146143
// focus on search input only if not on mobile
147-
if (!isMobile.phone)
144+
if(!isMobile.phone)
148145
$(popover).find('.launch-search').focus();
149146

150147
// make apps draggable
@@ -157,12 +154,12 @@ async function UITaskbar(options) {
157154
distance: 5,
158155
revertDuration: 100,
159156
helper: 'clone',
160-
cursorAt: {left: 18, top: 20},
161-
start: function (event, ui) {
157+
cursorAt: { left: 18, top: 20 },
158+
start: function(event, ui){
162159
},
163-
drag: function (event, ui) {
160+
drag: function(event, ui){
164161
},
165-
stop: function () {
162+
stop: function(){
166163
}
167164
});
168165
}
@@ -178,11 +175,11 @@ async function UITaskbar(options) {
178175
sortable: false,
179176
keep_in_taskbar: true,
180177
lock_keep_in_taskbar: true,
181-
onClick: function () {
178+
onClick: function(){
182179
let open_window_count = parseInt($(`.taskbar-item[data-app="explorer"]`).attr('data-open-windows'));
183-
if (open_window_count === 0) {
184-
launch_app({name: 'explorer', path: window.home_path});
185-
} else {
180+
if(open_window_count === 0){
181+
launch_app({ name: 'explorer', path: window.home_path});
182+
}else{
186183
return false;
187184
}
188185
}
@@ -191,7 +188,7 @@ async function UITaskbar(options) {
191188
//---------------------------------------------
192189
// Add other useful apps to the taskbar
193190
//---------------------------------------------
194-
if (window.user.taskbar_items && window.user.taskbar_items.length > 0) {
191+
if(window.user.taskbar_items && window.user.taskbar_items.length > 0){
195192
for (let index = 0; index < window.user.taskbar_items.length; index++) {
196193
const app_info = window.user.taskbar_items[index];
197194
// add taskbar item for each app
@@ -200,13 +197,13 @@ async function UITaskbar(options) {
200197
app: app_info.name,
201198
name: app_info.title,
202199
keep_in_taskbar: true,
203-
onClick: function () {
200+
onClick: function(){
204201
let open_window_count = parseInt($(`.taskbar-item[data-app="${app_info.name}"]`).attr('data-open-windows'));
205-
if (open_window_count === 0) {
202+
if(open_window_count === 0){
206203
launch_app({
207204
name: app_info.name,
208-
})
209-
} else {
205+
})
206+
}else{
210207
return false;
211208
}
212209
}
@@ -218,7 +215,7 @@ async function UITaskbar(options) {
218215
// add `Trash` to the taskbar
219216
//---------------------------------------------
220217
const trash = await puter.fs.stat(window.trash_path);
221-
if (window.socket) {
218+
if(window.socket){
222219
window.socket.emit('trash.is_empty', {is_empty: trash.is_empty});
223220
}
224221

@@ -229,28 +226,23 @@ async function UITaskbar(options) {
229226
sortable: false,
230227
keep_in_taskbar: true,
231228
lock_keep_in_taskbar: true,
232-
onClick: function () {
229+
onClick: function(){
233230
let open_windows = $(`.window[data-path="${html_encode(window.trash_path)}"]`);
234-
if (open_windows.length === 0) {
235-
launch_app({name: 'explorer', path: window.trash_path});
236-
} else {
231+
if(open_windows.length === 0){
232+
launch_app({ name: 'explorer', path: window.trash_path});
233+
}else{
237234
open_windows.focusWindow();
238235
}
239236
},
240-
onItemsDrop: function (items) {
237+
onItemsDrop: function(items){
241238
window.move_items(items, window.trash_path);
242239
}
243240
})
244241

245242
window.make_taskbar_sortable();
246-
247-
//---------------------------------------------
248-
// Taskbar is Animation
249-
//---------------------------------------------
250-
window.taskbar_is_animation()
251243
}
252244

253-
window.make_taskbar_sortable = function () {
245+
window.make_taskbar_sortable = function(){
254246
//-------------------------------------------
255247
// Taskbar is sortable
256248
//-------------------------------------------
@@ -259,41 +251,41 @@ window.make_taskbar_sortable = function () {
259251
items: '.taskbar-item-sortable:not(.has-open-contextmenu)',
260252
cancel: '.has-open-contextmenu',
261253
placeholder: "taskbar-item-sortable-placeholder",
262-
helper: 'clone',
254+
helper : 'clone',
263255
distance: 5,
264256
revert: 10,
265-
receive: function (event, ui) {
266-
if (!$(ui.item).hasClass('taskbar-item')) {
257+
receive: function(event, ui){
258+
if(!$(ui.item).hasClass('taskbar-item')){
267259
// if app is already in taskbar, cancel
268-
if ($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0) {
260+
if($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0){
269261
$(this).sortable('cancel');
270262
$('.taskbar .start-app').remove();
271263
return;
272264
}
273265
}
274266
},
275-
update: function (event, ui) {
276-
if (!$(ui.item).hasClass('taskbar-item')) {
267+
update: function(event, ui){
268+
if(!$(ui.item).hasClass('taskbar-item')){
277269
// if app is already in taskbar, cancel
278-
if ($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0) {
270+
if($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).length !== 0){
279271
$(this).sortable('cancel');
280272
$('.taskbar .start-app').remove();
281273
return;
282274
}
283-
275+
284276
let item = UITaskbarItem({
285277
icon: $(ui.item).attr('data-app-icon'),
286278
app: $(ui.item).attr('data-app-name'),
287279
name: $(ui.item).attr('data-app-title'),
288280
append_to_taskbar: false,
289281
keep_in_taskbar: true,
290-
onClick: function () {
282+
onClick: function(){
291283
let open_window_count = parseInt($(`.taskbar-item[data-app="${$(ui.item).attr('data-app-name')}"]`).attr('data-open-windows'));
292-
if (open_window_count === 0) {
284+
if(open_window_count === 0){
293285
launch_app({
294286
name: $(ui.item).attr('data-app-name'),
295-
})
296-
} else {
287+
})
288+
}else{
297289
return false;
298290
}
299291
}
@@ -305,26 +297,11 @@ window.make_taskbar_sortable = function () {
305297
window.update_taskbar();
306298
}
307299
// only proceed to update DB if the item sorted was a pinned item otherwise no point in updating the taskbar in DB
308-
else if ($(ui.item).attr('data-keep-in-taskbar') === 'true') {
300+
else if($(ui.item).attr('data-keep-in-taskbar') === 'true'){
309301
window.update_taskbar();
310302
}
311303
},
312304
});
313305
}
314306

315-
window.taskbar_is_animation = function () {
316-
const range = 300;
317-
const maxScale = 1.8;
318-
const items = $('.taskbar-item');
319-
const taskbar = $('.taskbar')
320-
taskbar.on('mousemove', function (e) {
321-
const curve = UITaskBarCreateCurve(range, e.clientX, 1, maxScale);
322-
console.log(curve, 'UITaskBarCreateCurve');
323-
UITaskBarLayout(items, curve)
324-
})
325-
taskbar.on("mouseleave", function () {
326-
UITaskBarLayout(items, () => 1);
327-
})
328-
}
329-
330307
export default UITaskbar;

0 commit comments

Comments
 (0)