mirror of
https://github.com/hotomoe/hotomoe
synced 2024-12-12 05:38:12 +09:00
[Client] Some performance optimizations
This commit is contained in:
syuilo
parent
e58a6593c0
commit
54710f17fc
@ -37,6 +37,8 @@
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
import { lib } from 'emojilib';
|
||||
import { faAsterisk, faLeaf, faUtensils, faFutbol, faCity, faDice } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faHeart, faFlag } from '@fortawesome/free-regular-svg-icons';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('common/views/components/emoji-picker.vue'),
|
||||
@ -48,7 +50,7 @@ export default Vue.extend({
|
||||
categories: [{
|
||||
ref: 'customEmojiSection',
|
||||
text: this.$t('custom-emoji'),
|
||||
icon: ['fas', 'asterisk'],
|
||||
icon: faAsterisk,
|
||||
isActive: true
|
||||
}, {
|
||||
name: 'people',
|
||||
@ -60,43 +62,43 @@ export default Vue.extend({
|
||||
name: 'animals_and_nature',
|
||||
ref: 'animalsAndNatureSection',
|
||||
text: this.$t('animals-and-nature'),
|
||||
icon: ['fas', 'leaf'],
|
||||
icon: faLeaf,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'food_and_drink',
|
||||
ref: 'foodAndDrinkSection',
|
||||
text: this.$t('food-and-drink'),
|
||||
icon: ['fas', 'utensils'],
|
||||
icon: faUtensils,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'activity',
|
||||
ref: 'activitySection',
|
||||
text: this.$t('activity'),
|
||||
icon: ['fas', 'futbol'],
|
||||
icon: faFutbol,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'travel_and_places',
|
||||
ref: 'travelAndPlacesSection',
|
||||
text: this.$t('travel-and-places'),
|
||||
icon: ['fas', 'city'],
|
||||
icon: faCity,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'objects',
|
||||
ref: 'objectsSection',
|
||||
text: this.$t('objects'),
|
||||
icon: ['fas', 'poo-storm'],
|
||||
icon: faDice,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'symbols',
|
||||
ref: 'symbolsSection',
|
||||
text: this.$t('symbols'),
|
||||
icon: ['far', 'heart'],
|
||||
icon: faHeart,
|
||||
isActive: false
|
||||
}, {
|
||||
name: 'flags',
|
||||
ref: 'flagsSection',
|
||||
text: this.$t('flags'),
|
||||
icon: ['far', 'flag'],
|
||||
icon: faFlag,
|
||||
isActive: false
|
||||
}]
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div class="memory">
|
||||
<x-pie class="pie" :value="usage"/>
|
||||
<div>
|
||||
<p><fa icon="flask"/>Memory</p>
|
||||
<p><fa icon="memory"/>Memory</p>
|
||||
<p>Total: {{ total | bytes(1) }}</p>
|
||||
<p>Used: {{ used | bytes(1) }}</p>
|
||||
<p>Free: {{ free | bytes(1) }}</p>
|
||||
|
||||
@ -41,7 +41,7 @@
|
||||
<button class="drive" :title="$t('attach-media-from-drive')" @click="chooseFileFromDrive"><fa icon="cloud"/></button>
|
||||
<button class="kao" :title="$t('insert-a-kao')" @click="kao"><fa :icon="['far', 'smile']"/></button>
|
||||
<button class="poll" :title="$t('create-poll')" @click="poll = !poll"><fa icon="chart-pie"/></button>
|
||||
<button class="cw" :title="$t('hide-contents')" @click="useCw = !useCw"><fa icon="eye-slash"/></button>
|
||||
<button class="cw" :title="$t('hide-contents')" @click="useCw = !useCw"><fa :icon="['far', 'eye-slash']"/></button>
|
||||
<button class="geo" :title="$t('attach-location-information')" @click="geo ? removeGeo() : setGeo()"><fa icon="map-marker-alt"/></button>
|
||||
<button class="visibility" :title="$t('visibility')" @click="setVisibility" ref="visibilityButton">
|
||||
<span v-if="visibility === 'public'"><fa icon="globe"/></span>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<div class="action-form">
|
||||
<ui-button @click="user.isMuted ? unmute() : mute()" v-if="$store.state.i.id != user.id">
|
||||
<span v-if="user.isMuted"><fa icon="eye"/> {{ $t('unmute') }}</span>
|
||||
<span v-else><fa icon="eye-slash"/> {{ $t('mute') }}</span>
|
||||
<span v-else><fa :icon="['far', 'eye-slash']"/> {{ $t('mute') }}</span>
|
||||
</ui-button>
|
||||
<ui-button @click="user.isBlocking ? unblock() : block()" v-if="$store.state.i.id != user.id">
|
||||
<span v-if="user.isBlocking"><fa icon="user"/> {{ $t('unblock') }}</span>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<header>
|
||||
<span :data-active="mode == 'default'" @click="mode = 'default'"><fa :icon="['far', 'comment-alt']"/> {{ $t('default') }}</span>
|
||||
<span :data-active="mode == 'with-replies'" @click="mode = 'with-replies'"><fa icon="comments"/> {{ $t('with-replies') }}</span>
|
||||
<span :data-active="mode == 'with-media'" @click="mode = 'with-media'"><fa icon="images"/> {{ $t('with-media') }}</span>
|
||||
<span :data-active="mode == 'with-media'" @click="mode = 'with-media'"><fa :icon="['far', 'images']"/> {{ $t('with-media') }}</span>
|
||||
</header>
|
||||
<mk-notes ref="timeline" :more="existMore ? more : null">
|
||||
<p class="empty" slot="empty"><fa :icon="['far', 'comments']"/>{{ $t('empty') }}</p>
|
||||
|
||||
@ -50,7 +50,7 @@
|
||||
</div>
|
||||
|
||||
<div class="photos block">
|
||||
<header><fa icon="images"/> {{ $t('photos') }}</header>
|
||||
<header><fa :icon="['far', 'images']"/> {{ $t('photos') }}</header>
|
||||
<div>
|
||||
<div v-for="photo in photos" :style="`background-image: url(${photo.thumbnailUrl})`"></div>
|
||||
</div>
|
||||
|
||||
@ -25,47 +25,112 @@ if (localStorage.getItem('theme') == null) {
|
||||
import { library } from '@fortawesome/fontawesome-svg-core';
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
|
||||
|
||||
/* なぜか動かない
|
||||
import faRetweet from '@fortawesome/free-solid-svg-icons/faRetweet';
|
||||
import faPlus from '@fortawesome/free-solid-svg-icons/faPlus';
|
||||
import faUser from '@fortawesome/free-solid-svg-icons/faUser';
|
||||
import faCog from '@fortawesome/free-solid-svg-icons/faCog';
|
||||
import faCheck from '@fortawesome/free-solid-svg-icons/faCheck';
|
||||
import faStar from '@fortawesome/free-solid-svg-icons/faStar';
|
||||
import faReply from '@fortawesome/free-solid-svg-icons/faReply';
|
||||
import faEllipsisH from '@fortawesome/free-solid-svg-icons/faEllipsisH';
|
||||
import faQuoteLeft from '@fortawesome/free-solid-svg-icons/faQuoteLeft';
|
||||
import faQuoteRight from '@fortawesome/free-solid-svg-icons/faQuoteRight';
|
||||
import faAngleUp from '@fortawesome/free-solid-svg-icons/faAngleUp';
|
||||
import faAngleDown from '@fortawesome/free-solid-svg-icons/faAngleDown';
|
||||
import faAt from '@fortawesome/free-solid-svg-icons/faAt';
|
||||
import faHashtag from '@fortawesome/free-solid-svg-icons/faHashtag';
|
||||
import faHome from '@fortawesome/free-solid-svg-icons/faHome';
|
||||
import faGlobe from '@fortawesome/free-solid-svg-icons/faGlobe';
|
||||
import faCircle from '@fortawesome/free-solid-svg-icons/faCircle';
|
||||
import faList from '@fortawesome/free-solid-svg-icons/faList';
|
||||
import faHeart from '@fortawesome/free-solid-svg-icons/faHeart';
|
||||
import faUnlock from '@fortawesome/free-solid-svg-icons/faUnlock';
|
||||
import faRssSquare from '@fortawesome/free-solid-svg-icons/faRssSquare';
|
||||
import faSort from '@fortawesome/free-solid-svg-icons/faSort';
|
||||
import faChartPie from '@fortawesome/free-solid-svg-icons/faChartPie';
|
||||
import faChartBar from '@fortawesome/free-solid-svg-icons/faChartBar';
|
||||
import faPencilAlt from '@fortawesome/free-solid-svg-icons/faPencilAlt';
|
||||
import faColumns from '@fortawesome/free-solid-svg-icons/faColumns';
|
||||
import faComments from '@fortawesome/free-solid-svg-icons/faComments';
|
||||
import faGamepad from '@fortawesome/free-solid-svg-icons/faGamepad';
|
||||
import faCloud from '@fortawesome/free-solid-svg-icons/faCloud';
|
||||
import faPowerOff from '@fortawesome/free-solid-svg-icons/faPowerOff';
|
||||
import faChevronCircleLeft from '@fortawesome/free-solid-svg-icons/faChevronCircleLeft';
|
||||
import faChevronCircleRight from '@fortawesome/free-solid-svg-icons/faChevronCircleRight';
|
||||
import faShareAlt from '@fortawesome/free-solid-svg-icons/faShareAlt';
|
||||
import faTimes from '@fortawesome/free-solid-svg-icons/faTimes';
|
||||
import faThumbtack from '@fortawesome/free-solid-svg-icons/faThumbtack';
|
||||
import faSearch from '@fortawesome/free-solid-svg-icons/faSearch';
|
||||
import {
|
||||
faRetweet,
|
||||
faPlus,
|
||||
faUser,
|
||||
faCog,
|
||||
faCheck,
|
||||
faStar,
|
||||
faReply,
|
||||
faEllipsisH,
|
||||
faQuoteLeft,
|
||||
faQuoteRight,
|
||||
faAngleUp,
|
||||
faAngleDown,
|
||||
faAt,
|
||||
faHashtag,
|
||||
faHome,
|
||||
faGlobe,
|
||||
faCircle,
|
||||
faList,
|
||||
faHeart,
|
||||
faUnlock,
|
||||
faRssSquare,
|
||||
faSort,
|
||||
faChartPie,
|
||||
faChartBar,
|
||||
faPencilAlt,
|
||||
faColumns,
|
||||
faComments,
|
||||
faGamepad,
|
||||
faCloud,
|
||||
faPowerOff,
|
||||
faChevronCircleLeft,
|
||||
faChevronCircleRight,
|
||||
faShareAlt,
|
||||
faTimes,
|
||||
faThumbtack,
|
||||
faSearch,
|
||||
faAngleRight,
|
||||
faWrench,
|
||||
faTerminal,
|
||||
faMoon,
|
||||
faPalette,
|
||||
faSlidersH,
|
||||
faDesktop,
|
||||
faVolumeUp,
|
||||
faLanguage,
|
||||
faInfoCircle,
|
||||
faExclamationTriangle,
|
||||
faKey,
|
||||
faBan,
|
||||
faCogs,
|
||||
faUnlockAlt,
|
||||
faPuzzlePiece,
|
||||
faMobileAlt,
|
||||
faSignInAlt,
|
||||
faSyncAlt,
|
||||
faPaperPlane,
|
||||
faUpload,
|
||||
faMapMarkerAlt,
|
||||
faEnvelope,
|
||||
faLock,
|
||||
faFolderOpen,
|
||||
faBirthdayCake,
|
||||
faImage,
|
||||
faEye,
|
||||
faDownload,
|
||||
faFileImport,
|
||||
faLink,
|
||||
faArrowRight,
|
||||
faICursor,
|
||||
faCaretRight,
|
||||
faReplyAll,
|
||||
faCamera,
|
||||
faMinus,
|
||||
faCaretDown,
|
||||
faCalculator,
|
||||
faUsers,
|
||||
faBars,
|
||||
faFileImage,
|
||||
faPollH,
|
||||
faFolder,
|
||||
faMicrochip,
|
||||
faMemory,
|
||||
faServer,
|
||||
faExclamationCircle,
|
||||
} from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
import farBell from '@fortawesome/free-regular-svg-icons/faBell';
|
||||
import farEnvelope from '@fortawesome/free-regular-svg-icons/faEnvelope';
|
||||
import farComments from '@fortawesome/free-regular-svg-icons/faComments';
|
||||
import {
|
||||
faBell as farBell,
|
||||
faEnvelope as farEnvelope,
|
||||
faComments as farComments,
|
||||
faTrashAlt as farTrashAlt,
|
||||
faWindowRestore as farWindowRestore,
|
||||
faFolder as farFolder,
|
||||
faLaugh as farLaugh,
|
||||
faSmile as farSmile,
|
||||
faEyeSlash as farEyeSlash,
|
||||
faFolderOpen as farFolderOpen,
|
||||
faSave as farSave,
|
||||
faImages as farImages,
|
||||
faChartBar as farChartBar,
|
||||
faCommentAlt as farCommentAlt,
|
||||
faClock as farClock,
|
||||
faCalendarAlt as farCalendarAlt,
|
||||
faHdd as farHdd,
|
||||
} from '@fortawesome/free-regular-svg-icons';
|
||||
|
||||
library.add(
|
||||
faRetweet,
|
||||
@ -104,16 +169,73 @@ library.add(
|
||||
faTimes,
|
||||
faThumbtack,
|
||||
faSearch,
|
||||
faAngleRight,
|
||||
faWrench,
|
||||
faTerminal,
|
||||
faMoon,
|
||||
faPalette,
|
||||
faSlidersH,
|
||||
faDesktop,
|
||||
faVolumeUp,
|
||||
faLanguage,
|
||||
faInfoCircle,
|
||||
faExclamationTriangle,
|
||||
faKey,
|
||||
faBan,
|
||||
faCogs,
|
||||
faUnlockAlt,
|
||||
faPuzzlePiece,
|
||||
faMobileAlt,
|
||||
faSignInAlt,
|
||||
faSyncAlt,
|
||||
faPaperPlane,
|
||||
faUpload,
|
||||
faMapMarkerAlt,
|
||||
faEnvelope,
|
||||
faLock,
|
||||
faFolderOpen,
|
||||
faBirthdayCake,
|
||||
faImage,
|
||||
faEye,
|
||||
faDownload,
|
||||
faFileImport,
|
||||
faLink,
|
||||
faArrowRight,
|
||||
faICursor,
|
||||
faCaretRight,
|
||||
faReplyAll,
|
||||
faCamera,
|
||||
faMinus,
|
||||
faCaretDown,
|
||||
faCalculator,
|
||||
faUsers,
|
||||
faBars,
|
||||
faFileImage,
|
||||
faPollH,
|
||||
faFolder,
|
||||
faMicrochip,
|
||||
faMemory,
|
||||
faServer,
|
||||
faExclamationCircle,
|
||||
|
||||
farBell,
|
||||
farEnvelope,
|
||||
farComments,
|
||||
farTrashAlt,
|
||||
farWindowRestore,
|
||||
farFolder,
|
||||
farLaugh,
|
||||
farSmile,
|
||||
farEyeSlash,
|
||||
farFolderOpen,
|
||||
farSave,
|
||||
farImages,
|
||||
farChartBar,
|
||||
farCommentAlt,
|
||||
farClock,
|
||||
farCalendarAlt,
|
||||
farHdd,
|
||||
);
|
||||
*/
|
||||
|
||||
import { fas } from '@fortawesome/free-solid-svg-icons';
|
||||
import { far } from '@fortawesome/free-regular-svg-icons';
|
||||
|
||||
library.add(fas, far);
|
||||
//#endregion
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
<span class="created-at" @click="showCreatedAt"><fa :icon="['far', 'clock']"/><mk-time :time="file.createdAt"/></span>
|
||||
<template v-if="file.isSensitive">
|
||||
<span class="separator"></span>
|
||||
<span class="nsfw"><fa icon="eye-slash"/> {{ $t('nsfw') }}</span>
|
||||
<span class="nsfw"><fa :icon="['far', 'eye-slash']"/> {{ $t('nsfw') }}</span>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
<span class="created-at"><fa :icon="['far', 'clock']"/><mk-time :time="file.createdAt"/></span>
|
||||
<template v-if="file.isSensitive">
|
||||
<span class="separator"></span>
|
||||
<span class="nsfw"><fa icon="eye-slash"/> {{ $t('nsfw') }}</span>
|
||||
<span class="nsfw"><fa :icon="['far', 'eye-slash']"/> {{ $t('nsfw') }}</span>
|
||||
</template>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
@ -51,8 +51,6 @@ export default Vue.extend({
|
||||
top 0
|
||||
bottom 0
|
||||
right 20px
|
||||
|
||||
> *
|
||||
height 100%
|
||||
height 100%
|
||||
|
||||
</style>
|
||||
|
||||
@ -32,7 +32,7 @@
|
||||
<button class="drive" @click="chooseFileFromDrive"><fa icon="cloud"/></button>
|
||||
<button class="kao" @click="kao"><fa :icon="['far', 'smile']"/></button>
|
||||
<button class="poll" @click="poll = true"><fa icon="chart-pie"/></button>
|
||||
<button class="poll" @click="useCw = !useCw"><fa icon="eye-slash"/></button>
|
||||
<button class="poll" @click="useCw = !useCw"><fa :icon="['far', 'eye-slash']"/></button>
|
||||
<button class="geo" @click="geo ? removeGeo() : setGeo()"><fa icon="map-marker-alt"/></button>
|
||||
<button class="visibility" @click="setVisibility" ref="visibilityButton">
|
||||
<span v-if="visibility === 'public'"><fa icon="globe"/></span>
|
||||
|
||||
@ -116,7 +116,7 @@ export default Vue.extend({
|
||||
|
||||
menu() {
|
||||
let menu = [{
|
||||
icon: this.user.isMuted ? '<fa icon="eye"/>' : '<fa icon="eye-slash"/>',
|
||||
icon: this.user.isMuted ? ['fas', 'eye'] : ['far', 'eye-slash'],
|
||||
text: this.user.isMuted ? this.$t('unmute') : this.$t('mute'),
|
||||
action: () => {
|
||||
if (this.user.isMuted) {
|
||||
@ -138,7 +138,7 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
}, {
|
||||
icon: this.user.isBlocking ? '<fa icon="user"/>' : '<fa icon="user-slash"/>',
|
||||
icon: this.user.isBlocking ? ['fas', 'user'] : ['fas', 'user-slash'],
|
||||
text: this.user.isBlocking ? this.$t('unblock') : this.$t('block'),
|
||||
action: () => {
|
||||
if (this.user.isBlocking) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user