Compare commits
No commits in common. "450c8f114b65d1ea701488762cbaa214e488e6b8" and "a73e394b08af0df2fd31f4016d1c9e4d1e6f6da6" have entirely different histories.
450c8f114b
...
a73e394b08
|
|
@ -31,6 +31,9 @@ html
|
|||
link(rel='icon' href= icon || '/favicon.ico')
|
||||
link(rel='apple-touch-icon' href= icon || '/apple-touch-icon.png')
|
||||
link(rel='manifest' href='/manifest.json')
|
||||
link(rel='prefetch' href='https://xn--931a.moe/assets/info.jpg')
|
||||
link(rel='prefetch' href='https://xn--931a.moe/assets/not-found.jpg')
|
||||
link(rel='prefetch' href='https://xn--931a.moe/assets/error.jpg')
|
||||
link(rel='stylesheet' href='/assets/fontawesome/css/all.css')
|
||||
link(rel='modulepreload' href=`/assets/${clientEntry.file}`)
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
|
|
@ -2,7 +2,7 @@
|
|||
<MkPagination ref="pagingComponent" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noNotes }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<MkPagination ref="pagingComponent" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noNotifications }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<div v-else-if="empty" key="_empty_" class="empty">
|
||||
<slot name="empty">
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.nothing }}</div>
|
||||
</div>
|
||||
</slot>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<MkPagination ref="pagingComponent" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noUsers }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<div class="mjndxjcg">
|
||||
<img src="/client-assets/mascot/error.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
|
||||
<p><i class="fas fa-exclamation-triangle"></i> {{ i18n.ts.somethingHappened }}</p>
|
||||
<MkButton class="button" @click="() => $emit('retry')">{{ i18n.ts.retry }}</MkButton>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<KeepAlive :max="defaultStore.state.numberOfPageCache" v-bind="props.keepalive">
|
||||
<KeepAlive :max="defaultStore.state.numberOfPageCache">
|
||||
<Suspense>
|
||||
<component :is="currentPageComponent" :key="key" v-bind="Object.fromEntries(currentPageProps)"/>
|
||||
|
||||
|
|
@ -17,7 +17,6 @@ import { defaultStore } from '@/store';
|
|||
|
||||
const props = defineProps<{
|
||||
router?: Router;
|
||||
keepalive?: any;
|
||||
}>();
|
||||
|
||||
const router = props.router ?? inject('router');
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<MkLoading v-if="!loaded"/>
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<div v-show="loaded" class="mjndxjch">
|
||||
<img src="/client-assets/mascot/error.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
|
||||
<p><b><i class="fas fa-exclamation-triangle"></i> {{ i18n.ts.pageLoadError }}</b></p>
|
||||
<p v-if="meta && (version === meta.version)">{{ i18n.ts.pageLoadErrorDescription }}</p>
|
||||
<p v-else-if="serverIsDead">{{ i18n.ts.serverIsDead }}</p>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<MkPagination ref="pagingComponent" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noNotes }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<MkPagination ref="paginationComponent" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noFollowRequests }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
</MkA>
|
||||
</div>
|
||||
<div v-if="!fetching && messages.length == 0" class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noHistory }}</div>
|
||||
</div>
|
||||
<MkLoading v-if="fetching"/>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<MkPagination v-if="pagination" ref="pagingComponent" :key="userAcct || groupId" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.noMessagesYet }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="ipledcug">
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/not-found.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/not-found.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.notFoundDescription }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<FormPagination ref="list" :pagination="pagination">
|
||||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ i18n.ts.nothing }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -3,13 +3,14 @@
|
|||
<div class="nav">
|
||||
<header class="header">
|
||||
<div class="left">
|
||||
<button class="_button account" @click="handleAccountSwitcher">
|
||||
<button class="_button account" @click="openAccountMenu">
|
||||
<MkAvatar :user="$i" class="avatar"/><!--<MkAcct class="text" :user="$i"/>-->
|
||||
</button>
|
||||
</div>
|
||||
<div class="right">
|
||||
<MkA v-tooltip="$ts.favorites" class="item" to="/my/favorites"><i class="fas fa-star icon"></i><span v-if="$i.hasUnreadMessagingMessage" class="indicator"><i class="fas fa-circle"></i></span></MkA>
|
||||
<MkA v-tooltip="$ts.messaging" class="item" to="/my/messaging"><i class="fas fa-comments icon"></i><span v-if="$i.hasUnreadMessagingMessage" class="indicator"><i class="fas fa-circle"></i></span></MkA>
|
||||
<MkA v-tooltip="$ts.directNotes" class="item" to="/my/messages"><i class="fas fa-envelope icon"></i><span v-if="$i.hasUnreadSpecifiedNotes" class="indicator"><i class="fas fa-circle"></i></span></MkA>
|
||||
<MkA v-tooltip="$ts.mentions" class="item" to="/my/mentions"><i class="fas fa-at icon"></i><span v-if="$i.hasUnreadMentions" class="indicator"><i class="fas fa-circle"></i></span></MkA>
|
||||
<MkA v-tooltip="$ts.notifications" class="item" to="/my/notifications"><i class="fas fa-bell icon"></i><span v-if="$i.hasUnreadNotification" class="indicator"><i class="fas fa-circle"></i></span></MkA>
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -47,6 +48,11 @@
|
|||
<MkA v-for="antenna in antennas" :key="antenna.id" :to="`/timeline/antenna/${ antenna.id }`" class="item" :class="{ active: tl === `antenna:${ antenna.id }` }"><i class="fas fa-satellite icon"></i>{{ antenna.name }}</MkA>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="body">
|
||||
<MkA to="/my/favorites" class="item"><i class="fas fa-star icon"></i>{{ $ts.favorites }}</MkA>
|
||||
</div>
|
||||
</div>
|
||||
<MkAd class="a" :prefer="['square']"/>
|
||||
</div>
|
||||
<footer class="footer">
|
||||
|
|
@ -65,7 +71,13 @@
|
|||
</div>
|
||||
|
||||
<main class="main" @contextmenu.stop="onContextmenu">
|
||||
<RouterView :keepalive="{ exclude: ['timeline'] }"/>
|
||||
<RouterView v-slot="{ Component }">
|
||||
<transition :name="$store.state.animation ? 'page' : ''" mode="out-in" @enter="onTransition">
|
||||
<KeepAlive :include="['timeline']">
|
||||
<component :is="Component" class="body"/>
|
||||
</KeepAlive>
|
||||
</transition>
|
||||
</RouterView>
|
||||
</main>
|
||||
|
||||
<XSide ref="side" class="side" @open="sideViewOpening = true" @close="sideViewOpening = false"/>
|
||||
|
|
@ -105,7 +117,7 @@ import makeList from '@/scripts/new-list.ts';
|
|||
import copyToClipboard from '@/scripts/copy-to-clipboard';
|
||||
import { PageMetadata, provideMetadataReceiver, setPageMetadata } from '@/scripts/page-metadata';
|
||||
import { store } from './chat/store';
|
||||
import { openAccountMenu, $i } from '@/account';
|
||||
import { openAccountMenu } from '@/account';
|
||||
|
||||
const side = ref();
|
||||
|
||||
|
|
@ -256,12 +268,6 @@ function onContextmenu(e) {
|
|||
}], e);
|
||||
};
|
||||
|
||||
function handleAccountSwitcher(ev: event) {
|
||||
return openAccountMenu({
|
||||
withExtraOperation: true,
|
||||
}, ev);
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
if (window.innerWidth < 1024) {
|
||||
|
|
@ -298,7 +304,7 @@ onMounted(() => {
|
|||
}
|
||||
|
||||
.mk-app {
|
||||
$header-height: 55px; // TODO: どこかに集約したい
|
||||
$header-height: 54px; // TODO: どこかに集約したい
|
||||
$ui-font-size: 1em; // TODO: どこかに集約したい
|
||||
|
||||
// ほんとは単に 100vh と書きたいところだが... https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="">
|
||||
<div v-if="empty" class="_fullinfo">
|
||||
<img src="/client-assets/mascot/info.jpg" class="_ghost"/>
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noNotes }}</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,21 +1,20 @@
|
|||
<template>
|
||||
<MkPageHeader @click="goTop()"/>
|
||||
<div class="dbiokgaf">
|
||||
<div v-if="date" class="info">
|
||||
<MkInfo>{{ i18n.ts.showingPastTimeline }} <button class="_textButton clear" @click="timetravel()">{{ i18n.ts.clear }}</button></MkInfo>
|
||||
</div>
|
||||
<div class="top">
|
||||
<XPostForm/>
|
||||
</div>
|
||||
<div ref="body" class="tl">
|
||||
<div v-if="queue > 0" class="new" :style="{ width: width + 'px', top: top + 'px' }"><button class="_buttonPrimary" @click="goTop()">{{ i18n.ts.newNoteRecived }}</button></div>
|
||||
<XNotes ref="tl" class="tl" :pagination="pagination" @queue="queueUpdated"/>
|
||||
</div>
|
||||
<div class="dbiokgaf">
|
||||
<div v-if="date" class="info">
|
||||
<MkInfo>{{ i18n.ts.showingPastTimeline }} <button class="_textButton clear" @click="timetravel()">{{ i18n.ts.clear }}</button></MkInfo>
|
||||
</div>
|
||||
<div class="top">
|
||||
<XPostForm/>
|
||||
</div>
|
||||
<div ref="body" class="tl">
|
||||
<div v-if="queue > 0" class="new" :style="{ width: width + 'px', top: top + 'px' }"><button class="_buttonPrimary" @click="goTop()">{{ i18n.ts.newNoteRecived }}</button></div>
|
||||
<XNotes ref="tl" class="tl" :pagination="pagination" @queue="queueUpdated"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, markRaw, onBeforeUnmount, ref, reactive, withDefaults, watchEffect } from 'vue';
|
||||
import { computed, markRaw, onBeforeUnmount, ref, reactive, withDefaults } from 'vue';
|
||||
import XNotes from '../notes.vue';
|
||||
import * as os from '@/os';
|
||||
import { stream } from '@/stream';
|
||||
|
|
@ -42,6 +41,8 @@ const baseQuery = {
|
|||
includeLocalRenotes: defaultStore.state.showLocalRenotes
|
||||
};
|
||||
|
||||
const connection = ref(null);
|
||||
const connection2 = ref(null);
|
||||
const query = reactive({});
|
||||
const queue = ref(0);
|
||||
const width = ref(0);
|
||||
|
|
@ -77,43 +78,32 @@ const onChangeFollowing = () => {
|
|||
}
|
||||
};
|
||||
|
||||
const connection = ref(null);
|
||||
const connection2 = ref(null);
|
||||
const endpoint = ref(null);
|
||||
let endpoint;
|
||||
|
||||
watchEffect((onCleanup) => {
|
||||
console.log(props.src, defaultStore.state.numberOfPageCache);
|
||||
if (props.src == 'home') {
|
||||
endpoint.value = 'notes/timeline';
|
||||
connection.value = markRaw(stream.useChannel('homeTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
if (props.src == 'home') {
|
||||
endpoint = 'notes/timeline';
|
||||
connection.value = markRaw(stream.useChannel('homeTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
|
||||
connection2.value = markRaw(stream.useChannel('main'));
|
||||
connection2.value.on('follow', onChangeFollowing);
|
||||
connection2.value.on('unfollow', onChangeFollowing);
|
||||
} else if (props.src == 'local') {
|
||||
endpoint.value = 'notes/local-timeline';
|
||||
connection.value = markRaw(stream.useChannel('localTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
} else if (props.src == 'social') {
|
||||
endpoint.value = 'notes/hybrid-timeline';
|
||||
connection.value = markRaw(stream.useChannel('hybridTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
} else if (props.src == 'global') {
|
||||
endpoint.value = 'notes/global-timeline';
|
||||
connection.value = markRaw(stream.useChannel('globalTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
}
|
||||
|
||||
onCleanup(() => {
|
||||
console.log('cleaning');
|
||||
connection.value.dispose();
|
||||
if (connection2.value) connection2.value.dispose();
|
||||
});
|
||||
});
|
||||
connection2.value = markRaw(stream.useChannel('main'));
|
||||
connection2.value.on('follow', onChangeFollowing);
|
||||
connection2.value.on('unfollow', onChangeFollowing);
|
||||
} else if (props.src == 'local') {
|
||||
endpoint = 'notes/local-timeline';
|
||||
connection.value = markRaw(stream.useChannel('localTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
} else if (props.src == 'social') {
|
||||
endpoint = 'notes/hybrid-timeline';
|
||||
connection.value = markRaw(stream.useChannel('hybridTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
} else if (props.src == 'global') {
|
||||
endpoint = 'notes/global-timeline';
|
||||
connection.value = markRaw(stream.useChannel('globalTimeline'));
|
||||
connection.value.on('note', prepend);
|
||||
}
|
||||
|
||||
const pagination = computed(() => ({
|
||||
endpoint: endpoint.value,
|
||||
endpoint: endpoint,
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
untilDate: date.value?.getTime(),
|
||||
|
|
@ -122,6 +112,11 @@ const pagination = computed(() => ({
|
|||
}));
|
||||
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
connection.value.dispose();
|
||||
if (connection2.value) connection2.value.dispose();
|
||||
});
|
||||
|
||||
function focus() {
|
||||
body.value.focus();
|
||||
};
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ export default defineComponent({
|
|||
|
||||
<style lang="scss" scoped>
|
||||
.mrajymqm {
|
||||
$header-height: 55px; // TODO: どこかに集約したい
|
||||
$header-height: 54px; // TODO: どこかに集約したい
|
||||
|
||||
--root-margin: 16px;
|
||||
--margin: var(--marginHalf);
|
||||
|
|
|
|||
Loading…
Reference in New Issue