OSDN Git Service

Merge branch 'master' into feature/sightre-prefix
[kit/kit.git] / system.js
1 "use strict";
2
3 //   _    _ _   
4 //  | | _(_) |_ 
5 //  | |/ / | __|
6 //  |   <| | |_ 
7 //  |_|\_\_|\__|
8 //
9 // THIS IS THE KIT KERNEL, KIT APPS FRAMEWORK 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" ) ) pid = localStorage.getItem( "kit-pid" );
20
21     if( !localStorage.getItem( "kit-username" ) ) localStorage.setItem( "kit-username", "ユーザー" );
22     $( "#kit-header-username" ).text( localStorage.getItem( "kit-username" ) );
23
24     if( localStorage.getItem( "kit-lock" ) == null ) localStorage.setItem( "kit-lock", "false" );
25
26     if( System.bootopt.get("safe") ) $( "#kit-wallpaper" ).css( "background","#404040" );
27     else if( localStorage.getItem( "kit-wallpaper" ) ) $( "#kit-wallpaper" ).css( "background", localStorage.getItem( "kit-wallpaper" ) ).css( "background-size", "cover" ).css( "background-position", "center" );
28
29     if( !localStorage.getItem( "kit-default-browser" ) ) localStorage.setItem( "kit-default-browser", "browser" );
30
31     if( localStorage.getItem("kit-fusen") ){
32         this.list = JSON.parse(localStorage.getItem("kit-fusen"));
33         for( let i in this.list ){
34             KWS.fusen.add(this.list[i]);
35         }
36     }
37     
38     if( localStorage.getItem("kit-darkmode") == "true" ){
39         KWS.darkmode = true;
40         $("#kit-darkmode").attr("href", "system/theme/kit-darkmode.css");
41         $(".winc-darkmode").addClass("kit-darkmode");
42     }
43
44     if( System.bootopt.get("safe") ){
45         $("#kit-theme-file").attr("href", "./system/theme/theme-light.css" );
46     }
47     else{
48         if( !localStorage.getItem( "kit-theme" ) ) localStorage.setItem( "kit-theme", "theme-default.css" );
49         $("#kit-theme-file").attr("href", "./system/theme/" + localStorage.getItem("kit-theme") );
50     }
51
52     if( !localStorage.getItem( "kit-appdir" ) ) localStorage.setItem( "kit-appdir", "./app/" );
53     S.appdir = localStorage.getItem( "kit-appdir" );
54
55     if( localStorage.getItem( "kit-installed" ) ) System.installed = JSON.parse( localStorage.getItem( "kit-installed" ) );
56
57     if( localStorage["kit-userarea"] ) System.userarea = JSON.parse(localStorage["kit-userarea"]);
58     if( localStorage["kit-recycle"] ) System.recycle = JSON.parse(localStorage["kit-recycle"]);
59
60     System.moveDesktop( "1" );
61
62     var clockmove;
63     if( System.bootopt.get("safe") ) clockmove = setInterval( System.clock, 1000 );
64     else  clockmove = setInterval( System.clock, 10 );
65
66     if ( localStorage.getItem("kit-shutted-down") == "false" ) {
67         Notification.push( "お知らせ", "kitは前回終了時、正しくシャットダウンされませんでした。", "system" );
68     }
69     localStorage.setItem("kit-shutted-down", false);
70
71     Notification.push( "kitへようこそ", localStorage["kit-username"] + "さん、こんにちは。", "system", null, null, 'documents/icon.png', [
72         {
73             label: 'kitについて',
74             func: () => launch( 'settings', {'view': 'about'} )
75         }
76     ]);
77
78     if( localStorage.getItem( "kit-startup" ) == undefined ) {
79         localStorage.setItem( "kit-startup", new Array( "welcome" ) );
80     }
81     System.startup = localStorage.getItem( "kit-startup" ).split( "," );
82     if( System.bootopt.get("safe") ){
83         Notification.push( "セーフブート", "現在、kitをセーフモードで起動しています。", "system" );
84         System.alert( "セーフブート", "現在、kitをセーフモードで起動しています。<br><a class='kit-hyperlink' onclick='System.reboot()'>通常モードで再起動</a>", "system" );
85     }
86     else for( let i of System.startup ) if( i != "" ) launch( i );
87     
88     $("#kit-header-fullscreen").hide();
89
90     //イベントハンドラ
91     $( "#desktops" ).click( function() {
92         $( "#desktop-" + currentDesktop ).toggleClass( "selected-section" );
93     } ).mousedown( function() {
94         $( ".window" ).css( "opacity", "0.6" );
95     } ).mouseup( function() {
96         $( ".window" ).css( "opacity", "1.0" );
97     } );
98     //タスク一覧
99     $( "#footer-tasks" ).click( function() {
100         if( $( "#kit-tasks" ).is( ":visible" ) ) {
101             $( "#kit-tasks" ).html( "" ).fadeOut( 300 );
102         }
103         else {
104             $( "#task-ctx" ).fadeOut( 200 );
105             $( "#kit-tasks" ).html( $( "#tasks" ).html() ).fadeIn( 300 ).css( "z-index", "9997" );
106         }
107     } );
108     $.getJSON("system/testload.json").fail( () => {
109         $('#body').append(`<div id='wcors' class="window windowactive" style="top: 70px; left: 50px; width: calc(100% - 100px)">
110             <div class="wt">問題が発生しました</div>
111             <div class="winc">JSONデータ読み込みに失敗しました。<br>
112             クロスオリジン制約によりkitアプリケーションの動作が制限されている場合があります。<br>
113             詳細は<a class="kit-hyperlink" onclick="location.href = 'https://mtsgi.github.io/kitdocs/#/cors'">こちらの記事</a>をご確認ください。</div>
114         </div>`);
115         $('<kit-button-alt class="kit-block kit-text-c m">閉じる</kit-button-alt>').appendTo('#wcors .winc').on('click', ()=>{
116             $('#wcors').remove();
117         })
118     });
119     
120     $.getJSON("config/desktop.json", (data) => {
121         for( let i in data ){
122             $(".desktop-icons").append("<div class='desktop-icon' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
123         }
124         $(".desktop-icon").on("click", function(){
125             launch( $(this).attr("data-launch") );
126         });
127     }).fail( function() {
128         Notification.push( "読み込みに失敗", "デスクトップ(config/desktop.json)の読み込みに失敗しました。", "system" );
129     } );
130     
131     $.getJSON("config/apps.json", System.initLauncher).fail( function() {
132         Notification.push( "ランチャー初期化失敗", "アプリケーション一覧(config/apps.json)の読み込みに失敗しました。", "system" );
133     } );
134     $( "#kit-tasks" ).delegate( ".task", "click", function() {
135         System.close( this.id.slice( 1 ) );
136         $( this ).hide();
137     } );
138     
139     $( "#footer-noti" ).click( function() {
140         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
141         if( $( "#notifications" ).is( ":visible" ) ) {
142             $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
143         }
144         else {
145             $( "#notifications" ).show( "drop", {direction: "right"}, 300 );
146         }
147     } );
148     $( "#last-notification-close" ).click( function() {
149         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
150     } );
151     $("#notifications-dnp").prop("checked", false).on("change", ()=>{
152         if( $("#notifications-dnp").is(":checked") ){
153             Notification.goodnight = true;
154         }
155         else Notification.goodnight = false;
156     });
157     
158     $( ".power-button" ).click( function() {
159         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
160         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
161         $( "#kit-wallpaper" ).css( "filter", "blur(5px)" );
162         $( "footer, header, #launcher, #task-ctx, #kit-sightre, .dropdown, #desktop-" + currentDesktop ).hide();
163         $( "#kit-power" ).show();
164     } );
165     $( "#kit-power-back" ).click( function() {
166         $( "section, header, footer, #kit-wallpaper, .dropdown" ).css( "filter", "none" );
167         $( "footer, header, #desktop-" + currentDesktop ).show();
168         $( "#kit-power" ).hide();
169     } );
170     $( "#kit-power-shutdown" ).click( function() {
171         System.shutdown();
172     } );
173     $( "#kit-power-reboot" ).click( function() {
174         System.reboot();
175     } );
176     $( "#kit-power-suspend" ).click( function() {
177         location.reload();
178         $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
179         $( "#kit-power" ).fadeOut( 300 );
180         System.alert("サスペンド機能", "サスペンド機能はこのバージョンのkitではサポートされていません。");
181     } );
182     $( "#kit-power-lock" ).click( function() {
183         System.lock();
184     } );
185     $( "#lock-password" ).on( 'keypress', function( e ) {
186         if( e.which == 13 ) $( "#lock-unl" ).click();
187     } );
188     $( "#lock-unl" ).on( 'click', function() {
189         if( !localStorage.getItem( "kit-password" ) || $( "#lock-password" ).val() == localStorage.getItem( "kit-password" ) ) {
190             $( "header, footer" ).show();
191             $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
192             $( "#lock-password" ).val( "" );
193             System.moveDesktop(1);
194         }
195         else $( "#lock-password" ).effect( "bounce", {distance: 12, times: 4}, 500 );
196     } ).hover( function() {
197         $( "#lock-unl span" ).removeClass( "fa-lock" ).addClass( "fa-lock-open" );
198     }, function() {
199         $( "#lock-unl span" ).removeClass( "fa-lock-open" ).addClass( "fa-lock" );
200     } );
201     
202     $( "#launch" ).click( function() {
203         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
204         if( $( "#launcher" ).is( ":visible" ) ) {
205             $( "#kit-wallpaper" ).css( "filter", "none" );
206             $( "#desktop-" + currentDesktop ).show();
207             $( "#launcher" ).hide();
208         }
209         else {
210             $( "#kit-wallpaper" ).css( "filter", "blur(5px)" )
211             $( "section, #task-ctx" ).hide();
212             $( "#launcher" ).show();
213         }
214     } );
215
216     //Sightre
217     $('#kit-header-sightre').on('click', () => {
218         if($('#kit-sightre').is( ":visible" )) {
219             $('#kit-sightre').fadeOut(300);
220         }
221         else {
222             $('#kit-sightre-results').html('');
223             $('#kit-sightre').show();
224             $('#kit-sightre-form').val('').focus();
225         }
226     });
227     let sightrePrevWord = '';
228     $('#kit-sightre-form').on('keypress', (e) => {
229         let _word = $('#kit-sightre-form').val();
230         if( e.which == 13 && _word ) {
231             if( _word == "kit" ){
232                 S.alert("", "<div style='text-align:left;'> _    _ _ <br>| | _(_) |_ <br>| |/ / | __|<br>|   〈| | |_ <br>|_|\_ \ _\__|</div><hr>", S.version);
233                 return;
234             }
235             $('.kit-sightre-result.-first').click();
236             sightrePrevWord = '';
237             $('#kit-sightre-form').val('');
238             $('#kit-sightre-results').html('');
239             $('#kit-sightre').fadeOut(300);
240         }
241     }).on('keydown keyup change', (e) => {
242         let _word = $('#kit-sightre-form').val();
243         if( e.which == 27 ) $('#kit-sightre').fadeOut(300);
244         else {
245             if( _word == sightrePrevWord ) return;
246             $('#kit-sightre-results').html('');
247             if( !_word ) return;
248             sightrePrevWord = _word;
249             if( _word.indexOf('kish ') == 0 || _word.indexOf('🥧 ') == 0 ){
250                 let _cmd = _word.substring( _word.indexOf(" ") + 1 );
251                 if( _cmd ){
252                     $(`<div class='kit-sightre-result -first'>
253                             <img class='--icon' src='app/kish/icon.png'/>
254                             <div class='--info'>
255                                 <div class='--name'>${_cmd}</div>
256                                 <div class='--desc'>kishでコマンドを実行</div>
257                             </div>
258                             <div class='--open fa fa-arrow-right'></div>
259                         </div>`).appendTo('#kit-sightre-results').on('click', () => {
260                             launch('kish', { 'rc': [ _cmd ] });
261                     });
262                 }
263             }
264             else if( _word.indexOf('http://') == 0 || _word.indexOf('https://') == 0 || _word.indexOf('localhost') == 0 ){
265                 $(`<div class='kit-sightre-result -first'>
266                         <img class='--icon' src='app/browser/icon.png'/>
267                         <div class='--info'>
268                             <div class='--name'>${_word}</div>
269                             <div class='--desc'>ブラウザでURLを開く</div>
270                         </div>
271                         <div class='--open fa fa-arrow-right'></div>
272                     </div>`).appendTo('#kit-sightre-results').on('click', () => {
273                         launch( localStorage.getItem( "kit-default-browser" ), { "url" : _word } );
274                 });
275             }
276             else {
277                 $(`<div class='kit-sightre-result -first'>
278                         <img class='--icon' src='system/icons/q.png'/>
279                         <div class='--info'>
280                             <div class='--name'>${_word}</div>
281                             <div class='--desc'>アプリを起動する</div>
282                         </div>
283                         <div class='--open fa fa-arrow-right'></div>
284                     </div>`).appendTo('#kit-sightre-results').on('click', () => {
285                         let _args = null;
286                         try {
287                             if( _word.split(",")[1] ) _args = JSON.parse( _word.split(",").slice(1).join().trim() );
288                         }
289                         catch(error) {
290                             Notification.push("引数の解釈に失敗", error, "system");
291                         }
292                         launch( _word.split(",")[0], _args );
293                 });
294             }
295             for( let i in System.apps ){
296                 if( i.indexOf(_word) == 0 || S.apps[i].name.indexOf(_word) == 0 ){
297                     $(`<div class='kit-sightre-result -app'>
298                             <img class='--icon' src='${S.apps[i].icon}'/>
299                             <div class='--info'>
300                                 <div class='--name'>${S.apps[i].name}</div>
301                                 <div class='--desc'>kitアプリケーション - ${i}</div>
302                             </div>
303                             <div class='--open fa fa-arrow-right'></div>
304                         </div>`).appendTo('#kit-sightre-results').on('click', () => {
305                         launch(i);
306                         $('#kit-sightre-results').html('');
307                         $('#kit-sightre').fadeOut(300);
308                     });
309                 }
310             }
311             for( let i in System.userarea ){
312                 if( i.indexOf(_word) == 0 || i.indexOf(_word) == 0 ){
313                     $(`<div class='kit-sightre-result -file'>
314                             <i class="fa fa-file --icon"></i>
315                             <div class='--info'>
316                                 <div class='--name'>${i}</div>
317                                 <div class='--desc'>ファイル - 種類:${S.userarea[i].type} - ユーザー:${System.username}</div>
318                             </div>
319                             <div class='--open fa fa-arrow-right'></div>
320                         </div>`).appendTo('#kit-sightre-results').on('click', () => {
321                         System.open(i);
322                         $('#kit-sightre-results').html('');
323                         $('#kit-sightre').fadeOut(300);
324                     });
325                 }
326             }
327             $(`<div class='kit-sightre-result -link'>
328                     <i class="fa fa-search --icon"></i>
329                     <div class='--info'>
330                         <div class='--name'>${_word}</div>
331                         <div class='--desc'>をWebで検索</div>
332                     </div>
333                     <div class='--open fa fa-arrow-right'></div>
334                 </div>`).appendTo('#kit-sightre-results').on('click', () => {
335                 launch( 'browser', { 'url' : 'https://www.bing.com/search?q=' + _word } );
336                 $('#kit-sightre-results').html('');
337                 $('#kit-sightre').fadeOut(300);
338             });
339             $(`<div class='kit-sightre-result -link'>
340                     <i class="fab fa-wikipedia-w --icon"></i>
341                     <div class='--info'>
342                         <div class='--name'>${_word}</div>
343                         <div class='--desc'>wikipediaの記事を表示</div>
344                     </div>
345                     <div class='--open fa fa-arrow-right'></div>
346                 </div>`).appendTo('#kit-sightre-results').on('click', () => {
347                 launch( 'browser', { 'url' : 'https://ja.wikipedia.org/wiki/' + _word } );
348                 $('#kit-sightre-results').html('');
349                 $('#kit-sightre').fadeOut(300);
350             });
351         }
352     });
353
354     $("#dropdown-sound-slider").slider({
355         min: 0, max: 100, step: 1, value: 100,
356         change: (e, ui) => {
357             System.audio.level = ui.value;
358             $("#dropdown-sound-level").text(ui.value);
359             localStorage.setItem("kit-audio-level", ui.value);
360             for( let i in System.audio.list ){
361                 System.audio.list[i].volume = System.audio.level / 100;
362             }
363             if( ui.value == 0 ) $("#kit-header-sound-icon").removeClass("fa-volume-up").addClass("fa-volume-mute");
364             else $("#kit-header-sound-icon").removeClass("fa-volume-mute").addClass("fa-volume-up");
365         }
366     });
367     if( localStorage["kit-audio-level"] ) System.audio.volume( localStorage["kit-audio-level"] );
368
369     $("#dropdown-sound-silent").prop("checked", false).on("change", ()=>{
370         if( $("#dropdown-sound-silent").is(":checked") ){
371             System.audio.silent = true;
372             $("#kit-header-sound-icon").removeClass("fa-volume-up").addClass("fa-volume-mute");
373         }
374         else{
375             System.audio.silent = false;
376             $("#kit-header-sound-icon").removeClass("fa-volume-mute").addClass("fa-volume-up");
377         }
378     });
379
380     $("#kit-header-user").on("click", ()=>{
381         launch("user");
382     });
383
384     $(":root section:not(#desktop-l)").on("contextmenu", function() {
385         let _ptelem = $( document.elementFromPoint(S.mouseX, S.mouseY) );
386         S.selectedElement = _ptelem;
387         S.selectedText = window.getSelection();
388         $( "#kit-context-input" ).val( S.selectedText );
389         if( $( "#kit-context-input" ).val() == "" ) $("#kit-contextgroup-text").hide();
390         else $("#kit-contextgroup-text").show();
391         if( _ptelem[0].id == "desktop-" + currentDesktop ){
392             $("#kit-contextgroup-desktop").show();
393             $("#kit-contextgroup-elem").hide();
394         }
395         else{
396             $("#kit-contextgroup-desktop").hide();
397             $("#kit-contextgroup-elem").show();
398         }
399         $( "#kit-context-elem" ).text( _ptelem.prop("tagName").toLowerCase() + "要素" );
400         $("#kit-contextgroup-custom").hide();
401
402         let  _ctxid = _ptelem.attr("data-kit-contextid") || _ptelem.attr("kit-context");
403         if( _ctxid ){
404             $("#kit-contextgroup-custom").show().html('<div id="kit-context-custom"></div>');
405             let  _ctxname = KWS.context[_ctxid].name || _ctxid; 
406             $("#kit-context-custom").text( _ctxname );
407             for( let i in KWS.context[_ctxid]){
408                 if( i == "name" ) continue;
409                 $("#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>");
410                 $("#kit-context-" + _ctxid + "-" + i).on("click", () => {
411                     KWS.context[_ctxid][i].function();
412                     $("#kit-context").fadeOut(300);
413                 });
414             }
415         }
416         if( _ptelem[0].id ) $( "#kit-context-elem" ).append( "#" + _ptelem[0].id );
417         $( "#kit-context-size" ).text( _ptelem[0].clientWidth + "✕" + _ptelem[0].clientHeight );
418         $("#kit-context").toggle().css("left", S.mouseX).css("top", S.mouseY);
419         return false;
420     });
421     $("#kit-context-open").on("click", function(){
422         S.alert("要素", S.selectedElement.clone());
423     });
424     $("#kit-context-save").on("click", function(){
425         S.obj2img( S.selectedElement , true );
426     });
427     $( "#kit-context-search" ).on("click", function(){
428         $("#kit-context").fadeOut(300);
429         launch( "browser", { "url" : "https://www.bing.com/search?q=" + $( "#kit-context-input" ).val() } );
430     });
431     $( "#kit-context-input" ).keypress( function( e ) {
432         if( e.which == 13 ) $( "#kit-context-search" ).click();
433     } );
434     $("#kit-context a").on("click", function(){
435         $("#kit-context").fadeOut(300);
436     });
437     $("#kit-context-vacuum").on("click", function(){
438         for( let i in process ){
439             KWS.vacuum( S.mouseX, S.mouseY );    
440         }
441         setTimeout(() => {
442             $(".window").css("transition", "none");
443         }, 500);
444     });
445     $("#kit-context-fusen").on("click", function(){
446         KWS.fusen.add("");
447     });
448
449
450     $("section").on("click", function(){
451         $("#kit-context").fadeOut(300);
452     })
453
454     $( document ).delegate( "a", "click", function() {
455         if( this.href ) {
456             launch( localStorage.getItem( "kit-default-browser" ), { "url" : this.href } );
457             return false;
458         }
459     } ).on("mousemove", function(event){
460         System.mouseX = event.clientX;
461         System.mouseY = event.clientY;
462     }).delegate( ".textbox", "keypress", function( e ) {
463         if( e.which == 13 && this.id ){
464             if( $("#" + this.id + " + .kit-button").length ){
465                 Notification.push("debug", this.id, "system");
466                 $("#" + this.id + " + .kit-button").click();
467             }
468             else if( $("#" + this.id + " + kit-button").length ){
469                 Notification.push("debug", this.id, "system");
470                 $("#" + this.id + " + kit-button").click();
471             }
472         }
473     } );
474
475     window.onresize = () => {
476         System.display.width = window.innerWidth;
477         System.display.height = window.innerWidth;
478
479         if( KWS.fullscreen.pid ){
480             KWS.resize( KWS.fullscreen.pid, System.display.width, System.display.height - 30 );
481         }
482     }
483
484     if( localStorage.getItem( "kit-lock" ) == "true" ){
485         $("section").hide();
486         setTimeout(() =>  System.lock(), 100);
487     }
488 }
489
490 function launch( str, args, dir ) {
491     let _pid = pid;
492     System.args[_pid] = args;
493     System.launchpath[_pid] = dir || System.appdir + str;
494
495     if( System.appCache[str] ) {
496         if( KWS.fullscreen.pid ) KWS.unmax(KWS.fullscreen.pid);
497         appData( System.appCache[str] );
498     }
499     else {
500         try{
501             $.getJSON( S.launchpath[_pid] + '/define.json', appData ).fail( () => {
502                 Notification.push('kitアプリをロードできません。', `${str}を展開できませんでした。`, 'system');
503             } );
504         }
505         catch(error){
506             Notification.push( "System Error", error, "system" );
507         }
508     }
509 }
510
511 function appData( data ) {
512     let _pid = pid;
513     process[String( _pid )] = {
514         id: data.id,
515         time: System.time.obj.toLocaleString(),
516         isactive: false,
517         preventclose: false,
518         title: data.name
519     };
520     System.appCache[data.id] = data;
521     app = new App(_pid);
522     let _taskAppend = `<span id='t${_pid}'>`;
523     if( data.icon && data.icon != "none" ) _taskAppend += `<img src='${S.launchpath[_pid]}/${data.icon}'>`;
524     _taskAppend += `<span id='tname${_pid}'>${data.name}<span></span>`;
525     $( "#tasks" ).append( _taskAppend );
526     $( "#t" + _pid ).addClass( "task" ).on({
527         click: function() {
528             if( $(this).hasClass("t-active") || $(this).hasClass("task-min") ) KWS.min( _pid );
529             else{
530                 $("#w"+_pid).css("z-index", KWS.windowIndex + 1);
531                 KWS.refreshWindowIndex();
532             }
533         },
534         mouseenter: function() {
535             $( "#task-ctx-name" ).text( data.name );
536             if( data.icon && data.icon != "none" ) $( "#task-ctx-img" ).attr( "src", System.launchpath[_pid] + "/" + data.icon );
537             else $( "#task-ctx-img" ).hide();
538             $( "#task-ctx-ver" ).text( data.version + "/pid:" + _pid );
539             $( "#task-ctx-info" ).off().on( "click", function() { System.appInfo( _pid )} );
540             $( "#task-ctx-sshot" ).off().on( "click", function() { S.screenshot(_pid, true) } );
541             $( "#task-ctx-min" ).off().on( "click", function() { KWS.min( String(_pid) ) } );
542             if( $(this).hasClass("t-active") ) $( "#task-ctx-front" ).hide();
543             else $( "#task-ctx-front" ).show();
544             $( "#task-ctx-front" ).off().on( "click", function() {
545                 $("#w"+_pid).css("z-index", KWS.windowIndex + 1);
546                 KWS.refreshWindowIndex();
547             } );
548             $( "#task-ctx-close" ).off().on("click", () => System.close(_pid));
549             $( "#task-ctx-kill" ).off().on("click", () => System.kill( data.id));
550             const _ctxleft = $(this).offset().left, _ctxtop = window.innerHeight - $(this).offset().top;
551             if( _ctxleft != $( "#task-ctx" ).offset().left ) $( "#task-ctx" ).hide();
552             $( "#task-ctx" ).css( "left", _ctxleft ).css( "bottom", _ctxtop ).show();
553         }
554     } );
555     $( "section, #kit-tasks" ).on( "mouseenter", function() {
556         $( "#task-ctx" ).fadeOut( 200 );
557     } );
558     $( "#t" + _pid ).on({
559         mouseenter: () => {
560             prevWindowIndex = $( "#w" + _pid ).css( "z-index" );
561             $( "#w" + _pid ).addClass( "win-highlight" );
562         },
563         mouseleave: () => $( "#w" + _pid ).removeClass( "win-highlight" )
564     });
565
566     let _windowAppend = "<div id='w" + _pid + "'><div id='wt" + _pid + "' class='wt'><i class='wmzx'><span id='wm" + _pid + "'></span>";
567     if( data.support && data.support['fullscreen'] == true ) _windowAppend += "<span id='wz" + _pid + "'></span>";
568     _windowAppend += "<span id='wx" + _pid + "'></span></i>";
569     if( data.icon && data.icon != "none" ) _windowAppend += "<img src='" + S.launchpath[_pid] + "/" + data.icon + "'>";
570     _windowAppend += "<span id='wtname" + _pid + "'>" + data.name + "</span></div><div class='winc winc-" + data.id + "' id='winc" + _pid + "'></div></div>";
571     $( "#desktop-" + currentDesktop ).append( _windowAppend );
572
573     if( data.support && data.support['darkmode'] == true ) $("#winc"+_pid).addClass("winc-darkmode");
574     if( KWS.darkmode ) $("#winc"+_pid).addClass("kit-darkmode");
575
576     if( data.size ){
577         $("#winc"+_pid).css("width", data.size.width).css("height", data.size.height);
578     }
579     if( data.resize ){
580         let _minwidth = 200, _minheight = 40;
581         if( data.resize.minWidth ) _minwidth = data.resize.minWidth;
582         if( data.resize.minHeight ) _minheight = data.resize.minHeight;
583         $("#winc"+_pid).windowResizable({
584             minWidth: _minwidth,
585             minHeight: _minheight
586         });
587     }
588
589     let windowPos = 50 + ( _pid % 10 ) * 20;
590     KWS.windowIndex ++;
591     $( "#w"+_pid ).addClass( "window" ).pep({
592         elementsWithInteraction: ".winc, .ui-resizable-handle",
593         useCSSTranslation: false,
594         disableSelect: false,
595         shouldEase:     true,
596         initiate: function(){
597             $(this.el).addClass("ui-draggable-dragging");
598             KWS.windowIndex ++;
599             this.el.style.zIndex = KWS.windowIndex;
600             KWS.refreshWindowIndex();
601         },
602         stop: function(){
603             this.el.style.transition = "none";
604             $(this.el).removeClass("ui-draggable-dragging");
605         }
606     }).on( "mousedown", function(){
607         $(".window").css( "transition", "none" );
608         $(this).css("z-index", KWS.windowIndex + 1);
609         KWS.refreshWindowIndex();
610     } ).css( "left", windowPos + "px" ).css( "top", windowPos + "px" ).css( "z-index",  KWS.windowIndex );
611     KWS.refreshWindowIndex();
612     $( `#wm${_pid}` ).addClass( "wm fa fa-window-minimize" ).on("click", () => KWS.min( _pid ) );
613     $( `#wz${_pid}` ).addClass( "wz fas fa-square" ).on("click", () => KWS.max( _pid ) );
614     $( `#wx${_pid}` ).addClass( "wx fa fa-times" ).on("click", () => System.close( _pid )  );
615     $( "#winc" + _pid ).resizable( {
616         minWidth: "200"
617     } ).load( System.launchpath[_pid] + "/" + data.view, (r, s, x) => {
618         if( s == "error" ){
619             Notification.push("起動に失敗:" + x.status, x.statusText);
620             return false;
621         }
622         if( !data.script || data.script != "none" ) $.getScript( System.launchpath[_pid] + "/" + data.script, () => {
623             if( !data.support || data.support['kaf'] != false ) App.kaf(_pid);
624             pid++;
625         }).fail( () => {
626             App.kaf(_pid);
627             pid++;
628         });
629         else if( !data.support || data.support['kaf'] != false ){
630             App.kaf(_pid);
631             pid++;
632         }
633         else pid++;
634         if( data.css != "none" && $("#kit-style-"+data.id).length == 0 ){
635             $( "head" ).append( '<link href="' + System.launchpath[_pid] + '/' + data.css + '" rel="stylesheet" id="kit-style-' + data.id + '"></link>' );
636         }
637         localStorage.setItem( "kit-pid", pid );
638     } );
639 }
640
641 const System = new function() {
642     this.version = "0.2.1";
643     this.username = localStorage.getItem("kit-username");
644     this.appdir = localStorage.getItem("kit-appdir");
645     this.loc = { ...location };
646
647     this.bootopt = new URLSearchParams(location.search);
648
649     this.mouseX = 0;
650     this.mouseY = 0;
651
652     this.display = {
653         "width": window.innerWidth,
654         "height": window.innerHeight
655     }
656
657     this.selectedElement = null;
658     this.selectedText = null;
659
660     this.dom = function(_pid, ..._elems) {
661         let q = "";
662         if( !_elems.length ) q = ",#winc" + _pid;
663         else for( let i of _elems ){
664             q += ",#winc" + _pid + " " + i;
665         }
666         return $( q.substring(1) );
667     }
668
669     this.qs = ( _pid, ..._elems ) => {
670         let q = "";
671         if( !_elems.length ) q = ",#winc" + _pid;
672         else for( let i of _elems ) q += ",#winc" + _pid + " " + i;
673         return document.querySelectorAll( q.substring(1) )
674     }
675
676     this.userarea = new Object();
677     this.recycle = new Object();
678
679     this.appCache = {};
680     //アプリ引数
681     this.args = {};
682     //アプリ起動パス
683     this.launchpath = {};
684
685     this.support = $.support;
686     this.debugmode = false;
687
688     this.battery = null;
689
690     this.log = new Array();
691     this.noop = () => {}
692
693     this.setBattery = function(){
694         if( navigator.getBattery ) navigator.getBattery().then((e)=>{
695             let _lv =  e.level * 100;
696             System.battery = _lv;
697             return _lv;
698         });
699     }
700
701     this.screenshot = function( _pid, _popup ){
702         let _elem = document.querySelector("body");
703         if( _pid ) _elem = document.querySelector("#w"+_pid);
704         html2canvas( _elem ).then(canvas => {
705             if( _popup ){
706                 canvas.style.border = "1px solid #909090";
707                 S.save( canvas.toDataURL("image/png"), "image" );
708             }
709             return canvas;
710         });
711     }
712
713     this.obj2img = function( _obj, _popup ){
714         let _elem = _obj[0];
715         html2canvas( _elem ).then(canvas => {
716             if( _popup ){
717                 canvas.style.border = "1px solid #909090";
718                 S.save( canvas.toDataURL("image/png"), "image" );
719             }
720             return canvas;
721         });
722     }
723
724     this.save = function(data, type){
725         launch("fivr", { "save" : data, "type" : type });
726     }
727
728     this.open = function(filename){
729         launch("fivr", { "open" : filename });
730     }
731
732     this.preventClose = function( _pid ){
733         if( !process[_pid] ) return false;
734         process[_pid].preventclose = true;
735         return true;
736     }
737     
738     this.shutdown = function(_opt) {
739         $( "#last-notification-close" ).click();
740         $( "#kit-power-back" ).click();
741         for( let i in process ) {
742             if( process[i].preventclose == true ){
743                 S.dialog( "シャットダウンの中断", "pid" + System.appCache[process[i].id].name + "がシャットダウンを妨げています。<br>強制終了してシャットダウンを続行する場合は[OK]を押下してください。", () => {
744                     process[i].preventclose = false;
745                     System.shutdown();
746                 } );
747                 return false;
748             }
749             else System.close( i );
750         }
751         $( "section" ).hide();
752         $( "body" ).css( "background-color", "black" );
753         $( "header, footer" ).fadeOut( 300 );
754         $( "#kit-wallpaper" ).fadeOut( 1500 );
755         if( _opt == "reboot" ) location.href = "autorun.html";
756         localStorage.setItem("kit-shutted-down", true);
757     }
758
759     this.reboot = function() {
760         System.shutdown("reboot");
761     }
762
763     this.lock = function(){
764         System.moveDesktop( "l" );
765
766         $( "#lock-user-icon" ).css( "background", localStorage.getItem( "kit-user-color" ) );
767         $( "section, header, footer" ).css( "filter", "none" );
768         $( "#kit-wallpaper" ).css( "filter", "blur(20px)" );
769         $( "header, footer, #kit-power" ).hide();
770
771         $( "#lock-username" ).text( localStorage.getItem( "kit-username" ) );
772         if( localStorage.getItem( "kit-password" ) ) $( "#lock-password" ).show();
773         else $( "#lock-password" ).hide();
774     }
775
776     this.alert = function( title, content, winname ) {
777         launch( "alert", [title, content, winname] );
778     }
779
780     this.dialog = function( title, content, func ){
781         launch("dialog", {
782             "title": title,
783             "content": content,
784             "func": func
785         })
786     }
787
788     this.appInfo = function( _pid ){
789         let _title = "", _content = "";
790         let ac = System.appCache[process[_pid].id];
791         let _lp = System.launchpath[_pid];
792         if( ac ){
793             _title = ac.name + " " + ac.version;
794             if( ac.icon && ac.icon != "none" ) _content = "<img style='height: 96px' src='" + _lp + "/" + ac.icon + "'><br>";
795             for( let i in ac ){
796                 if( typeof ac[i] != "object" ) _content += "<div><span style='font-weight: 100'>" + i + " </span>" + ac[i] + "</div>";
797             }
798             _content += "<br><span style='font-weight: 100'>起動パス " + _lp + "</span><br><br>"
799         }
800         else _title = "取得に失敗しました";
801         System.alert( _title, _content );
802     }
803
804     this.apps = new Object();
805     this.installed = new Array();
806
807     this.close = function( _str ) {
808         let _pid = String( _str );
809         $( "#w" + _pid ).remove();
810         $( "#t" + _pid ).remove();
811         $( "#task-ctx" ).hide();
812         delete process[_pid];
813         KWS.refreshWindowIndex();
814     }
815
816     this.kill = function( _str ){
817         for( let _pid in process ) {
818             if( process[_pid] && process[_pid].id == _str ) System.close( _pid );
819         }
820     }
821     
822     this.vacuum = function( _left, _top ){
823         KWS.vacuum( _left, _top ); //非推奨です(削除予定)。
824     }
825
826     this.time = {
827         "obj" : new Date(),
828         "y" : "1970",
829         "m" : "1",
830         "d" : "1",
831         "h" : "00",
832         "i" : "00",
833         "s" : "00",
834         "ms" : "0"
835     }
836
837     this.clock = function() {
838         let DD = new Date();
839         S.time.obj = DD;
840         let Year = DD.getFullYear();
841         S.time.day = DD.getDay();
842         S.time.y = Year;
843         let Month = ( "00" + Number(DD.getMonth()+1) ).slice( -2 );
844         S.time.m = Month;
845         let DateN = ( "00" + DD.getDate() ).slice( -2 );
846         S.time.d = DateN;
847         let Hour = ( "00" + DD.getHours() ).slice( -2 );
848         S.time.h = Hour;
849         let Min = ( "00" + DD.getMinutes() ).slice( -2 );
850         S.time.i = Min;
851         let Sec = ( "00" + DD.getSeconds() ).slice( -2 );
852         S.time.s = Sec;
853         $( ".os-time" ).text( Hour + ":" + Min + ":" + Sec );
854         let MS = DD.getMilliseconds();
855         S.time.ms = MS;
856         let circle = {
857             outer: { radius: .9, color: "transparent" },
858             inner: { radius: .85, color: "transparent" }
859         }
860         let lines = {
861             long: { from: .8, to: .7, width: 2, color: "#303030" },
862             short: { from: .8, to: .75, width: 1, color: "#a0a0a0" }
863         }
864         let hands = {
865             hour: { length: .4, width: 3, cap: "butt", color: "#303030", ratio: .2 },
866             minute: { length: .67, width: 2, cap: "butt", color: "#303030", ratio: .2 },
867             second: { length: .67, width: 1, cap: "butt", color: "dodgerblue", ratio: .2 }
868         }
869         let canvas = $(".dropdown-clock-canvas")[0];
870         canvas.width = "200", canvas.height = "200";
871         let context = canvas.getContext("2d");
872         let center = { x: Math.floor(canvas.width / 2), y: Math.floor(canvas.height / 2) };
873         let radius = Math.min(center.x, center.y), angle, len;
874         context.beginPath();context.fillStyle = circle.outer.color;
875         context.arc(center.x, center.y, radius * circle.outer.radius, 0, Math.PI * 2, false);
876         context.fill();context.beginPath();context.fillStyle = circle.inner.color;
877         context.arc(center.x, center.y, radius * circle.inner.radius, 0, Math.PI * 2, false);
878         context.fill();
879         for( let i=0; i<60; i++ ){
880             angle = Math.PI * i / 30;
881             context.beginPath();
882             let line = ( i%5 == 0 ) ? lines.long : lines.short;
883             context.lineWidth = line.width, context.strokeStyle = line.color;
884             context.moveTo(center.x + Math.sin(angle) * radius * line.from, center.y - Math.cos(angle) * radius * line.from)
885             context.lineTo(center.x + Math.sin(angle) * radius * line.to, center.y - Math.cos(angle) * radius * line.to);
886             context.stroke();
887         }
888         angle = Math.PI * ( Number(Hour)+Number(Min)/60 ) / 6, len = radius * hands.hour.length;
889         context.beginPath(), context.lineWidth = hands.hour.width;
890         context.lineCap = hands.hour.cap, context.strokeStyle = hands.hour.color;
891         context.moveTo(center.x - Math.sin(angle) * len * hands.hour.ratio, center.y + Math.cos(angle) * len * hands.hour.ratio);
892         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
893         angle = Math.PI * ( Number(Min)+Number(Sec) / 60) / 30, len = radius * hands.minute.length;
894         context.beginPath(), context.lineWidth = hands.minute.width;
895         context.lineCap = hands.minute.cap, context.strokeStyle = hands.minute.color;
896         context.moveTo(center.x - Math.sin(angle) * len * hands.minute.ratio, center.y + Math.cos(angle) * len * hands.minute.ratio);
897         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
898         angle = Math.PI * Number(Sec) / 30, len = radius * hands.second.length;
899         context.beginPath(), context.lineWidth = hands.second.width;
900         context.lineCap = hands.second.cap, context.strokeStyle = hands.second.color;
901         context.moveTo(center.x - Math.sin(angle) * len * hands.second.ratio, center.y + Math.cos(angle) * len * hands.second.ratio);
902         context.lineTo(center.x + Math.sin(angle) * len, center.y - Math.cos(angle) * len), context.stroke();
903     }
904
905     this.changeWallpaper = function( str ) {
906         $( "#kit-wallpaper" ).css( "background", str ).css( "background-size", "cover" );
907         localStorage.setItem( "kit-wallpaper", str )
908     }
909
910     this.moveDesktop = function( str ) {
911         str = String( str );
912         $( "section" ).hide();
913         $( "#desktop-" + str ).show();
914         $( "#desktops" ).html( "<span class='far fa-clone'></span>Desktop" + str );
915         currentDesktop = str;
916     }
917
918     this.avoidMultiple = function( _pid, _alert ) {
919         let _id = process[_pid].id;
920         let _cnt = 0;
921         for( let i in process ) {
922             if( process[i].id == _id ) _cnt += 1;
923         }
924         Notification.push( "debug", _cnt );
925         if( _cnt > 1 ) {
926             System.close( _pid );
927             if( !_alert ){
928                 System.alert( "多重起動", "アプリケーション" + _id + "が既に起動しています。このアプリケーションの多重起動は許可されていません。" );
929             }
930         }
931         return _cnt;
932     }
933
934     this.resizable = function( _pid, _elem, _width, _height ){
935         let E = ".winc";
936         if( _elem ) E = String( _elem );
937         if( !_width ) _width = null;
938         if( !_height ) _height = "100";
939         $("#w" + _pid).resizable({
940             alsoResize: "#w" + _pid + " " + E,
941             minWidth: _width,
942             minHeight: _height
943         });
944     }
945
946     this.initLauncher = function(data){
947         $("#launcher-apps").html("");
948         System.apps = data;
949         for( let i in data ){
950             $("#launcher-apps").append("<div class='launcher-app' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
951         }
952         if( !System.bootopt.get("safe") ){
953             for( let i of System.installed ){
954                 $("#launcher-apps").append("<div class='launcher-app' data-define-path='" + i.path + "' data-define-id='" + i.id + "'><img src='" + i.icon + "'>" + i.name + "</div>");
955             }
956         }
957         $(".launcher-app").on("click", function(){
958             $("#launch").click();
959             if( $(this).attr("data-launch") ) launch( $(this).attr("data-launch") );
960             else if( $(this).attr("data-define-path") ){
961                 launch( $(this).attr("data-define-id"), null, $(this).attr("data-define-path") );
962             };
963         });
964     }
965
966     this.clip = new function(){
967         this.content = null;
968         this.history = new Array();
969
970         this.set = function( content ){
971             this.content = content;
972             this.history.push(content);
973             return content;
974         }
975         this.get = ()=>{ return this.content }
976     }
977
978     this.config = new function(){
979         this.apps = new Object();
980     }
981
982     this.audio = new function(){
983         this.level = localStorage["kit-audio-level"] || 100;
984         this.silent = false;
985
986         this.list = new Array();
987
988         this.volume = function( _level ){
989             $("#dropdown-sound-slider").slider("value", _level);
990         }
991
992         this.play = function( _audioid, _src ){
993             if( !System.audio.list[_audioid] ){
994                 System.audio.list[_audioid] = new Audio(_src);
995                 System.audio.list[_audioid].volume = System.audio.level / 100;
996             }
997             System.audio.list[_audioid].play();
998         }
999
1000         this.get = function( _audioid ){
1001             return System.audio.list[_audioid];
1002         }
1003
1004         this.pause = function( _audioid ){
1005             System.audio.list[_audioid].pause();
1006         }
1007
1008         this.stop = function( _audioid ){
1009             System.audio.list[_audioid].pause();
1010             System.audio.list[_audioid] = null;
1011         }
1012
1013         this.seek = function( _audioid, _time ){
1014             System.audio.list[_audioid].fastSeek(_time);
1015         }
1016
1017         this.mute = function( _audioid, _bool ){
1018             System.audio.list[_audioid].muted = _bool;
1019         }
1020     }
1021 }
1022
1023 const KWS = new function(){
1024     this.version = "3.2.2";
1025     this.active = null;
1026
1027     this.darkmode = false;
1028
1029     this.changeWindowTitle = function( _pid, _str ){
1030         $("#tname"+_pid).text( _str );
1031         $("#wtname"+_pid).text( _str );
1032     }
1033
1034     this.min = function( _str ) {
1035         let _pid = String( _str );
1036         if( $( "#w" + _pid ).is( ":visible" ) ) {
1037             $( "#w" + _pid ).css("transition", "none").hide( "drop", {direction: "down"}, 300 );
1038             $( "#task-ctx" ).effect( "bounce", {distance: 12, times: 1}, 400 );
1039             $( "#t" + _pid ).addClass( "task-min" );
1040         }
1041         else {
1042             $( "#w" + _pid ).show( "drop", {direction: "down"}, 300 );
1043             $( "#task-ctx" ).effect( "bounce", {distance: 12, times: 1}, 400 );
1044             $( "#t" + _pid ).removeClass( "task-min" );
1045         }
1046     }
1047
1048     this.fullscreen = {
1049         "pid": null,
1050         "prevWidth": null,
1051         "prevHeight": null,
1052         "prevTop": 0,
1053         "prevLeft": 0
1054     }
1055
1056     this.max = function( _pid ){
1057         if( KWS.fullscreen.pid ){
1058             Notification.push("最大化に失敗", "最大化しているウィンドウがあります。");
1059             return;
1060         }
1061         $( "#wt"+_pid ).addClass("wtmaximize");
1062         $( "#w"+_pid ).css({
1063             "top": "0px",
1064             "left": "0px"
1065         })
1066         .addClass("windowmaximize")
1067         .css("z-index", KWS.windowIndex + 1);
1068         KWS.refreshWindowIndex();
1069
1070         KWS.fullscreen.prevWidth = $("#winc"+_pid).outerWidth();
1071         KWS.fullscreen.prevHeight = $("#winc"+_pid).outerHeight();
1072         KWS.fullscreen.prevTop = $("#w"+_pid).offset().top;
1073         KWS.fullscreen.prevLeft = $("#w"+_pid).offset().left;
1074
1075         KWS.resize( _pid, System.display.width, System.display.height - 30 );
1076         $("footer").hide();
1077         $("#kit-header-fullscreen").show().on("click", () => {
1078             KWS.unmax( _pid );
1079         });
1080         KWS.fullscreen.pid = _pid;
1081     }
1082
1083     this.unmax = function( _pid ){
1084         if( _pid != KWS.fullscreen.pid ){
1085             Notification.push("最大化解除に失敗", "対象がフルスクリーンウィンドウではありません。");
1086             return;
1087         }
1088         $( "#wt"+_pid ).removeClass("wtmaximize");
1089         $( "#w"+_pid ).css({
1090             "top": KWS.fullscreen.prevTop,
1091             "left": KWS.fullscreen.prevLeft
1092         })
1093         .removeClass("windowmaximize");
1094         $("footer").show();
1095         $("#kit-header-fullscreen").hide().off();
1096         KWS.resize( _pid, KWS.fullscreen.prevWidth, KWS.fullscreen.prevHeight );
1097         KWS.fullscreen.pid = null;
1098         KWS.fullscreen.prevWidth = null;
1099         KWS.fullscreen.prevHeight = null;
1100         KWS.fullscreen.prevTop = null;
1101         KWS.fullscreen.prevLeft = null;
1102     }
1103
1104     this.vacuum = function( _left, _top ){
1105         for( let i in process ){
1106             $("#w"+i).css("transition", ".5s all ease").css("left", _left ).css("top", _top );
1107         }
1108         setTimeout(() => {
1109             $(".window").css("transition", "none");
1110         }, 500);
1111     }
1112
1113     this.active = null;
1114     this.windowIndex = 1;
1115
1116     this.refreshWindowIndex = function(){
1117         let num = $(".window").length;
1118         let array = new Array();
1119         let obj = new Object();
1120         for( let i = 0; i < num; i++ ){
1121             obj = { id: $(".window")[i].id, zindex: $(".window")[i].style.zIndex };
1122             array.push( obj );
1123         };
1124         array.sort( (a,b) => {
1125             return Number(a.zindex - b.zindex);
1126         } );
1127         for( let i in array ){
1128             document.getElementById(array[i].id).style.zIndex = i;
1129             if( i == num-1 ){
1130                 $("#"+array[i].id).addClass("windowactive");
1131                 $("#t"+String(array[i].id).substring(1)).addClass("t-active");
1132                 KWS.active = String(array[i].id).substring(1);
1133                 process[array[i].id.substring(1)].isactive = true;
1134             }
1135             else{
1136                 $("#"+array[i].id).removeClass("windowactive");
1137                 $("#t"+String(array[i].id).substring(1)).removeClass("t-active");
1138                 process[array[i].id.substring(1)].isactive = false;
1139             }
1140         }
1141         KWS.windowIndex = num;
1142     }
1143
1144     this.front = function( _pid ) {
1145         $(`#w${_pid}`).css("z-index", KWS.windowIndex + 1);
1146         KWS.refreshWindowIndex();
1147     }
1148
1149     this.resize = function( _pid, _width, _height ){
1150         if( _width ) $("#winc"+_pid).css("width", _width)
1151         if( _height ) $("#winc"+_pid).css("height", _height);
1152     }
1153
1154     this.fusen = new function(){
1155         this.fid = 0;
1156         this.list = new Object();
1157
1158         this.add = function(_text){
1159             KWS.fusen.list[KWS.fusen.fid] = String(_text);
1160             $("#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+"' kit-context='fusen'>"+_text+"</textarea></div>");
1161             $("#kit-f"+KWS.fusen.fid).css({
1162                 "left": Number(KWS.fusen.fid)*40 + 20,
1163                 "top": Number(KWS.fusen.fid)*10 + 100,
1164             }).pep({
1165                 elementsWithInteraction: ".kit-fusen-textarea",
1166                 useCSSTranslation: false,
1167                 disableSelect: false,
1168                 shouldEase:     true,
1169                 initiate: function(){
1170                     $(this.el).css("ui-opacity", "0.7");
1171                 },
1172                 stop: function(){
1173                     this.el.style.transition = "none";
1174                     $(this.el).css("ui-opacity", "1.0");
1175                 }
1176             })
1177             $(".kit-fusen-textarea").off().on("change",function(){
1178                 Notification.push($(this).attr("data-fid"), $(this).val(), "debug");
1179                 KWS.fusen.list[$(this).attr("data-fid")] = $(this).val();
1180                 localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1181             });
1182             localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1183             KWS.fusen.fid++;
1184         }
1185
1186         this.remove = function(_fid){
1187             delete KWS.fusen.list[_fid];
1188             localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
1189             $("#kit-f"+_fid).remove();
1190         }
1191     }
1192
1193     this.addCustomContext = function( _elem, _contextid, _obj ){
1194         KWS.context[_contextid] = _obj;
1195     }
1196
1197     this.context = {
1198         "fusen" : {
1199             "name" : "ふせん",
1200             "delete" : {
1201                 "label" : "ふせんを削除",
1202                 "icon" : "fa-trash-alt",
1203                 "function" : function(){
1204                     KWS.fusen.remove( S.selectedElement.attr("data-fid") );
1205                 }
1206             },
1207             "copy" : {
1208                 "label" : "ふせんを複製",
1209                 "icon" : "fa-copy",
1210                 "function" : function(){
1211                     KWS.fusen.add( KWS.fusen.list[S.selectedElement.attr("data-fid")] );
1212                 }
1213             }
1214         }
1215     }
1216 }
1217
1218 const Notification = new function() {
1219     this.nid = 0;
1220     this.list = new Object();
1221
1222     this.goodnight = false;
1223     this.sound = null;
1224
1225     this.push = function( _title, _content, _app, _pid, _action, _img, _buttons ) {
1226         let _nid = this.nid;
1227         if( !System.debugmode && ( _title == "debug" || _app == "debug" ) ){
1228             return false;
1229         }
1230         Notification.list[_nid] = {
1231             title: _title,
1232             content: _content,
1233             app: _app,
1234             time: System.time.obj.toLocaleString(),
1235             pid: _pid,
1236             action: () => {
1237                 if( typeof _action == 'function' ) _action();
1238                 else if( _pid ) KWS.front(_pid);
1239                 $('#notifications').hide('drop', {direction: 'right'}, 300);
1240             },
1241             img: _img
1242         };
1243         if( _pid && System.appCache[_app] ){
1244             _app = `<img src='${System.launchpath[_pid]}/${System.appCache[_app].icon}'>${_app}`;
1245         }
1246         if( !this.goodnight ){
1247             if( this.sound ) System.audio.play( "n" + this.nid, this.sound );
1248             $('#last-notification-title').text('').text( _title );
1249             $('#last-notification-content').text('').text( _content );
1250             $('#last-notification-app').text('').html( _app );
1251             $('#last-notification').hide().show('drop', {direction: "right"}, 300).off().on('click', Notification.list[this.nid].action);
1252             if( _img ) $('#last-notification-img').attr('src', _img).show();
1253             else $('#last-notification-img').attr('src', '').hide();
1254         }
1255         let imgtag = '';
1256         if( _img ) imgtag = `<img src='${_img }' alt='' class='notis_img'>`;
1257         $(`<div class='notis' id='nt${_nid}'>
1258                 ${imgtag}
1259                 <span class='notis_close' id='nc${_nid}'></span>
1260                 <div class='notis_app'>${_app}</div>
1261                 <span>${_title}</span>
1262                 ${_content}
1263                 <div class='notis_buttons'></div>
1264                 <div class='notis_time'>${System.time.obj.toTimeString()}</div>
1265             </div>`).appendTo('#notifications').on('click', Notification.list[this.nid].action);
1266         $(`#nc${_nid}`).on('click', (e) => {
1267             e.stopPropagation();
1268             $(`#nt${_nid}`).fadeOut(300);
1269         });
1270         $('#last-notification-buttons').html('');
1271         if( _buttons ){
1272             for( let b of _buttons ){
1273                 $(`<a>${b.label}</a>`).appendTo('#last-notification-buttons').on('click', (e) => {
1274                     e.stopPropagation();
1275                     b.func();
1276                 });
1277                 $(`<a>${b.label}</a>`).appendTo(`#nt${_nid} .notis_buttons`).on('click', (e) => {
1278                     e.stopPropagation();
1279                     b.func();
1280                 });
1281             }
1282         }
1283         this.nid ++;
1284         return (this.nid - 1);
1285     }
1286 }
1287
1288 class App {
1289     constructor(_pid) {
1290         App.e[_pid] = new Object();
1291         App.d[_pid] = new Object();
1292         
1293         this.process = process[_pid];
1294         this.info = System.appCache[process[_pid].id];
1295
1296         this.args = System.args[_pid];
1297         this.close = () => System.close(_pid);
1298         this.d = App.d[_pid];
1299         this.dom = (..._args) => System.dom(_pid, ..._args);
1300         this.e =  App.e[_pid];
1301         this.ntf = (_title, _content, _action, _img, _buttons) => Notification.push(_title, _content, this.info.id, _pid, _action, _img, _buttons);
1302         this.qs = (...args) => System.qs(_pid, ...args);
1303         this.front = () => KWS.front(_pid);
1304
1305         this.changeWindowTitle = _t => App.changeWindowTitle( _pid, _t );
1306         this.data = (_name, _value) => App.data(_pid, _name, _value);
1307         this.event = (_name, _event) => App.event(_pid, _name, _event);
1308         this.getPath = _path => App.getPath(_pid, _path);
1309         this.kaf = () => App.kaf(_pid);
1310         this.load = _path => App.load(_pid, _path);
1311         this.preventClose = _bool => App.preventClose(_pid, _bool);
1312     }
1313
1314     static changeWindowTitle( _pid, _t ) {
1315         $( "#tname"+_pid ).text( _t );
1316         $( "#wtname"+_pid ).text( _t );
1317         process[_pid].title = _t;
1318         return App;
1319     }
1320
1321     static context( _cid, _obj ) {
1322         KWS.context[ _cid ] = _obj;
1323         return App;
1324     }
1325
1326     static data( _pid, _name, _value ) {
1327         if( _value !== undefined ) {
1328             S.dom(_pid, `[kit\\:bind=${_name}]`).val( _value );
1329             S.dom(_pid, `[kit\\:observe=${_name}]`).text( _value );
1330             if( _value ) S.dom(_pid, `[kit\\:if=${_name}]`).show();
1331             else S.dom(_pid, `[kit\\:if=${_name}]`).hide();
1332             return App.d[_pid][_name] = _value;
1333         }
1334         else if( _name ) return App.d[_pid][_name];
1335         else return App.d[_pid];
1336     }
1337
1338     static event( _pid, _name, _event ) {
1339         if( !App.e[_pid] ) App.e[_pid] = new Object();
1340         App.e[_pid][_name] = _event;
1341         return App;
1342     }
1343
1344     static getPath( _pid, _path ) {
1345         return System.launchpath[_pid] + _path;
1346     }
1347
1348     static kaf( _pid ) {
1349         let attrs = [
1350             "[kit-ref]",
1351             "[kit-e]",
1352             "[kit-src]",
1353             "[kit-alert]",
1354             "[kit-launch]",
1355             "[kit-close]",
1356             "[kit-text]",
1357             "[kit-html]",
1358             "[kit\\:bind]",
1359             "[kit\\:observe]",
1360             "[kit\\:value]",
1361             "[kit-value]",
1362             "[kit-color]",
1363             "[kit\\:if]",
1364             "[kit-if]"
1365         ]
1366         const PID = _pid;
1367         const DATA = App.data(_pid);
1368         const ARGS = System.args[_pid];
1369         for( let i of S.qs(_pid, ...attrs) ){
1370             if( i.hasAttribute("kit-ref") ){
1371                 $(i).on("click", () => App.load(_pid, i.getAttribute("kit-ref")) );
1372             }
1373             if( i.hasAttribute("kit-e") ){
1374                 let _eqs = i.getAttribute("kit-e").split(",");
1375                 for( let k of _eqs ){
1376                     let _eq = k.split(" ");
1377                     $(i).on( _eq[1]||"click", App.e[_pid][_eq[0]] );
1378                 }
1379             }
1380             if( i.hasAttribute("kit-src") ){
1381                 $(i).attr("src", `${System.launchpath[_pid]}/${i.getAttribute("kit-src")}` );
1382             }
1383             if( i.hasAttribute("kit-alert") ){
1384                 $(i).on("click", ()=> System.alert( System.appCache[ process[_pid].id ].name, i.getAttribute("kit-alert") ) );
1385             }
1386             if( i.hasAttribute("kit-launch") ){
1387                 $(i).on("click", ()=> launch( i.getAttribute("kit-launch") ) );
1388             }
1389             if( i.hasAttribute("kit-close") ){
1390                 $(i).on("click", ()=> System.close( i.getAttribute("kit-close") || _pid ) );
1391             }
1392             if( i.hasAttribute("kit-text") ){
1393                 $(i).text( eval(i.getAttribute("kit-text")) );
1394             }
1395             if( i.hasAttribute("kit-html") ){
1396                 $(i).html( eval(i.getAttribute("kit-html")) );
1397             }
1398             if( i.hasAttribute("kit:bind") ){
1399                 if( App.d[_pid] == undefined ) App.d[_pid] = new Object();
1400                 $(i).on('keydown keyup keypress change', () => {
1401                     let _name = i.getAttribute("kit:bind");
1402                     App.d[_pid][_name] = i.value;
1403                     S.dom(_pid, `[kit\\:observe=${_name}]`).text( i.value );
1404                     if( i.value ) S.dom(_pid, `[kit\\:if=${_name}]`).show();
1405                     else S.dom(_pid, `[kit\\:if=${_name}]`).hide();
1406                 } );
1407             }
1408             if( i.hasAttribute("kit:observe") ){
1409                 $(i).text( App.d[_pid][i.getAttribute("kit:observe")] );
1410             }
1411             if( i.hasAttribute("kit:value") ){
1412                 $(i).val( App.d[_pid][i.getAttribute("kit:value")] );
1413             }
1414             if( i.hasAttribute("kit-value") ){
1415                 $(i).val( eval(i.getAttribute("kit-value")) );
1416             }
1417             if( i.hasAttribute("kit-color") ){
1418                 $(i).css('color', i.getAttribute("kit-color"));
1419             }
1420             if( i.hasAttribute("kit:if") ){
1421                 if( App.d[_pid][i.getAttribute("kit:if")] ){
1422                     $(i).show();
1423                 }
1424                 else $(i).hide();
1425             }
1426             if( i.hasAttribute("kit-if") ){
1427                 if( eval( i.getAttribute("kit-if")) ){
1428                     $(i).show();
1429                 }
1430                 else $(i).hide();
1431             }
1432         }
1433     }
1434
1435     static load( _pid, _path ) {
1436         S.dom(_pid).load( System.launchpath[_pid] +"/"+ _path, () => {
1437             App.kaf(_pid);
1438         } );
1439         return App;
1440     }
1441
1442     static preventClose( _pid, _bool = true ) {
1443         process[_pid].preventclose = _bool || true;
1444         return App;
1445     }
1446 }
1447
1448 App.d = new Object();
1449 App.e = new Object();
1450 App.version = "2.1.1";
1451
1452 var process = {}, pid = 0, app, currentDesktop = 1, currentCTX = "", prevWindowIndex, S;