wip
This commit is contained in:
parent
d1aba96a29
commit
92a1429de9
|
@ -115,7 +115,7 @@
|
|||
this.api('auth/deny', {
|
||||
token: this.session.token
|
||||
}).then(() => {
|
||||
this.trigger('denied');
|
||||
this.$emit('denied');
|
||||
});
|
||||
};
|
||||
|
||||
|
@ -123,7 +123,7 @@
|
|||
this.api('auth/accept', {
|
||||
token: this.session.token
|
||||
}).then(() => {
|
||||
this.trigger('accepted');
|
||||
this.$emit('accepted');
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -344,7 +344,7 @@
|
|||
this.registerMessage = message => {
|
||||
message.is_me = message.user_id == this.I.id;
|
||||
message._click = () => {
|
||||
this.trigger('navigate-user', message.is_me ? message.recipient : message.user);
|
||||
this.$emit('navigate-user', message.is_me ? message.recipient : message.user);
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -400,7 +400,7 @@
|
|||
}).then(users => {
|
||||
users.forEach(user => {
|
||||
user._click = () => {
|
||||
this.trigger('navigate-user', user);
|
||||
this.$emit('navigate-user', user);
|
||||
this.searchResult = [];
|
||||
};
|
||||
});
|
||||
|
|
|
@ -111,7 +111,7 @@
|
|||
username: this.$refs.username.value
|
||||
}).then(user => {
|
||||
this.user = user;
|
||||
this.trigger('user', user);
|
||||
this.$emit('user', user);
|
||||
this.update();
|
||||
});
|
||||
};
|
||||
|
|
|
@ -155,7 +155,7 @@
|
|||
};
|
||||
|
||||
this.uploads.push(ctx);
|
||||
this.trigger('change-uploads', this.uploads);
|
||||
this.$emit('change-uploads', this.uploads);
|
||||
this.update();
|
||||
|
||||
const reader = new FileReader();
|
||||
|
@ -176,10 +176,10 @@
|
|||
xhr.onload = e => {
|
||||
const driveFile = JSON.parse(e.target.response);
|
||||
|
||||
this.trigger('uploaded', driveFile);
|
||||
this.$emit('uploaded', driveFile);
|
||||
|
||||
this.uploads = this.uploads.filter(x => x.id != id);
|
||||
this.trigger('change-uploads', this.uploads);
|
||||
this.$emit('change-uploads', this.uploads);
|
||||
|
||||
this.update();
|
||||
};
|
||||
|
|
|
@ -131,7 +131,7 @@
|
|||
el.removeEventListener('mousedown', this.mousedown);
|
||||
});
|
||||
|
||||
this.trigger('closed');
|
||||
this.$emit('closed');
|
||||
this.$destroy();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -178,18 +178,18 @@
|
|||
|
||||
this.ok = () => {
|
||||
this.cropper.getCroppedCanvas().toBlob(blob => {
|
||||
this.trigger('cropped', blob);
|
||||
this.$emit('cropped', blob);
|
||||
this.$refs.window.close();
|
||||
});
|
||||
};
|
||||
|
||||
this.skip = () => {
|
||||
this.trigger('skipped');
|
||||
this.$emit('skipped');
|
||||
this.$refs.window.close();
|
||||
};
|
||||
|
||||
this.cancel = () => {
|
||||
this.trigger('canceled');
|
||||
this.$emit('canceled');
|
||||
this.$refs.window.close();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -17,7 +17,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.$emit('closed');
|
||||
this.$destroy();
|
||||
});
|
||||
});
|
||||
|
|
|
@ -535,13 +535,13 @@
|
|||
this.selectedFiles.push(file);
|
||||
}
|
||||
this.update();
|
||||
this.trigger('change-selection', this.selectedFiles);
|
||||
this.$emit('change-selection', this.selectedFiles);
|
||||
} else {
|
||||
if (isAlreadySelected) {
|
||||
this.trigger('selected', file);
|
||||
this.$emit('selected', file);
|
||||
} else {
|
||||
this.selectedFiles = [file];
|
||||
this.trigger('change-selection', [file]);
|
||||
this.$emit('change-selection', [file]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -578,7 +578,7 @@
|
|||
if (folder.parent) dive(folder.parent);
|
||||
|
||||
this.update();
|
||||
this.trigger('open-folder', folder);
|
||||
this.$emit('open-folder', folder);
|
||||
this.fetch();
|
||||
});
|
||||
};
|
||||
|
@ -648,7 +648,7 @@
|
|||
folder: null,
|
||||
hierarchyFolders: []
|
||||
});
|
||||
this.trigger('move-root');
|
||||
this.$emit('move-root');
|
||||
this.fetch();
|
||||
};
|
||||
|
||||
|
|
|
@ -49,7 +49,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.$emit('closed');
|
||||
this.$destroy();
|
||||
});
|
||||
});
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
this.$refs.ctx.open(pos);
|
||||
|
||||
this.$refs.ctx.on('closed', () => {
|
||||
this.trigger('closed');
|
||||
this.$emit('closed');
|
||||
this.$destroy();
|
||||
});
|
||||
};
|
||||
|
|
|
@ -65,7 +65,7 @@
|
|||
document.addEventListener('keydown', this.onDocumentKeydown);
|
||||
window.addEventListener('scroll', this.onScroll);
|
||||
|
||||
this.fetch(() => this.trigger('loaded'));
|
||||
this.fetch(() => this.$emit('loaded'));
|
||||
});
|
||||
|
||||
this.on('unmount', () => {
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
document.addEventListener('keydown', this.onDocumentKeydown);
|
||||
window.addEventListener('scroll', this.onScroll);
|
||||
|
||||
this.load(() => this.trigger('loaded'));
|
||||
this.load(() => this.$emit('loaded'));
|
||||
});
|
||||
|
||||
this.on('unmount', () => {
|
||||
|
|
|
@ -1,57 +1,243 @@
|
|||
<template>
|
||||
<div :data-customize="customize">
|
||||
<div class="customize" v-if="customize">
|
||||
<a href="/">%fa:check%完了</a>
|
||||
<div>
|
||||
<div class="adder">
|
||||
<p>ウィジェットを追加:</p>
|
||||
<select ref="widgetSelector">
|
||||
<option value="profile">プロフィール</option>
|
||||
<option value="calendar">カレンダー</option>
|
||||
<option value="timemachine">カレンダー(タイムマシン)</option>
|
||||
<option value="activity">アクティビティ</option>
|
||||
<option value="rss-reader">RSSリーダー</option>
|
||||
<option value="trends">トレンド</option>
|
||||
<option value="photo-stream">フォトストリーム</option>
|
||||
<option value="slideshow">スライドショー</option>
|
||||
<option value="version">バージョン</option>
|
||||
<option value="broadcast">ブロードキャスト</option>
|
||||
<option value="notifications">通知</option>
|
||||
<option value="user-recommendation">おすすめユーザー</option>
|
||||
<option value="recommended-polls">投票</option>
|
||||
<option value="post-form">投稿フォーム</option>
|
||||
<option value="messaging">メッセージ</option>
|
||||
<option value="channel">チャンネル</option>
|
||||
<option value="access-log">アクセスログ</option>
|
||||
<option value="server">サーバー情報</option>
|
||||
<option value="donation">寄付のお願い</option>
|
||||
<option value="nav">ナビゲーション</option>
|
||||
<option value="tips">ヒント</option>
|
||||
</select>
|
||||
<button @click="addWidget">追加</button>
|
||||
</div>
|
||||
<div class="trash">
|
||||
<div ref="trash"></div>
|
||||
<p>ゴミ箱</p>
|
||||
</div>
|
||||
<div :data-customize="customize">
|
||||
<div class="customize" v-if="customize">
|
||||
<a href="/">%fa:check%完了</a>
|
||||
<div>
|
||||
<div class="adder">
|
||||
<p>ウィジェットを追加:</p>
|
||||
<select ref="widgetSelector">
|
||||
<option value="profile">プロフィール</option>
|
||||
<option value="calendar">カレンダー</option>
|
||||
<option value="timemachine">カレンダー(タイムマシン)</option>
|
||||
<option value="activity">アクティビティ</option>
|
||||
<option value="rss-reader">RSSリーダー</option>
|
||||
<option value="trends">トレンド</option>
|
||||
<option value="photo-stream">フォトストリーム</option>
|
||||
<option value="slideshow">スライドショー</option>
|
||||
<option value="version">バージョン</option>
|
||||
<option value="broadcast">ブロードキャスト</option>
|
||||
<option value="notifications">通知</option>
|
||||
<option value="user-recommendation">おすすめユーザー</option>
|
||||
<option value="recommended-polls">投票</option>
|
||||
<option value="post-form">投稿フォーム</option>
|
||||
<option value="messaging">メッセージ</option>
|
||||
<option value="channel">チャンネル</option>
|
||||
<option value="access-log">アクセスログ</option>
|
||||
<option value="server">サーバー情報</option>
|
||||
<option value="donation">寄付のお願い</option>
|
||||
<option value="nav">ナビゲーション</option>
|
||||
<option value="tips">ヒント</option>
|
||||
</select>
|
||||
<button @click="addWidget">追加</button>
|
||||
</div>
|
||||
<div class="trash">
|
||||
<div ref="trash"></div>
|
||||
<p>ゴミ箱</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div ref="left" data-place="left"></div>
|
||||
</div>
|
||||
<main ref="main">
|
||||
<div class="maintop" ref="maintop" data-place="main" v-if="customize"></div>
|
||||
<mk-timeline-home-widget ref="tl" v-if="mode == 'timeline'"/>
|
||||
<mk-mentions-home-widget ref="tl" v-if="mode == 'mentions'"/>
|
||||
</main>
|
||||
<div class="right">
|
||||
<div ref="right" data-place="right"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div ref="left" data-place="left">
|
||||
<template v-for="widget in leftWidgets">
|
||||
<div class="customize-container" v-if="customize" :key="widget.id" @contextmenu="onWidgetContextmenu.stop.prevent(widget.id)">
|
||||
<component :is="widget.name" :widget="widget" :ref="widget.id"></component>
|
||||
</div>
|
||||
<template v-else>
|
||||
<component :is="widget.name" :key="widget.id" :widget="widget" :ref="widget.id"></component>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<main ref="main">
|
||||
<div class="maintop" ref="maintop" data-place="main" v-if="customize">
|
||||
<template v-for="widget in centerWidgets">
|
||||
<div class="customize-container" v-if="customize" :key="widget.id" @contextmenu="onWidgetContextmenu.stop.prevent(widget.id)">
|
||||
<component :is="widget.name" :widget="widget" :ref="widget.id"></component>
|
||||
</div>
|
||||
<template v-else>
|
||||
<component :is="widget.name" :key="widget.id" :widget="widget" :ref="widget.id"></component>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
<mk-timeline-home-widget ref="tl" v-on:loaded="onTlLoaded" v-if="mode == 'timeline'"/>
|
||||
<mk-mentions-home-widget ref="tl" v-on:loaded="onTlLoaded" v-if="mode == 'mentions'"/>
|
||||
</main>
|
||||
<div class="right">
|
||||
<div ref="right" data-place="right">
|
||||
<template v-for="widget in rightWidgets">
|
||||
<div class="customize-container" v-if="customize" :key="widget.id" @contextmenu="onWidgetContextmenu.stop.prevent(widget.id)">
|
||||
<component :is="widget.name" :widget="widget" :ref="widget.id"></component>
|
||||
</div>
|
||||
<template v-else>
|
||||
<component :is="widget.name" :key="widget.id" :widget="widget" :ref="widget.id"></component>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="typescript">
|
||||
import uuid from 'uuid';
|
||||
import Sortable from 'sortablejs';
|
||||
import I from '../../common/i';
|
||||
import { resolveSrv } from 'dns';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
customize: Boolean,
|
||||
mode: {
|
||||
type: String,
|
||||
default: 'timeline'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
home: [],
|
||||
bakedHomeData: null
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
bakeHomeData() {
|
||||
return JSON.stringify(this.I.client_settings.home);
|
||||
},
|
||||
onTlLoaded() {
|
||||
this.$emit('loaded');
|
||||
},
|
||||
onMeRefreshed() {
|
||||
if (this.bakedHomeData != this.bakeHomeData()) {
|
||||
// TODO: i18n
|
||||
alert('別の場所でホームが編集されました。ページを再度読み込みすると編集が反映されます。');
|
||||
}
|
||||
},
|
||||
onWidgetContextmenu(widgetId) {
|
||||
this.$refs[widgetId].func();
|
||||
},
|
||||
addWidget() {
|
||||
const widget = {
|
||||
name: this.$refs.widgetSelector.options[this.$refs.widgetSelector.selectedIndex].value,
|
||||
id: uuid(),
|
||||
place: 'left',
|
||||
data: {}
|
||||
};
|
||||
|
||||
this.I.client_settings.home.unshift(widget);
|
||||
|
||||
this.saveHome();
|
||||
},
|
||||
saveHome() {
|
||||
/*const data = [];
|
||||
|
||||
Array.from(this.$refs.left.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'left';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
Array.from(this.$refs.right.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'right';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
Array.from(this.$refs.maintop.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'main';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
this.api('i/update_home', {
|
||||
home: data
|
||||
}).then(() => {
|
||||
this.I.update();
|
||||
});*/
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
leftWidgets() {
|
||||
return this.I.client_settings.home.filter(w => w.place == 'left');
|
||||
},
|
||||
centerWidgets() {
|
||||
return this.I.client_settings.home.filter(w => w.place == 'center');
|
||||
},
|
||||
rightWidgets() {
|
||||
return this.I.client_settings.home.filter(w => w.place == 'right');
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.bakedHomeData = this.bakeHomeData();
|
||||
},
|
||||
mounted() {
|
||||
this.I.on('refreshed', this.onMeRefreshed);
|
||||
|
||||
this.I.client_settings.home.forEach(widget => {
|
||||
try {
|
||||
this.setWidget(widget);
|
||||
} catch (e) {
|
||||
// noop
|
||||
}
|
||||
});
|
||||
|
||||
if (!this.opts.customize) {
|
||||
if (this.$refs.left.children.length == 0) {
|
||||
this.$refs.left.parentNode.removeChild(this.$refs.left);
|
||||
}
|
||||
if (this.$refs.right.children.length == 0) {
|
||||
this.$refs.right.parentNode.removeChild(this.$refs.right);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.opts.customize) {
|
||||
dialog('%fa:info-circle%カスタマイズのヒント',
|
||||
'<p>ホームのカスタマイズでは、ウィジェットを追加/削除したり、ドラッグ&ドロップして並べ替えたりすることができます。</p>' +
|
||||
'<p>一部のウィジェットは、<strong><strong>右</strong>クリック</strong>することで表示を変更することができます。</p>' +
|
||||
'<p>ウィジェットを削除するには、ヘッダーの<strong>「ゴミ箱」</strong>と書かれたエリアにウィジェットをドラッグ&ドロップします。</p>' +
|
||||
'<p>カスタマイズを終了するには、右上の「完了」をクリックします。</p>',
|
||||
[{
|
||||
text: 'Got it!'
|
||||
}]);
|
||||
|
||||
const sortableOption = {
|
||||
group: 'kyoppie',
|
||||
animation: 150,
|
||||
onMove: evt => {
|
||||
const id = evt.dragged.getAttribute('data-widget-id');
|
||||
this.home.find(tag => tag.id == id).update({ place: evt.to.getAttribute('data-place') });
|
||||
},
|
||||
onSort: () => {
|
||||
this.saveHome();
|
||||
}
|
||||
};
|
||||
|
||||
new Sortable(this.$refs.left, sortableOption);
|
||||
new Sortable(this.$refs.right, sortableOption);
|
||||
new Sortable(this.$refs.maintop, sortableOption);
|
||||
new Sortable(this.$refs.trash, Object.assign({}, sortableOption, {
|
||||
onAdd: evt => {
|
||||
const el = evt.item;
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
el.parentNode.removeChild(el);
|
||||
this.I.client_settings.home = this.I.client_settings.home.filter(w => w.id != id);
|
||||
this.saveHome();
|
||||
}
|
||||
}));
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.I.off('refreshed', this.onMeRefreshed);
|
||||
|
||||
this.home.forEach(widget => {
|
||||
widget.unmount();
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
:scope
|
||||
display block
|
||||
|
@ -184,209 +370,3 @@
|
|||
margin 0 auto
|
||||
|
||||
</style>
|
||||
|
||||
<script lang="typescript">
|
||||
import uuid from 'uuid';
|
||||
import Sortable from 'sortablejs';
|
||||
import dialog from '../scripts/dialog';
|
||||
import ScrollFollower from '../scripts/scroll-follower';
|
||||
|
||||
this.mixin('i');
|
||||
this.mixin('api');
|
||||
|
||||
this.mode = this.opts.mode || 'timeline';
|
||||
|
||||
this.home = [];
|
||||
|
||||
this.bakeHomeData = () => JSON.stringify(this.I.client_settings.home);
|
||||
this.bakedHomeData = this.bakeHomeData();
|
||||
|
||||
this.on('mount', () => {
|
||||
this.$refs.tl.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
});
|
||||
|
||||
this.I.on('refreshed', this.onMeRefreshed);
|
||||
|
||||
this.I.client_settings.home.forEach(widget => {
|
||||
try {
|
||||
this.setWidget(widget);
|
||||
} catch (e) {
|
||||
// noop
|
||||
}
|
||||
});
|
||||
|
||||
if (!this.opts.customize) {
|
||||
if (this.$refs.left.children.length == 0) {
|
||||
this.$refs.left.parentNode.removeChild(this.$refs.left);
|
||||
}
|
||||
if (this.$refs.right.children.length == 0) {
|
||||
this.$refs.right.parentNode.removeChild(this.$refs.right);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.opts.customize) {
|
||||
dialog('%fa:info-circle%カスタマイズのヒント',
|
||||
'<p>ホームのカスタマイズでは、ウィジェットを追加/削除したり、ドラッグ&ドロップして並べ替えたりすることができます。</p>' +
|
||||
'<p>一部のウィジェットは、<strong><strong>右</strong>クリック</strong>することで表示を変更することができます。</p>' +
|
||||
'<p>ウィジェットを削除するには、ヘッダーの<strong>「ゴミ箱」</strong>と書かれたエリアにウィジェットをドラッグ&ドロップします。</p>' +
|
||||
'<p>カスタマイズを終了するには、右上の「完了」をクリックします。</p>',
|
||||
[{
|
||||
text: 'Got it!'
|
||||
}]);
|
||||
|
||||
const sortableOption = {
|
||||
group: 'kyoppie',
|
||||
animation: 150,
|
||||
onMove: evt => {
|
||||
const id = evt.dragged.getAttribute('data-widget-id');
|
||||
this.home.find(tag => tag.id == id).update({ place: evt.to.getAttribute('data-place') });
|
||||
},
|
||||
onSort: () => {
|
||||
this.saveHome();
|
||||
}
|
||||
};
|
||||
|
||||
new Sortable(this.$refs.left, sortableOption);
|
||||
new Sortable(this.$refs.right, sortableOption);
|
||||
new Sortable(this.$refs.maintop, sortableOption);
|
||||
new Sortable(this.$refs.trash, Object.assign({}, sortableOption, {
|
||||
onAdd: evt => {
|
||||
const el = evt.item;
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
el.parentNode.removeChild(el);
|
||||
this.I.client_settings.home = this.I.client_settings.home.filter(w => w.id != id);
|
||||
this.saveHome();
|
||||
}
|
||||
}));
|
||||
}
|
||||
|
||||
if (!this.opts.customize) {
|
||||
this.scrollFollowerLeft = this.$refs.left.parentNode ? new ScrollFollower(this.$refs.left, this.root.getBoundingClientRect().top) : null;
|
||||
this.scrollFollowerRight = this.$refs.right.parentNode ? new ScrollFollower(this.$refs.right, this.root.getBoundingClientRect().top) : null;
|
||||
}
|
||||
});
|
||||
|
||||
this.on('unmount', () => {
|
||||
this.I.off('refreshed', this.onMeRefreshed);
|
||||
|
||||
this.home.forEach(widget => {
|
||||
widget.unmount();
|
||||
});
|
||||
|
||||
if (!this.opts.customize) {
|
||||
if (this.scrollFollowerLeft) this.scrollFollowerLeft.dispose();
|
||||
if (this.scrollFollowerRight) this.scrollFollowerRight.dispose();
|
||||
}
|
||||
});
|
||||
|
||||
this.onMeRefreshed = () => {
|
||||
if (this.bakedHomeData != this.bakeHomeData()) {
|
||||
alert('別の場所でホームが編集されました。ページを再度読み込みすると編集が反映されます。');
|
||||
}
|
||||
};
|
||||
|
||||
this.setWidget = (widget, prepend = false) => {
|
||||
const el = document.createElement(`mk-${widget.name}-home-widget`);
|
||||
|
||||
let actualEl;
|
||||
|
||||
if (this.opts.customize) {
|
||||
const container = document.createElement('div');
|
||||
container.classList.add('customize-container');
|
||||
container.setAttribute('data-widget-id', widget.id);
|
||||
container.appendChild(el);
|
||||
actualEl = container;
|
||||
} else {
|
||||
actualEl = el;
|
||||
}
|
||||
|
||||
switch (widget.place) {
|
||||
case 'left':
|
||||
if (prepend) {
|
||||
this.$refs.left.insertBefore(actualEl, this.$refs.left.firstChild);
|
||||
} else {
|
||||
this.$refs.left.appendChild(actualEl);
|
||||
}
|
||||
break;
|
||||
case 'right':
|
||||
if (prepend) {
|
||||
this.$refs.right.insertBefore(actualEl, this.$refs.right.firstChild);
|
||||
} else {
|
||||
this.$refs.right.appendChild(actualEl);
|
||||
}
|
||||
break;
|
||||
case 'main':
|
||||
if (this.opts.customize) {
|
||||
this.$refs.maintop.appendChild(actualEl);
|
||||
} else {
|
||||
this.$refs.main.insertBefore(actualEl, this.$refs.tl.root);
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
const tag = riot.mount(el, {
|
||||
id: widget.id,
|
||||
data: widget.data,
|
||||
place: widget.place,
|
||||
tl: this.$refs.tl
|
||||
})[0];
|
||||
|
||||
this.home.push(tag);
|
||||
|
||||
if (this.opts.customize) {
|
||||
actualEl.oncontextmenu = e => {
|
||||
e.preventDefault();
|
||||
e.stopImmediatePropagation();
|
||||
if (tag.func) tag.func();
|
||||
return false;
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
this.addWidget = () => {
|
||||
const widget = {
|
||||
name: this.$refs.widgetSelector.options[this.$refs.widgetSelector.selectedIndex].value,
|
||||
id: uuid(),
|
||||
place: 'left',
|
||||
data: {}
|
||||
};
|
||||
|
||||
this.I.client_settings.home.unshift(widget);
|
||||
|
||||
this.setWidget(widget, true);
|
||||
|
||||
this.saveHome();
|
||||
};
|
||||
|
||||
this.saveHome = () => {
|
||||
const data = [];
|
||||
|
||||
Array.from(this.$refs.left.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'left';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
Array.from(this.$refs.right.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'right';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
Array.from(this.$refs.maintop.children).forEach(el => {
|
||||
const id = el.getAttribute('data-widget-id');
|
||||
const widget = this.I.client_settings.home.find(w => w.id == id);
|
||||
widget.place = 'main';
|
||||
data.push(widget);
|
||||
});
|
||||
|
||||
this.api('i/update_home', {
|
||||
home: data
|
||||
}).then(() => {
|
||||
this.I.update();
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -324,7 +324,7 @@
|
|||
});
|
||||
|
||||
this.$refs.uploader.on('change-uploads', uploads => {
|
||||
this.trigger('change-uploading-files', uploads);
|
||||
this.$emit('change-uploading-files', uploads);
|
||||
});
|
||||
|
||||
this.autocomplete = new Autocomplete(this.$refs.text);
|
||||
|
@ -340,7 +340,7 @@
|
|||
this.update();
|
||||
this.$refs.poll.set(draft.data.poll);
|
||||
}
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
}
|
||||
|
||||
|
@ -361,7 +361,7 @@
|
|||
this.$refs.text.value = '';
|
||||
this.files = [];
|
||||
this.poll = false;
|
||||
this.trigger('change-files');
|
||||
this.$emit('change-files');
|
||||
this.update();
|
||||
};
|
||||
|
||||
|
@ -444,14 +444,14 @@
|
|||
|
||||
this.addFile = file => {
|
||||
this.files.push(file);
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
};
|
||||
|
||||
this.removeFile = e => {
|
||||
const file = e.item;
|
||||
this.files = this.files.filter(x => x.id != file.id);
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
};
|
||||
|
||||
|
@ -487,7 +487,7 @@
|
|||
}).then(data => {
|
||||
this.clear();
|
||||
this.removeDraft();
|
||||
this.trigger('post');
|
||||
this.$emit('post');
|
||||
notify(this.repost
|
||||
? '%i18n:desktop.tags.mk-post-form.reposted%'
|
||||
: this.inReplyToPost
|
||||
|
|
|
@ -93,7 +93,7 @@
|
|||
this.quote = false;
|
||||
|
||||
this.cancel = () => {
|
||||
this.trigger('cancel');
|
||||
this.$emit('cancel');
|
||||
};
|
||||
|
||||
this.ok = () => {
|
||||
|
@ -101,7 +101,7 @@
|
|||
this.api('posts/create', {
|
||||
repost_id: this.opts.post.id
|
||||
}).then(data => {
|
||||
this.trigger('posted');
|
||||
this.$emit('posted');
|
||||
notify('%i18n:desktop.tags.mk-repost-form.success%');
|
||||
}).catch(err => {
|
||||
notify('%i18n:desktop.tags.mk-repost-form.failure%');
|
||||
|
@ -118,7 +118,7 @@
|
|||
});
|
||||
|
||||
this.$refs.form.on('post', () => {
|
||||
this.trigger('posted');
|
||||
this.$emit('posted');
|
||||
});
|
||||
|
||||
this.$refs.form.focus();
|
||||
|
|
|
@ -54,7 +54,7 @@
|
|||
isEmpty: posts.length == 0
|
||||
});
|
||||
this.$refs.timeline.setPosts(posts);
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.posts.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -166,7 +166,7 @@
|
|||
};
|
||||
|
||||
this.ok = () => {
|
||||
this.trigger('selected', this.multiple ? this.files : this.files[0]);
|
||||
this.$emit('selected', this.multiple ? this.files : this.files[0]);
|
||||
this.$refs.window.close();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -105,7 +105,7 @@
|
|||
};
|
||||
|
||||
this.ok = () => {
|
||||
this.trigger('selected', this.$refs.window.refs.browser.folder);
|
||||
this.$emit('selected', this.$refs.window.refs.browser.folder);
|
||||
this.$refs.window.close();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -76,7 +76,7 @@
|
|||
user: user
|
||||
});
|
||||
|
||||
this.fetch(() => this.trigger('loaded'));
|
||||
this.fetch(() => this.$emit('loaded'));
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
fetching: false,
|
||||
user: user
|
||||
});
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
@ -716,7 +716,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.tl.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
|
||||
this.scrollFollowerLeft = new ScrollFollower(this.$refs.left, this.parent.root.getBoundingClientRect().top);
|
||||
|
@ -778,7 +778,7 @@
|
|||
</style>
|
||||
<script lang="typescript">
|
||||
this.on('mount', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
</script>
|
||||
</mk-user-graphs>
|
||||
|
|
|
@ -98,7 +98,7 @@
|
|||
this.moreFetching = false;
|
||||
|
||||
this.on('mount', () => {
|
||||
this.fetch(() => this.trigger('loaded'));
|
||||
this.fetch(() => this.$emit('loaded'));
|
||||
});
|
||||
|
||||
this.fetch = cb => {
|
||||
|
|
|
@ -82,7 +82,7 @@
|
|||
this.view++;
|
||||
if (this.view == 2) this.view = 0;
|
||||
this.update();
|
||||
this.trigger('view-changed', this.view);
|
||||
this.$emit('view-changed', this.view);
|
||||
};
|
||||
</script>
|
||||
</mk-activity-widget>
|
||||
|
|
|
@ -231,7 +231,7 @@
|
|||
};
|
||||
|
||||
this.open = () => {
|
||||
this.trigger('opening');
|
||||
this.$emit('opening');
|
||||
|
||||
this.top();
|
||||
|
||||
|
@ -257,7 +257,7 @@
|
|||
//this.$refs.main.focus();
|
||||
|
||||
setTimeout(() => {
|
||||
this.trigger('opened');
|
||||
this.$emit('opened');
|
||||
}, 300);
|
||||
};
|
||||
|
||||
|
@ -278,7 +278,7 @@
|
|||
};
|
||||
|
||||
this.close = () => {
|
||||
this.trigger('closing');
|
||||
this.$emit('closing');
|
||||
|
||||
if (this.isModal) {
|
||||
this.$refs.bg.style.pointerEvents = 'none';
|
||||
|
@ -301,7 +301,7 @@
|
|||
});
|
||||
|
||||
setTimeout(() => {
|
||||
this.trigger('closed');
|
||||
this.$emit('closed');
|
||||
}, 300);
|
||||
};
|
||||
|
||||
|
|
|
@ -57,12 +57,12 @@
|
|||
</style>
|
||||
<script lang="typescript">
|
||||
this.cancel = () => {
|
||||
this.trigger('canceled');
|
||||
this.$emit('canceled');
|
||||
this.$destroy();
|
||||
};
|
||||
|
||||
this.ok = () => {
|
||||
this.trigger('selected', this.$refs.browser.folder);
|
||||
this.$emit('selected', this.$refs.browser.folder);
|
||||
this.$destroy();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -70,18 +70,18 @@
|
|||
});
|
||||
|
||||
this.$refs.browser.on('selected', file => {
|
||||
this.trigger('selected', file);
|
||||
this.$emit('selected', file);
|
||||
this.$destroy();
|
||||
});
|
||||
});
|
||||
|
||||
this.cancel = () => {
|
||||
this.trigger('canceled');
|
||||
this.$emit('canceled');
|
||||
this.$destroy();
|
||||
};
|
||||
|
||||
this.ok = () => {
|
||||
this.trigger('selected', this.files);
|
||||
this.$emit('selected', this.files);
|
||||
this.$destroy();
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -274,7 +274,7 @@
|
|||
if (folder.parent) dive(folder.parent);
|
||||
|
||||
this.update();
|
||||
this.trigger('open-folder', this.folder, silent);
|
||||
this.$emit('open-folder', this.folder, silent);
|
||||
this.fetch();
|
||||
});
|
||||
};
|
||||
|
@ -343,7 +343,7 @@
|
|||
folder: null,
|
||||
hierarchyFolders: []
|
||||
});
|
||||
this.trigger('move-root');
|
||||
this.$emit('move-root');
|
||||
this.fetch();
|
||||
}
|
||||
|
||||
|
@ -359,7 +359,7 @@
|
|||
fetching: true
|
||||
});
|
||||
|
||||
this.trigger('begin-fetch');
|
||||
this.$emit('begin-fetch');
|
||||
|
||||
let fetchedFolders = null;
|
||||
let fetchedFiles = null;
|
||||
|
@ -402,11 +402,11 @@
|
|||
fetching: false
|
||||
});
|
||||
// 一連の読み込みが完了したイベントを発行
|
||||
this.trigger('fetched');
|
||||
this.$emit('fetched');
|
||||
} else {
|
||||
flag = true;
|
||||
// 一連の読み込みが半分完了したイベントを発行
|
||||
this.trigger('fetch-mid');
|
||||
this.$emit('fetch-mid');
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -455,9 +455,9 @@
|
|||
this.selectedFiles.push(file);
|
||||
}
|
||||
this.update();
|
||||
this.trigger('change-selection', this.selectedFiles);
|
||||
this.$emit('change-selection', this.selectedFiles);
|
||||
} else {
|
||||
this.trigger('selected', file);
|
||||
this.$emit('selected', file);
|
||||
}
|
||||
} else {
|
||||
this.cf(file);
|
||||
|
@ -482,7 +482,7 @@
|
|||
if (file.folder) dive(file.folder);
|
||||
|
||||
this.update();
|
||||
this.trigger('open-file', this.file, silent);
|
||||
this.$emit('open-file', this.file, silent);
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
@ -22,7 +22,7 @@
|
|||
this.init = new Promise((res, rej) => {
|
||||
this.api('posts/timeline').then(posts => {
|
||||
res(posts);
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
<script lang="typescript">
|
||||
this.on('mount', () => {
|
||||
this.$refs.tl.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -106,7 +106,7 @@
|
|||
notifications: notifications
|
||||
});
|
||||
|
||||
this.trigger('fetched');
|
||||
this.$emit('fetched');
|
||||
});
|
||||
|
||||
this.connection.on('notification', this.onNotification);
|
||||
|
|
|
@ -161,7 +161,7 @@
|
|||
});
|
||||
|
||||
this.$refs.uploader.on('change-uploads', uploads => {
|
||||
this.trigger('change-uploading-files', uploads);
|
||||
this.$emit('change-uploading-files', uploads);
|
||||
});
|
||||
|
||||
this.$refs.text.focus();
|
||||
|
@ -207,19 +207,19 @@
|
|||
this.addFile = file => {
|
||||
file._remove = () => {
|
||||
this.files = this.files.filter(x => x.id != file.id);
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
};
|
||||
|
||||
this.files.push(file);
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
};
|
||||
|
||||
this.removeFile = e => {
|
||||
const file = e.item;
|
||||
this.files = this.files.filter(x => x.id != file.id);
|
||||
this.trigger('change-files', this.files);
|
||||
this.$emit('change-files', this.files);
|
||||
this.update();
|
||||
};
|
||||
|
||||
|
@ -254,7 +254,7 @@
|
|||
reply_id: opts.reply ? opts.reply.id : undefined,
|
||||
poll: this.poll ? this.$refs.poll.get() : undefined
|
||||
}).then(data => {
|
||||
this.trigger('post');
|
||||
this.$emit('post');
|
||||
this.$destroy();
|
||||
}).catch(err => {
|
||||
this.update({
|
||||
|
@ -264,7 +264,7 @@
|
|||
};
|
||||
|
||||
this.cancel = () => {
|
||||
this.trigger('cancel');
|
||||
this.$emit('cancel');
|
||||
this.$destroy();
|
||||
};
|
||||
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
this.init = new Promise((res, rej) => {
|
||||
this.api('posts/search', parse(this.query)).then(posts => {
|
||||
res(posts);
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.posts.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.list.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
this.on('mount', () => {
|
||||
this.$refs.list.on('loaded', () => {
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
with_media: this.withMedia
|
||||
}).then(posts => {
|
||||
res(posts);
|
||||
this.trigger('loaded');
|
||||
this.$emit('loaded');
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -201,7 +201,7 @@
|
|||
}).then(user => {
|
||||
this.fetching = false;
|
||||
this.user = user;
|
||||
this.trigger('loaded', user);
|
||||
this.$emit('loaded', user);
|
||||
this.update();
|
||||
});
|
||||
});
|
||||
|
|
|
@ -87,7 +87,7 @@
|
|||
this.moreFetching = false;
|
||||
|
||||
this.on('mount', () => {
|
||||
this.fetch(() => this.trigger('loaded'));
|
||||
this.fetch(() => this.$emit('loaded'));
|
||||
});
|
||||
|
||||
this.fetch = cb => {
|
||||
|
|
Loading…
Reference in New Issue