OSDN Git Service

Update readme.md and Bug Fix [0.2.0]
[kit/kit.git] / system.js
1 "use strict";
2
3 //   _    _ _   
4 //  | | _(_) |_ 
5 //  | |/ / | __|
6 //  |   <| | |_ 
7 //  |_|\_\_|\__|
8 //
9 // THIS IS THE KIT KERNEL AND KIT WINDOW SYSTEM
10 // http://web.kitit.ml/
11 // https://github.com/mtsgi/kit
12
13
14 $( document ).ready( kit );
15
16 function kit() {
17     S = System;
18
19     if( !localStorage.getItem( "kit-pid" ) ) processID = 0;
20     else processID = localStorage.getItem( "kit-pid" );
21
22     if( !localStorage.getItem( "kit-username" ) ) localStorage.setItem( "kit-username", "ユーザー" );
23     $( "#kit-header-username" ).text( localStorage.getItem( "kit-username" ) );
24
25     if( localStorage.getItem( "kit-lock" ) == null ) localStorage.setItem( "kit-lock", "false" );
26
27     if( System.bootopt.get("safe") ) $( "#kit-wallpaper" ).css( "background","#404040" );
28     else if( localStorage.getItem( "kit-wallpaper" ) ) $( "#kit-wallpaper" ).css( "background", localStorage.getItem( "kit-wallpaper" ) ).css( "background-size", "cover" );
29
30     if( !localStorage.getItem( "kit-default-browser" ) ) localStorage.setItem( "kit-default-browser", "browser" );
31
32     if( localStorage.getItem("kit-fusen") ){
33         this.list = JSON.parse(localStorage.getItem("kit-fusen"));
34         for( let i in this.list ){
35             KWS.fusen.add(this.list[i]);
36         }
37     }
38     
39     if( localStorage.getItem("kit-darkmode") == "true" ){
40         KWS.darkmode = true;
41         $("#kit-darkmode").attr("href", "system/theme/kit-darkmode.css");
42         $(".winc-darkmode").addClass("kit-darkmode");
43     }
44
45     if( System.bootopt.get("safe") ){
46         $("#kit-theme-file").attr("href", "./system/theme/theme-light.css" );
47     }
48     else{
49         if( !localStorage.getItem( "kit-theme" ) ) localStorage.setItem( "kit-theme", "theme-default.css" );
50         $("#kit-theme-file").attr("href", "./system/theme/" + localStorage.getItem("kit-theme") );
51     }
52
53     if( !localStorage.getItem( "kit-appdir" ) ) localStorage.setItem( "kit-appdir", "./app/" );
54     S.appdir = localStorage.getItem( "kit-appdir" );
55
56     if( localStorage.getItem( "kit-installed" ) ) System.installed = JSON.parse( localStorage.getItem( "kit-installed" ) );
57
58     if( localStorage["kit-userarea"] ) System.userarea = JSON.parse(localStorage["kit-userarea"]);
59     if( localStorage["kit-recycle"] ) System.recycle = JSON.parse(localStorage["kit-recycle"]);
60
61     System.moveDesktop( "1" );
62
63     var clockmove;
64     if( System.bootopt.get("safe") ) clockmove = setInterval( System.clock, 1000 );
65     else  clockmove = setInterval( System.clock, 10 );
66
67     Notification.push( "kitへようこそ", localStorage["kit-username"] + "さん、こんにちは。", "system" );
68     //スタートアップ
69     if( localStorage.getItem( "kit-startup" ) == undefined ) {
70         localStorage.setItem( "kit-startup", new Array( "welcome" ) );
71     }
72     System.startup = localStorage.getItem( "kit-startup" ).split( "," );
73     if( System.bootopt.get("safe") ){
74         Notification.push( "セーフブート", "現在、kitをセーフモードで起動しています。", "system" );
75         System.alert( "セーフブート", "現在、kitをセーフモードで起動しています。<br><a class='kit-hyperlink' onclick='location.href=\"index.html\";'>通常モードで再起動</a>", "system" );
76     }
77     else for( let i of System.startup ) if( i != "" ) launch( i );
78     
79     $("#kit-header-fullscreen").hide();
80
81     //イベントハンドラ
82     $( "#desktops" ).click( function() {
83         $( "#desktop-" + currentDesktop ).toggleClass( "selected-section" );
84     } ).mousedown( function() {
85         $( ".window" ).css( "opacity", "0.6" );
86     } ).mouseup( function() {
87         $( ".window" ).css( "opacity", "1.0" );
88     } );
89     //タスク一覧
90     $( "#footer-tasks" ).click( function() {
91         if( $( "#kit-tasks" ).is( ":visible" ) ) {
92             $( "#kit-tasks" ).html( "" ).fadeOut( 300 );
93         }
94         else {
95             $( "#task-ctx" ).fadeOut( 200 );
96             $( "#kit-tasks" ).html( $( "#tasks" ).html() ).fadeIn( 300 ).css( "z-index", "9997" );
97         }
98     } );
99     //デスクトップアイコン
100     $.getJSON("config/desktop.json", (data) => {
101         for( let i in data ){
102             $(".desktop-icons").append("<div class='desktop-icon' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
103         }
104         $(".desktop-icon").on("click", function(){
105             launch( $(this).attr("data-launch") );
106         });
107     }).fail( function() {
108         Notification.push( "読み込みに失敗", "デスクトップ(config/desktop.json)の読み込みに失敗しました。", system );
109     } );
110     //ランチャー
111     $.getJSON("config/apps.json", System.initLauncher).fail( function() {
112         Notification.push( "ランチャー初期化失敗", "アプリケーション一覧(config/apps.json)の読み込みに失敗しました。", system );
113     } );
114     $( "#kit-tasks" ).delegate( ".task", "click", function() {
115         System.close( this.id.slice( 1 ) );
116         $( this ).hide();
117     } );
118     //通知バー
119     $( "#footer-noti" ).click( function() {
120         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
121         if( $( "#notifications" ).is( ":visible" ) ) {
122             $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
123         }
124         else {
125             $( "#notifications" ).show( "drop", {direction: "right"}, 300 );
126         }
127     } );
128     $( "#last-notification-close" ).click( function() {
129         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
130     } );
131     $("#notifications-dnp").prop("checked", false).on("change", ()=>{
132         if( $("#notifications-dnp").is(":checked") ){
133             Notification.goodnight = true;
134         }
135         else Notification.goodnight = false;
136     });
137     //電源管理
138     $( ".power-button" ).click( function() {
139         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
140         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
141         $( "section, header, footer, #kit-wallpaper, .dropdown" ).css( "filter", "blur(5px)" );
142         $( "#kit-power" ).fadeIn( 300 );
143     } );
144     $( "#kit-power-back" ).click( function() {
145         $( "section, header, footer, #kit-wallpaper, .dropdown" ).css( "filter", "none" );
146         $( "#kit-power" ).fadeOut( 300 );
147     } );
148     $( "#kit-power-shutdown" ).click( function() {
149         System.shutdown();
150     } );
151     $( "#kit-power-reboot" ).click( function() {
152         System.reboot();
153     } );
154     $( "#kit-power-suspend" ).click( function() {
155         $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
156         $( "#kit-power" ).fadeOut( 300 );
157         System.alert("サスペンド機能", "サスペンド機能はこのバージョンのkitではサポートされていません。");
158     } );
159     $( "#kit-power-lock" ).click( function() {
160         System.lock();
161     } );
162     $( "#lock-password" ).keypress( function( e ) {
163         if( e.which == 13 ) $( "#lock-unl" ).click();
164     } );
165     $( "#lock-unl" ).click( function() {
166         if( !localStorage.getItem( "kit-password" ) || $( "#lock-password" ).val() == localStorage.getItem( "kit-password" ) ) {
167             $( "header, footer" ).show();
168             $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
169             $( "#lock-password" ).val( "" );
170             System.moveDesktop(1);
171         }
172         else $( "#lock-password" ).effect( "bounce", {distance: 12, times: 4}, 500 );
173     } ).hover( function() {
174         $( "#lock-unl span" ).removeClass( "fa-lock" ).addClass( "fa-lock-open" );
175     }, function() {
176         $( "#lock-unl span" ).removeClass( "fa-lock-open" ).addClass( "fa-lock" );
177     } );
178     //ランチャー起動
179     $( "#launch" ).click( function() {
180         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
181         if( $( "#launcher" ).is( ":visible" ) ) {
182             $( "#kit-wallpaper" ).css( "filter", "none" );
183             $( "#desktop-" + currentDesktop ).show();
184             $( "#launcher" ).hide();
185         }
186         else {
187             $( "#kit-wallpaper" ).css( "filter", "blur(5px)" )
188             $( "section" ).hide();
189             $( "#launcher" ).show();
190         }
191     } );
192
193     //検索バー
194     $( "#milp" ).val( "" ).on( "focus", function() {
195         $( "#kit-milp" ).show();
196     } ).on( "blur", function() {
197         $( "#kit-milp" ).fadeOut( 200 );
198     } ).on( 'keydown keyup keypress change', function() {
199         $( "#kit-milp-text" ).text( $( this ).val() );
200     } ).keypress( function( e ) {
201         if( e.which == 13 ) $( "#kit-milp-launch" ).click();
202     } );
203     $( "#kit-milp-launch" ).click( function() {
204         if( $("#milp").val() == "kit" ){
205             System.alert("", "<div style='text-align:left;'> _    _ _ <br>| | _(_) |_ <br>| |/ / | __|<br>|   〈| | |_ <br>|_|\_ \ _\__|</div><hr>", S.version);
206             return;
207         }
208         let _app = $( "#milp" ).val().split(",")[0];
209         let _args = null;
210         try {
211             if( $( "#milp" ).val().split(",")[1] ){
212                 _args = JSON.parse( $( "#milp" ).val().split(",").slice(1).join() );
213             }
214         }
215         catch(error) {
216             Notification.push("引数の解釈に失敗", error, "system");
217         }
218         launch( _app, _args );
219     } );
220     $( "#kit-milp-search" ).click( function() {
221         launch( "browser", { "url" : "https://www.bing.com/search?q=" + $( "#milp" ).val() } );
222     } );
223     $( "#kit-milp-wikipedia" ).click( function() {
224         launch( "browser", { "url" : "https://ja.wikipedia.org/wiki/" + $( "#milp" ).val() } );
225     } );
226
227     //サウンドドロップダウン
228     $("#dropdown-sound-slider").slider({
229         min: 0, max: 100, step: 1, value: 100,
230         change: (e, ui) => {
231             System.audio.level = ui.value;
232             $("#dropdown-sound-level").text(ui.value);
233             localStorage.setItem("kit-audio-level", ui.value);
234             for( let i in System.audio.list ){
235                 System.audio.list[i].volume = System.audio.level / 100;
236             }
237             if( ui.value == 0 ) $("#kit-header-sound-icon").removeClass("fa-volume-up").addClass("fa-volume-mute");
238             else $("#kit-header-sound-icon").removeClass("fa-volume-mute").addClass("fa-volume-up");
239         }
240     });
241     if( localStorage["kit-audio-level"] ) System.audio.volume( localStorage["kit-audio-level"] );
242
243     $("#dropdown-sound-silent").prop("checked", false).on("change", ()=>{
244         if( $("#dropdown-sound-silent").is(":checked") ){
245             System.audio.silent = true;
246             $("#kit-header-sound-icon").removeClass("fa-volume-up").addClass("fa-volume-mute");
247         }
248         else{
249             System.audio.silent = false;
250             $("#kit-header-sound-icon").removeClass("fa-volume-mute").addClass("fa-volume-up");
251         }
252     });
253
254     $("#kit-header-user").on("click", ()=>{
255         launch("user");
256     });
257
258     //コンテキストメニュー
259     $(":root section:not(#desktop-l)").on("contextmenu", function() {
260         let _ptelem = $( document.elementFromPoint(S.mouseX, S.mouseY) );
261         S.selectedElement = _ptelem;
262         S.selectedText = window.getSelection();
263         $( "#kit-context-input" ).val( S.selectedText );
264         if( $( "#kit-context-input" ).val() == "" ) $("#kit-contextgroup-text").hide();
265         else $("#kit-contextgroup-text").show();
266         if( _ptelem[0].id == "desktop-" + currentDesktop ){
267             $("#kit-contextgroup-desktop").show();
268             $("#kit-contextgroup-elem").hide();
269         }
270         else{
271             $("#kit-contextgroup-desktop").hide();
272             $("#kit-contextgroup-elem").show();
273         }
274         $( "#kit-context-elem" ).text( _ptelem.prop("tagName").toLowerCase() + "要素" );
275         $("#kit-contextgroup-custom").hide();
276
277         let  _ctxid = _ptelem.attr("data-kit-contextid");
278         if( _ctxid ){
279             $("#kit-contextgroup-custom").show().html('<div id="kit-context-custom"></div>');
280             let  _ctxname = KWS.context[_ctxid].name || _ctxid; 
281             $("#kit-context-custom").text( _ctxname );
282             for( let i in KWS.context[_ctxid]){
283                 if( i == "name" ) continue;
284                 $("#kit-contextgroup-custom").append("<a id='kit-context-" + _ctxid + "-" + i + "'><span class='fa " + KWS.context[_ctxid][i].icon + "'></span> " + KWS.context[_ctxid][i].label +"</a>");
285                 $("#kit-context-" + _ctxid + "-" + i).on("click", () => {
286                     KWS.context[_ctxid][i].function();
287                     $("#kit-context").fadeOut(300);
288                 });
289             }
290         }
291         if( _ptelem[0].id ) $( "#kit-context-elem" ).append( "#" + _ptelem[0].id );
292         $( "#kit-context-size" ).text( _ptelem[0].clientWidth + "✕" + _ptelem[0].clientHeight );
293         $("#kit-context").toggle().css("left", S.mouseX).css("top", S.mouseY);
294         return false;
295     });
296     $("#kit-context-open").on("click", function(){
297         S.alert("要素", S.selectedElement.clone());
298     });
299     $("#kit-context-save").on("click", function(){
300         S.obj2img( S.selectedElement , true );
301     });
302     $( "#kit-context-search" ).on("click", function(){
303         $("#kit-context").fadeOut(300);
304         launch( "browser", { "url" : "https://www.bing.com/search?q=" + $( "#kit-context-input" ).val() } );
305     });
306     $( "#kit-context-input" ).keypress( function( e ) {
307         if( e.which == 13 ) $( "#kit-context-search" ).click();
308     } );
309     $("#kit-context a").on("click", function(){
310         $("#kit-context").fadeOut(300);
311     });
312     $("#kit-context-vacuum").on("click", function(){
313         for( let i in process ){
314             KWS.vacuum( S.mouseX, S.mouseY );    
315         }
316         setTimeout(() => {
317             $(".window").css("transition", "none");
318         }, 500);
319     });
320     $("#kit-context-fusen").on("click", function(){
321         KWS.fusen.add("");
322     });
323
324
325     $("section").on("click", function(){
326         $("#kit-context").fadeOut(300);
327     })
328
329     $( document ).delegate( "a", "click", function() {
330         if( this.href ) {
331             launch( localStorage.getItem( "kit-default-browser" ), { "url" : this.href } );
332             return false;
333         }
334     } ).on("mousemove", function(event){
335         System.mouseX = event.clientX;
336         System.mouseY = event.clientY;
337     }).delegate( ".textbox", "keypress", function( e ) {
338         if( e.which == 13 && this.id && $("#" + this.id + " + .kit-button") ){
339             Notification.push("debug", this.id, "system");
340             $("#" + this.id + " + .kit-button").click();
341         }
342     } );
343
344     window.onresize = () => {
345         System.display.width = window.innerWidth;
346         System.display.height = window.innerWidth;
347
348         if( KWS.fullscreen.pid ){
349             KWS.resize( KWS.fullscreen.pid, System.display.width, System.display.height - 30 );
350         }
351     }
352
353     if( localStorage.getItem( "kit-lock" ) == "true" ){
354         $("section").hide();
355         setTimeout(() =>  System.lock(), 100);
356     }
357 }
358
359 function launch( str, args, dir ) {
360     pid = processID;
361     System.args[pid] = args;
362     System.launchpath[pid] = dir || System.appdir + str;
363
364     if( System.appCache[str] ) {
365         if( KWS.fullscreen.pid ) KWS.unmax(KWS.fullscreen.pid);
366         //app[str].open();
367         appData( System.appCache[str] );
368     }
369     else {
370         try{
371             $.getJSON( S.launchpath[pid] + "/define.json", appData ).fail( function() {
372                 System.alert( "起動エラー", "アプリケーションの起動に失敗しました<br>アプリケーション" + str + "は存在しないかアクセス権がありません(pid:" + processID + ")。ヘルプは<a class='kit-hyperlink' href='https://kitdev.home.blog/'>こちら</a>" );
373             } );
374         }
375         catch(error){
376             Notification.push( "System Error", error, "system" );
377         }
378     }
379 }
380
381 function appData( data ) {
382     var pid = processID;
383     process[String( pid )] = {
384         id: data.id,
385         time: System.time.obj.toLocaleString(),
386         isactive: false,
387         preventclose: false
388     };
389     System.appCache[data.id] = data;
390     $( "#tasks" ).append( "<span id='t" + pid + "'><img src='" + S.launchpath[pid] + "/" + data.icon + "'><span id='tname" + pid + "'>" + data.name + "<span></span>" );
391     //タスクバーのクリック挙動
392     $( "#t" + pid ).addClass( "task" ).click( function() {
393         if( $(this).hasClass("t-active") || $(this).hasClass("task-min") ) KWS.min( pid );
394         else{
395             $("#w"+pid).css("z-index", KWS.windowIndex + 1);
396             KWS.refreshWindowIndex();
397         }
398     } );
399     $( "#t" + pid ).addClass( "task" ).on( "mouseenter", function() {
400         $( "#task-ctx-name" ).text( data.name );
401         $( "#task-ctx-img" ).attr( "src", "./app/" + data.id + "/" + data.icon );
402         $( "#task-ctx-ver" ).text( data.version + "/pid:" + pid );
403         $( "#task-ctx-info" ).off().on( "click", function() { System.appInfo( data.id, pid )} );
404         $( "#task-ctx-sshot" ).off().on( "click", function() { S.screenshot(pid, true) } );
405         $( "#task-ctx-min" ).off().on( "click", function() { KWS.min( String(pid) ) } );
406         if( $(this).hasClass("t-active") ) $( "#task-ctx-front" ).hide();
407         else $( "#task-ctx-front" ).show();
408         $( "#task-ctx-front" ).off().on( "click", function() {
409             $("#w"+pid).css("z-index", KWS.windowIndex + 1);
410             KWS.refreshWindowIndex();
411         } );
412         $( "#task-ctx-close" ).off().on( "click", () => { System.close( String(pid) ) } );
413         $( "#task-ctx-kill" ).off().on( "click", () => { System.kill( String(data.id) ) } );
414         const _ctxleft = $( "#t" + pid ).offset().left;
415         const _ctxtop = window.innerHeight - $( "#t" + pid ).offset().top;
416         if( _ctxleft != $( "#task-ctx" ).offset().left ) {
417             $( "#task-ctx" ).hide();
418         }
419         $( "#task-ctx" ).css( "left", _ctxleft ).css( "bottom", _ctxtop ).show();
420     } );
421     $( "section, #kit-tasks" ).on( "mouseenter", function() {
422         $( "#task-ctx" ).fadeOut( 200 );
423     } );
424     $( "#t" + pid ).hover( function() {
425         prevWindowIndex = $( "#w" + pid ).css( "z-index" );
426         $( "#w" + pid ).addClass( "win-highlight" );
427     }, function() {
428         $( "#w" + pid ).removeClass( "win-highlight" );
429     } );
430     let _windowAppend = "<div id='w" + pid + "'><div id='wt" + pid + "' class='wt'><i class='wmzx'><span id='wm" + pid + "'></span>";
431     if( data.support && data.support.fullscreen == true ) _windowAppend += "<span id='wz" + pid + "'></span>";
432     _windowAppend += "<span id='wx" + pid + "'></span></i><img src='" + S.launchpath[pid] + "/" + data.icon + "'><span id='wtname" + pid + "'>" + data.name + "</span></div><div class='winc winc-" + data.id + "' id='winc" + pid + "'></div></div>";
433     $( "#desktop-" + currentDesktop ).append( _windowAppend );
434
435     if( data.support && data.support.darkmode == true ) $("#winc"+pid).addClass("winc-darkmode");
436     if( KWS.darkmode ) $("#winc"+pid).addClass("kit-darkmode");
437
438     if( data.size ){
439         $("#winc"+pid).css("width", data.size.width).css("height", data.size.height);
440     }
441     if( data.resize ){
442         let _minwidth = 200, _minheight = 40;
443         if( data.resize.minWidth ) _minwidth = data.resize.minWidth;
444         if( data.resize.minHeight ) _minheight = data.resize.minHeight;
445         $("#winc"+pid).windowResizable({
446             minWidth: _minwidth,
447             minHeight: _minheight
448         });
449     }
450
451     var windowPos = 50 + ( pid % 10 ) * 20;
452     //$( "#w" + pid ).addClass( "window" ).draggable( {cancel: ".winc", stack: ".window"} ).css( "left", windowPos + "px" ).css( "top", windowPos + "px" ).css( "z-index", $( ".window" ).length + 1 );
453     KWS.windowIndex ++;
454     $( "#w"+pid ).addClass( "window" ).pep({
455         elementsWithInteraction: ".winc, .ui-resizable-handle",
456         useCSSTranslation: false,
457         disableSelect: false,
458         shouldEase:     true,
459         initiate: function(){
460             $(this.el).addClass("ui-draggable-dragging");
461             KWS.windowIndex ++;
462             this.el.style.zIndex = KWS.windowIndex;
463             KWS.refreshWindowIndex();
464         },
465         stop: function(){
466             this.el.style.transition = "none";
467             $(this.el).removeClass("ui-draggable-dragging");
468         }
469     }).on( "mousedown", function(){
470         $(".window").css( "transition", "none" );
471         $(this).css("z-index", KWS.windowIndex + 1);
472         KWS.refreshWindowIndex();
473     } ).css( "left", windowPos + "px" ).css( "top", windowPos + "px" ).css( "z-index",  KWS.windowIndex );
474     KWS.refreshWindowIndex();
475     $( "#wm" + pid ).addClass( "wm fa fa-window-minimize" ).click( () => KWS.min( String(pid) ) );
476     $( "#wz" + pid ).addClass( "wz fas fa-square" ).click( () => KWS.max( String(pid) ) );
477     $( "#wx" + pid ).addClass( "wx fa fa-times" ).click( () => System.close( String(pid) ) );
478     $( "#winc" + pid ).resizable( {
479         minWidth: "200"
480     } ).load( System.launchpath[pid] + "/" + data.view );
481
482     //スクリプト読み込み
483     if( data.script != "none" ) $.getScript( System.launchpath[pid] + "/" + data.script );
484     if( data.css != "none" && $("#kit-style-"+data.id).length == 0 ){
485         $( "head" ).append( '<link href="' + System.launchpath[pid] + '/' + data.css + '" rel="stylesheet" id="kit-style-' + data.id + '"></link>' );
486         Notification.push("debug", "新規スタイルシートの読み込み", data.id);
487     }
488
489     processID++;
490     localStorage.setItem( "kit-pid", processID );
491 }
492
493 //非推奨メソッド
494 function appInfo( str ){
495     System.appInfo(str)
496 }
497
498 //非推奨メソッド
499 function close( str ) {
500     System.close( str )
501 }
502
503 //非推奨メソッド
504 function kill( str ) {
505     System.kill(str)
506 }
507
508 const System = new function() {
509     this.version = "0.2.0";
510     this.username = localStorage.getItem("kit-username");
511     this.appdir = localStorage.getItem("kit-appdir");
512
513     this.bootopt = new URLSearchParams(location.search);
514
515     this.mouseX = 0;
516     this.mouseY = 0;
517
518     this.display = {
519         "width": window.innerWidth,
520         "height": window.innerHeight
521     }
522
523     this.selectedElement = null;
524     this.selectedText = null;
525
526     this.dom = function(_pid, _elements) {
527         _elements = _elements || "";
528         return $("#winc" + _pid + " " + _elements);
529     }
530
531     this.userarea = new Object();
532     this.recycle = new Object();
533
534     this.appCache = {};
535     //アプリ引数
536     this.args = {};
537     //アプリ起動パス
538     this.launchpath = {};
539
540     this.support = $.support;
541     this.debugmode = false;
542
543     this.battery = null;
544
545     this.log = new Array();
546     this.noop = () => {}
547
548     this.setBattery = function(){
549         if( navigator.getBattery ) navigator.getBattery().then((e)=>{
550             let _lv =  e.level * 100;
551             System.battery = _lv;
552             return _lv;
553         });
554     }
555
556     this.screenshot = function( _pid, _popup ){
557         let _elem = document.querySelector("body");
558         if( _pid ) _elem = document.querySelector("#w"+_pid);
559         html2canvas( _elem ).then(canvas => {
560             if( _popup ){
561                 canvas.style.border = "1px solid #909090";
562                 S.save( canvas.toDataURL("image/png"), "image" );
563             }
564             return canvas;
565         });
566     }
567
568     this.obj2img = function( _obj, _popup ){
569         let _elem = _obj[0];
570         html2canvas( _elem ).then(canvas => {
571             if( _popup ){
572                 canvas.style.border = "1px solid #909090";
573                 S.save( canvas.toDataURL("image/png"), "image" );
574             }
575             return canvas;
576         });
577     }
578
579     this.save = function(data, type){
580         launch("fivr", { "save" : data, "type" : type });
581     }
582
583     this.open = function(filename){
584         launch("fivr", { "open" : filename });
585     }
586
587     this.preventClose = function( _pid ){
588         if( !process[_pid] ) return false;
589         process[_pid].preventclose = true;
590         return true;
591     }
592     
593     this.shutdown = function(_opt) {
594         $( "#last-notification-close" ).click();
595         $( "#kit-power-back" ).click();
596         for( let i in process ) {
597             if( process[i].preventclose == true ){
598                 S.dialog( "シャットダウンの中断", "pid" + System.appCache[process[i].id].name + "がシャットダウンを妨げています。<br>強制終了してシャットダウンを続行する場合は[OK]を押下してください。", () => {
599                     process[i].preventclose = false;
600                     System.shutdown();
601                 } );
602                 return false;
603             }
604             else System.close( i );
605         }
606         $( "section" ).hide();
607         $( "body" ).css( "background-color", "black" );
608         $( "header, footer" ).fadeOut( 300 );
609         $( "#kit-wallpaper" ).fadeOut( 1500 );
610         if( _opt == "reboot" ) location.reload();
611     }
612
613     this.reboot = function() {
614         System.shutdown("reboot");
615     }
616
617     this.lock = function(){
618         System.moveDesktop( "l" );
619
620         $( "#lock-user-icon" ).css( "background", localStorage.getItem( "kit-user-color" ) );
621         $( "section, header, footer" ).css( "filter", "none" );
622         $( "#kit-wallpaper" ).css( "filter", "blur(20px)" );
623         $( "header, footer, #kit-power" ).hide();
624
625         $( "#lock-username" ).text( localStorage.getItem( "kit-username" ) );
626         if( localStorage.getItem( "kit-password" ) ) $( "#lock-password" ).show();
627         else $( "#lock-password" ).hide();
628     }
629
630     this.alert = function( title, content, winname ) {
631         launch( "alert", [title, content, winname] );
632     }
633
634     this.dialog = function( title, content, func ){
635         launch("dialog", {
636             "title": title,
637             "content": content,
638             "func": func
639         })
640     }
641
642     this.appInfo = function( str, _pid ){
643         let _title = "", _content = "";
644         let ac = System.appCache[str];
645         let _lp = "";
646         if( _pid ) _lp = System.launchpath[pid];
647         else for( let i in process ){
648             if( process[i].id == str ){
649                 _lp = System.launchpath[i]; break;
650             }
651         }
652         if( ac ){
653             _title = ac.name + " (" + ac.version + ")";
654             _content = "<img style='height: 96px' src='" + _lp + "/" + ac.icon + "'><br>";
655             for( let i in ac ){
656                 if( typeof ac[i] != "object" ) _content += "<div><span style='font-weight: 100'>" + i + " </span>" + ac[i] + "</div>";
657             }
658             _content += "<br><span style='font-weight: 100'>起動パス" + _lp + "</span><br><br>"
659         }
660         else _title = "取得に失敗しました";
661         System.alert( _title, _content );
662     }
663
664     this.installed = new Array();
665  
666     //非推奨です(削除予定)。
667     this.min = function( _str ) {
668         KWS.min( _str );
669     }
670
671     this.close = function( _str ) {
672         let _pid = String( _str );
673         $( "#w" + _pid ).remove();
674         $( "#t" + _pid ).remove();
675         $( "#task-ctx" ).hide();
676         delete process[_pid];
677         KWS.refreshWindowIndex();
678     }
679
680     this.kill = function( _str ){
681         for( let pid in process ) {
682             if( process[pid] && process[pid].id == _str ) System.close( pid );
683         }
684     }
685     
686     this.vacuum = function( _left, _top ){
687         KWS.vacuum( _left, _top ); //非推奨です(削除予定)。
688     }
689
690     this.time = {
691         "obj" : new Date(),
692         "y" : "1970",
693         "m" : "1",
694         "d" : "1",
695         "h" : "00",
696         "i" : "00",
697         "s" : "00",
698         "ms" : "0"
699     }
700
701     this.clock = function() {
702         let DD = new Date();
703         S.time.obj = DD;
704         let Year = DD.getFullYear();
705         S.time.day = DD.getDay();
706         S.time.y = Year;
707         let Month = ( "00" + Number(DD.getMonth()+1) ).slice( -2 );
708         S.time.m = Month;
709         let DateN = ( "00" + DD.getDate() ).slice( -2 );
710         S.time.d = DateN;
711         let Hour = ( "00" + DD.getHours() ).slice( -2 );
712         S.time.h = Hour;
713         let Min = ( "00" + DD.getMinutes() ).slice( -2 );
714         S.time.i = Min;
715         let Sec = ( "00" + DD.getSeconds() ).slice( -2 );
716         S.time.s = Sec;
717         $( ".os-time" ).text( Hour + ":" + Min + ":" + Sec );
718         let MS = DD.getMilliseconds();
719         S.time.ms = MS;
720         let circle = {
721             outer: { radius: .9, color: "transparent" },
722             inner: { radius: .85, color: "transparent" }
723         }
724         let lines = {
725             long: { from: .8, to: .7, width: 2, color: "#303030" },
726             short: { from: .8, to: .75, width: 1, color: "#a0a0a0" }
727         }
728         let hands = {
729             hour: { length: .4, width: 3, cap: "butt", color: "#303030", ratio: .2 },
730             minute: { length: .67, width: 2, cap: "butt", color: "#303030", ratio: .2 },
731             second: { length: .67, width: 1, cap: "butt", color: "dodgerblue", ratio: .2 }
732         }
733         let canvas = $(".dropdown-clock-canvas")[0];
734         canvas.width = "200", canvas.height = "200";
735         let context = canvas.getContext("2d");
736         let center = { x: Math.floor(canvas.width / 2), y: Math.floor(canvas.height / 2) };
737         let radius = Math.min(center.x, center.y), angle, len;
738         context.beginPath();context.fillStyle = circle.outer.color;
739         context.arc(center.x, center.y, radius * circle.outer.radius, 0, Math.PI * 2, false);
740         context.fill();context.beginPath();context.fillStyle = circle.inner.color;
741         context.arc(center.x, center.y, radius * circle.inner.radius, 0, Math.PI * 2, false);
742         context.fill();
743         for( let i=0; i<60; i++ ){
744             angle = Math.PI * i / 30;
745             context.beginPath();
746             let line = ( i%5 == 0 ) ? lines.long : lines.short;
747             context.lineWidth = line.width, context.strokeStyle = line.color;
748             context.moveTo(center.x + Math.sin(angle) * radius * line.from, center.y - Math.cos(angle) * radius * line.from)
749             context.lineTo(center.x + Math.sin(angle) * radius * line.to, center.y - Math.cos(angle) * radius * line.to);
750             context.stroke();
751         }
752         angle = Math.PI * ( Hour+Min/60 ) / 6, len = radius * hands.hour.length;
753         context.beginPath(), context.lineWidth = hands.hour.width;
754         context.lineCap = hands.hour.cap, context.strokeStyle = hands.hour.color;
755         context.moveTo(center.x - Math.sin(angle) * len * hands.hour.ratio, center.y + Math.cos(angle) * len * hands.hour.ratio);
756         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
757         angle = Math.PI * (Min + Sec / 60) / 30, len = radius * hands.minute.length;
758         context.beginPath(), context.lineWidth = hands.minute.width;
759         context.lineCap = hands.minute.cap, context.strokeStyle = hands.minute.color;
760         context.moveTo(center.x - Math.sin(angle) * len * hands.minute.ratio, center.y + Math.cos(angle) * len * hands.minute.ratio);
761         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
762         angle = Math.PI * Sec / 30, len = radius * hands.second.length;
763         context.beginPath(), context.lineWidth = hands.second.width;
764         context.lineCap = hands.second.cap, context.strokeStyle = hands.second.color;
765         context.moveTo(center.x - Math.sin(angle) * len * hands.second.ratio, center.y + Math.cos(angle) * len * hands.second.ratio);
766         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
767     }
768
769     this.changeWallpaper = function( str ) {
770         $( "#kit-wallpaper" ).css( "background", str ).css( "background-size", "cover" );
771         localStorage.setItem( "kit-wallpaper", str )
772     }
773
774     this.moveDesktop = function( str ) {
775         str = String( str );
776         $( "section" ).hide();
777         $( "#desktop-" + str ).show();
778         $( "#desktops" ).html( "<span class='far fa-clone'></span>Desktop" + str );
779         currentDesktop = str;
780     }
781
782     this.avoidMultiple = function( _pid, _alert ) {
783         let _id = process[_pid].id;
784         let _cnt = 0;
785         for( let i in process ) {
786             if( process[i].id == _id ) _cnt += 1;
787         }
788         console.log( _cnt );
789         if( _cnt > 1 ) {
790             System.close( _pid );
791             if( !_alert ){
792                 System.alert( "多重起動", "アプリケーション" + _id + "が既に起動しています。このアプリケーションの多重起動は許可されていません。" );
793             }
794         }
795         return _cnt;
796     }
797
798     this.resizable = function( _pid, _elem, _width, _height ){
799         let E = ".winc";
800         if( _elem ) E = String( _elem );
801         if( !_width ) _width = null;
802         if( !_height ) _height = "100";
803         $("#w" + _pid).resizable({
804             alsoResize: "#w" + _pid + " " + E,
805             minWidth: _width,
806             minHeight: _height
807         });
808     }
809
810     this.initLauncher = function(data){
811         $("#launcher-apps").html("");
812         for( let i in data ){
813             $("#launcher-apps").append("<div class='launcher-app' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
814         }
815         if( !System.bootopt.get("safe") ){
816             for( let i of System.installed ){
817                 $("#launcher-apps").append("<div class='launcher-app' data-define-path='" + i.path + "' data-define-id='" + i.id + "'><img src='" + i.icon + "'>" + i.name + "</div>");
818             }
819         }
820         $(".launcher-app").on("click", function(){
821             $("#launch").click();
822             if( $(this).attr("data-launch") ) launch( $(this).attr("data-launch") );
823             else if( $(this).attr("data-define-path") ){
824                 launch( $(this).attr("data-define-id"), null, $(this).attr("data-define-path") );
825             };
826         });
827     }
828
829     this.clip = new function(){
830         this.content = null;
831         this.history = new Array();
832
833         this.set = function( content ){
834             this.content = content;
835             this.history.push(content);
836             return content;
837         }
838         this.get = ()=>{ return this.content }
839     }
840
841     this.config = new function(){
842         this.apps = new Object();
843     }
844
845     this.audio = new function(){
846         this.level = localStorage["kit-audio-level"] || 100;
847         this.silent = false;
848
849         this.list = new Array();
850
851         this.volume = function( _level ){
852             $("#dropdown-sound-slider").slider("value", _level);
853         }
854
855         this.play = function( _audioid, _src ){
856             if( !System.audio.list[_audioid] ){
857                 System.audio.list[_audioid] = new Audio(_src);
858                 System.audio.list[_audioid].volume = System.audio.level / 100;
859             }
860             System.audio.list[_audioid].play();
861         }
862
863         this.get = function( _audioid ){
864             return System.audio.list[_audioid];
865         }
866
867         this.pause = function( _audioid ){
868             System.audio.list[_audioid].pause();
869         }
870
871         this.stop = function( _audioid ){
872             System.audio.list[_audioid].pause();
873             System.audio.list[_audioid] = null;
874         }
875
876         this.seek = function( _audioid, _time ){
877             System.audio.list[_audioid].fastSeek(_time);
878         }
879
880         this.mute = function( _audioid, _bool ){
881             System.audio.list[_audioid].muted = _bool;
882         }
883     }
884 }
885
886 const KWS = new function(){
887     this.version = "3.2.2";
888     this.active = null;
889
890     this.darkmode = false;
891
892     this.changeWindowTitle = function( _pid, _str ){
893         $("#tname"+_pid).text( _str );
894         $("#wtname"+_pid).text( _str );
895     }
896
897     this.min = function( _str ) {
898         let _pid = String( _str );
899         if( $( "#w" + _pid ).is( ":visible" ) ) {
900             $( "#w" + _pid ).css("transition", "none").hide( "drop", {direction: "down"}, 300 );
901             $( "#task-ctx" ).effect( "bounce", {distance: 12, times: 1}, 400 );
902             $( "#t" + _pid ).addClass( "task-min" );
903         }
904         else {
905             $( "#w" + _pid ).show( "drop", {direction: "down"}, 300 );
906             $( "#task-ctx" ).effect( "bounce", {distance: 12, times: 1}, 400 );
907             $( "#t" + _pid ).removeClass( "task-min" );
908         }
909     }
910
911     this.fullscreen = {
912         "pid": null,
913         "prevWidth": null,
914         "prevHeight": null,
915         "prevTop": 0,
916         "prevLeft": 0
917     }
918
919     this.max = function( _pid ){
920         if( KWS.fullscreen.pid ){
921             Notification.push("最大化に失敗", "最大化しているウィンドウがあります。");
922             return;
923         }
924         $( "#wt"+_pid ).addClass("wtmaximize");
925         $( "#w"+_pid ).css({
926             "top": "0px",
927             "left": "0px"
928         })
929         .addClass("windowmaximize")
930         .css("z-index", KWS.windowIndex + 1);
931         KWS.refreshWindowIndex();
932
933         KWS.fullscreen.prevWidth = $("#winc"+_pid).outerWidth();
934         KWS.fullscreen.prevHeight = $("#winc"+_pid).outerHeight();
935         KWS.fullscreen.prevTop = $("#w"+_pid).offset().top;
936         KWS.fullscreen.prevLeft = $("#w"+_pid).offset().left;
937
938         KWS.resize( _pid, System.display.width, System.display.height - 30 );
939         $("footer").hide();
940         $("#kit-header-fullscreen").show().on("click", () => {
941             KWS.unmax( _pid );
942         });
943         KWS.fullscreen.pid = _pid;
944     }
945
946     this.unmax = function( _pid ){
947         if( _pid != KWS.fullscreen.pid ){
948             Notification.push("最大化解除に失敗", "対象がフルスクリーンウィンドウではありません。");
949             return;
950         }
951         $( "#wt"+_pid ).removeClass("wtmaximize");
952         $( "#w"+_pid ).css({
953             "top": KWS.fullscreen.prevTop,
954             "left": KWS.fullscreen.prevLeft
955         })
956         .removeClass("windowmaximize");
957         $("footer").show();
958         $("#kit-header-fullscreen").hide().off();
959         KWS.resize( _pid, KWS.fullscreen.prevWidth, KWS.fullscreen.prevHeight );
960         KWS.fullscreen.pid = null;
961         KWS.fullscreen.prevWidth = null;
962         KWS.fullscreen.prevHeight = null;
963         KWS.fullscreen.prevTop = null;
964         KWS.fullscreen.prevLeft = null;
965     }
966
967     this.vacuum = function( _left, _top ){
968         for( let i in process ){
969             $("#w"+i).css("transition", ".5s all ease").css("left", _left ).css("top", _top );
970         }
971         setTimeout(() => {
972             $(".window").css("transition", "none");
973         }, 500);
974     }
975
976     this.active = null;
977     this.windowIndex = 1;
978
979     this.refreshWindowIndex = function(){
980         let num = $(".window").length;
981         let array = new Array();
982         let obj = new Object();
983         for( let i = 0; i < num; i++ ){
984             obj = { id: $(".window")[i].id, zindex: $(".window")[i].style.zIndex };
985             array.push( obj );
986         };
987         array.sort( (a,b) => {
988             return Number(a.zindex - b.zindex);
989         } );
990         for( let i in array ){
991             document.getElementById(array[i].id).style.zIndex = i;
992             if( i == num-1 ){
993                 $("#"+array[i].id).addClass("windowactive");
994                 $("#t"+String(array[i].id).substring(1)).addClass("t-active");
995                 KWS.active = String(array[i].id).substring(1);
996                 process[array[i].id.substring(1)].isactive = true;
997             }
998             else{
999                 $("#"+array[i].id).removeClass("windowactive");
1000                 $("#t"+String(array[i].id).substring(1)).removeClass("t-active");
1001                 process[array[i].id.substring(1)].isactive = false;
1002             }
1003         }
1004         KWS.windowIndex = num;
1005     }
1006
1007     this.resize = function( _pid, _width, _height ){
1008         if( _width ) $("#winc"+_pid).css("width", _width)
1009         if( _height ) $("#winc"+_pid).css("height", _height);
1010     }
1011
1012     this.fusen = new function(){
1013         this.fid = 0;
1014         this.list = new Object();
1015
1016         this.add = function(_text){
1017             KWS.fusen.list[KWS.fusen.fid] = String(_text);
1018             $("#desktop-"+currentDesktop).append("<div class='kit-fusen' id='kit-f"+KWS.fusen.fid+"'><i class='fa fa-quote-left'></i><textarea class='kit-fusen-textarea kit-selectable' data-fid='"+KWS.fusen.fid+"' data-kit-contextid='fusen'>"+_text+"</textarea></div>");
1019             $("#kit-f"+KWS.fusen.fid).css({
1020                 "left": Number(KWS.fusen.fid)*40 + 20,
1021                 "top": Number(KWS.fusen.fid)*10 + 100,
1022             }).pep({
1023                 elementsWithInteraction: ".kit-fusen-textarea",
1024                 useCSSTranslation: false,
1025                 disableSelect: false,
1026                 shouldEase:     true,
1027                 initiate: function(){
1028                     $(this.el).css("ui-opacity", "0.7");
1029                 },
1030                 stop: function(){
1031                     this.el.style.transition = "none";
1032                     $(this.el).css("ui-opacity", "1.0");
1033                 }
1034             })
1035             $(".kit-fusen-textarea").off().on("change",function(){
1036                 Notification.push($(this).attr("data-fid"), $(this).val(), "debug");
1037                 KWS.fusen.list[$(this).attr("data-fid")] = $(this).val();
1038                 localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1039             });
1040             localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1041             KWS.fusen.fid++;
1042         }
1043
1044         this.remove = function(_fid){
1045             delete KWS.fusen.list[_fid];
1046             localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1047             $("#kit-f"+_fid).remove();
1048         }
1049     }
1050
1051     this.addCustomContext = function( _elem, _contextid, _obj ){
1052         KWS.context[_contextid] = _obj;
1053     }
1054
1055     this.context = {
1056         "fusen" : {
1057             "name" : "ふせん",
1058             "delete" : {
1059                 "label" : "ふせんを削除",
1060                 "icon" : "fa-trash-alt",
1061                 "function" : function(){
1062                     KWS.fusen.remove( S.selectedElement.attr("data-fid") );
1063                 }
1064             },
1065             "copy" : {
1066                 "label" : "ふせんを複製",
1067                 "icon" : "fa-copy",
1068                 "function" : function(){
1069                     KWS.fusen.add( KWS.fusen.list[S.selectedElement.attr("data-fid")] );
1070                 }
1071             }
1072         }
1073     }
1074 }
1075
1076 const Notification = new function() {
1077     this.nid = 0;
1078     this.list = new Object();
1079
1080     this.goodnight = false;
1081     this.sound = null;
1082
1083     this.push = function( _title, _content, _app ) {
1084         if( !System.debugmode && ( _title == "debug" || _app == "debug" ) ){
1085             return false;
1086         }
1087         this.list[this.nid] = {
1088             "title" : _title,
1089             "content" : _content,
1090             "app" : _app,
1091             "time" : System.time.obj.toLocaleString()
1092         };
1093         if( !this.goodnight ){
1094             if( this.sound ) System.audio.play( "n" + this.nid, this.sound );
1095             $( "#last-notification-title" ).text("").text( _title );
1096             $( "#last-notification-content" ).text("").text( _content );
1097             $( "#last-notification-app" ).text("").text( _app );
1098             $( "#last-notification" ).hide().show( "drop", {direction: "right"}, 300 );
1099         }
1100         $( "#notifications" ).append( "<div class='notis' id='nt" + this.nid + "'><span class='notis_close' id='nc" + this.nid + "'></span><span><span class='fas fa-comment-alt'></span>" + _title + "</span>" + _content + "<div class='notis_time'>" + System.time.obj.toLocaleString() + "</div></div>" );
1101         $("#nc" + this.nid).on("click", function(){
1102             let _nid = this.id.slice(2);
1103             $("#nt" + _nid).fadeOut(300);
1104             return false;
1105         } );
1106         $("#nt" + this.nid).on("click", function(){
1107             let _nid = this.id.slice(2);
1108             if( Notification.list[ _nid ].app != "system" ){
1109                 launch(Notification.list[ _nid ].app);
1110             }
1111         } );
1112         this.nid ++;
1113         return (this.nid - 1);
1114     }
1115 }
1116
1117 var process = {}, processID = 0, pid, currentDesktop = 1, currentCTX = "", prevWindowIndex, S;