// | <| | |_
// |_|\_\_|\__|
//
-// 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
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: () => launch( 'settings', {'view': 'about'} )
+ }
+ ]);
+
if( localStorage.getItem( "kit-startup" ) == undefined ) {
localStorage.setItem( "kit-startup", new Array( "welcome" ) );
}
$( "#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>");
}).fail( function() {
Notification.push( "読み込みに失敗", "デスクトップ(config/desktop.json)の読み込みに失敗しました。", "system" );
} );
- //ランチャー
+
$.getJSON("config/apps.json", System.initLauncher).fail( function() {
Notification.push( "ランチャー初期化失敗", "アプリケーション一覧(config/apps.json)の読み込みに失敗しました。", "system" );
} );
System.close( this.id.slice( 1 ) );
$( this ).hide();
} );
- //通知バー
+
$( "#footer-noti" ).click( function() {
$( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
if( $( "#notifications" ).is( ":visible" ) ) {
}
else Notification.goodnight = false;
});
- //電源管理
+
$( ".power-button" ).click( function() {
$( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
$( "#last-notification" ).hide( "drop", {direction: "right"}, 300 );
}, function() {
$( "#lock-unl span" ).removeClass( "fa-lock-open" ).addClass( "fa-lock" );
} );
- //ランチャー起動
+
$( "#launch" ).click( function() {
$( "#notifications" ).hide( "drop", {direction: "right"}, 300 );
if( $( "#launcher" ).is( ":visible" ) ) {
}
});
- //サウンドドロップダウン
$("#dropdown-sound-slider").slider({
min: 0, max: 100, step: 1, value: 100,
change: (e, ui) => {
launch("user");
});
- //コンテキストメニュー
$(":root section:not(#desktop-l)").on("contextmenu", function() {
let _ptelem = $( document.elementFromPoint(S.mouseX, S.mouseY) );
S.selectedElement = _ptelem;
}
else {
try{
- $.getJSON( S.launchpath[_pid] + "/define.json", appData ).fail( function() {
- Notification.push("kitアプリをロードできません", str + "を展開できませんでした。アプリが存在しないか、クロスオリジン要求がブロックされている可能性があります。詳細:https://kitdev.home.blog/", "system");
+ $.getJSON( S.launchpath[_pid] + '/define.json', appData ).fail( () => {
+ Notification.push('kitアプリをロードできません。', `${str}を展開できませんでした。`, 'system');
} );
}
catch(error){
function appData( data ) {
let _pid = pid;
- app = new App(_pid);
process[String( _pid )] = {
id: data.id,
time: System.time.obj.toLocaleString(),
title: data.name
};
System.appCache[data.id] = data;
+ app = new App(_pid);
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>`;
$( "header, footer" ).fadeOut( 300 );
$( "#kit-wallpaper" ).fadeOut( 1500 );
if( _opt == "reboot" ) location.href = "autorun.html";
+ localStorage.setItem("kit-shutted-down", true);
}
this.reboot = function() {
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.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[_app] ){
+ _app = `<img src='${System.launchpath[_pid]}/${System.appCache[_app].icon}'>${_app}`;
+ }
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);
}
App.e[_pid] = new Object();
App.d[_pid] = new Object();
+ this.process = process[_pid];
+ this.info = System.appCache[process[_pid].id];
+
this.args = System.args[_pid];
this.close = () => System.close(_pid);
- this.d = () => App.d[_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.e = App.e[_pid];
+ this.front = () => KWS.front(_pid);
this.changeWindowTitle = _t => App.changeWindowTitle( _pid, _t );
this.data = (_name, _value) => App.data(_pid, _name, _value);
return App;
}
- static preventClose( _pid, _bool ) {
+ static preventClose( _pid, _bool = true ) {
process[_pid].preventclose = _bool || true;
return App;
}
App.d = new Object();
App.e = new Object();
+App.version = "2.1.1";
var process = {}, pid = 0, app, currentDesktop = 1, currentCTX = "", prevWindowIndex, S;
+/* notifications */
+
+#notifications {
+ z-index: 9994;
+ display: none;
+ box-sizing: border-box;
+ position: fixed;
+ right: 0px;
+ min-height: 100%;
+ max-height: 100%;
+ width: 340px;
+ background: rgba(255, 255, 255, .7);
+ box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, .4);
+ padding: 40px 8px 50px 8px;
+ cursor: url(../cursor-1.png), default;
+}
+
+#notifications-show-history {
+ display: block;
+ text-align: right;
+}
+
+.notis {
+ position: relative;
+ overflow: hidden;
+ cursor: url(../cursor-1.png), default;
+ padding: 4px;
+ border-radius: 5px;
+ margin: 10px 4px;
+ background: #ffffff;
+}
+
+.notis .notis_img {
+ float: left;
+ max-height: 64px;
+ max-width: 64px;
+ margin: 2px;
+ border-radius: 3px;
+ z-index: 0;
+}
+
+.notis .notis_close {
+ position: absolute;
+ right: 4px;
+ top: 4px;
+}
+
+.notis .notis_app {
+ margin-bottom: 2px;
+ font-size: 14px;
+ color: #999999;
+}
+
+.notis_app img {
+ height: 18px;
+ vertical-align: top;
+ margin-right: 4px;
+}
+
+.notis>span {
+ display: block;
+ font-weight: 700;
+}
+
+.notis .notis_close {
+ cursor: url(../cursor-2.png), pointer;
+ float: right;
+ background: rgba(255, 100, 100, .8);
+ width: 16px;
+ height: 16px;
+ margin: 2px;
+ border-radius: 99px;
+}
+
+.notis .notis_time {
+ text-align: right;
+ font-size: 12px;
+ color: #c0c0c0;
+}
+
+.notis .notis_buttons {
+ text-align: right;
+}
+
+.notis_buttons a {
+ display: inline-block;
+ color: dodgerblue;
+ font-size: 14px;
+ padding: 2px 6px;
+ border-radius: 3px;
+ cursor: pointer;
+ margin: 2px 3px;
+}
+
+.notis_buttons a:hover {
+ background: #f0f0f0;
+ box-shadow: 0px 1px 3px 0 rgba(0, 0, 0, .3);
+}
+
+
+/* last notification */
+
+#last-notification {
+ max-height: 200px;
+ width: 320px;
+ z-index: 9999;
+ display: none;
+ position: fixed;
+ padding: 4px;
+ bottom: 54px;
+ right: 12px;
+ border-radius: 4px;
+ cursor: url(../cursor-1.png), default;
+ box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, .5);
+ overflow: hidden;
+}
+
+#last-notification-close {
+ background: red;
+ width: 15px;
+ height: 15px;
+ display: inline-block;
+ float: right;
+ border-radius: 999px;
+ cursor: url(../cursor-2.png), pointer;
+ opacity: .8;
+}
+
+#last-notification-title {
+ font-weight: 700;
+}
+
+#last-notification-img {
+ float: left;
+ max-height: 64px;
+ max-width: 64px;
+ margin: 2px;
+ margin-right: 10px;
+ border-radius: 3px;
+}
+
+#last-notification-buttons {
+ text-align: right;
+ padding: 6px 0;
+}
+
+#last-notification-buttons a {
+ color: dodgerblue;
+ border: 1px solid transparent
+ font-size: 14px;
+ padding: 2px 6px;
+ border-radius: 3px;
+ cursor: pointer;
+ margin: 0 3px;
+}
+
+#last-notification-buttons a:hover {
+ box-shadow: 0px 1px 3px 0 rgba(0, 0, 0, .3);
+ background: #ffffff;
+}
+
+#last-notification-app {
+ font-size: 12px;
+ color: #a0a0a0;
+}
+
+#last-notification-app img {
+ height: 16px;
+ vertical-align: top;
+ margin-right: 4px;
+}
+
+/* sightre */
+
#kit-sightre {
position: fixed;
top: 0px;
margin: 0;
padding: 0;
border-radius: 0 0 6px 6px;
- box-shadow: 0 2px 15px 0 rgba(0,0,0,.3);
+ box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .3);
display: none;
z-index: 9995;
}
#kit-sightre input {
all: initial;
- font-family: 'Noto Sans JP', sans-serif;
+ font-family: 'Noto Sans JP', sans-serif;
background: transparent;
width: 100%;
font-size: 20px;
.kit-sightre-result:hover {
transition: .2s all ease;
background: #ffffff;
- box-shadow: 0 2px 5px 0 rgba(0,0,0,.1);
+ box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
}
.kit-sightre-result.-app {
#footer-tasks:hover{
text-shadow: 0px 1px 3px dodgerblue;
}
+
#notifications{
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
- z-index: 9994;
- display: none;
- box-sizing: border-box;
- position: fixed;
- right: 0px;
- min-height: 100%;
- max-height: 100%;
- width: 300px;
- background: rgba(255,255,255,.7);
- box-shadow: 0px 0px 60px 0px rgba(0,0,0,.4);
- padding: 40px 8px 50px 8px;
- cursor:url(../cursor-1.png), default;
}
+
#notifications-show-history{
- display: block;
- text-align: right;
text-shadow: 0px 1px 3px #ffffff;
}
+
#notifications .notis{
- cursor:url(../cursor-1.png), default;
- border: 1px solid #a0a0a0;
- padding: 4px;
- border-radius: 5px;
- margin: 6px 4px;
- background: #ffffff;
+ box-shadow: 0px 1px 2px 0px rgba(0,0,0,.3);
}
+
#notifications .notis:hover{
- border: 1px solid #505050;
box-shadow: 0px 1px 5px 0px rgba(0,0,0,.3);
}
-.notis > span{
- display: block;
- font-weight: 700;
-}
-.notis_close{
- cursor:url(../cursor-2.png), pointer;
- float: right;
- background: rgba(255,100,100,.8);
- width: 16px;
- height: 16px;
- margin: 2px;
- border-radius: 99px;
-}
-.notis_time{
- font-size: 13px;
- color: #909090;
-}
+
#tasks{
padding-left: 38px;
}
margin: 0 auto;
height: 70px;
}
+
#last-notification{
- z-index: 9999;
- display: none;
- position: fixed;
background: rgba(255,255,255,.9);
- padding: 4px;
- bottom: 54px;
- right: 12px;
- width: 200px;
- border-radius: 4px;
- cursor:url(../cursor-1.png), default;
- box-shadow: 0px 1px 4px 0px rgba(0,0,0,.5);
-}
-#last-notification-close{
- background: red;
- width: 15px;
- height: 15px;
- display: inline-block;
- float: right;
- border-radius: 999px;
- cursor:url(../cursor-2.png), pointer;
- opacity: .8;
-}
-#last-notification-title{
- font-weight: 700;
-}
-#last-notification-content{
- font-size: 14px;
-}
-#last-notification-app{
- font-size: 14px;
- color: #a0a0a0;
- text-align: right;
}
+
.kit-fusen{
background: rgba(255,250,220,.9);
width: 200px;