OSDN Git Service

Merge pull request #103 from mtsgi/feature/kit-disabled-kaf
[kit/kit.git] / system.js
index 3978348..b8f6871 100644 (file)
--- a/system.js
+++ b/system.js
@@ -6,7 +6,7 @@
 //  |   <| | |_ 
 //  |_|\_\_|\__|
 //
-// THIS IS THE KIT KERNEL AND KIT WINDOW SYSTEM
+// THIS IS THE KIT KERNEL, KIT APPS FRAMEWORK AND KIT WINDOW SYSTEM
 // http://web.kitit.ml/
 // https://github.com/mtsgi/kit
 
@@ -16,8 +16,7 @@ $( document ).ready( kit );
 function kit() {
     S = System;
 
-    if( !localStorage.getItem( "kit-pid" ) ) processID = 0;
-    else processID = localStorage.getItem( "kit-pid" );
+    if( localStorage.getItem( "kit-pid" ) ) pid = localStorage.getItem( "kit-pid" );
 
     if( !localStorage.getItem( "kit-username" ) ) localStorage.setItem( "kit-username", "ユーザー" );
     $( "#kit-header-username" ).text( localStorage.getItem( "kit-username" ) );
@@ -53,7 +52,9 @@ function kit() {
     if( !localStorage.getItem( "kit-appdir" ) ) localStorage.setItem( "kit-appdir", "./app/" );
     S.appdir = localStorage.getItem( "kit-appdir" );
 
-    if( localStorage.getItem( "kit-installed" ) ) System.installed = JSON.parse( localStorage.getItem( "kit-installed" ) );
+    if( localStorage.getItem('kit-installed') ) System.installed = JSON.parse( localStorage.getItem('kit-installed') );
+
+    if( localStorage.getItem('kit-screentime') ) KWS.screenTime = JSON.parse( localStorage.getItem('kit-screentime') );
 
     if( localStorage["kit-userarea"] ) System.userarea = JSON.parse(localStorage["kit-userarea"]);
     if( localStorage["kit-recycle"] ) System.recycle = JSON.parse(localStorage["kit-recycle"]);
@@ -64,8 +65,18 @@ function kit() {
     if( System.bootopt.get("safe") ) clockmove = setInterval( System.clock, 1000 );
     else  clockmove = setInterval( System.clock, 10 );
 
-    Notification.push( "kitへようこそ", localStorage["kit-username"] + "さん、こんにちは。", "system" );
-    //スタートアップ
+    if ( localStorage.getItem("kit-shutted-down") == "false" ) {
+        Notification.push("お知らせ", "kitは前回終了時、正しくシャットダウンされませんでした。", "system");
+    }
+    localStorage.setItem("kit-shutted-down", false);
+
+    Notification.push("kitへようこそ", localStorage["kit-username"] + "さん、こんにちは。", "system", null, null, 'documents/icon.png', [
+        {
+            label: 'kitについて',
+            func: () => System.launch( 'settings', {'view': 'about'} )
+        }
+    ]);
+
     if( localStorage.getItem( "kit-startup" ) == undefined ) {
         localStorage.setItem( "kit-startup", new Array( "welcome" ) );
     }
@@ -74,7 +85,7 @@ function kit() {
         Notification.push( "セーフブート", "現在、kitをセーフモードで起動しています。", "system" );
         System.alert( "セーフブート", "現在、kitをセーフモードで起動しています。<br><a class='kit-hyperlink' onclick='System.reboot()'>通常モードで再起動</a>", "system" );
     }
-    else for( let i of System.startup ) if( i != "" ) launch( i );
+    else for( let i of System.startup ) if( i != "" ) System.launch(i);
     
     $("#kit-header-fullscreen").hide();
 
@@ -96,26 +107,37 @@ function kit() {
             $( "#kit-tasks" ).html( $( "#tasks" ).html() ).fadeIn( 300 ).css( "z-index", "9997" );
         }
     } );
-    //デスクトップアイコン
+    $.getJSON("system/testload.json").fail( () => {
+        $('#body').append(`<div id='wcors' class="window windowactive" style="top: 70px; left: 50px; width: calc(100% - 100px)">
+            <div class="wt">問題が発生しました</div>
+            <div class="winc">JSONデータ読み込みに失敗しました。<br>
+            クロスオリジン制約によりkitアプリケーションの動作が制限されている場合があります。<br>
+            詳細は<a class="kit-hyperlink" onclick="location.href = 'https://mtsgi.github.io/kitdocs/#/cors'">こちらの記事</a>をご確認ください。</div>
+        </div>`);
+        $('<kit-button-alt class="kit-block kit-text-c m">閉じる</kit-button-alt>').appendTo('#wcors .winc').on('click', ()=>{
+            $('#wcors').remove();
+        })
+    });
+    
     $.getJSON("config/desktop.json", (data) => {
         for( let i in data ){
             $(".desktop-icons").append("<div class='desktop-icon' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
         }
         $(".desktop-icon").on("click", function(){
-            launch( $(this).attr("data-launch") );
+            System.launch( $(this).attr("data-launch") );
         });
     }).fail( function() {
-        Notification.push( "読み込みに失敗", "デスクトップ(config/desktop.json)の読み込みに失敗しました。", system );
+        Notification.push( "読み込みに失敗", "デスクトップ(config/desktop.json)の読み込みに失敗しました。", "system" );
     } );
-    //ランチャー
+    
     $.getJSON("config/apps.json", System.initLauncher).fail( function() {
-        Notification.push( "ランチャー初期化失敗", "アプリケーション一覧(config/apps.json)の読み込みに失敗しました。", system );
+        Notification.push( "ランチャー初期化失敗", "アプリケーション一覧(config/apps.json)の読み込みに失敗しました。", "system" );
     } );
     $( "#kit-tasks" ).delegate( ".task", "click", function() {
         System.close( this.id.slice( 1 ) );
         $( this ).hide();
     } );
-    //通知バー
+    
     $( "#footer-noti" ).click( function() {
         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
         if( $( "#notifications" ).is( ":visible" ) ) {
@@ -134,12 +156,12 @@ function kit() {
         }
         else Notification.goodnight = false;
     });
-    //電源管理
+    
     $( ".power-button" ).click( function() {
         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
         $( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
         $( "#kit-wallpaper" ).css( "filter", "blur(5px)" );
-        $( "footer, header, #desktop-" + currentDesktop ).hide();
+        $( "footer, header, #launcher, #task-ctx, #kit-sightre, .dropdown, #desktop-" + currentDesktop ).hide();
         $( "#kit-power" ).show();
     } );
     $( "#kit-power-back" ).click( function() {
@@ -154,6 +176,7 @@ function kit() {
         System.reboot();
     } );
     $( "#kit-power-suspend" ).click( function() {
+        location.reload();
         $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
         $( "#kit-power" ).fadeOut( 300 );
         System.alert("サスペンド機能", "サスペンド機能はこのバージョンのkitではサポートされていません。");
@@ -161,10 +184,10 @@ function kit() {
     $( "#kit-power-lock" ).click( function() {
         System.lock();
     } );
-    $( "#lock-password" ).keypress( function( e ) {
+    $( "#lock-password" ).on( 'keypress', function( e ) {
         if( e.which == 13 ) $( "#lock-unl" ).click();
     } );
-    $( "#lock-unl" ).click( function() {
+    $( "#lock-unl" ).on( 'click', function() {
         if( !localStorage.getItem( "kit-password" ) || $( "#lock-password" ).val() == localStorage.getItem( "kit-password" ) ) {
             $( "header, footer" ).show();
             $( "section, header, footer, #kit-wallpaper" ).css( "filter", "none" );
@@ -177,7 +200,7 @@ function kit() {
     }, function() {
         $( "#lock-unl span" ).removeClass( "fa-lock-open" ).addClass( "fa-lock" );
     } );
-    //ランチャー起動
+    
     $( "#launch" ).click( function() {
         $( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
         if( $( "#launcher" ).is( ":visible" ) ) {
@@ -187,46 +210,149 @@ function kit() {
         }
         else {
             $( "#kit-wallpaper" ).css( "filter", "blur(5px)" )
-            $( "section" ).hide();
+            $( "section, #task-ctx" ).hide();
             $( "#launcher" ).show();
         }
     } );
 
-    //検索バー
-    $( "#milp" ).val( "" ).on( "focus", function() {
-        $( "#kit-milp" ).show();
-    } ).on( "blur", function() {
-        $( "#kit-milp" ).fadeOut( 200 );
-    } ).on( 'keydown keyup keypress change', function() {
-        $( "#kit-milp-text" ).text( $( this ).val() );
-    } ).keypress( function( e ) {
-        if( e.which == 13 ) $( "#kit-milp-launch" ).click();
-    } );
-    $( "#kit-milp-launch" ).click( function() {
-        if( $("#milp").val() == "kit" ){
-            System.alert("", "<div style='text-align:left;'> _    _ _ <br>| | _(_) |_ <br>| |/ / | __|<br>|   〈| | |_ <br>|_|\_ \ _\__|</div><hr>", S.version);
-            return;
+    //Sightre
+    $('#kit-header-sightre').on('click', () => {
+        if($('#kit-sightre').is( ":visible" )) {
+            $('#kit-sightre').fadeOut(300);
+        }
+        else {
+            $('#kit-sightre-results').html('');
+            $('#kit-sightre').show();
+            $('#kit-sightre-form').val('').focus();
         }
-        let _app = $( "#milp" ).val().split(",")[0];
-        let _args = null;
-        try {
-            if( $( "#milp" ).val().split(",")[1] ){
-                _args = JSON.parse( $( "#milp" ).val().split(",").slice(1).join() );
+    });
+    let sightrePrevWord = '';
+    $('#kit-sightre-form').on('keypress', (e) => {
+        let _word = $('#kit-sightre-form').val();
+        if( e.which == 13 && _word ) {
+            if( _word == "kit" ){
+                S.alert("", "<div style='text-align:left;'> _    _ _ <br>| | _(_) |_ <br>| |/ / | __|<br>|   〈| | |_ <br>|_|\_ \ _\__|</div><hr>", S.version);
+                return;
             }
+            $('.kit-sightre-result.-first').click();
+            sightrePrevWord = '';
+            $('#kit-sightre-form').val('');
+            $('#kit-sightre-results').html('');
+            $('#kit-sightre').fadeOut(300);
         }
-        catch(error) {
-            Notification.push("引数の解釈に失敗", error, "system");
+    }).on('keydown keyup change', (e) => {
+        let _word = $('#kit-sightre-form').val();
+        if( e.which == 27 ) $('#kit-sightre').fadeOut(300);
+        else {
+            if( _word == sightrePrevWord ) return;
+            $('#kit-sightre-results').html('');
+            if( !_word ) return;
+            sightrePrevWord = _word;
+            if( _word.indexOf('kish ') == 0 || _word.indexOf('🥧 ') == 0 ){
+                let _cmd = _word.substring( _word.indexOf(" ") + 1 );
+                if( _cmd ){
+                    $(`<div class='kit-sightre-result -first'>
+                            <img class='--icon' src='app/kish/icon.png'/>
+                            <div class='--info'>
+                                <div class='--name'>${_cmd}</div>
+                                <div class='--desc'>kishでコマンドを実行</div>
+                            </div>
+                            <div class='--open fa fa-arrow-right'></div>
+                        </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                            System.launch('kish', { 'rc': [ _cmd ] });
+                    });
+                }
+            }
+            else if( _word.indexOf('http://') == 0 || _word.indexOf('https://') == 0 || _word.indexOf('localhost') == 0 ){
+                $(`<div class='kit-sightre-result -first'>
+                        <img class='--icon' src='app/browser/icon.png'/>
+                        <div class='--info'>
+                            <div class='--name'>${_word}</div>
+                            <div class='--desc'>ブラウザでURLを開く</div>
+                        </div>
+                        <div class='--open fa fa-arrow-right'></div>
+                    </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                        System.launch( localStorage.getItem('kit-default-browser'), { "url" : _word } );
+                });
+            }
+            else {
+                $(`<div class='kit-sightre-result -first'>
+                        <img class='--icon' src='system/icons/q.png'/>
+                        <div class='--info'>
+                            <div class='--name'>${_word}</div>
+                            <div class='--desc'>アプリを起動する</div>
+                        </div>
+                        <div class='--open fa fa-arrow-right'></div>
+                    </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                        let _args = null;
+                        try {
+                            if( _word.split(",")[1] ) _args = JSON.parse( _word.split(",").slice(1).join().trim() );
+                        }
+                        catch(error) {
+                            Notification.push("引数の解釈に失敗", error, "system");
+                        }
+                        System.launch( _word.split(",")[0], _args );
+                });
+            }
+            for( let i in System.apps ){
+                if( i.indexOf(_word) == 0 || S.apps[i].name.indexOf(_word) == 0 ){
+                    $(`<div class='kit-sightre-result -app'>
+                            <img class='--icon' src='${S.apps[i].icon}'/>
+                            <div class='--info'>
+                                <div class='--name'>${S.apps[i].name}</div>
+                                <div class='--desc'>kitアプリケーション - ${i}</div>
+                            </div>
+                            <div class='--open fa fa-arrow-right'></div>
+                        </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                        System.launch(i);
+                        $('#kit-sightre-results').html('');
+                        $('#kit-sightre').fadeOut(300);
+                    });
+                }
+            }
+            for( let i in System.userarea ){
+                if( i.indexOf(_word) == 0 || i.indexOf(_word) == 0 ){
+                    $(`<div class='kit-sightre-result -file'>
+                            <i class="fa fa-file --icon"></i>
+                            <div class='--info'>
+                                <div class='--name'>${i}</div>
+                                <div class='--desc'>ファイル - 種類:${S.userarea[i].type} - ユーザー:${System.username}</div>
+                            </div>
+                            <div class='--open fa fa-arrow-right'></div>
+                        </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                        System.open(i);
+                        $('#kit-sightre-results').html('');
+                        $('#kit-sightre').fadeOut(300);
+                    });
+                }
+            }
+            $(`<div class='kit-sightre-result -link'>
+                    <i class="fa fa-search --icon"></i>
+                    <div class='--info'>
+                        <div class='--name'>${_word}</div>
+                        <div class='--desc'>をWebで検索</div>
+                    </div>
+                    <div class='--open fa fa-arrow-right'></div>
+                </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                System.launch( 'browser', { 'url' : 'https://www.bing.com/search?q=' + _word } );
+                $('#kit-sightre-results').html('');
+                $('#kit-sightre').fadeOut(300);
+            });
+            $(`<div class='kit-sightre-result -link'>
+                    <i class="fab fa-wikipedia-w --icon"></i>
+                    <div class='--info'>
+                        <div class='--name'>${_word}</div>
+                        <div class='--desc'>wikipediaの記事を表示</div>
+                    </div>
+                    <div class='--open fa fa-arrow-right'></div>
+                </div>`).appendTo('#kit-sightre-results').on('click', () => {
+                System.launch( 'browser', { 'url' : 'https://ja.wikipedia.org/wiki/' + _word } );
+                $('#kit-sightre-results').html('');
+                $('#kit-sightre').fadeOut(300);
+            });
         }
-        launch( _app, _args );
-    } );
-    $( "#kit-milp-search" ).click( function() {
-        launch( "browser", { "url" : "https://www.bing.com/search?q=" + $( "#milp" ).val() } );
-    } );
-    $( "#kit-milp-wikipedia" ).click( function() {
-        launch( "browser", { "url" : "https://ja.wikipedia.org/wiki/" + $( "#milp" ).val() } );
-    } );
+    });
 
-    //サウンドドロップダウン
     $("#dropdown-sound-slider").slider({
         min: 0, max: 100, step: 1, value: 100,
         change: (e, ui) => {
@@ -253,11 +379,8 @@ function kit() {
         }
     });
 
-    $("#kit-header-user").on("click", ()=>{
-        launch("user");
-    });
+    $('#kit-header-user').on('click', () => System.launch('user') );
 
-    //コンテキストメニュー
     $(":root section:not(#desktop-l)").on("contextmenu", function() {
         let _ptelem = $( document.elementFromPoint(S.mouseX, S.mouseY) );
         S.selectedElement = _ptelem;
@@ -276,7 +399,7 @@ function kit() {
         $( "#kit-context-elem" ).text( _ptelem.prop("tagName").toLowerCase() + "要素" );
         $("#kit-contextgroup-custom").hide();
 
-        let  _ctxid = _ptelem.attr("data-kit-contextid");
+        let  _ctxid = _ptelem.attr("data-kit-contextid") || _ptelem.attr("kit-context");
         if( _ctxid ){
             $("#kit-contextgroup-custom").show().html('<div id="kit-context-custom"></div>');
             let  _ctxname = KWS.context[_ctxid].name || _ctxid; 
@@ -303,7 +426,7 @@ function kit() {
     });
     $( "#kit-context-search" ).on("click", function(){
         $("#kit-context").fadeOut(300);
-        launch( "browser", { "url" : "https://www.bing.com/search?q=" + $( "#kit-context-input" ).val() } );
+        System.launch( 'browser', {'url': `https://www.bing.com/search?q=${$('#kit-context-input').val()}`} );
     });
     $( "#kit-context-input" ).keypress( function( e ) {
         if( e.which == 13 ) $( "#kit-context-search" ).click();
@@ -328,15 +451,15 @@ function kit() {
         $("#kit-context").fadeOut(300);
     })
 
-    $( document ).delegate( "a", "click", function() {
+    $( document ).delegate('a', 'click', function() {
         if( this.href ) {
-            launch( localStorage.getItem( "kit-default-browser" ), { "url" : this.href } );
+            System.launch( localStorage.getItem( "kit-default-browser" ), { "url" : this.href } );
             return false;
         }
-    } ).on("mousemove", function(event){
-        System.mouseX = event.clientX;
-        System.mouseY = event.clientY;
-    }).delegate( ".textbox", "keypress", function( e ) {
+    } ).on("mousemove", function(e){
+        System.mouseX = e.clientX;
+        System.mouseY = e.clientY;
+    }).delegate('.textbox', 'keypress', function(e) {
         if( e.which == 13 && this.id ){
             if( $("#" + this.id + " + .kit-button").length ){
                 Notification.push("debug", this.id, "system");
@@ -364,108 +487,156 @@ function kit() {
     }
 }
 
-function launch( str, args, dir ) {
-    pid = processID;
-    System.args[pid] = args;
-    System.launchpath[pid] = dir || System.appdir + str;
+async function launch( str, args, dir ) {
+    while(System.launchLock) await System.ajaxWait();
+    System.launchLock = true;
+
+    let _pid = pid;
+    System.args[_pid] = args;
+    let _path = dir || System.appdir + str;
+    System.launchpath[_pid] = _path;
 
-    if( System.appCache[str] ) {
+    if( System.appCache[_path] ) {
         if( KWS.fullscreen.pid ) KWS.unmax(KWS.fullscreen.pid);
-        //app[str].open();
-        appData( System.appCache[str] );
+        appData( System.appCache[_path] );
     }
     else {
         try{
-            $.getJSON( S.launchpath[pid] + "/define.json", appData ).fail( function() {
-                System.alert( "起動エラー", "アプリケーションの起動に失敗しました<br>アプリケーション" + str + "は存在しないかアクセス権がありません(pid:" + processID + ")。ヘルプは<a class='kit-hyperlink' href='https://kitdev.home.blog/'>こちら</a>" );
+            $.getJSON( S.launchpath[_pid] + '/define.json', appData ).fail( () => {
+                Notification.push('kitアプリをロードできません。', `${str}を展開できませんでした。`, 'system');
+                System.launchLock = false;
+                pid++;
             } );
         }
         catch(error){
             Notification.push( "System Error", error, "system" );
+            System.launchLock = false;
         }
     }
 }
 
-function appData( data ) {
-    var pid = processID;
-    process[String( pid )] = {
-        id: data.id,
+async function appData(data) {
+    let _support = {
+        fullscreen: false,
+        resize: false,
+        darkmode: false,
+        kaf: true,
+        multiple: true
+    }, _size = {}, _resize = false;
+    if (data.support) _support = {
+        fullscreen: typeof data.support.fullscreen == "undefined" ? false : data.support.fullscreen,
+        resize: typeof data.support.resize == "undefined" ? false : data.support.resize,
+        darkmode: typeof data.support.darkmode == "undefined" ? false : data.support.darkmode,
+        kaf: typeof data.support.kaf == "undefined" ? true : data.support.kaf,
+        multiple: typeof data.support.multiple == "undefined" ? true : data.support.multiple
+    }
+    if (data.size) _size = {
+        width: data.size.width || 'auto',
+        height: data.size.height || 'auto'
+    };
+    if (data.resize) _resize = data.resize;
+    const defobj = {
+        id: data.id || null,
+        name: data.name || 'アプリ名なし',
+        icon: data.icon || 'none',
+        version: data.version || null,
+        author: data.author || null,
+        support: _support,
+        size: _size,
+        resize: _resize,
+        view: data.view || 'default.html',
+        script: data.script || 'none',
+        css: data.css || 'none'
+    }
+    if (!data.id || !data.version || !data.author) {
+        Notification.push('起動エラー', '起動に失敗しました。詳細情報を得るためには、デバッグモードを有効化してください。', 'system');
+        Notification.push('debug', '起動エラー:id, version, authorは必須定義項目です。', 'system');
+        System.launchLock = false;
+        return;
+    }
+    if (defobj.support.multiple == false) {
+        if (Object.values(process).map(p => p.id).includes(defobj.id)) {
+            Notification.push('多重起動エラー', `アプリケーション「${defobj.name}」の多重起動は許可されていません。`, 'system');
+            System.launchLock = false;
+            return;
+        }
+    }
+    let _pid = pid;
+    process[String(_pid)] = {
+        id: defobj.id,
         time: System.time.obj.toLocaleString(),
         isactive: false,
-        preventclose: false
+        preventclose: false,
+        title: defobj.name
     };
-    System.appCache[data.id] = data;
-    let _taskAppend = "<span id='t" + pid + "'>";
-    if( data.icon && data.icon != "none" ) _taskAppend += "<img src='" + S.launchpath[pid] + "/" + data.icon + "'>";
-    _taskAppend += "<span id='tname" + pid + "'>" + data.name + "<span></span>";
-    $( "#tasks" ).append( _taskAppend );
-    //タスクバーのクリック挙動
-    $( "#t" + pid ).addClass( "task" ).click( function() {
-        if( $(this).hasClass("t-active") || $(this).hasClass("task-min") ) KWS.min( pid );
-        else{
-            $("#w"+pid).css("z-index", KWS.windowIndex + 1);
-            KWS.refreshWindowIndex();
+    System.appCache[System.launchpath[pid]] = data;
+    app = new App(_pid);
+    let _taskAppend = `<span id='t${_pid}'>`;
+    const _iconPath = app.getPath(defobj.icon).toString();
+    const _viewPath = app.getPath(defobj.view).toString();
+    if(defobj.icon != 'none') _taskAppend += `<img src='${_iconPath}'>`;
+    _taskAppend += `<span id='tname${_pid}'>${defobj.name}<span></span>`;
+    $("#tasks").append(_taskAppend);
+    $("#t" + _pid).addClass("task").on({
+        click: function() {
+            if ( process[_pid].isactive || $(this).hasClass("task-min") ) KWS.min(_pid);
+            else {
+                $("#w"+_pid).css("z-index", KWS.windowIndex + 1);
+                KWS.refreshWindowIndex();
+            }
+        },
+        mouseenter: function() {
+            $("#task-ctx-name").text(defobj.name);
+            if(defobj.icon != "none") $("#task-ctx-img").show().attr("src", _iconPath);
+            else $("#task-ctx-img").hide();
+            $("#task-ctx-ver").text(`v${defobj.version} pid${_pid}`);
+            $("#task-ctx-info").off().on("click", function() { System.appInfo(_pid)});
+            $("#task-ctx-sshot").off().on("click", function() { System.screenshot(_pid, true) });
+            $("#task-ctx-min").off().on("click", function() { KWS.min(String(_pid)) });
+            if($(this).hasClass('t-active')) $('#task-ctx-front').hide();
+            else $('#task-ctx-front').show();
+            $("#task-ctx-front").off().on('click', function() {
+                $("#w"+_pid).css("z-index", KWS.windowIndex+1);
+                KWS.refreshWindowIndex();
+            });
+            $("#task-ctx-close").off().on("click", () => System.close(_pid));
+            $("#task-ctx-kill").off().on("click", () => System.kill(defobj.id));
+            const _ctxleft = $(this).offset().left, _ctxtop = window.innerHeight - $(this).offset().top;
+            if( _ctxleft != $("#task-ctx").offset().left ) $("#task-ctx").hide();
+            $("#task-ctx").css("left", _ctxleft).css("bottom", _ctxtop).show();
         }
     } );
-    $( "#t" + pid ).addClass( "task" ).on( "mouseenter", function() {
-        $( "#task-ctx-name" ).text( data.name );
-        if( data.icon && data.icon != "none" ) $( "#task-ctx-img" ).attr( "src", System.launchpath[pid] + "/" + data.icon );
-        else $( "#task-ctx-img" ).hide();
-        $( "#task-ctx-ver" ).text( data.version + "/pid:" + pid );
-        $( "#task-ctx-info" ).off().on( "click", function() { System.appInfo( pid )} );
-        $( "#task-ctx-sshot" ).off().on( "click", function() { S.screenshot(pid, true) } );
-        $( "#task-ctx-min" ).off().on( "click", function() { KWS.min( String(pid) ) } );
-        if( $(this).hasClass("t-active") ) $( "#task-ctx-front" ).hide();
-        else $( "#task-ctx-front" ).show();
-        $( "#task-ctx-front" ).off().on( "click", function() {
-            $("#w"+pid).css("z-index", KWS.windowIndex + 1);
-            KWS.refreshWindowIndex();
-        } );
-        $( "#task-ctx-close" ).off().on( "click", () => { System.close( String(pid) ) } );
-        $( "#task-ctx-kill" ).off().on( "click", () => { System.kill( String(data.id) ) } );
-        const _ctxleft = $( "#t" + pid ).offset().left;
-        const _ctxtop = window.innerHeight - $( "#t" + pid ).offset().top;
-        if( _ctxleft != $( "#task-ctx" ).offset().left ) {
-            $( "#task-ctx" ).hide();
-        }
-        $( "#task-ctx" ).css( "left", _ctxleft ).css( "bottom", _ctxtop ).show();
-    } );
-    $( "section, #kit-tasks" ).on( "mouseenter", function() {
-        $( "#task-ctx" ).fadeOut( 200 );
-    } );
-    $( "#t" + pid ).hover( function() {
-        prevWindowIndex = $( "#w" + pid ).css( "z-index" );
-        $( "#w" + pid ).addClass( "win-highlight" );
-    }, function() {
-        $( "#w" + pid ).removeClass( "win-highlight" );
-    } );
-    let _windowAppend = "<div id='w" + pid + "'><div id='wt" + pid + "' class='wt'><i class='wmzx'><span id='wm" + pid + "'></span>";
-    if( data.support && data.support.fullscreen == true ) _windowAppend += "<span id='wz" + pid + "'></span>";
-    _windowAppend += "<span id='wx" + pid + "'></span></i>";
-    if( data.icon && data.icon != "none" ) _windowAppend += "<img src='" + S.launchpath[pid] + "/" + data.icon + "'>";
-    _windowAppend += "<span id='wtname" + pid + "'>" + data.name + "</span></div><div class='winc winc-" + data.id + "' id='winc" + pid + "'></div></div>";
-    $( "#desktop-" + currentDesktop ).append( _windowAppend );
-
-    if( data.support && data.support.darkmode == true ) $("#winc"+pid).addClass("winc-darkmode");
-    if( KWS.darkmode ) $("#winc"+pid).addClass("kit-darkmode");
-
-    if( data.size ){
-        $("#winc"+pid).css("width", data.size.width).css("height", data.size.height);
-    }
-    if( data.resize ){
-        let _minwidth = 200, _minheight = 40;
-        if( data.resize.minWidth ) _minwidth = data.resize.minWidth;
-        if( data.resize.minHeight ) _minheight = data.resize.minHeight;
-        $("#winc"+pid).windowResizable({
+    $("section, #kit-tasks").on('mouseenter', function() { $('#task-ctx').fadeOut(200) });
+    $("#t" + _pid).on({
+        mouseenter: () => {
+            prevWindowIndex = $("#w" + _pid).css('z-index');
+            $("#w" + _pid).addClass('win-highlight');
+        },
+        mouseleave: () => $("#w" + _pid).removeClass('win-highlight')
+    });
+    let _windowAppend = "<div id='w" + _pid + "'><div id='wt" + _pid + "' class='wt'><i class='wmzx'><span id='wm" + _pid + "'></span>";
+    if( defobj.support.fullscreen == true ) _windowAppend += "<span id='wz" + _pid + "'></span>";
+    _windowAppend += "<span id='wx" + _pid + "'></span></i>";
+    if( defobj.icon != "none" ) _windowAppend += "<img src='" + _iconPath + "'>";
+    _windowAppend += "<span id='wtname" + _pid + "'>" + defobj.name + "</span></div><div class='winc winc-" + defobj.id + "' id='winc" + _pid + "'></div></div>";
+    $("#desktop-" + currentDesktop).append(_windowAppend);
+
+    if( defobj.support.darkmode == true ) $("#winc"+_pid).addClass('winc-darkmode');
+    if( KWS.darkmode ) $("#winc"+_pid).addClass("kit-darkmode");
+    
+    $("#winc"+_pid).css("width", defobj.size.width).css("height", defobj.size.height);
+    if( defobj.resize ){
+        let _minwidth = defobj.resize.minWidth ? defobj.resize.minWidth : 200;
+        let _minheight = defobj.resize.minHeight ? defobj.resize.minHeight : 40;
+        $("#winc"+_pid).windowResizable({
             minWidth: _minwidth,
             minHeight: _minheight
         });
     }
 
-    var windowPos = 50 + ( pid % 10 ) * 20;
-    //$( "#w" + pid ).addClass( "window" ).draggable( {cancel: ".winc", stack: ".window"} ).css( "left", windowPos + "px" ).css( "top", windowPos + "px" ).css( "z-index", $( ".window" ).length + 1 );
+    let windowPos = 50 + ( _pid % 10 ) * 20;
     KWS.windowIndex ++;
-    $( "#w"+pid ).addClass( "window" ).pep({
+    $( "#w"+_pid ).addClass( "window" ).pep({
         elementsWithInteraction: ".winc, .ui-resizable-handle",
         useCSSTranslation: false,
         disableSelect: false,
@@ -486,41 +657,42 @@ function appData( data ) {
         KWS.refreshWindowIndex();
     } ).css( "left", windowPos + "px" ).css( "top", windowPos + "px" ).css( "z-index",  KWS.windowIndex );
     KWS.refreshWindowIndex();
-    $( "#wm" + pid ).addClass( "wm fa fa-window-minimize" ).click( () => KWS.min( String(pid) ) );
-    $( "#wz" + pid ).addClass( "wz fas fa-square" ).click( () => KWS.max( String(pid) ) );
-    $( "#wx" + pid ).addClass( "wx fa fa-times" ).click( () => System.close( String(pid) ) );
-    $( "#winc" + pid ).resizable( {
-        minWidth: "200"
-    } ).load( System.launchpath[pid] + "/" + data.view, (r, s, x) =>{
-        if( s == "error" ){
-            Notification.push("起動に失敗:" + x.status, x.statusText);
+    if(defobj.support.fullscreen == true) $(`#wt${_pid}`).on("dblclick", () => KWS.max(_pid));
+    $( `#wm${_pid}` ).addClass("wm fa fa-window-minimize").on("click", () => KWS.min( _pid ));
+    $( `#wz${_pid}` ).addClass("wz fas fa-square").on("click", () => KWS.max( _pid ));
+    $( `#wx${_pid}` ).addClass("wx fa fa-times").on("click", () => System.close( _pid ));
+    $( "#winc" + _pid ).resizable().load(app.getPath(defobj.view), (r, s, x) => {
+        if(s == "error"){
+            Notification.push("起動に失敗しました " + x.status, 'テンプレートにアクセスできません。' + x.statusText, 'system');
+            System.launchLock = false;
+            pid++;
             return false;
         }
-        if( !data.script || data.script != "none" ) $.getScript( System.launchpath[pid] + "/" + data.script, () => App.kaf(pid) ).fail( () =>  App.kaf(pid) );
-        else App.kaf(pid);
-        if( data.css != "none" && $("#kit-style-"+data.id).length == 0 ){
-            $( "head" ).append( '<link href="' + System.launchpath[pid] + '/' + data.css + '" rel="stylesheet" id="kit-style-' + data.id + '"></link>' );
-            //Notification.push("debug", "新規スタイルシートの読み込み", data.id);
-        }        
-        processID++;
-        localStorage.setItem( "kit-pid", processID );
-    } );
-}
-
-//非推奨メソッド
-function close( str ) {
-    System.close( str )
-}
-
-//非推奨メソッド
-function kill( str ) {
-    System.kill(str)
+        if( defobj.css != "none" && !document.querySelector(`#kit-style-${defobj.id}`) ){
+            $("head").append('<link href="' + app.getPath(defobj.css) + '" rel="stylesheet" id="kit-style-' + data.id + '"></link>');
+        }
+        if(defobj.script != "none") $.getScript(app.getPath(defobj.script), () => {
+            if( defobj.support.kaf == true ) App.kaf(_pid);
+            pid++;
+        }).fail(() => {
+            if( defobj.support.kaf == true ) App.kaf(_pid)
+            pid ++;
+        });
+        else if( defobj.support.kaf == true ){
+            App.kaf(_pid);
+            pid++;
+        }
+        else pid++;
+        localStorage.setItem( "kit-pid", pid );
+        System.launchLock = false;
+    });
 }
 
 const System = new function() {
-    this.version = "0.2.0";
+    this.version = "0.2.1";
     this.username = localStorage.getItem("kit-username");
     this.appdir = localStorage.getItem("kit-appdir");
+    this.loc = { ...location };
 
     this.bootopt = new URLSearchParams(location.search);
 
@@ -541,10 +713,16 @@ const System = new function() {
         else for( let i of _elems ){
             q += ",#winc" + _pid + " " + i;
         }
-        console.log(q)
         return $( q.substring(1) );
     }
 
+    this.qs = ( _pid, ..._elems ) => {
+        let q = "";
+        if( !_elems.length ) q = ",#winc" + _pid;
+        else for( let i of _elems ) q += ",#winc" + _pid + " " + i;
+        return document.querySelectorAll( q.substring(1) )
+    }
+
     this.userarea = new Object();
     this.recycle = new Object();
 
@@ -562,6 +740,19 @@ const System = new function() {
     this.log = new Array();
     this.noop = () => {}
 
+    this.launchLock = false;
+
+    this.ajaxWait = () =>{
+        return new Promise(resolve =>{
+            let interval = setInterval(()=>{
+                if(this.launchLock === false) {
+                    clearInterval(interval);
+                    resolve();
+                }
+            }, 100)
+        });
+    }
+
     this.setBattery = function(){
         if( navigator.getBattery ) navigator.getBattery().then((e)=>{
             let _lv =  e.level * 100;
@@ -594,11 +785,11 @@ const System = new function() {
     }
 
     this.save = function(data, type){
-        launch("fivr", { "save" : data, "type" : type });
+        System.launch("fivr", { "save" : data, "type" : type });
     }
 
     this.open = function(filename){
-        launch("fivr", { "open" : filename });
+        System.launch("fivr", { "open" : filename });
     }
 
     this.preventClose = function( _pid ){
@@ -612,7 +803,7 @@ const System = new function() {
         $( "#kit-power-back" ).click();
         for( let i in process ) {
             if( process[i].preventclose == true ){
-                S.dialog( "シャットダウンの中断", "pid" + System.appCache[process[i].id].name + "がシャットダウンを妨げています。<br>強制終了してシャットダウンを続行する場合は[OK]を押下してください。", () => {
+                S.dialog( "シャットダウンの中断", "pid" + System.appCache[System.launchpath[i]].name + "がシャットダウンを妨げています。<br>強制終了してシャットダウンを続行する場合は[OK]を押下してください。", () => {
                     process[i].preventclose = false;
                     System.shutdown();
                 } );
@@ -625,6 +816,7 @@ const System = new function() {
         $( "header, footer" ).fadeOut( 300 );
         $( "#kit-wallpaper" ).fadeOut( 1500 );
         if( _opt == "reboot" ) location.href = "autorun.html";
+        localStorage.setItem("kit-shutted-down", true);
     }
 
     this.reboot = function() {
@@ -644,21 +836,21 @@ const System = new function() {
         else $( "#lock-password" ).hide();
     }
 
-    this.alert = function( title, content, winname ) {
-        launch( "alert", [title, content, winname] );
+    this.alert = function( title, content, wtitle ) {
+        System.launch("alert", [title, content, wtitle]);
     }
 
     this.dialog = function( title, content, func ){
-        launch("dialog", {
+        System.launch("dialog", {
             "title": title,
             "content": content,
             "func": func
-        })
+        });
     }
 
     this.appInfo = function( _pid ){
         let _title = "", _content = "";
-        let ac = System.appCache[process[_pid].id];
+        let ac = System.appCache[S.launchpath[_pid]];
         let _lp = System.launchpath[_pid];
         if( ac ){
             _title = ac.name + " " + ac.version;
@@ -672,12 +864,8 @@ const System = new function() {
         System.alert( _title, _content );
     }
 
+    this.apps = new Object();
     this.installed = new Array();
-    //非推奨です(削除予定)。
-    this.min = function( _str ) {
-        KWS.min( _str );
-    }
 
     this.close = function( _str ) {
         let _pid = String( _str );
@@ -689,8 +877,8 @@ const System = new function() {
     }
 
     this.kill = function( _str ){
-        for( let pid in process ) {
-            if( process[pid] && process[pid].id == _str ) System.close( pid );
+        for( let _pid in process ) {
+            if( process[_pid] && process[_pid].id == _str ) System.close( _pid );
         }
     }
     
@@ -796,7 +984,7 @@ const System = new function() {
         for( let i in process ) {
             if( process[i].id == _id ) _cnt += 1;
         }
-        console.log( _cnt );
+        Notification.push( "debug", _cnt );
         if( _cnt > 1 ) {
             System.close( _pid );
             if( !_alert ){
@@ -820,23 +1008,55 @@ const System = new function() {
 
     this.initLauncher = function(data){
         $("#launcher-apps").html("");
+        System.apps = data;
         for( let i in data ){
-            $("#launcher-apps").append("<div class='launcher-app' data-launch='" + i + "'><img src='" + data[i].icon + "'>" + data[i].name + "</div>");
+            $('#launcher-apps').append(`<div class='launcher-app' data-launch='${i}'><img src='${data[i].icon}'>${data[i].name}</div>`);
         }
-        if( !System.bootopt.get("safe") ){
+        if( !System.bootopt.get('safe') ){
             for( let i of System.installed ){
-                $("#launcher-apps").append("<div class='launcher-app' data-define-path='" + i.path + "' data-define-id='" + i.id + "'><img src='" + i.icon + "'>" + i.name + "</div>");
+                $('#launcher-apps').append(`<div class='launcher-app' data-launch='${i.path}' data-define-id='${i.id}'><img src='${i.icon}'>${i.name}</div>`);
             }
         }
-        $(".launcher-app").on("click", function(){
-            $("#launch").click();
-            if( $(this).attr("data-launch") ) launch( $(this).attr("data-launch") );
-            else if( $(this).attr("data-define-path") ){
-                launch( $(this).attr("data-define-id"), null, $(this).attr("data-define-path") );
-            };
+        $('.launcher-app').on('click', function(){
+            $('#launch').click();
+            System.launch( $(this).attr('data-launch') );
         });
     }
 
+    this.launch = async function(path, args) {
+        while(this.launchLock) await this.ajaxWait();
+        this.launchLock = true;
+
+        let _pid = pid;
+        System.args[_pid] = args;
+        let _path = path;
+        if(_path.lastIndexOf('/') == _path.length - 1) {
+            _path = _path.substring(0, _path.length - 1);
+        }
+        else if(_path.indexOf('/') == -1) {
+            _path = System.appdir + _path;
+        }
+
+        System.launchpath[_pid] = _path;
+    
+        if( System.appCache[_path] ) {
+            if( KWS.fullscreen.pid ) KWS.unmax(KWS.fullscreen.pid);
+            appData( System.appCache[_path] );
+        }
+        else {
+            try{
+                $.getJSON( _path + '/define.json', appData ).fail( () => {
+                    Notification.push('kitアプリをロードできません。', `${_path}を展開できませんでした。`, 'system');
+                    System.launchLock = false;
+                } );
+            }
+            catch(error){
+                Notification.push( "System Error", error, "system" );
+                System.launchLock = false;
+            }
+        }
+    }
+
     this.clip = new function(){
         this.content = null;
         this.history = new Array();
@@ -895,7 +1115,7 @@ const System = new function() {
 }
 
 const KWS = new function(){
-    this.version = "3.2.2";
+    this.version = "3.2.3";
     this.active = null;
 
     this.darkmode = false;
@@ -928,10 +1148,16 @@ const KWS = new function(){
     }
 
     this.max = function( _pid ){
-        if( KWS.fullscreen.pid ){
-            Notification.push("最大化に失敗", "最大化しているウィンドウがあります。");
+        let _appcache = System.appCache[System.launchpath[_pid]];
+        if( KWS.fullscreen.pid || _appcache.support.fullscreen != true ){
+            Notification.push('最大化に失敗', 'ウィンドウの最大化に失敗しました。', 'system');
             return;
         }
+        KWS.fullscreen.prevWidth = $("#winc"+_pid).outerWidth();
+        KWS.fullscreen.prevHeight = $("#winc"+_pid).outerHeight();
+        KWS.fullscreen.prevTop = $("#w"+_pid).offset().top;
+        KWS.fullscreen.prevLeft = $("#w"+_pid).offset().left;
+        KWS.fullscreen.pid = _pid;
         $( "#wt"+_pid ).addClass("wtmaximize");
         $( "#w"+_pid ).css({
             "top": "0px",
@@ -940,18 +1166,9 @@ const KWS = new function(){
         .addClass("windowmaximize")
         .css("z-index", KWS.windowIndex + 1);
         KWS.refreshWindowIndex();
-
-        KWS.fullscreen.prevWidth = $("#winc"+_pid).outerWidth();
-        KWS.fullscreen.prevHeight = $("#winc"+_pid).outerHeight();
-        KWS.fullscreen.prevTop = $("#w"+_pid).offset().top;
-        KWS.fullscreen.prevLeft = $("#w"+_pid).offset().left;
-
         KWS.resize( _pid, System.display.width, System.display.height - 30 );
         $("footer").hide();
-        $("#kit-header-fullscreen").show().on("click", () => {
-            KWS.unmax( _pid );
-        });
-        KWS.fullscreen.pid = _pid;
+        $("#kit-header-fullscreen").show().on('click', () => KWS.unmax( _pid ));
     }
 
     this.unmax = function( _pid ){
@@ -959,8 +1176,8 @@ const KWS = new function(){
             Notification.push("最大化解除に失敗", "対象がフルスクリーンウィンドウではありません。");
             return;
         }
-        $( "#wt"+_pid ).removeClass("wtmaximize");
-        $( "#w"+_pid ).css({
+        $('#wt'+_pid).removeClass("wtmaximize");
+        $('#w'+_pid).css({
             "top": KWS.fullscreen.prevTop,
             "left": KWS.fullscreen.prevLeft
         })
@@ -973,6 +1190,10 @@ const KWS = new function(){
         KWS.fullscreen.prevHeight = null;
         KWS.fullscreen.prevTop = null;
         KWS.fullscreen.prevLeft = null;
+
+        if( !System.appCache[System.launchpath[_pid]].size.height ) {
+            System.qs(_pid)[0].style.height = "auto";
+        }
     }
 
     this.vacuum = function( _left, _top ){
@@ -1000,33 +1221,59 @@ const KWS = new function(){
         } );
         for( let i in array ){
             document.getElementById(array[i].id).style.zIndex = i;
+            let _pid = String(array[i].id).substring(1);
             if( i == num-1 ){
                 $("#"+array[i].id).addClass("windowactive");
-                $("#t"+String(array[i].id).substring(1)).addClass("t-active");
-                KWS.active = String(array[i].id).substring(1);
-                process[array[i].id.substring(1)].isactive = true;
+                $("#t"+_pid).addClass("t-active");
+                KWS.active = _pid;
+                process[_pid].isactive = true;
+                KWS.screenPrevSwitched = new Date();
+                localStorage.setItem('kit-screentime', JSON.stringify(KWS.screenTime));
             }
             else{
                 $("#"+array[i].id).removeClass("windowactive");
-                $("#t"+String(array[i].id).substring(1)).removeClass("t-active");
-                process[array[i].id.substring(1)].isactive = false;
+                $("#t"+_pid).removeClass("t-active");
+                process[_pid].isactive = false;
+                if( KWS.active == _pid ){
+                    let _diff = (new Date() - KWS.screenPrevSwitched);
+                    let _appid = process[_pid].id
+                    if( !KWS.screenTime[_appid] ) KWS.screenTime[_appid] = new Number();
+                    if( _diff < 0 ) Notification.push('debug', 'スクリーンタイムの記録に失敗しました。', 'system')
+                    else KWS.screenTime[_appid] += _diff;
+                }
             }
         }
         KWS.windowIndex = num;
     }
 
+    this.front = function( _pid ) {
+        $(`#w${_pid}`).css("z-index", KWS.windowIndex + 1);
+        KWS.refreshWindowIndex();
+    }
+
     this.resize = function( _pid, _width, _height ){
         if( _width ) $("#winc"+_pid).css("width", _width)
         if( _height ) $("#winc"+_pid).css("height", _height);
     }
 
+    this.setTheme = function(_name){
+        localStorage.setItem('kit-theme', _name);
+        if(_name != 'none') $('#kit-theme-file').attr('href', `./system/theme/${localStorage.getItem('kit-theme')}`);
+        else $('#kit-theme-file').attr('href', '');
+        System.moveDesktop(currentDesktop);
+    }
+
+    this.screenTime = new Object();
+
+    this.screenPrevSwitched = new Date();
+
     this.fusen = new function(){
         this.fid = 0;
         this.list = new Object();
 
         this.add = function(_text){
             KWS.fusen.list[KWS.fusen.fid] = String(_text);
-            $("#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>");
+            $("#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>");
             $("#kit-f"+KWS.fusen.fid).css({
                 "left": Number(KWS.fusen.fid)*40 + 20,
                 "top": Number(KWS.fusen.fid)*10 + 100,
@@ -1044,7 +1291,6 @@ const KWS = new function(){
                 }
             })
             $(".kit-fusen-textarea").off().on("change",function(){
-                Notification.push($(this).attr("data-fid"), $(this).val(), "debug");
                 KWS.fusen.list[$(this).attr("data-fid")] = $(this).val();
                 localStorage.setItem("kit-fusen", JSON.stringify( KWS.fusen.list ));
             });
@@ -1091,50 +1337,171 @@ const Notification = new function() {
     this.goodnight = false;
     this.sound = null;
 
-    this.push = function( _title, _content, _app ) {
+    this.push = function( _title, _content, _app, _pid, _action, _img, _buttons ) {
+        let _nid = this.nid;
         if( !System.debugmode && ( _title == "debug" || _app == "debug" ) ){
             return false;
         }
-        this.list[this.nid] = {
-            "title" : _title,
-            "content" : _content,
-            "app" : _app,
-            "time" : System.time.obj.toLocaleString()
+        Notification.list[_nid] = {
+            title: _title,
+            content: _content,
+            app: _app,
+            time: System.time.obj.toLocaleString(),
+            pid: _pid,
+            action: () => {
+                if( typeof _action == 'function' ) _action();
+                else if( _pid ) KWS.front(_pid);
+                $('#notifications').hide('drop', {direction: 'right'}, 300);
+            },
+            img: _img
         };
+        if( _pid && System.appCache[System.launchpath[_pid]] ){
+            _app = `<img src='${System.launchpath[_pid]}/${System.appCache[System.launchpath[_pid]].icon}'>${System.appCache[System.launchpath[_pid]].name}`;
+        }
         if( !this.goodnight ){
             if( this.sound ) System.audio.play( "n" + this.nid, this.sound );
-            $( "#last-notification-title" ).text("").text( _title );
-            $( "#last-notification-content" ).text("").text( _content );
-            $( "#last-notification-app" ).text("").text( _app );
-            $( "#last-notification" ).hide().show( "drop", {direction: "right"}, 300 );
-        }
-        $( "#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>" );
-        $("#nc" + this.nid).on("click", function(){
-            let _nid = this.id.slice(2);
-            $("#nt" + _nid).fadeOut(300);
-            return false;
-        } );
-        $("#nt" + this.nid).on("click", function(){
-            let _nid = this.id.slice(2);
-            if( Notification.list[ _nid ].app != "system" ){
-                launch(Notification.list[ _nid ].app);
+            $('#last-notification-title').text('').text( _title );
+            $('#last-notification-content').text('').text( _content );
+            $('#last-notification-app').text('').html( _app );
+            $('#last-notification').hide().show('drop', {direction: "right"}, 300).off().on('click', Notification.list[this.nid].action);
+            if( _img ) $('#last-notification-img').attr('src', _img).show();
+            else $('#last-notification-img').attr('src', '').hide();
+        }
+        let imgtag = '';
+        if( _img ) imgtag = `<img src='${_img }' alt='' class='notis_img'>`;
+        $(`<div class='notis' id='nt${_nid}'>
+                ${imgtag}
+                <span class='notis_close' id='nc${_nid}'></span>
+                <div class='notis_app'>${_app}</div>
+                <span>${_title}</span>
+                ${_content}
+                <div class='notis_buttons'></div>
+                <div class='notis_time'>${System.time.obj.toTimeString()}</div>
+            </div>`).appendTo('#notifications').on('click', Notification.list[this.nid].action);
+        $(`#nc${_nid}`).on('click', (e) => {
+            e.stopPropagation();
+            $(`#nt${_nid}`).fadeOut(300);
+        });
+        $('#last-notification-buttons').html('');
+        if( _buttons ){
+            for( let b of _buttons ){
+                $(`<a>${b.label}</a>`).appendTo('#last-notification-buttons').on('click', (e) => {
+                    e.stopPropagation();
+                    b.func();
+                });
+                $(`<a>${b.label}</a>`).appendTo(`#nt${_nid} .notis_buttons`).on('click', (e) => {
+                    e.stopPropagation();
+                    b.func();
+                });
             }
-        } );
+        }
         this.nid ++;
         return (this.nid - 1);
     }
 }
 
-const App = new function() {
-    this.e = new Object();
+class App {
+    constructor(_pid) {
+        App.e[_pid] = new Object();
+        App.d[_pid] = new Object();
+        
+        this.process = process[_pid];
+        this.cache = System.appCache[System.launchpath[_pid]];
+
+        this.args = System.args[_pid];
+        this.close = () => System.close(_pid);
+        this.d = App.d[_pid];
+        this.dom = (..._args) => System.dom(_pid, ..._args);
+        this.e =  App.e[_pid];
+        this.ntf = (_title, _content, _action, _img, _buttons) => Notification.push(_title, _content, this.info.id, _pid, _action, _img, _buttons);
+        this.qs = (...args) => System.qs(_pid, ...args);
+        this.front = () => KWS.front(_pid);
+
+        this.changeWindowTitle = _t => App.changeWindowTitle( _pid, _t );
+        this.data = (_name, _value) => App.data(_pid, _name, _value);
+        this.event = (_name, _event) => App.event(_pid, _name, _event);
+        this.getPath = _path => App.getPath(_pid, _path);
+        this.kaf = () => App.kaf(_pid);
+        this.load = _path => App.load(_pid, _path);
+        this.preventClose = _bool => App.preventClose(_pid, _bool);
+    }
+
+    static changeWindowTitle( _pid, _t ) {
+        $( "#tname"+_pid ).text( _t );
+        $( "#wtname"+_pid ).text( _t );
+        process[_pid].title = _t;
+        return App;
+    }
+
+    static context( _cid, _obj ) {
+        KWS.context[ _cid ] = _obj;
+        return App;
+    }
+
+    static data( _pid, _name, _value ) {
+        if( _value !== undefined ) {
+            S.dom(_pid, `[kit\\:bind=${_name}]`).val( _value );
+            S.dom(_pid, `[kit\\:observe=${_name}]`).text( _value );
+            S.dom(_pid, `template[kit\\:for=${_name}] + kit-for`).text('');
+            if (typeof _value == 'object'){
+                for(let elem of S.qs(_pid, `template[kit\\:for=${_name}] + kit-for`)){
+                    let _rep = App.d[_pid][`__kaf_node_id_${elem.getAttribute('kaf-node-id')}`], _result = '';
+                    for(let i in _value) {
+                        _result += _rep.replace(/{{\s*key\s*}}/g, i).replace(/{{\s*value\s*}}/g, _value[i]);
+                    }
+                    elem.innerHTML = _result;
+                }
+            }
+            if( _value ) {
+                S.dom(_pid, `[kit\\:if=${_name}]`).show();
+                S.dom(_pid, `[kit\\:disabled=${_name}]`).prop('disabled', true);
+            }
+            else{
+                S.dom(_pid, `[kit\\:if=${_name}]`).hide();
+                S.dom(_pid, `[kit\\:disabled=${_name}]`).prop('disabled', false).removeClass('-disabled');
+            }
+            return App.d[_pid][_name] = _value;
+        }
+        else if( _name ) return App.d[_pid][_name];
+        else return Object.fromEntries( Object.entries(App.d[_pid] || {}).filter(d => d[0].indexOf("__") != 0) );
+    }
 
-    this.event = ( _pid, _name, _event ) => {
+    static event( _pid, _name, _event ) {
         if( !App.e[_pid] ) App.e[_pid] = new Object();
-        App.e[_pid][_name] = _event;
+        if( !_event && App.e[_pid][_name] ) App.e[_pid][_name].call();
+        else App.e[_pid][_name] = _event;
+        return App;
     }
 
-    this.kaf = ( _pid ) => {
-        for( let i of S.dom(_pid, ".kaf", "kaf") ){
+    static getPath( _pid, _path ) {
+        if( String(_path)[0] != '/' ) _path = '/' + _path;
+        return System.launchpath[_pid] + _path;
+    }
+
+    static kaf( _pid ) {
+        let attrs = [
+            "[kit-ref]",
+            "[kit-e]",
+            "[kit-src]",
+            "[kit-alert]",
+            "[kit-launch]",
+            "[kit-close]",
+            "[kit-text]",
+            "[kit-html]",
+            "[kit\\:bind]",
+            "[kit\\:observe]",
+            "[kit\\:value]",
+            "[kit-value]",
+            "[kit-color]",
+            "[kit\\:if]",
+            "[kit-if]",
+            "[kit\\:for]"
+        ]
+        const PID = _pid;
+        const DATA = App.data(_pid);
+        const ARGS = System.args[_pid];
+        let _kaf_node_id = 0;
+        for( let i of S.qs(_pid, ...attrs) ){
             if( i.hasAttribute("kit-ref") ){
                 $(i).on("click", () => App.load(_pid, i.getAttribute("kit-ref")) );
             }
@@ -1142,33 +1509,109 @@ const App = new function() {
                 let _eqs = i.getAttribute("kit-e").split(",");
                 for( let k of _eqs ){
                     let _eq = k.split(" ");
-                    $(i).on( _eq[1]||"click", App.e[_pid][_eq[0]] );
+                    $(i).on( _eq[1]||'click', (e) => {
+                        if(e.target.classList.contains('-disabled') === false) App.e[_pid][_eq[0]]();
+                    } );
                 }
             }
             if( i.hasAttribute("kit-src") ){
-                $(i).attr("src", System.launchpath[_pid] +"/"+ i.getAttribute("kit-ref") )
+                $(i).attr("src", `${System.launchpath[_pid]}/${i.getAttribute("kit-src")}` );
             }
             if( i.hasAttribute("kit-alert") ){
-                $(i).on("click", ()=> System.alert( System.appCache[ process[_pid].id ].name, i.getAttribute("kit-alert") ) );
+                $(i).on("click", ()=> System.alert( System.appCache[System.launchpath[_pid]].name, i.getAttribute("kit-alert") ) );
             }
             if( i.hasAttribute("kit-launch") ){
-                $(i).on("click", ()=> launch( i.getAttribute("kit-launch") ) );
+                $(i).on("click", ()=> System.launch( i.getAttribute("kit-launch") ) );
             }
             if( i.hasAttribute("kit-close") ){
                 $(i).on("click", ()=> System.close( i.getAttribute("kit-close") || _pid ) );
             }
+            if( i.hasAttribute("kit-text") ){
+                $(i).text( eval(i.getAttribute("kit-text")) );
+            }
+            if( i.hasAttribute("kit-html") ){
+                $(i).html( eval(i.getAttribute("kit-html")) );
+            }
+            if( i.hasAttribute("kit:bind") ){
+                if( App.d[_pid] == undefined ) App.d[_pid] = new Object();
+                $(i).on('keydown keyup keypress change', () => {
+                    let _name = i.getAttribute("kit:bind");
+                    App.d[_pid][_name] = i.value;
+                    S.dom(_pid, `[kit\\:observe=${_name}]`).text( i.value );
+                    if( i.value ){
+                        S.dom(_pid, `[kit\\:if=${_name}]`).show();
+                        S.dom(_pid, `[kit\\:disabled=${_name}]`).prop('disabled', true).addClass('-disabled');
+                    }
+                    else{
+                        S.dom(_pid, `[kit\\:if=${_name}]`).hide();
+                        S.dom(_pid, `[kit\\:disabled=${_name}]`).prop('disabled', false).removeClass('-disabled');
+                    }
+                } );
+            }
+            if( i.hasAttribute("kit:observe") ){
+                $(i).text( App.d[_pid][i.getAttribute("kit:observe")] );
+            }
+            if( i.hasAttribute("kit:value") ){
+                $(i).val( App.d[_pid][i.getAttribute("kit:value")] );
+            }
+            if( i.hasAttribute("kit-value") ){
+                $(i).val( eval(i.getAttribute("kit-value")) );
+            }
+            if( i.hasAttribute("kit-color") ){
+                $(i).css('color', i.getAttribute("kit-color"));
+            }
+            if( i.hasAttribute("kit:if") ){
+                if( App.d[_pid][i.getAttribute("kit:if")] ){
+                    $(i).show();
+                }
+                else $(i).hide();
+            }
+            if( i.hasAttribute("kit:disabled") ){
+                if( App.d[_pid][i.getAttribute("kit:if")] ){
+                    i.disabled = true;
+                    i.classList.add('-disabled');
+                }
+                else i.disabled = false;
+            }
+            if( i.hasAttribute("kit-if") ){
+                if( eval( i.getAttribute("kit-if")) ){
+                    $(i).show();
+                }
+                else $(i).hide();
+            }
+            if( i.hasAttribute("kit:for") ){
+                if ('content' in document.createElement('template')) {
+                    i.setAttribute('kaf-node-id', _kaf_node_id);
+                    App.d[_pid][`__kaf_node_id_${_kaf_node_id}`] = i.innerHTML;
+                    i.insertAdjacentHTML('afterend', `<kit-for kaf-node-id="${_kaf_node_id}"></kit-for>`);
+                }
+                else i.style.display = 'none';
+            }
+            _kaf_node_id ++;
         }
     }
 
-    this.load = ( _pid, _path ) => {
-        S.dom(_pid).load( System.launchpath[_pid] +"/"+ _path, () => {
+    static load( _pid, _path ) {
+        if( String(_path)[0] != '/' ) _path = '/' + _path;
+        _path = System.launchpath[_pid] + _path;
+        S.dom(_pid).load( _path, () => {
             App.kaf(_pid);
+            let _appcache = System.appCache[System.launchpath[_pid]];
+            if( !KWS.fullscreen.pid && !_appcache.size.height ) {
+                System.qs(_pid)[0].style.height = "auto";
+            }
         } );
+        return App;
     }
 
-    this.preventClose = ( _pid, _bool ) => {
+    static preventClose( _pid, _bool = true ) {
         process[_pid].preventclose = _bool || true;
+        return App;
     }
 }
 
-var process = {}, processID = 0, pid, currentDesktop = 1, currentCTX = "", prevWindowIndex, S;
\ No newline at end of file
+App.d = new Object();
+App.e = new Object();
+App.version = "2.1.1";
+
+var process = {}, pid = 0, app, currentDesktop = 1, currentCTX = "", prevWindowIndex, S;