Sharkey/src/client/app/desktop/script.ts

261 lines
7.1 KiB
TypeScript
Raw Normal View History

2016-12-29 00:49:51 +02:00
/**
* Desktop Client
*/
import Vue from 'vue';
2018-03-27 08:13:12 +03:00
import VueRouter from 'vue-router';
2017-02-19 05:31:23 +02:00
// Style
2017-02-19 08:36:53 +02:00
import './style.styl';
2017-02-19 05:31:23 +02:00
2017-05-17 23:06:55 +03:00
import init from '../init';
2018-02-20 19:53:34 +02:00
import fuckAdBlock from '../common/scripts/fuck-ad-block';
2017-11-20 22:09:45 +02:00
import composeNotification from '../common/scripts/compose-notification';
2016-12-29 00:49:51 +02:00
2018-02-10 07:56:33 +02:00
import MkIndex from './views/pages/index.vue';
2018-10-19 05:10:49 +03:00
import MkHome from './views/pages/home.vue';
2018-06-05 15:36:21 +03:00
import MkDeck from './views/pages/deck/deck.vue';
2018-02-19 07:29:42 +02:00
import MkUser from './views/pages/user/user.vue';
import MkUserFollowingOrFollowers from './views/pages/user-following-or-followers.vue';
2018-04-20 07:31:43 +03:00
import MkFavorites from './views/pages/favorites.vue';
2018-02-20 16:37:35 +02:00
import MkSelectDrive from './views/pages/selectdrive.vue';
import MkDrive from './views/pages/drive.vue';
2018-02-21 08:30:03 +02:00
import MkHomeCustomize from './views/pages/home-customize.vue';
2018-02-22 14:15:24 +02:00
import MkMessagingRoom from './views/pages/messaging-room.vue';
2018-04-07 20:30:37 +03:00
import MkNote from './views/pages/note.vue';
2018-02-22 14:39:36 +02:00
import MkSearch from './views/pages/search.vue';
2018-06-10 06:19:19 +03:00
import MkTag from './views/pages/tag.vue';
2018-08-03 16:34:58 +03:00
import MkReversi from './views/pages/games/reversi.vue';
2018-06-16 12:42:49 +03:00
import MkShare from './views/pages/share.vue';
import MkFollow from '../common/views/pages/follow.vue';
import Ctx from './views/components/context-menu.vue';
import PostFormWindow from './views/components/post-form-window.vue';
import RenoteFormWindow from './views/components/renote-form-window.vue';
import MkChooseFileFromDriveWindow from './views/components/choose-file-from-drive-window.vue';
import MkChooseFolderFromDriveWindow from './views/components/choose-folder-from-drive-window.vue';
import Dialog from './views/components/dialog.vue';
import InputDialog from './views/components/input-dialog.vue';
import Notification from './views/components/ui-notification.vue';
import { url } from '../config';
import MiOS from '../mios';
2018-02-10 03:27:05 +02:00
2016-12-29 00:49:51 +02:00
/**
2017-05-17 23:06:55 +03:00
* init
2016-12-29 00:49:51 +02:00
*/
2018-02-11 05:08:43 +02:00
init(async (launch) => {
Vue.mixin({
methods: {
$contextmenu(e, menu, opts?) {
const o = opts || {};
const vm = this.$root.new(Ctx, {
menu,
x: e.pageX - window.pageXOffset,
y: e.pageY - window.pageYOffset,
});
vm.$once('closed', () => {
if (o.closed) o.closed();
});
},
$post(opts) {
const o = opts || {};
if (o.renote) {
const vm = this.$root.new(RenoteFormWindow, {
note: o.renote,
animation: o.animation == null ? true : o.animation
});
if (o.cb) vm.$once('closed', o.cb);
} else {
const vm = this.$root.new(PostFormWindow, {
reply: o.reply,
animation: o.animation == null ? true : o.animation
});
if (o.cb) vm.$once('closed', o.cb);
}
},
$chooseDriveFile(opts) {
return new Promise((res, rej) => {
const o = opts || {};
if (document.body.clientWidth > 800) {
const w = this.$root.new(MkChooseFileFromDriveWindow, {
title: o.title,
multiple: o.multiple,
initFolder: o.currentFolder
});
w.$once('selected', file => {
res(file);
});
} else {
window['cb'] = file => {
res(file);
};
window.open(url + `/selectdrive?multiple=${o.multiple}`,
'choose_drive_window',
'height=500, width=800');
}
});
},
$chooseDriveFolder(opts) {
return new Promise((res, rej) => {
const o = opts || {};
const w = this.$root.new(MkChooseFolderFromDriveWindow, {
title: o.title,
initFolder: o.currentFolder
});
w.$once('selected', folder => {
res(folder);
});
});
},
$dialog(opts) {
return new Promise<string>((res, rej) => {
const o = opts || {};
const d = this.$root.new(Dialog, {
title: o.title,
text: o.text,
modal: o.modal,
buttons: o.actions
});
d.$once('clicked', id => {
res(id);
});
});
},
$input(opts) {
return new Promise<string>((res, rej) => {
const o = opts || {};
const d = this.$root.new(InputDialog, {
title: o.title,
placeholder: o.placeholder,
default: o.default,
type: o.type || 'text',
allowEmpty: o.allowEmpty
});
d.$once('done', text => {
res(text);
});
});
},
$notify(message) {
this.$root.new(Notification, {
message
});
}
}
});
2018-02-16 19:24:10 +02:00
// Register directives
require('./views/directives');
2018-02-11 05:08:43 +02:00
// Register components
require('./views/components');
2018-02-24 17:18:09 +02:00
require('./views/widgets');
2018-02-11 05:08:43 +02:00
2018-03-27 08:13:12 +03:00
// Init router
const router = new VueRouter({
mode: 'history',
routes: [
{ path: '/', name: 'index', component: MkIndex },
2018-10-19 05:10:49 +03:00
{ path: '/home', name: 'home', component: MkHome },
2018-06-05 15:36:21 +03:00
{ path: '/deck', name: 'deck', component: MkDeck },
2018-03-27 08:13:12 +03:00
{ path: '/i/customize-home', component: MkHomeCustomize },
2018-04-20 07:31:43 +03:00
{ path: '/i/favorites', component: MkFavorites },
2018-03-27 10:51:12 +03:00
{ path: '/i/messaging/:user', component: MkMessagingRoom },
2018-03-27 08:13:12 +03:00
{ path: '/i/drive', component: MkDrive },
{ path: '/i/drive/folder/:folder', component: MkDrive },
{ path: '/selectdrive', component: MkSelectDrive },
{ path: '/search', component: MkSearch },
{ path: '/tags/:tag', name: 'tag', component: MkTag },
2018-06-16 12:42:49 +03:00
{ path: '/share', component: MkShare },
2018-08-03 16:42:53 +03:00
{ path: '/reversi/:game?', component: MkReversi },
{ path: '/@:user', name: 'user', component: MkUser },
{ path: '/@:user/following', name: 'userFollowing', component: MkUserFollowingOrFollowers },
{ path: '/@:user/followers', name: 'userFollowers', component: MkUserFollowingOrFollowers },
{ path: '/notes/:note', name: 'note', component: MkNote },
{ path: '/authorize-follow', component: MkFollow }
2018-03-27 08:13:12 +03:00
]
});
2018-02-21 19:00:30 +02:00
// Launch the app
const [app, os] = launch(router);
2018-02-20 19:53:34 +02:00
if (os.store.getters.isSignedIn) {
/**
* Fuck AD Block
*/
fuckAdBlock(app);
}
2018-02-11 05:08:43 +02:00
2016-12-29 00:49:51 +02:00
/**
* Init Notification
*/
2018-08-25 02:39:12 +03:00
if ('Notification' in window && os.store.getters.isSignedIn) {
2016-12-29 00:49:51 +02:00
// 許可を得ていなかったらリクエスト
2017-11-13 11:05:35 +02:00
if ((Notification as any).permission == 'default') {
2017-06-06 18:04:28 +03:00
await Notification.requestPermission();
}
2017-11-13 11:05:35 +02:00
if ((Notification as any).permission == 'granted') {
registerNotifications(os);
2016-12-29 00:49:51 +02:00
}
}
2017-11-21 03:01:00 +02:00
}, true);
2017-06-06 18:04:28 +03:00
function registerNotifications(os: MiOS) {
const stream = os.stream;
2017-06-07 09:19:28 +03:00
if (stream == null) return;
const connection = stream.useSharedConnection('main');
2017-11-16 18:24:44 +02:00
connection.on('notification', notification => {
const _n = composeNotification('notification', notification);
const n = new Notification(_n.title, {
body: _n.body,
icon: _n.icon
2017-06-06 18:04:28 +03:00
});
setTimeout(n.close.bind(n), 6000);
});
connection.on('driveFileCreated', file => {
const _n = composeNotification('driveFileCreated', file);
const n = new Notification(_n.title, {
body: _n.body,
icon: _n.icon
});
setTimeout(n.close.bind(n), 5000);
});
2017-11-16 18:24:44 +02:00
connection.on('unreadMessagingMessage', message => {
const _n = composeNotification('unreadMessagingMessage', message);
const n = new Notification(_n.title, {
body: _n.body,
icon: _n.icon
2017-11-16 18:24:44 +02:00
});
n.onclick = () => {
n.close();
/*(riot as any).mount(document.body.appendChild(document.createElement('mk-messaging-room-window')), {
user: message.user
});*/
};
setTimeout(n.close.bind(n), 7000);
});
2018-03-17 10:53:35 +02:00
connection.on('reversiInvited', matching => {
const _n = composeNotification('reversiInvited', matching);
const n = new Notification(_n.title, {
body: _n.body,
icon: _n.icon
2018-03-17 10:53:35 +02:00
});
});
2017-06-06 18:04:28 +03:00
}