Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' into migrate-accounts-to-idb

Browse source
This commit is contained in:
tamaina 2021-07-27 00:41:31 +09:00
commit 66b4eaf72e
91 changed files with 2729 additions and 502 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/client/components/analog-clock.vue
View file

@ -5,7 +5,8 @@
:cy="5 - (Math.cos(angle) * (5 - graduationsPadding))"
:r="i % 5 == 0 ? 0.125 : 0.05"
:fill="i % 5 == 0 ? majorGraduationColor : minorGraduationColor"
:key="i"/>
:key="i"
/>
<line
:x1="5 - (Math.sin(sAngle) * (sHandLengthRatio * handsTailLength))"
@ -13,7 +14,9 @@
:x2="5 + (Math.sin(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
:y2="5 - (Math.cos(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
:stroke="sHandColor"
stroke-width="0.05"/>
:stroke-width="thickness / 2"
stroke-linecap="round"
/>
<line
:x1="5 - (Math.sin(mAngle) * (mHandLengthRatio * handsTailLength))"
@ -21,7 +24,9 @@
:x2="5 + (Math.sin(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
:y2="5 - (Math.cos(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
:stroke="mHandColor"
stroke-width="0.1"/>
:stroke-width="thickness"
stroke-linecap="round"
/>
<line
:x1="5 - (Math.sin(hAngle) * (hHandLengthRatio * handsTailLength))"
@ -29,16 +34,24 @@
:x2="5 + (Math.sin(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
:y2="5 - (Math.cos(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
:stroke="hHandColor"
stroke-width="0.1"/>
:stroke-width="thickness"
stroke-linecap="round"
/>
</svg>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import * as tinycolor from 'tinycolor2';
import * as os from '@client/os';
export default defineComponent({
props: {
thickness: {
type: Number,
default: 0.1
}
},
data() {
return {
now: new Date(),

4
src/client/components/drive.vue
View file

@ -46,7 +46,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import XNavFolder from './drive.nav-folder.vue';
import XFolder from './drive.folder.vue';
import XFile from './drive.file.vue';
@ -139,7 +139,7 @@ export default defineComponent({
});
}
this.connection = os.stream.useChannel('drive');
this.connection = markRaw(os.stream.useChannel('drive'));
this.connection.on('fileCreated', this.onStreamDriveFileCreated);
this.connection.on('fileUpdated', this.onStreamDriveFileUpdated);

4
src/client/components/follow-button.vue
View file

@ -28,7 +28,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import * as os from '@client/os';
export default defineComponent({
@ -71,7 +71,7 @@ export default defineComponent({
},
mounted() {
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('follow', this.onFollowChange);
this.connection.on('unfollow', this.onFollowChange);

6
src/client/components/form-dialog.vue
View file

@ -34,6 +34,10 @@
<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
<option v-for="item in form[item].enum" :value="item.value" :key="item.value">{{ item.label }}</option>
</FormSelect>
<FormRadios v-else-if="form[item].type === 'radio'" v-model="values[item]">
<template #desc><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
<option v-for="item in form[item].options" :value="item.value" :key="item.value">{{ item.label }}</option>
</FormRadios>
<FormRange v-else-if="form[item].type === 'range'" v-model:value="values[item]" :min="form[item].mim" :max="form[item].max" :step="form[item].step">
<template #label><span v-text="form[item].label || item"></span><span v-if="form[item].required === false"> ({{ $ts.optional }})</span></template>
<template v-if="form[item].description" #desc>{{ form[item].description }}</template>
@ -56,6 +60,7 @@ import FormSwitch from './form/switch.vue';
import FormSelect from './form/select.vue';
import FormRange from './form/range.vue';
import FormButton from './form/button.vue';
import FormRadios from './form/radios.vue';
export default defineComponent({
components: {
@ -67,6 +72,7 @@ export default defineComponent({
FormSelect,
FormRange,
FormButton,
FormRadios,
},
props: {

7
src/client/components/form/radios.vue
View file

@ -27,7 +27,10 @@ export default defineComponent({
},
render() {
const label = this.$slots.desc();
const options = this.$slots.default();
let options = this.$slots.default();
// なぜかFragmentになることがあるため
if (options.length === 1 && options[0].props == null) options = options[0].children;
return h('div', {
class: 'cnklmpwm _formItem'
@ -37,7 +40,7 @@ export default defineComponent({
}, label),
...options.map(option => h('button', {
class: '_button _formPanel _formClickable',
key: option.props.value,
key: option.key,
onClick: () => this.value = option.props.value,
}, [h('span', {
class: ['check', { checked: this.value === option.props.value }],

4
src/client/components/notification.vue
View file

@ -58,7 +58,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import { getNoteSummary } from '@/misc/get-note-summary';
import XReactionIcon from './reaction-icon.vue';
import MkFollowButton from './follow-button.vue';
@ -109,7 +109,7 @@ export default defineComponent({
this.readObserver.observe(this.$el);
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('readAllNotifications', () => this.readObserver.unobserve(this.$el));
}
},

4
src/client/components/notifications.vue
View file

@ -21,7 +21,7 @@
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { defineComponent, PropType, markRaw } from 'vue';
import paging from '@client/scripts/paging';
import XNotification from './notification.vue';
import XList from './date-separated-list.vue';
@ -89,7 +89,7 @@ export default defineComponent({
},
mounted() {
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('notification', this.onNotification);
},

2
src/client/components/tab.vue
View file

@ -14,7 +14,7 @@ export default defineComponent({
class: 'pxhvhrfw',
}, options.map(option => withDirectives(h('button', {
class: ['_button', { active: this.value === option.props.value }],
key: option.props.value,
key: option.key,
disabled: this.value === option.props.value,
onClick: () => {
this.$emit('update:value', option.props.value);

28
src/client/components/timeline.vue
View file

@ -3,7 +3,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import XNotes from './notes.vue';
import * as os from '@client/os';
import * as sound from '@client/scripts/sound';
@ -92,33 +92,33 @@ export default defineComponent({
this.query = {
antennaId: this.antenna
};
this.connection = os.stream.useChannel('antenna', {
this.connection = markRaw(os.stream.useChannel('antenna', {
antennaId: this.antenna
});
}));
this.connection.on('note', prepend);
} else if (this.src == 'home') {
endpoint = 'notes/timeline';
this.connection = os.stream.useChannel('homeTimeline');
this.connection = markRaw(os.stream.useChannel('homeTimeline'));
this.connection.on('note', prepend);
this.connection2 = os.stream.useChannel('main');
this.connection2 = markRaw(os.stream.useChannel('main'));
this.connection2.on('follow', onChangeFollowing);
this.connection2.on('unfollow', onChangeFollowing);
} else if (this.src == 'local') {
endpoint = 'notes/local-timeline';
this.connection = os.stream.useChannel('localTimeline');
this.connection = markRaw(os.stream.useChannel('localTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'social') {
endpoint = 'notes/hybrid-timeline';
this.connection = os.stream.useChannel('hybridTimeline');
this.connection = markRaw(os.stream.useChannel('hybridTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'global') {
endpoint = 'notes/global-timeline';
this.connection = os.stream.useChannel('globalTimeline');
this.connection = markRaw(os.stream.useChannel('globalTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'mentions') {
endpoint = 'notes/mentions';
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('mention', prepend);
} else if (this.src == 'directs') {
endpoint = 'notes/mentions';
@ -130,16 +130,16 @@ export default defineComponent({
prepend(note);
}
};
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('mention', onNote);
} else if (this.src == 'list') {
endpoint = 'notes/user-list-timeline';
this.query = {
listId: this.list
};
this.connection = os.stream.useChannel('userList', {
this.connection = markRaw(os.stream.useChannel('userList', {
listId: this.list
});
}));
this.connection.on('note', prepend);
this.connection.on('userAdded', onUserAdded);
this.connection.on('userRemoved', onUserRemoved);
@ -148,9 +148,9 @@ export default defineComponent({
this.query = {
channelId: this.channel
};
this.connection = os.stream.useChannel('channel', {
this.connection = markRaw(os.stream.useChannel('channel', {
channelId: this.channel
});
}));
this.connection.on('note', prepend);
}

7
src/client/components/ui/radios.vue
View file

@ -23,14 +23,17 @@ export default defineComponent({
},
render() {
const label = this.$slots.desc();
const options = this.$slots.default();
let options = this.$slots.default();
// なぜかFragmentになることがあるため
if (options.length === 1 && options[0].props == null) options = options[0].children;
return h('div', {
class: 'novjtcto'
}, [
h('div', label),
...options.map(option => h(MkRadio, {
key: option.props.value,
key: option.key,
value: option.props.value,
modelValue: this.value,
'onUpdate:modelValue': value => this.value = value,

4
src/client/init.ts
View file

@ -15,7 +15,7 @@ if (localStorage.getItem('accounts') != null) {
import * as Sentry from '@sentry/browser';
import { Integrations } from '@sentry/tracing';
import { computed, createApp, watch } from 'vue';
import { computed, createApp, watch, markRaw } from 'vue';
import widgets from '@client/widgets';
import directives from '@client/directives';
@ -291,7 +291,7 @@ if ($i) {
}
}
const main = stream.useChannel('main', null, 'System');
const main = markRaw(stream.useChannel('main', null, 'System'));
// 自分の情報が更新されたとき
main.on('meUpdated', i => {

4
src/client/pages/instance/metrics.vue
View file

@ -90,7 +90,7 @@ export default defineComponent({
stats: null,
serverInfo: null,
connection: null,
queueConnection: os.stream.useChannel('queueStats'),
queueConnection: markRaw(os.stream.useChannel('queueStats')),
memUsage: 0,
chartCpuMem: null,
chartNet: null,
@ -121,7 +121,7 @@ export default defineComponent({
os.api('admin/server-info', {}).then(res => {
this.serverInfo = res;
this.connection = os.stream.useChannel('serverStats');
this.connection = markRaw(os.stream.useChannel('serverStats'));
this.connection.on('stats', this.onStats);
this.connection.on('statsLog', this.onStatsLog);
this.connection.send('requestLog', {

4
src/client/pages/instance/queue.vue
View file

@ -11,7 +11,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import MkButton from '@client/components/ui/button.vue';
import XQueue from './queue.chart.vue';
import FormBase from '@client/components/form/base.vue';
@ -35,7 +35,7 @@ export default defineComponent({
title: this.$ts.jobQueue,
icon: 'fas fa-clipboard-list',
},
connection: os.stream.useChannel('queueStats'),
connection: markRaw(os.stream.useChannel('queueStats')),
}
},

4
src/client/pages/messaging/index.vue
View file

@ -37,7 +37,7 @@
</template>
<script lang="ts">
import { defineAsyncComponent, defineComponent } from 'vue';
import { defineAsyncComponent, defineComponent, markRaw } from 'vue';
import { getAcct } from '@/misc/acct';
import MkButton from '@client/components/ui/button.vue';
import { acct } from '../../filters/user';
@ -63,7 +63,7 @@ export default defineComponent({
},
mounted() {
this.connection = os.stream.useChannel('messagingIndex');
this.connection = markRaw(os.stream.useChannel('messagingIndex'));
this.connection.on('message', this.onMessage);
this.connection.on('read', this.onRead);

6
src/client/pages/messaging/messaging-room.vue
View file

@ -36,7 +36,7 @@
</template>
<script lang="ts">
import { computed, defineComponent } from 'vue';
import { computed, defineComponent, markRaw } from 'vue';
import XList from '@client/components/date-separated-list.vue';
import XMessage from './messaging-room.message.vue';
import XForm from './messaging-room.form.vue';
@ -141,10 +141,10 @@ const Component = defineComponent({
this.group = group;
}
this.connection = os.stream.useChannel('messaging', {
this.connection = markRaw(os.stream.useChannel('messaging', {
otherparty: this.user ? this.user.id : undefined,
group: this.group ? this.group.id : undefined,
});
}));
this.connection.on('message', this.onMessage);
this.connection.on('read', this.onRead);

6
src/client/pages/reversi/game.vue
View file

@ -5,7 +5,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import GameSetting from './game.setting.vue';
import GameBoard from './game.board.vue';
import * as os from '@client/os';
@ -61,9 +61,9 @@ export default defineComponent({
if (this.connection) {
this.connection.dispose();
}
this.connection = os.stream.useChannel('gamesReversiGame', {
this.connection = markRaw(os.stream.useChannel('gamesReversiGame', {
gameId: this.game.id
});
}));
this.connection.on('started', this.onStarted);
});
},

4
src/client/pages/reversi/index.vue
View file

@ -60,7 +60,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import * as os from '@client/os';
import MkButton from '@client/components/ui/button.vue';
import MkFolder from '@client/components/ui/folder.vue';
@ -92,7 +92,7 @@ export default defineComponent({
mounted() {
if (this.$i) {
this.connection = os.stream.useChannel('gamesReversi');
this.connection = markRaw(os.stream.useChannel('gamesReversi'));
this.connection.on('invited', this.onInvited);

2
src/client/store.ts
View file

@ -90,7 +90,7 @@ export const defaultStore = markRaw(new Storage('base', {
default: [] as {
name: string;
id: string;
place: string;
place: string | null;
data: Record<string, any>;
}[]
},

28
src/client/ui/chat/timeline.vue
View file

@ -23,7 +23,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import XNotes from './notes.vue';
import * as os from '@client/os';
import * as sound from '@client/scripts/sound';
@ -121,33 +121,33 @@ export default defineComponent({
this.query = {
antennaId: this.antenna
};
this.connection = os.stream.useChannel('antenna', {
this.connection = markRaw(os.stream.useChannel('antenna', {
antennaId: this.antenna
});
}));
this.connection.on('note', prepend);
} else if (this.src == 'home') {
endpoint = 'notes/timeline';
this.connection = os.stream.useChannel('homeTimeline');
this.connection = markRaw(os.stream.useChannel('homeTimeline'));
this.connection.on('note', prepend);
this.connection2 = os.stream.useChannel('main');
this.connection2 = markRaw(os.stream.useChannel('main'));
this.connection2.on('follow', onChangeFollowing);
this.connection2.on('unfollow', onChangeFollowing);
} else if (this.src == 'local') {
endpoint = 'notes/local-timeline';
this.connection = os.stream.useChannel('localTimeline');
this.connection = markRaw(os.stream.useChannel('localTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'social') {
endpoint = 'notes/hybrid-timeline';
this.connection = os.stream.useChannel('hybridTimeline');
this.connection = markRaw(os.stream.useChannel('hybridTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'global') {
endpoint = 'notes/global-timeline';
this.connection = os.stream.useChannel('globalTimeline');
this.connection = markRaw(os.stream.useChannel('globalTimeline'));
this.connection.on('note', prepend);
} else if (this.src == 'mentions') {
endpoint = 'notes/mentions';
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('mention', prepend);
} else if (this.src == 'directs') {
endpoint = 'notes/mentions';
@ -159,16 +159,16 @@ export default defineComponent({
prepend(note);
}
};
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('mention', onNote);
} else if (this.src == 'list') {
endpoint = 'notes/user-list-timeline';
this.query = {
listId: this.list
};
this.connection = os.stream.useChannel('userList', {
this.connection = markRaw(os.stream.useChannel('userList', {
listId: this.list
});
}));
this.connection.on('note', prepend);
this.connection.on('userAdded', onUserAdded);
this.connection.on('userRemoved', onUserRemoved);
@ -178,9 +178,9 @@ export default defineComponent({
this.query = {
channelId: this.channel
};
this.connection = os.stream.useChannel('channel', {
this.connection = markRaw(os.stream.useChannel('channel', {
channelId: this.channel
});
}));
this.connection.on('note', prepend);
this.connection.on('typers', typers => {
this.typers = this.$i ? typers.filter(u => u.id !== this.$i.id) : typers;

16
src/client/ui/default.vue
View file

@ -115,13 +115,13 @@ export default defineComponent({
if (this.$store.state.widgets.length === 0) {
this.$store.set('widgets', [{
name: 'calendar',
id: 'a', place: 'right', data: {}
id: 'a', place: null, data: {}
}, {
name: 'notifications',
id: 'b', place: 'right', data: {}
id: 'b', place: null, data: {}
}, {
name: 'trends',
id: 'c', place: 'right', data: {}
id: 'c', place: null, data: {}
}]);
}
},
@ -143,7 +143,7 @@ export default defineComponent({
},
attachSticky(ref) {
const sticky = new StickySidebar(this.$refs[ref], this.$store.state.menuDisplay === 'top' ? 0 : 16, this.$store.state.menuDisplay === 'top' ? 60 : 0); // TODO: ヘッダーの高さを60pxと決め打ちしているのを直す
const sticky = new StickySidebar(this.$refs[ref], this.$store.state.menuDisplay === 'top' ? 1 : 16, this.$store.state.menuDisplay === 'top' ? 60 : 0); // TODO: ヘッダーの高さを60pxと決め打ちしているのを直す
window.addEventListener('scroll', () => {
sticky.calc(window.scrollY);
}, { passive: true });
@ -230,7 +230,7 @@ export default defineComponent({
$widgets-hide-threshold: 1200px;
$nav-icon-only-width: 78px; // TODO: どこかに集約したい
--panelShadow: none;
--panelShadow: 0 0 0 1px var(--divider);
// ほんとは単に 100vh と書きたいところだが... https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
min-height: calc(var(--vh, 1vh) * 100);
@ -342,14 +342,14 @@ export default defineComponent({
--globalHeaderHeight: 60px; // TODO: 60pxと決め打ちしているのを直す
> .main {
margin-top: 2px;
margin-top: 1px;
border-radius: var(--radius);
box-shadow: 0 0 0 2px var(--divider);
box-shadow: 0 0 0 1px var(--divider);
}
> .widgets {
--stickyTop: var(--globalHeaderHeight);
margin-top: 0px;
margin-top: 1px;
}
}

13
src/client/widgets/clock.vue
View file

@ -1,7 +1,7 @@
<template>
<MkContainer :naked="props.transparent" :show-header="false">
<div class="vubelbmv">
<MkAnalogClock class="clock"/>
<MkAnalogClock class="clock" :thickness="props.thickness"/>
</div>
</MkContainer>
</template>
@ -20,6 +20,17 @@ const widget = define({
type: 'boolean',
default: false,
},
thickness: {
type: 'radio',
default: 0.1,
options: [{
value: 0.1, label: 'thin'
}, {
value: 0.2, label: 'medium'
}, {
value: 0.3, label: 'thick'
}]
}
})
});

4
src/client/widgets/job-queue.vue
View file

@ -46,7 +46,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import define from './define';
import * as os from '@client/os';
import number from '@client/filters/number';
@ -65,7 +65,7 @@ export default defineComponent({
extends: widget,
data() {
return {
connection: os.stream.useChannel('queueStats'),
connection: markRaw(os.stream.useChannel('queueStats')),
inbox: {
activeSincePrevTick: 0,
active: 0,

4
src/client/widgets/photos.vue
View file

@ -15,7 +15,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import MkContainer from '@client/components/ui/container.vue';
import define from './define';
import { getStaticImageUrl } from '@client/scripts/get-static-image-url';
@ -48,7 +48,7 @@ export default defineComponent({
};
},
mounted() {
this.connection = os.stream.useChannel('main');
this.connection = markRaw(os.stream.useChannel('main'));
this.connection.on('driveFileCreated', this.onDriveFileCreated);

4
src/client/widgets/server-metric/index.vue
View file

@ -14,7 +14,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, markRaw } from 'vue';
import define from '../define';
import MkContainer from '@client/components/ui/container.vue';
import XCpuMemory from './cpu-mem.vue';
@ -63,7 +63,7 @@ export default defineComponent({
os.api('server-info', {}).then(res => {
this.meta = res;
});
this.connection = os.stream.useChannel('serverStats');
this.connection = markRaw(os.stream.useChannel('serverStats'));
},
unmounted() {
this.connection.dispose();