usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

wip

This commit is contained in:
syuilo 2020-09-05 10:06:59 +09:00
parent c49e5a80be
commit 190486d841
69 changed files with 284 additions and 284 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/client/components/captcha.vue
View File

@ -110,7 +110,7 @@ export default defineComponent({
}
},
callback(response?: string) {
this.$emit('input', typeof response == 'string' ? response : null);
this.$emit('update:value', typeof response == 'string' ? response : null);
},
},
});

2
src/client/components/cw-button.vue
View File

@ -36,7 +36,7 @@ export default defineComponent({
length,
toggle() {
this.$emit('input', !this.value);
this.$emit('update:value', !this.value);
}
}
});

2
src/client/components/deck/widgets-column.vue
View File

@ -5,7 +5,7 @@
<div class="wtdtxvec">
<template v-if="edit">
<header>
<mk-select v-model="widgetAdderSelected" style="margin-bottom: var(--margin)">
<mk-select v-model:value="widgetAdderSelected" style="margin-bottom: var(--margin)">
<template #label>{{ $t('selectWidget') }}</template>
<option v-for="widget in widgets" :value="widget" :key="widget">{{ $t(`_widgets.${widget}`) }}</option>
</mk-select>

6
src/client/components/dialog.vue
View File

@ -23,9 +23,9 @@
<header v-if="title" v-html="title"></header>
<header v-if="title == null && user">{{ $t('enterUsername') }}</header>
<div class="body" v-if="text" v-html="text"></div>
<mk-input v-if="input" v-model="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder" @keydown="onInputKeydown"></mk-input>
<mk-input v-if="user" v-model="userInputValue" autofocus @keydown="onInputKeydown"><template #prefix>@</template></mk-input>
<mk-select v-if="select" v-model="selectedValue" autofocus>
<mk-input v-if="input" v-model:value="inputValue" autofocus :type="input.type || 'text'" :placeholder="input.placeholder" @keydown="onInputKeydown"></mk-input>
<mk-input v-if="user" v-model:value="userInputValue" autofocus @keydown="onInputKeydown"><template #prefix>@</template></mk-input>
<mk-select v-if="select" v-model:value="selectedValue" autofocus>
<template v-if="select.items">
<option v-for="item in select.items" :value="item.value">{{ item.text }}</option>
</template>

8
src/client/components/form-window.vue
View File

@ -5,19 +5,19 @@
</template>
<div class="xkpnjxcv">
<label v-for="item in Object.keys(form).filter(item => !form[item].hidden)" :key="item">
<mk-input v-if="form[item].type === 'number'" v-model="values[item]" type="number" :step="form[item].step || 1">
<mk-input v-if="form[item].type === 'number'" v-model:value="values[item]" type="number" :step="form[item].step || 1">
<span v-text="form[item].label || item"></span>
<template v-if="form[item].description" #desc>{{ form[item].description }}</template>
</mk-input>
<mk-input v-else-if="form[item].type === 'string' && !item.multiline" v-model="values[item]" type="text">
<mk-input v-else-if="form[item].type === 'string' && !item.multiline" v-model:value="values[item]" type="text">
<span v-text="form[item].label || item"></span>
<template v-if="form[item].description" #desc>{{ form[item].description }}</template>
</mk-input>
<mk-textarea v-else-if="form[item].type === 'string' && item.multiline" v-model="values[item]">
<mk-textarea v-else-if="form[item].type === 'string' && item.multiline" v-model:value="values[item]">
<span v-text="form[item].label || item"></span>
<template v-if="form[item].description" #desc>{{ form[item].description }}</template>
</mk-textarea>
<mk-switch v-else-if="form[item].type === 'boolean'" v-model="values[item]">
<mk-switch v-else-if="form[item].type === 'boolean'" v-model:value="values[item]">
<span v-text="form[item].label || item"></span>
<template v-if="form[item].description" #desc>{{ form[item].description }}</template>
</mk-switch>

4
src/client/components/instance-stats.vue
View File

@ -87,7 +87,7 @@
<div class="_title" style="position: relative;"><fa :icon="faChartBar"/> {{ $t('statistics') }}<button @click="fetchChart" class="_button" style="position: absolute; right: 0; bottom: 0; top: 0; padding: inherit;"><fa :icon="faSync"/></button></div>
<div class="_content" style="margin-top: -8px;">
<div class="selects" style="display: flex;">
<mk-select v-model="chartSrc" style="margin: 0; flex: 1;">
<mk-select v-model:value="chartSrc" style="margin: 0; flex: 1;">
<optgroup :label="$t('federation')">
<option value="federation-instances">{{ $t('_charts.federationInstancesIncDec') }}</option>
<option value="federation-instances-total">{{ $t('_charts.federationInstancesTotal') }}</option>
@ -110,7 +110,7 @@
<option value="drive-total">{{ $t('_charts.storageUsageTotal') }}</option>
</optgroup>
</mk-select>
<mk-select v-model="chartSpan" style="margin: 0;">
<mk-select v-model:value="chartSpan" style="margin: 0;">
<option value="hour">{{ $t('perHour') }}</option>
<option value="day">{{ $t('perDay') }}</option>
</mk-select>

2
src/client/components/note-preview.vue
View File

@ -6,7 +6,7 @@
<div class="body">
<p v-if="note.cw != null" class="cw">
<span class="text" v-if="note.cw != ''">{{ note.cw }}</span>
<x-cw-button v-model="showContent" :note="note"/>
<x-cw-button v-model:value="showContent" :note="note"/>
</p>
<div class="content" v-show="note.cw == null || showContent">
<x-sub-note-content class="text" :note="note"/>

2
src/client/components/note.sub.vue
View File

@ -7,7 +7,7 @@
<div class="body">
<p v-if="note.cw != null" class="cw">
<mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$store.state.i" :custom-emojis="note.emojis" />
<x-cw-button v-model="showContent" :note="note"/>
<x-cw-button v-model:value="showContent" :note="note"/>
</p>
<div class="content" v-show="note.cw == null || showContent">
<x-sub-note-content class="text" :note="note"/>

2
src/client/components/note.vue
View File

@ -41,7 +41,7 @@
<div class="body" ref="noteBody">
<p v-if="appearNote.cw != null" class="cw">
<mfm v-if="appearNote.cw != ''" class="text" :text="appearNote.cw" :author="appearNote.user" :i="$store.state.i" :custom-emojis="appearNote.emojis"/>
<x-cw-button v-model="showContent" :note="appearNote"/>
<x-cw-button v-model:value="showContent" :note="appearNote"/>
</p>
<div class="content" v-show="appearNote.cw == null || showContent">
<div class="text">

4
src/client/components/notification-setting-window.vue
View File

@ -3,7 +3,7 @@
<template #header>{{ $t('notificationSetting') }}</template>
<div class="vv94n3oa">
<div v-if="showGlobalToggle">
<mk-switch v-model="useGlobalSetting">
<mk-switch v-model:value="useGlobalSetting">
{{ $t('useGlobalSetting') }}
<template #desc>{{ $t('useGlobalSettingDesc') }}</template>
</mk-switch>
@ -12,7 +12,7 @@
<mk-info>{{ $t('notificationSettingDesc') }}</mk-info>
<mk-button inline @click="disableAll">{{ $t('disableAll') }}</mk-button>
<mk-button inline @click="enableAll">{{ $t('enableAll') }}</mk-button>
<mk-switch v-for="type in notificationTypes" :key="type" v-model="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</mk-switch>
<mk-switch v-for="type in notificationTypes" :key="type" v-model:value="typesMap[type]">{{ $t(`_notification._types.${type}`) }}</mk-switch>
</div>
</div>
</x-window>

2
src/client/components/page/page.number-input.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<mk-input class="kudkigyw" v-model="v" type="number">{{ hpml.interpolate(value.text) }}</mk-input>
<mk-input class="kudkigyw" v-model:value="v" type="number">{{ hpml.interpolate(value.text) }}</mk-input>
</div>
</template>

2
src/client/components/page/page.radio-button.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<div>{{ hpml.interpolate(value.title) }}</div>
<mk-radio v-for="x in value.values" v-model="v" :value="x" :key="x">{{ x }}</mk-radio>
<mk-radio v-for="x in value.values" v-model:value="v" :value="x" :key="x">{{ x }}</mk-radio>
</div>
</template>

2
src/client/components/page/page.switch.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="hkcxmtwj">
<mk-switch v-model="v">{{ hpml.interpolate(value.text) }}</mk-switch>
<mk-switch v-model:value="v">{{ hpml.interpolate(value.text) }}</mk-switch>
</div>
</template>

2
src/client/components/page/page.text-input.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<mk-input class="kudkigyw" v-model="v" type="text">{{ hpml.interpolate(value.text) }}</mk-input>
<mk-input class="kudkigyw" v-model:value="v" type="text">{{ hpml.interpolate(value.text) }}</mk-input>
</div>
</template>

2
src/client/components/page/page.textarea-input.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<mk-textarea v-model="v">{{ hpml.interpolate(value.text) }}</mk-textarea>
<mk-textarea v-model:value="v">{{ hpml.interpolate(value.text) }}</mk-textarea>
</div>
</template>

2
src/client/components/page/page.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="iroscrza" :class="{ center: page.alignCenter, serif: page.font === 'serif' }" v-if="hpml">
<x-block v-for="child in page.content" :value="child" @input="v => updateBlock(v)" :page="page" :hpml="hpml" :key="child.id" :h="2"/>
<x-block v-for="child in page.content" :value="child" @onUpdate:value="v => updateBlock(v)" :page="page" :hpml="hpml" :key="child.id" :h="2"/>
</div>
</template>

14
src/client/components/poll-editor.vue
View File

@ -5,7 +5,7 @@
</p>
<ul ref="choices">
<li v-for="(choice, i) in choices" :key="i">
<mk-input class="input" :value="choice" @input="onInput(i, $event)">
<mk-input class="input" :value="choice" @onUpdate:value="onInput(i, $event)">
<span>{{ $t('_poll.choiceN', { n: i + 1 }) }}</span>
</mk-input>
<button @click="remove(i)" class="_button">
@ -16,27 +16,27 @@
<mk-button class="add" v-if="choices.length < 10" @click="add">{{ $t('add') }}</mk-button>
<mk-button class="add" v-else disabled>{{ $t('_poll.noMore') }}</mk-button>
<section>
<mk-switch v-model="multiple">{{ $t('_poll.canMultipleVote') }}</mk-switch>
<mk-switch v-model:value="multiple">{{ $t('_poll.canMultipleVote') }}</mk-switch>
<div>
<mk-select v-model="expiration">
<mk-select v-model:value="expiration">
<template #label>{{ $t('_poll.expiration') }}</template>
<option value="infinite">{{ $t('_poll.infinite') }}</option>
<option value="at">{{ $t('_poll.at') }}</option>
<option value="after">{{ $t('_poll.after') }}</option>
</mk-select>
<section v-if="expiration === 'at'">
<mk-input v-model="atDate" type="date" class="input">
<mk-input v-model:value="atDate" type="date" class="input">
<span>{{ $t('_poll.deadlineDate') }}</span>
</mk-input>
<mk-input v-model="atTime" type="time" class="input">
<mk-input v-model:value="atTime" type="time" class="input">
<span>{{ $t('_poll.deadlineTime') }}</span>
</mk-input>
</section>
<section v-if="expiration === 'after'">
<mk-input v-model="after" type="number" class="input">
<mk-input v-model:value="after" type="number" class="input">
<span>{{ $t('_poll.duration') }}</span>
</mk-input>
<mk-select v-model="unit">
<mk-select v-model:value="unit">
<option value="second">{{ $t('_time.second') }}</option>
<option value="minute">{{ $t('_time.minute') }}</option>
<option value="hour">{{ $t('_time.hour') }}</option>

8
src/client/components/signin.vue
View File

@ -2,12 +2,12 @@
<form class="eppvobhk" :class="{ signing, totpLogin }" @submit.prevent="onSubmit">
<div class="avatar" :style="{ backgroundImage: user ? `url('${ user.avatarUrl }')` : null }" v-show="withAvatar"></div>
<div class="normal-signin" v-if="!totpLogin">
<mk-input v-model="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @input="onUsernameChange">
<mk-input v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]+$" spellcheck="false" autofocus required @onUpdate:value="onUsernameChange">
<span>{{ $t('username') }}</span>
<template #prefix>@</template>
<template #suffix>@{{ host }}</template>
</mk-input>
<mk-input v-model="password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
<mk-input v-model:value="password" type="password" :with-password-toggle="true" v-if="!user || user && !user.usePasswordLessLogin" required>
<span>{{ $t('password') }}</span>
<template #prefix><fa :icon="faLock"/></template>
</mk-input>
@ -28,11 +28,11 @@
</div>
<div class="twofa-group totp-group">
<p style="margin-bottom:0;">{{ $t('twoStepAuthentication') }}</p>
<mk-input v-model="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
<mk-input v-model:value="password" type="password" :with-password-toggle="true" v-if="user && user.usePasswordLessLogin" required>
<span>{{ $t('password') }}</span>
<template #prefix><fa :icon="faLock"/></template>
</mk-input>
<mk-input v-model="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
<mk-input v-model:value="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false" required>
<span>{{ $t('token') }}</span>
<template #prefix><fa :icon="faGavel"/></template>
</mk-input>

14
src/client/components/signup.vue
View File

@ -1,11 +1,11 @@
<template>
<form class="mk-signup" @submit.prevent="onSubmit" :autocomplete="Math.random()">
<template v-if="meta">
<mk-input v-if="meta.disableRegistration" v-model="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
<mk-input v-if="meta.disableRegistration" v-model:value="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
<span>{{ $t('invitationCode') }}</span>
<template #prefix><fa :icon="faKey"/></template>
</mk-input>
<mk-input v-model="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @input="onChangeUsername">
<mk-input v-model:value="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @onUpdate:value="onChangeUsername">
<span>{{ $t('username') }}</span>
<template #prefix>@</template>
<template #suffix>@{{ host }}</template>
@ -19,7 +19,7 @@
<span v-if="usernameState == 'max-range'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('tooLong') }}</span>
</template>
</mk-input>
<mk-input v-model="password" type="password" :autocomplete="Math.random()" required @input="onChangePassword">
<mk-input v-model:value="password" type="password" :autocomplete="Math.random()" required @onUpdate:value="onChangePassword">
<span>{{ $t('password') }}</span>
<template #prefix><fa :icon="faLock"/></template>
<template #desc>
@ -28,7 +28,7 @@
<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('strongPassword') }}</p>
</template>
</mk-input>
<mk-input v-model="retypedPassword" type="password" :autocomplete="Math.random()" required @input="onChangePasswordRetype">
<mk-input v-model:value="retypedPassword" type="password" :autocomplete="Math.random()" required @onUpdate:value="onChangePasswordRetype">
<span>{{ $t('password') }} ({{ $t('retype') }})</span>
<template #prefix><fa :icon="faLock"/></template>
<template #desc>
@ -36,13 +36,13 @@
<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('passwordNotMatched') }}</p>
</template>
</mk-input>
<mk-switch v-model="ToSAgreement" v-if="meta.tosUrl">
<mk-switch v-model:value="ToSAgreement" v-if="meta.tosUrl">
<i18n-t path="agreeTo">
<a :href="meta.tosUrl" class="_link" target="_blank">{{ $t('tos') }}</a>
</i18n-t>
</mk-switch>
<captcha v-if="meta.enableHcaptcha" class="captcha" provider="hcaptcha" ref="hcaptcha" v-model="hCaptchaResponse" :sitekey="meta.hcaptchaSiteKey"/>
<captcha v-if="meta.enableRecaptcha" class="captcha" provider="grecaptcha" ref="recaptcha" v-model="reCaptchaResponse" :sitekey="meta.recaptchaSiteKey"/>
<captcha v-if="meta.enableHcaptcha" class="captcha" provider="hcaptcha" ref="hcaptcha" v-model:value="hCaptchaResponse" :sitekey="meta.hcaptchaSiteKey"/>
<captcha v-if="meta.enableRecaptcha" class="captcha" provider="grecaptcha" ref="recaptcha" v-model:value="reCaptchaResponse" :sitekey="meta.recaptchaSiteKey"/>
<mk-button type="submit" :disabled="shouldDisableSubmitting" primary>{{ $t('start') }}</mk-button>
</template>
</form>

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

@ -1,6 +1,6 @@
<template>
<div class="pxhvhrfw" v-size="{ max: [500] }">
<button v-for="item in items" class="_button" @click="$emit('input', item.value)" :class="{ active: value === item.value }" :key="item.value"><fa v-if="item.icon" :icon="item.icon" class="icon"/>{{ item.label }}</button>
<button v-for="item in items" class="_button" @click="$emit('update:value', item.value)" :class="{ active: value === item.value }" :key="item.value"><fa v-if="item.icon" :icon="item.icon" class="icon"/>{{ item.label }}</button>
</div>
</template>

4
src/client/components/token-generate-window.vue
View File

@ -6,13 +6,13 @@
<mk-info warn>{{ information }}</mk-info>
</div>
<div>
<mk-input v-model="name">{{ $t('name') }}</mk-input>
<mk-input v-model:value="name">{{ $t('name') }}</mk-input>
</div>
<div>
<div style="margin-bottom: 16px;"><b>{{ $t('permission') }}</b></div>
<mk-button inline @click="disableAll">{{ $t('disableAll') }}</mk-button>
<mk-button inline @click="enableAll">{{ $t('enableAll') }}</mk-button>
<mk-switch v-for="kind in (initialPermissions || kinds)" :key="kind" v-model="permissions[kind]">{{ $t(`_permissions.${kind}`) }}</mk-switch>
<mk-switch v-for="kind in (initialPermissions || kinds)" :key="kind" v-model:value="permissions[kind]">{{ $t(`_permissions.${kind}`) }}</mk-switch>
</div>
</div>
</x-window>

6
src/client/components/ui/input.vue
View File

@ -169,9 +169,9 @@ export default defineComponent({
},
v(v) {
if (this.type === 'number') {
this.$emit('input', parseFloat(v));
this.$emit('update:value', parseFloat(v));
} else {
this.$emit('input', v);
this.$emit('update:value', v);
}
this.invalid = this.$refs.input.validity.badInput;
@ -228,7 +228,7 @@ export default defineComponent({
},
onChangeFile() {
this.v = Array.from((this.$refs.file as any).files);
this.$emit('input', this.v);
this.$emit('update:value', this.v);
this.$emit('change', this.v);
},
onInput(ev) {

2
src/client/components/ui/range.vue
View File

@ -13,7 +13,7 @@
:autofocus="autofocus"
@focus="focused = true"
@blur="focused = false"
@input="$emit('input', $event.target.value)"
@input="$emit('update:value', $event.target.value)"
/>
</div>
</template>

2
src/client/components/ui/select.vue
View File

@ -58,7 +58,7 @@ export default defineComponent({
return this.value;
},
set(v) {
this.$emit('input', v);
this.$emit('update:value', v);
}
},
filled(): boolean {

2
src/client/components/ui/textarea.vue
View File

@ -74,7 +74,7 @@ export default defineComponent({
},
onInput(ev) {
this.changed = true;
this.$emit('input', ev.target.value);
this.$emit('update:value', ev.target.value);
}
}
});

4
src/client/components/user-select.vue
View File

@ -3,8 +3,8 @@
<template #header>{{ $t('selectUser') }}</template>
<div class="tbhwbxda">
<div class="inputs">
<mk-input v-model="username" class="input" @input="search" ref="username"><span>{{ $t('username') }}</span><template #prefix>@</template></mk-input>
<mk-input v-model="host" class="input" @input="search"><span>{{ $t('host') }}</span><template #prefix>@</template></mk-input>
<mk-input v-model:value="username" class="input" @onUpdate:value="search" ref="username"><span>{{ $t('username') }}</span><template #prefix>@</template></mk-input>
<mk-input v-model:value="host" class="input" @onUpdate:value="search"><span>{{ $t('host') }}</span><template #prefix>@</template></mk-input>
</div>
<div class="users">
<div class="user" v-for="user in users" :key="user.id" :class="{ selected: selected && selected.id === user.id }" @click="selected = user" @dblclick="ok()">

4
src/client/pages/channel-editor.vue
View File

@ -4,9 +4,9 @@
<div class="_card">
<div class="_content">
<mk-input v-model="name">{{ $t('name') }}</mk-input>
<mk-input v-model:value="name">{{ $t('name') }}</mk-input>
<mk-textarea v-model="description">{{ $t('description') }}</mk-textarea>
<mk-textarea v-model:value="description">{{ $t('description') }}</mk-textarea>
<div class="banner">
<mk-button v-if="bannerId == null" @click="setBannerImage"><fa :icon="faPlus"/> {{ $t('_channel.setBanner') }}</mk-button>

2
src/client/pages/channels.vue
View File

@ -2,7 +2,7 @@
<div>
<portal to="header"><fa :icon="faSatelliteDish"/>{{ $t('channel') }}</portal>
<mk-tab v-model="tab" :items="[{ label: $t('_channel.featured'), value: 'featured', icon: faFireAlt }, { label: $t('_channel.following'), value: 'following', icon: faHeart }, { label: $t('_channel.owned'), value: 'owned', icon: faEdit }]"/>
<mk-tab v-model:value="tab" :items="[{ label: $t('_channel.featured'), value: 'featured', icon: faFireAlt }, { label: $t('_channel.following'), value: 'following', icon: faHeart }, { label: $t('_channel.owned'), value: 'owned', icon: faEdit }]"/>
<div class="grwlizim featured" v-if="tab === 'featured'">
<mk-pagination :pagination="featuredPagination" #default="{items}">

4
src/client/pages/index.welcome.setup.vue
View File

@ -3,12 +3,12 @@
<h1>Welcome to Misskey!</h1>
<div>
<p>{{ $t('intro') }}</p>
<mk-input v-model="username" pattern="^[a-zA-Z0-9_]{1,20}$" spellcheck="false" required>
<mk-input v-model:value="username" pattern="^[a-zA-Z0-9_]{1,20}$" spellcheck="false" required>
<span>{{ $t('username') }}</span>
<template #prefix>@</template>
<template #suffix>@{{ host }}</template>
</mk-input>
<mk-input v-model="password" type="password">
<mk-input v-model:value="password" type="password">
<span>{{ $t('password') }}</span>
<template #prefix><fa :icon="faLock"/></template>
</mk-input>

6
src/client/pages/instance/announcements.vue
View File

@ -4,13 +4,13 @@
<mk-button @click="add()" primary style="margin: 0 auto 16px auto;"><fa :icon="faPlus"/> {{ $t('add') }}</mk-button>
<section class="_card announcements">
<div class="_content announcement" v-for="announcement in announcements">
<mk-input v-model="announcement.title">
<mk-input v-model:value="announcement.title">
<span>{{ $t('title') }}</span>
</mk-input>
<mk-textarea v-model="announcement.text">
<mk-textarea v-model:value="announcement.text">
<span>{{ $t('text') }}</span>
</mk-textarea>
<mk-input v-model="announcement.imageUrl">
<mk-input v-model:value="announcement.imageUrl">
<span>{{ $t('imageUrl') }}</span>
</mk-input>
<p v-if="announcement.reads">{{ $t('nUsersRead', { n: announcement.reads }) }}</p>

8
src/client/pages/instance/emojis.vue
View File

@ -22,9 +22,9 @@
</mk-pagination>
</div>
<div class="_content" v-if="selected">
<mk-input v-model="name"><span>{{ $t('name') }}</span></mk-input>
<mk-input v-model="category" :datalist="categories"><span>{{ $t('category') }}</span></mk-input>
<mk-input v-model="aliases"><span>{{ $t('tags') }}</span></mk-input>
<mk-input v-model:value="name"><span>{{ $t('name') }}</span></mk-input>
<mk-input v-model:value="category" :datalist="categories"><span>{{ $t('category') }}</span></mk-input>
<mk-input v-model:value="aliases"><span>{{ $t('tags') }}</span></mk-input>
<mk-button inline primary @click="update"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
<mk-button inline :disabled="selected == null" @click="del()"><fa :icon="faTrashAlt"/> {{ $t('delete') }}</mk-button>
</div>
@ -35,7 +35,7 @@
<section class="_card _vMargin remote">
<div class="_title"><fa :icon="faLaugh"/> {{ $t('customEmojisOfRemote') }}</div>
<div class="_content">
<mk-input v-model="host" :debounce="true"><span>{{ $t('host') }}</span></mk-input>
<mk-input v-model:value="host" :debounce="true"><span>{{ $t('host') }}</span></mk-input>
<mk-pagination :pagination="remotePagination" class="emojis" ref="remoteEmojis">
<template #empty><span>{{ $t('noCustomEmojis') }}</span></template>
<template #default="{items}">

6
src/client/pages/instance/federation.vue
View File

@ -4,9 +4,9 @@
<section class="_card instances">
<div class="_content">
<mk-input v-model="host" :debounce="true"><span>{{ $t('host') }}</span></mk-input>
<mk-input v-model:value="host" :debounce="true"><span>{{ $t('host') }}</span></mk-input>
<div class="inputs" style="display: flex;">
<mk-select v-model="state" style="margin: 0; flex: 1;">
<mk-select v-model:value="state" style="margin: 0; flex: 1;">
<template #label>{{ $t('state') }}</template>
<option value="all">{{ $t('all') }}</option>
<option value="federating">{{ $t('federating') }}</option>
@ -16,7 +16,7 @@
<option value="blocked">{{ $t('blocked') }}</option>
<option value="notResponding">{{ $t('notResponding') }}</option>
</mk-select>
<mk-select v-model="sort" style="margin: 0; flex: 1;">
<mk-select v-model:value="sort" style="margin: 0; flex: 1;">
<template #label>{{ $t('sort') }}</template>
<option value="+pubSub">{{ $t('pubSub') }} ({{ $t('descendingOrder') }})</option>
<option value="-pubSub">{{ $t('pubSub') }} ({{ $t('ascendingOrder') }})</option>

4
src/client/pages/instance/index.vue
View File

@ -150,10 +150,10 @@
<div class="_title"><fa :icon="faStream"/> {{ $t('serverLogs') }}</div>
<div class="_content">
<div class="_inputs">
<mk-input v-model="logDomain" :debounce="true">
<mk-input v-model:value="logDomain" :debounce="true">
<span>{{ $t('domain') }}</span>
</mk-input>
<mk-select v-model="logLevel">
<mk-select v-model:value="logLevel">
<template #label>{{ $t('level') }}</template>
<option value="all">{{ $t('levels.all') }}</option>
<option value="info">{{ $t('levels.info') }}</option>

6
src/client/pages/instance/instance.vue
View File

@ -72,7 +72,7 @@
<div class="header">
<span class="label">{{ $t('charts') }}</span>
<div class="selects">
<mk-select v-model="chartSrc" style="margin: 0; flex: 1;">
<mk-select v-model:value="chartSrc" style="margin: 0; flex: 1;">
<option value="requests">{{ $t('_instanceCharts.requests') }}</option>
<option value="users">{{ $t('_instanceCharts.users') }}</option>
<option value="users-total">{{ $t('_instanceCharts.usersTotal') }}</option>
@ -85,7 +85,7 @@
<option value="drive-files">{{ $t('_instanceCharts.files') }}</option>
<option value="drive-files-total">{{ $t('_instanceCharts.filesTotal') }}</option>
</mk-select>
<mk-select v-model="chartSpan" style="margin: 0;">
<mk-select v-model:value="chartSpan" style="margin: 0;">
<option value="hour">{{ $t('perHour') }}</option>
<option value="day">{{ $t('perDay') }}</option>
</mk-select>
@ -97,7 +97,7 @@
</div>
<div class="operations">
<span class="label">{{ $t('operations') }}</span>
<mk-switch v-model="isSuspended" class="switch">{{ $t('stopActivityDelivery') }}</mk-switch>
<mk-switch v-model:value="isSuspended" class="switch">{{ $t('stopActivityDelivery') }}</mk-switch>
<mk-switch :value="isBlocked" class="switch" @change="changeBlock">{{ $t('blockThisInstance') }}</mk-switch>
<details>
<summary>{{ $t('deleteAllFiles') }}</summary>

2
src/client/pages/instance/relays.vue
View File

@ -5,7 +5,7 @@
<section class="_card _vMargin add">
<div class="_title"><fa :icon="faPlus"/> {{ $t('addRelay') }}</div>
<div class="_content">
<mk-input v-model="inbox">
<mk-input v-model:value="inbox">
<span>{{ $t('inboxUrl') }}</span>
</mk-input>
<mk-button @click="add(inbox)" primary><fa :icon="faPlus"/> {{ $t('add') }}</mk-button>

110
src/client/pages/instance/settings.vue
View File

@ -5,13 +5,13 @@
<section class="_card _vMargin info">
<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('basicInfo') }}</div>
<div class="_content">
<mk-input v-model="name">{{ $t('instanceName') }}</mk-input>
<mk-textarea v-model="description">{{ $t('instanceDescription') }}</mk-textarea>
<mk-input v-model="iconUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('iconUrl') }}</mk-input>
<mk-input v-model="bannerUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('bannerUrl') }}</mk-input>
<mk-input v-model="tosUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('tosUrl') }}</mk-input>
<mk-input v-model="maintainerName">{{ $t('maintainerName') }}</mk-input>
<mk-input v-model="maintainerEmail" type="email"><template #icon><fa :icon="faEnvelope"/></template>{{ $t('maintainerEmail') }}</mk-input>
<mk-input v-model:value="name">{{ $t('instanceName') }}</mk-input>
<mk-textarea v-model:value="description">{{ $t('instanceDescription') }}</mk-textarea>
<mk-input v-model:value="iconUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('iconUrl') }}</mk-input>
<mk-input v-model:value="bannerUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('bannerUrl') }}</mk-input>
<mk-input v-model:value="tosUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('tosUrl') }}</mk-input>
<mk-input v-model:value="maintainerName">{{ $t('maintainerName') }}</mk-input>
<mk-input v-model:value="maintainerEmail" type="email"><template #icon><fa :icon="faEnvelope"/></template>{{ $t('maintainerEmail') }}</mk-input>
</div>
<div class="_footer">
<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
@ -20,22 +20,22 @@
<section class="_card _vMargin info">
<div class="_content">
<mk-input v-model="maxNoteTextLength" type="number" :save="() => save()" style="margin:0;"><template #icon><fa :icon="faPencilAlt"/></template>{{ $t('maxNoteTextLength') }}</mk-input>
<mk-input v-model:value="maxNoteTextLength" type="number" :save="() => save()" style="margin:0;"><template #icon><fa :icon="faPencilAlt"/></template>{{ $t('maxNoteTextLength') }}</mk-input>
</div>
<div class="_content">
<mk-switch v-model="enableLocalTimeline" @change="save()">{{ $t('enableLocalTimeline') }}</mk-switch>
<mk-switch v-model="enableGlobalTimeline" @change="save()">{{ $t('enableGlobalTimeline') }}</mk-switch>
<mk-switch v-model:value="enableLocalTimeline" @change="save()">{{ $t('enableLocalTimeline') }}</mk-switch>
<mk-switch v-model:value="enableGlobalTimeline" @change="save()">{{ $t('enableGlobalTimeline') }}</mk-switch>
<mk-info>{{ $t('disablingTimelinesInfo') }}</mk-info>
</div>
<div class="_content">
<mk-switch v-model="useStarForReactionFallback" @change="save()">{{ $t('useStarForReactionFallback') }}</mk-switch>
<mk-switch v-model:value="useStarForReactionFallback" @change="save()">{{ $t('useStarForReactionFallback') }}</mk-switch>
</div>
</section>
<section class="_card _vMargin info">
<div class="_title"><fa :icon="faUser"/> {{ $t('registration') }}</div>
<div class="_content">
<mk-switch v-model="enableRegistration" @change="save()">{{ $t('enableRegistration') }}</mk-switch>
<mk-switch v-model:value="enableRegistration" @change="save()">{{ $t('enableRegistration') }}</mk-switch>
<mk-button v-if="!enableRegistration" @click="invite">{{ $t('invite') }}</mk-button>
</div>
</section>
@ -43,10 +43,10 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faShieldAlt"/> {{ $t('hcaptcha') }}</div>
<div class="_content">
<mk-switch v-model="enableHcaptcha" ref="enableHcaptcha">{{ $t('enableHcaptcha') }}</mk-switch>
<mk-switch v-model:value="enableHcaptcha" ref="enableHcaptcha">{{ $t('enableHcaptcha') }}</mk-switch>
<template v-if="enableHcaptcha">
<mk-input v-model="hcaptchaSiteKey" :disabled="!enableHcaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('hcaptchaSiteKey') }}</mk-input>
<mk-input v-model="hcaptchaSecretKey" :disabled="!enableHcaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('hcaptchaSecretKey') }}</mk-input>
<mk-input v-model:value="hcaptchaSiteKey" :disabled="!enableHcaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('hcaptchaSiteKey') }}</mk-input>
<mk-input v-model:value="hcaptchaSecretKey" :disabled="!enableHcaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('hcaptchaSecretKey') }}</mk-input>
</template>
</div>
<div class="_content" v-if="enableHcaptcha">
@ -61,10 +61,10 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faShieldAlt"/> {{ $t('recaptcha') }}</div>
<div class="_content">
<mk-switch v-model="enableRecaptcha" ref="enableRecaptcha">{{ $t('enableRecaptcha') }}</mk-switch>
<mk-switch v-model:value="enableRecaptcha" ref="enableRecaptcha">{{ $t('enableRecaptcha') }}</mk-switch>
<template v-if="enableRecaptcha">
<mk-input v-model="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSiteKey') }}</mk-input>
<mk-input v-model="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSecretKey') }}</mk-input>
<mk-input v-model:value="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSiteKey') }}</mk-input>
<mk-input v-model:value="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSecretKey') }}</mk-input>
</template>
</div>
<div class="_content" v-if="enableRecaptcha && recaptchaSiteKey">
@ -79,19 +79,19 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faEnvelope" /> {{ $t('emailConfig') }}</div>
<div class="_content">
<mk-switch v-model="enableEmail" @change="save()">{{ $t('enableEmail') }}<template #desc>{{ $t('emailConfigInfo') }}</template></mk-switch>
<mk-input v-model="email" type="email" :disabled="!enableEmail">{{ $t('email') }}</mk-input>
<mk-switch v-model:value="enableEmail" @change="save()">{{ $t('enableEmail') }}<template #desc>{{ $t('emailConfigInfo') }}</template></mk-switch>
<mk-input v-model:value="email" type="email" :disabled="!enableEmail">{{ $t('email') }}</mk-input>
<div><b>{{ $t('smtpConfig') }}</b></div>
<div class="_inputs">
<mk-input v-model="smtpHost" :disabled="!enableEmail">{{ $t('smtpHost') }}</mk-input>
<mk-input v-model="smtpPort" type="number" :disabled="!enableEmail">{{ $t('smtpPort') }}</mk-input>
<mk-input v-model:value="smtpHost" :disabled="!enableEmail">{{ $t('smtpHost') }}</mk-input>
<mk-input v-model:value="smtpPort" type="number" :disabled="!enableEmail">{{ $t('smtpPort') }}</mk-input>
</div>
<div class="_inputs">
<mk-input v-model="smtpUser" :disabled="!enableEmail">{{ $t('smtpUser') }}</mk-input>
<mk-input v-model="smtpPass" type="password" :disabled="!enableEmail">{{ $t('smtpPass') }}</mk-input>
<mk-input v-model:value="smtpUser" :disabled="!enableEmail">{{ $t('smtpUser') }}</mk-input>
<mk-input v-model:value="smtpPass" type="password" :disabled="!enableEmail">{{ $t('smtpPass') }}</mk-input>
</div>
<mk-info>{{ $t('emptyToDisableSmtpAuth') }}</mk-info>
<mk-switch v-model="smtpSecure" :disabled="!enableEmail">{{ $t('smtpSecure') }}<template #desc>{{ $t('smtpSecureInfo') }}</template></mk-switch>
<mk-switch v-model:value="smtpSecure" :disabled="!enableEmail">{{ $t('smtpSecure') }}<template #desc>{{ $t('smtpSecureInfo') }}</template></mk-switch>
<div>
<mk-button :disabled="!enableEmail" inline @click="testEmail()">{{ $t('testEmail') }}</mk-button>
<mk-button :disabled="!enableEmail" primary inline @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
@ -102,11 +102,11 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faBolt"/> {{ $t('serviceworker') }}</div>
<div class="_content">
<mk-switch v-model="enableServiceWorker">{{ $t('enableServiceworker') }}<template #desc>{{ $t('serviceworkerInfo') }}</template></mk-switch>
<mk-switch v-model:value="enableServiceWorker">{{ $t('enableServiceworker') }}<template #desc>{{ $t('serviceworkerInfo') }}</template></mk-switch>
<template v-if="enableServiceWorker">
<div class="_inputs">
<mk-input v-model="swPublicKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Public key</mk-input>
<mk-input v-model="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Private key</mk-input>
<mk-input v-model:value="swPublicKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Public key</mk-input>
<mk-input v-model:value="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Private key</mk-input>
</div>
</template>
</div>
@ -118,7 +118,7 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faThumbtack"/> {{ $t('pinnedUsers') }}</div>
<div class="_content">
<mk-textarea v-model="pinnedUsers">
<mk-textarea v-model:value="pinnedUsers">
<template #desc>{{ $t('pinnedUsersDescription') }} <button class="_textButton" @click="addPinUser">{{ $t('addUser') }}</button></template>
</mk-textarea>
</div>
@ -130,10 +130,10 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faCloud"/> {{ $t('files') }}</div>
<div class="_content">
<mk-switch v-model="cacheRemoteFiles">{{ $t('cacheRemoteFiles') }}<template #desc>{{ $t('cacheRemoteFilesDescription') }}</template></mk-switch>
<mk-switch v-model="proxyRemoteFiles">{{ $t('proxyRemoteFiles') }}<template #desc>{{ $t('proxyRemoteFilesDescription') }}</template></mk-switch>
<mk-input v-model="localDriveCapacityMb" type="number">{{ $t('driveCapacityPerLocalAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
<mk-input v-model="remoteDriveCapacityMb" type="number" :disabled="!cacheRemoteFiles" style="margin-bottom: 0;">{{ $t('driveCapacityPerRemoteAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
<mk-switch v-model:value="cacheRemoteFiles">{{ $t('cacheRemoteFiles') }}<template #desc>{{ $t('cacheRemoteFilesDescription') }}</template></mk-switch>
<mk-switch v-model:value="proxyRemoteFiles">{{ $t('proxyRemoteFiles') }}<template #desc>{{ $t('proxyRemoteFilesDescription') }}</template></mk-switch>
<mk-input v-model:value="localDriveCapacityMb" type="number">{{ $t('driveCapacityPerLocalAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
<mk-input v-model:value="remoteDriveCapacityMb" type="number" :disabled="!cacheRemoteFiles" style="margin-bottom: 0;">{{ $t('driveCapacityPerRemoteAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
</div>
<div class="_footer">
<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
@ -143,24 +143,24 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faCloud"/> {{ $t('objectStorage') }}</div>
<div class="_content">
<mk-switch v-model="useObjectStorage">{{ $t('useObjectStorage') }}</mk-switch>
<mk-switch v-model:value="useObjectStorage">{{ $t('useObjectStorage') }}</mk-switch>
<template v-if="useObjectStorage">
<mk-input v-model="objectStorageBaseUrl" :disabled="!useObjectStorage">{{ $t('objectStorageBaseUrl') }}<template #desc>{{ $t('objectStorageBaseUrlDesc') }}</template></mk-input>
<mk-input v-model:value="objectStorageBaseUrl" :disabled="!useObjectStorage">{{ $t('objectStorageBaseUrl') }}<template #desc>{{ $t('objectStorageBaseUrlDesc') }}</template></mk-input>
<div class="_inputs">
<mk-input v-model="objectStorageBucket" :disabled="!useObjectStorage">{{ $t('objectStorageBucket') }}<template #desc>{{ $t('objectStorageBucketDesc') }}</template></mk-input>
<mk-input v-model="objectStoragePrefix" :disabled="!useObjectStorage">{{ $t('objectStoragePrefix') }}<template #desc>{{ $t('objectStoragePrefixDesc') }}</template></mk-input>
<mk-input v-model:value="objectStorageBucket" :disabled="!useObjectStorage">{{ $t('objectStorageBucket') }}<template #desc>{{ $t('objectStorageBucketDesc') }}</template></mk-input>
<mk-input v-model:value="objectStoragePrefix" :disabled="!useObjectStorage">{{ $t('objectStoragePrefix') }}<template #desc>{{ $t('objectStoragePrefixDesc') }}</template></mk-input>
</div>
<mk-input v-model="objectStorageEndpoint" :disabled="!useObjectStorage">{{ $t('objectStorageEndpoint') }}<template #desc>{{ $t('objectStorageEndpointDesc') }}</template></mk-input>
<mk-input v-model:value="objectStorageEndpoint" :disabled="!useObjectStorage">{{ $t('objectStorageEndpoint') }}<template #desc>{{ $t('objectStorageEndpointDesc') }}</template></mk-input>
<div class="_inputs">
<mk-input v-model="objectStorageRegion" :disabled="!useObjectStorage">{{ $t('objectStorageRegion') }}<template #desc>{{ $t('objectStorageRegionDesc') }}</template></mk-input>
<mk-input v-model:value="objectStorageRegion" :disabled="!useObjectStorage">{{ $t('objectStorageRegion') }}<template #desc>{{ $t('objectStorageRegionDesc') }}</template></mk-input>
</div>
<div class="_inputs">
<mk-input v-model="objectStorageAccessKey" :disabled="!useObjectStorage"><template #icon><fa :icon="faKey"/></template>Access key</mk-input>
<mk-input v-model="objectStorageSecretKey" :disabled="!useObjectStorage"><template #icon><fa :icon="faKey"/></template>Secret key</mk-input>
<mk-input v-model:value="objectStorageAccessKey" :disabled="!useObjectStorage"><template #icon><fa :icon="faKey"/></template>Access key</mk-input>
<mk-input v-model:value="objectStorageSecretKey" :disabled="!useObjectStorage"><template #icon><fa :icon="faKey"/></template>Secret key</mk-input>
</div>
<mk-switch v-model="objectStorageUseSSL" :disabled="!useObjectStorage">{{ $t('objectStorageUseSSL') }}<template #desc>{{ $t('objectStorageUseSSLDesc') }}</template></mk-switch>
<mk-switch v-model="objectStorageUseProxy" :disabled="!useObjectStorage">{{ $t('objectStorageUseProxy') }}<template #desc>{{ $t('objectStorageUseProxyDesc') }}</template></mk-switch>
<mk-switch v-model="objectStorageSetPublicRead" :disabled="!useObjectStorage">{{ $t('objectStorageSetPublicRead') }}</mk-switch>
<mk-switch v-model:value="objectStorageUseSSL" :disabled="!useObjectStorage">{{ $t('objectStorageUseSSL') }}<template #desc>{{ $t('objectStorageUseSSLDesc') }}</template></mk-switch>
<mk-switch v-model:value="objectStorageUseProxy" :disabled="!useObjectStorage">{{ $t('objectStorageUseProxy') }}<template #desc>{{ $t('objectStorageUseProxyDesc') }}</template></mk-switch>
<mk-switch v-model:value="objectStorageSetPublicRead" :disabled="!useObjectStorage">{{ $t('objectStorageSetPublicRead') }}</mk-switch>
</template>
</div>
<div class="_footer">
@ -179,7 +179,7 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faBan"/> {{ $t('blockedInstances') }}</div>
<div class="_content">
<mk-textarea v-model="blockedHosts">
<mk-textarea v-model:value="blockedHosts">
<template #desc>{{ $t('blockedInstancesDescription') }}</template>
</mk-textarea>
</div>
@ -192,29 +192,29 @@
<div class="_title"><fa :icon="faShareAlt"/> {{ $t('integration') }}</div>
<div class="_content">
<header><fa :icon="faTwitter"/> Twitter</header>
<mk-switch v-model="enableTwitterIntegration">{{ $t('enable') }}</mk-switch>
<mk-switch v-model:value="enableTwitterIntegration">{{ $t('enable') }}</mk-switch>
<template v-if="enableTwitterIntegration">
<mk-info>Callback URL: {{ `${url}/api/tw/cb` }}</mk-info>
<mk-input v-model="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Key</mk-input>
<mk-input v-model="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Secret</mk-input>
<mk-input v-model:value="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Key</mk-input>
<mk-input v-model:value="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Secret</mk-input>
</template>
</div>
<div class="_content">
<header><fa :icon="faGithub"/> GitHub</header>
<mk-switch v-model="enableGithubIntegration">{{ $t('enable') }}</mk-switch>
<mk-switch v-model:value="enableGithubIntegration">{{ $t('enable') }}</mk-switch>
<template v-if="enableGithubIntegration">
<mk-info>Callback URL: {{ `${url}/api/gh/cb` }}</mk-info>
<mk-input v-model="githubClientId" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
<mk-input v-model="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
<mk-input v-model:value="githubClientId" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
<mk-input v-model:value="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
</template>
</div>
<div class="_content">
<header><fa :icon="faDiscord"/> Discord</header>
<mk-switch v-model="enableDiscordIntegration">{{ $t('enable') }}</mk-switch>
<mk-switch v-model:value="enableDiscordIntegration">{{ $t('enable') }}</mk-switch>
<template v-if="enableDiscordIntegration">
<mk-info>Callback URL: {{ `${url}/api/dc/cb` }}</mk-info>
<mk-input v-model="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
<mk-input v-model="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
<mk-input v-model:value="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
<mk-input v-model:value="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
</template>
</div>
<div class="_footer">
@ -225,7 +225,7 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faArchway" /> Summaly Proxy</div>
<div class="_content">
<mk-input v-model="summalyProxy">URL</mk-input>
<mk-input v-model:value="summalyProxy">URL</mk-input>
<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
</div>
</section>

6
src/client/pages/instance/users.user.vue
View File

@ -14,9 +14,9 @@
</div>
<div class="_content actions">
<div style="flex: 1; padding-left: 1em;">
<mk-switch v-if="user.host == null && $store.state.i.isAdmin && (this.moderator || !user.isAdmin)" @change="toggleModerator()" v-model="moderator">{{ $t('moderator') }}</mk-switch>
<mk-switch @change="toggleSilence()" v-model="silenced">{{ $t('silence') }}</mk-switch>
<mk-switch @change="toggleSuspend()" v-model="suspended">{{ $t('suspend') }}</mk-switch>
<mk-switch v-if="user.host == null && $store.state.i.isAdmin && (this.moderator || !user.isAdmin)" @change="toggleModerator()" v-model:value="moderator">{{ $t('moderator') }}</mk-switch>
<mk-switch @change="toggleSilence()" v-model:value="silenced">{{ $t('silence') }}</mk-switch>
<mk-switch @change="toggleSuspend()" v-model:value="suspended">{{ $t('suspend') }}</mk-switch>
</div>
<div style="flex: 1; padding-left: 1em;">
<mk-button @click="openProfile"><fa :icon="faExternalLinkSquareAlt"/> {{ $t('profile')}}</mk-button>

12
src/client/pages/instance/users.vue
View File

@ -5,7 +5,7 @@
<section class="_card _vMargin lookup">
<div class="_title"><fa :icon="faSearch"/> {{ $t('lookup') }}</div>
<div class="_content">
<mk-input class="target" v-model="target" type="text" @enter="showUser()">
<mk-input class="target" v-model:value="target" type="text" @enter="showUser()">
<span>{{ $t('usernameOrUserId') }}</span>
</mk-input>
<mk-button @click="showUser()" primary><fa :icon="faSearch"/> {{ $t('lookup') }}</mk-button>
@ -19,14 +19,14 @@
<div class="_title"><fa :icon="faUsers"/> {{ $t('users') }}</div>
<div class="_content">
<div class="inputs" style="display: flex;">
<mk-select v-model="sort" style="margin: 0; flex: 1;">
<mk-select v-model:value="sort" style="margin: 0; flex: 1;">
<template #label>{{ $t('sort') }}</template>
<option value="-createdAt">{{ $t('registeredDate') }} ({{ $t('ascendingOrder') }})</option>
<option value="+createdAt">{{ $t('registeredDate') }} ({{ $t('descendingOrder') }})</option>
<option value="-updatedAt">{{ $t('lastUsed') }} ({{ $t('ascendingOrder') }})</option>
<option value="+updatedAt">{{ $t('lastUsed') }} ({{ $t('descendingOrder') }})</option>
</mk-select>
<mk-select v-model="state" style="margin: 0; flex: 1;">
<mk-select v-model:value="state" style="margin: 0; flex: 1;">
<template #label>{{ $t('state') }}</template>
<option value="all">{{ $t('all') }}</option>
<option value="available">{{ $t('normal') }}</option>
@ -35,7 +35,7 @@
<option value="silenced">{{ $t('silence') }}</option>
<option value="suspended">{{ $t('suspend') }}</option>
</mk-select>
<mk-select v-model="origin" style="margin: 0; flex: 1;">
<mk-select v-model:value="origin" style="margin: 0; flex: 1;">
<template #label>{{ $t('instance') }}</template>
<option value="combined">{{ $t('all') }}</option>
<option value="local">{{ $t('local') }}</option>
@ -43,10 +43,10 @@
</mk-select>
</div>
<div class="inputs" style="display: flex; padding-top: 1.2em;">
<mk-input v-model="searchUsername" style="margin: 0; flex: 1;" type="text" spellcheck="false" @input="$refs.users.reload()">
<mk-input v-model:value="searchUsername" style="margin: 0; flex: 1;" type="text" spellcheck="false" @onUpdate:value="$refs.users.reload()">
<span>{{ $t('username') }}</span>
</mk-input>
<mk-input v-model="searchHost" style="margin: 0; flex: 1;" type="text" spellcheck="false" @input="$refs.users.reload()" :disabled="pagination.params().origin === 'local'">
<mk-input v-model:value="searchHost" style="margin: 0; flex: 1;" type="text" spellcheck="false" @onUpdate:value="$refs.users.reload()" :disabled="pagination.params().origin === 'local'">
<span>{{ $t('host') }}</span>
</mk-input>
</div>

22
src/client/pages/my-antennas/index.antenna.vue
View File

@ -2,10 +2,10 @@
<div class="shaynizk _card">
<div class="_title" v-if="antenna.name">{{ antenna.name }}</div>
<div class="_content body">
<mk-input v-model="name">
<mk-input v-model:value="name">
<span>{{ $t('name') }}</span>
</mk-input>
<mk-select v-model="src">
<mk-select v-model:value="src">
<template #label>{{ $t('antennaSource') }}</template>
<option value="all">{{ $t('_antennaSources.all') }}</option>
<option value="home">{{ $t('_antennaSources.homeTimeline') }}</option>
@ -13,30 +13,30 @@
<option value="list">{{ $t('_antennaSources.userList') }}</option>
<option value="group">{{ $t('_antennaSources.userGroup') }}</option>
</mk-select>
<mk-select v-model="userListId" v-if="src === 'list'">
<mk-select v-model:value="userListId" v-if="src === 'list'">
<template #label>{{ $t('userList') }}</template>
<option v-for="list in userLists" :value="list.id" :key="list.id">{{ list.name }}</option>
</mk-select>
<mk-select v-model="userGroupId" v-else-if="src === 'group'">
<mk-select v-model:value="userGroupId" v-else-if="src === 'group'">
<template #label>{{ $t('userGroup') }}</template>
<option v-for="group in userGroups" :value="group.id" :key="group.id">{{ group.name }}</option>
</mk-select>
<mk-textarea v-model="users" v-else-if="src === 'users'">
<mk-textarea v-model:value="users" v-else-if="src === 'users'">
<span>{{ $t('users') }}</span>
<template #desc>{{ $t('antennaUsersDescription') }} <button class="_textButton" @click="addUser">{{ $t('addUser') }}</button></template>
</mk-textarea>
<mk-switch v-model="withReplies">{{ $t('withReplies') }}</mk-switch>
<mk-textarea v-model="keywords">
<mk-switch v-model:value="withReplies">{{ $t('withReplies') }}</mk-switch>
<mk-textarea v-model:value="keywords">
<span>{{ $t('antennaKeywords') }}</span>
<template #desc>{{ $t('antennaKeywordsDescription') }}</template>
</mk-textarea>
<mk-textarea v-model="excludeKeywords">
<mk-textarea v-model:value="excludeKeywords">
<span>{{ $t('antennaExcludeKeywords') }}</span>
<template #desc>{{ $t('antennaKeywordsDescription') }}</template>
</mk-textarea>
<mk-switch v-model="caseSensitive">{{ $t('caseSensitive') }}</mk-switch>
<mk-switch v-model="withFile">{{ $t('withFileAntenna') }}</mk-switch>
<mk-switch v-model="notify">{{ $t('notifyAntenna') }}</mk-switch>
<mk-switch v-model:value="caseSensitive">{{ $t('caseSensitive') }}</mk-switch>
<mk-switch v-model:value="withFile">{{ $t('withFileAntenna') }}</mk-switch>
<mk-switch v-model:value="notify">{{ $t('notifyAntenna') }}</mk-switch>
</div>
<div class="_footer">
<mk-button inline @click="saveAntenna()" primary><fa :icon="faSave"/> {{ $t('save') }}</mk-button>

6
src/client/pages/my-settings/2fa.vue
View File

@ -20,7 +20,7 @@
</div>
</div>
<mk-switch v-model="usePasswordLessLogin" @change="updatePasswordLessLogin" v-if="$store.state.i.securityKeysList.length > 0">{{ $t('passwordLessLogin') }}</mk-switch>
<mk-switch v-model:value="usePasswordLessLogin" @change="updatePasswordLessLogin" v-if="$store.state.i.securityKeysList.length > 0">{{ $t('passwordLessLogin') }}</mk-switch>
<mk-info warn v-if="registration && registration.error">{{ $t('error') }} {{ registration.error }}</mk-info>
<mk-button v-if="!registration || registration.error" @click="addSecurityKey">{{ $t('_2fa.registerKey') }}</mk-button>
@ -32,7 +32,7 @@
</li>
<li v-if="registration.stage >= 1">
<mk-form :disabled="registration.stage != 1 || registration.saving">
<mk-input v-model="keyName" :max="30">
<mk-input v-model:value="keyName" :max="30">
<span>{{ $t('securityKeyName') }}</span>
</mk-input>
<mk-button @click="registerKey" :disabled="keyName.length == 0">{{ $t('registerSecurityKey') }}</mk-button>
@ -52,7 +52,7 @@
</li>
<li>{{ $t('_2fa.step2') }}<br><img :src="data.qr"></li>
<li>{{ $t('_2fa.step3') }}<br>
<mk-input v-model="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false">{{ $t('token') }}</mk-input>
<mk-input v-model:value="token" type="text" pattern="^[0-9]{6}$" autocomplete="off" spellcheck="false">{{ $t('token') }}</mk-input>
<mk-button primary @click="submit">{{ $t('done') }}</mk-button>
</li>
</ol>

2
src/client/pages/my-settings/import-export.vue
View File

@ -2,7 +2,7 @@
<section class="_card">
<div class="_title"><fa :icon="faBoxes"/> {{ $t('importAndExport') }}</div>
<div class="_content">
<mk-select v-model="exportTarget">
<mk-select v-model:value="exportTarget">
<option value="notes">{{ $t('_exportOrImport.allNotes') }}</option>
<option value="following">{{ $t('_exportOrImport.followingList') }}</option>
<option value="user-lists">{{ $t('_exportOrImport.userLists') }}</option>

4
src/client/pages/my-settings/index.vue
View File

@ -9,10 +9,10 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faCog"/> {{ $t('general') }}</div>
<div class="_content">
<mk-switch v-model="$store.state.i.autoWatch" @change="onChangeAutoWatch">
<mk-switch v-model:value="$store.state.i.autoWatch" @change="onChangeAutoWatch">
{{ $t('autoNoteWatch') }}<template #desc>{{ $t('autoNoteWatchDescription') }}</template>
</mk-switch>
<mk-switch v-model="$store.state.i.injectFeaturedNote" @change="onChangeInjectFeaturedNote">
<mk-switch v-model:value="$store.state.i.injectFeaturedNote" @change="onChangeInjectFeaturedNote">
{{ $t('showFeaturedNotesInTimeline') }}
</mk-switch>
</div>

10
src/client/pages/my-settings/privacy.vue
View File

@ -2,19 +2,19 @@
<section class="_card">
<div class="_title"><fa :icon="faLock"/> {{ $t('privacy') }}</div>
<div class="_content">
<mk-switch v-model="isLocked" @change="save()">{{ $t('makeFollowManuallyApprove') }}</mk-switch>
<mk-switch v-model="autoAcceptFollowed" v-if="isLocked" @change="save()">{{ $t('autoAcceptFollowed') }}</mk-switch>
<mk-switch v-model:value="isLocked" @change="save()">{{ $t('makeFollowManuallyApprove') }}</mk-switch>
<mk-switch v-model:value="autoAcceptFollowed" v-if="isLocked" @change="save()">{{ $t('autoAcceptFollowed') }}</mk-switch>
</div>
<div class="_content">
<mk-switch v-model="rememberNoteVisibility" @change="save()">{{ $t('rememberNoteVisibility') }}</mk-switch>
<mk-select v-model="defaultNoteVisibility" style="margin-bottom: 8px;" v-if="!rememberNoteVisibility">
<mk-switch v-model:value="rememberNoteVisibility" @change="save()">{{ $t('rememberNoteVisibility') }}</mk-switch>
<mk-select v-model:value="defaultNoteVisibility" style="margin-bottom: 8px;" v-if="!rememberNoteVisibility">
<template #label>{{ $t('defaultNoteVisibility') }}</template>
<option value="public">{{ $t('_visibility.public') }}</option>
<option value="home">{{ $t('_visibility.home') }}</option>
<option value="followers">{{ $t('_visibility.followers') }}</option>
<option value="specified">{{ $t('_visibility.specified') }}</option>
</mk-select>
<mk-switch v-model="defaultNoteLocalOnly" v-if="!rememberNoteVisibility">{{ $t('_visibility.localOnly') }}</mk-switch>
<mk-switch v-model:value="defaultNoteLocalOnly" v-if="!rememberNoteVisibility">{{ $t('_visibility.localOnly') }}</mk-switch>
</div>
</section>
</template>

28
src/client/pages/my-settings/profile.vue
View File

@ -6,21 +6,21 @@
<mk-avatar class="avatar" :user="$store.state.i" :disable-preview="true" :disable-link="true" @click.stop="changeAvatar"/>
</div>
<mk-input v-model="name" :max="30">
<mk-input v-model:value="name" :max="30">
<span>{{ $t('_profile.name') }}</span>
</mk-input>
<mk-textarea v-model="description" :max="500">
<mk-textarea v-model:value="description" :max="500">
<span>{{ $t('_profile.description') }}</span>
<template #desc>{{ $t('_profile.youCanIncludeHashtags') }}</template>
</mk-textarea>
<mk-input v-model="location">
<mk-input v-model:value="location">
<span>{{ $t('location') }}</span>
<template #prefix><fa :icon="faMapMarkerAlt"/></template>
</mk-input>
<mk-input v-model="birthday" type="date">
<mk-input v-model:value="birthday" type="date">
<template #title>{{ $t('birthday') }}</template>
<template #prefix><fa :icon="faBirthdayCake"/></template>
</mk-input>
@ -28,25 +28,25 @@
<details class="fields">
<summary>{{ $t('_profile.metadata') }}</summary>
<div class="row">
<mk-input v-model="fieldName0">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model="fieldValue0">{{ $t('_profile.metadataContent') }}</mk-input>
<mk-input v-model:value="fieldName0">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model:value="fieldValue0">{{ $t('_profile.metadataContent') }}</mk-input>
</div>
<div class="row">
<mk-input v-model="fieldName1">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model="fieldValue1">{{ $t('_profile.metadataContent') }}</mk-input>
<mk-input v-model:value="fieldName1">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model:value="fieldValue1">{{ $t('_profile.metadataContent') }}</mk-input>
</div>
<div class="row">
<mk-input v-model="fieldName2">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model="fieldValue2">{{ $t('_profile.metadataContent') }}</mk-input>
<mk-input v-model:value="fieldName2">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model:value="fieldValue2">{{ $t('_profile.metadataContent') }}</mk-input>
</div>
<div class="row">
<mk-input v-model="fieldName3">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model="fieldValue3">{{ $t('_profile.metadataContent') }}</mk-input>
<mk-input v-model:value="fieldName3">{{ $t('_profile.metadataLabel') }}</mk-input>
<mk-input v-model:value="fieldValue3">{{ $t('_profile.metadataContent') }}</mk-input>
</div>
</details>
<mk-switch v-model="isBot">{{ $t('flagAsBot') }}</mk-switch>
<mk-switch v-model="isCat">{{ $t('flagAsCat') }}</mk-switch>
<mk-switch v-model:value="isBot">{{ $t('flagAsBot') }}</mk-switch>
<mk-switch v-model:value="isCat">{{ $t('flagAsCat') }}</mk-switch>
</div>
<div class="_footer">
<mk-button @click="save(true)" primary><fa :icon="faSave"/> {{ $t('save') }}</mk-button>

2
src/client/pages/my-settings/reaction.vue
View File

@ -2,7 +2,7 @@
<section class="_card">
<div class="_title"><fa :icon="faLaugh"/> {{ $t('reaction') }}</div>
<div class="_content">
<mk-input v-model="reactions" style="font-family: 'Segoe UI Emoji', 'Noto Color Emoji', Roboto, HelveticaNeue, Arial, sans-serif">
<mk-input v-model:value="reactions" style="font-family: 'Segoe UI Emoji', 'Noto Color Emoji', Roboto, HelveticaNeue, Arial, sans-serif">
{{ $t('reaction') }}<template #desc>{{ $t('reactionSettingDescription') }} <button class="_textButton" @click="chooseEmoji">{{ $t('chooseEmoji') }}</button></template>
</mk-input>
<mk-button inline @click="setDefault"><fa :icon="faUndo"/> {{ $t('default') }}</mk-button>

6
src/client/pages/my-settings/word-mute.vue
View File

@ -2,18 +2,18 @@
<section class="_card">
<div class="_title"><fa :icon="faCommentSlash"/> {{ $t('wordMute') }}</div>
<div class="_content _noPad">
<mk-tab v-model="tab" :items="[{ label: $t('_wordMute.soft'), value: 'soft' }, { label: $t('_wordMute.hard'), value: 'hard' }]"/>
<mk-tab v-model:value="tab" :items="[{ label: $t('_wordMute.soft'), value: 'soft' }, { label: $t('_wordMute.hard'), value: 'hard' }]"/>
</div>
<div class="_content" v-show="tab === 'soft'">
<mk-info>{{ $t('_wordMute.softDescription') }}</mk-info>
<mk-textarea v-model="softMutedWords">
<mk-textarea v-model:value="softMutedWords">
<span>{{ $t('_wordMute.muteWords') }}</span>
<template #desc>{{ $t('_wordMute.muteWordsDescription') }}<br>{{ $t('_wordMute.muteWordsDescription2') }}</template>
</mk-textarea>
</div>
<div class="_content" v-show="tab === 'hard'">
<mk-info>{{ $t('_wordMute.hardDescription') }}</mk-info>
<mk-textarea v-model="hardMutedWords" style="margin-bottom: 16px;">
<mk-textarea v-model:value="hardMutedWords" style="margin-bottom: 16px;">
<span>{{ $t('_wordMute.muteWords') }}</span>
<template #desc>{{ $t('_wordMute.muteWordsDescription') }}<br>{{ $t('_wordMute.muteWordsDescription2') }}</template>
</mk-textarea>

2
src/client/pages/note.vue
View File

@ -14,7 +14,7 @@
<hr v-if="showNext"/>
<mk-remote-caution v-if="note.user.host != null" :href="note.url || note.uri" style="margin-bottom: var(--margin)"/>
<x-note v-model="note" :key="note.id" :detail="true"/>
<x-note v-model:value="note" :key="note.id" :detail="true"/>
<button class="_panel _button" v-if="hasPrev && !showPrev" @click="showPrev = true" style="margin: var(--margin) auto 0 auto;"><fa :icon="faChevronDown"/></button>
<hr v-if="showPrev"/>

16
src/client/pages/page-editor/els/page-editor.el.button.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.button') }}</template>
<section class="xfhsjczc">
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._button.text') }}</span></mk-input>
<mk-switch v-model="value.primary"><span>{{ $t('_pages.blocks._button.colored') }}</span></mk-switch>
<mk-select v-model="value.action">
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._button.text') }}</span></mk-input>
<mk-switch v-model:value="value.primary"><span>{{ $t('_pages.blocks._button.colored') }}</span></mk-switch>
<mk-select v-model:value="value.action">
<template #label>{{ $t('_pages.blocks._button.action') }}</template>
<option value="dialog">{{ $t('_pages.blocks._button._action.dialog') }}</option>
<option value="resetRandom">{{ $t('_pages.blocks._button._action.resetRandom') }}</option>
@ -13,12 +13,12 @@
<option value="callAiScript">{{ $t('_pages.blocks._button._action.callAiScript') }}</option>
</mk-select>
<template v-if="value.action === 'dialog'">
<mk-input v-model="value.content"><span>{{ $t('_pages.blocks._button._action._dialog.content') }}</span></mk-input>
<mk-input v-model:value="value.content"><span>{{ $t('_pages.blocks._button._action._dialog.content') }}</span></mk-input>
</template>
<template v-else-if="value.action === 'pushEvent'">
<mk-input v-model="value.event"><span>{{ $t('_pages.blocks._button._action._pushEvent.event') }}</span></mk-input>
<mk-input v-model="value.message"><span>{{ $t('_pages.blocks._button._action._pushEvent.message') }}</span></mk-input>
<mk-select v-model="value.var">
<mk-input v-model:value="value.event"><span>{{ $t('_pages.blocks._button._action._pushEvent.event') }}</span></mk-input>
<mk-input v-model:value="value.message"><span>{{ $t('_pages.blocks._button._action._pushEvent.message') }}</span></mk-input>
<mk-select v-model:value="value.var">
<template #label>{{ $t('_pages.blocks._button._action._pushEvent.variable') }}</template>
<option :value="null">{{ $t('_pages.blocks._button._action._pushEvent.no-variable') }}</option>
<option v-for="v in hpml.getVarsByType()" :value="v.name">{{ v.name }}</option>
@ -31,7 +31,7 @@
</mk-select>
</template>
<template v-else-if="value.action === 'callAiScript'">
<mk-input v-model="value.fn"><span>{{ $t('_pages.blocks._button._action._callAiScript.functionName') }}</span></mk-input>
<mk-input v-model:value="value.fn"><span>{{ $t('_pages.blocks._button._action._callAiScript.functionName') }}</span></mk-input>
</template>
</section>
</x-container>

6
src/client/pages/page-editor/els/page-editor.el.canvas.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faPaintBrush"/> {{ $t('_pages.blocks.canvas') }}</template>
<section style="padding: 0 16px 0 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._canvas.id') }}</span></mk-input>
<mk-input v-model="value.width" type="number"><span>{{ $t('_pages.blocks._canvas.width') }}</span><template #suffix>px</template></mk-input>
<mk-input v-model="value.height" type="number"><span>{{ $t('_pages.blocks._canvas.height') }}</span><template #suffix>px</template></mk-input>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._canvas.id') }}</span></mk-input>
<mk-input v-model:value="value.width" type="number"><span>{{ $t('_pages.blocks._canvas.width') }}</span><template #suffix>px</template></mk-input>
<mk-input v-model:value="value.height" type="number"><span>{{ $t('_pages.blocks._canvas.height') }}</span><template #suffix>px</template></mk-input>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.counter.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.counter') }}</template>
<section style="padding: 0 16px 0 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._counter.name') }}</span></mk-input>
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._counter.text') }}</span></mk-input>
<mk-input v-model="value.inc" type="number"><span>{{ $t('_pages.blocks._counter.inc') }}</span></mk-input>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._counter.name') }}</span></mk-input>
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._counter.text') }}</span></mk-input>
<mk-input v-model:value="value.inc" type="number"><span>{{ $t('_pages.blocks._counter.inc') }}</span></mk-input>
</section>
</x-container>
</template>

4
src/client/pages/page-editor/els/page-editor.el.if.vue
View File

@ -8,7 +8,7 @@
</template>
<section class="romcojzs">
<mk-select v-model="value.var">
<mk-select v-model:value="value.var">
<template #label>{{ $t('_pages.blocks._if.variable') }}</template>
<option v-for="v in hpml.getVarsByType('boolean')" :value="v.name">{{ v.name }}</option>
<optgroup :label="$t('_pages.script.pageVariables')">
@ -19,7 +19,7 @@
</optgroup>
</mk-select>
<x-blocks class="children" v-model="value.children" :hpml="hpml"/>
<x-blocks class="children" v-model:value="value.children" :hpml="hpml"/>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.number-input.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.numberInput') }}</template>
<section style="padding: 0 16px 0 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._numberInput.name') }}</span></mk-input>
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._numberInput.text') }}</span></mk-input>
<mk-input v-model="value.default" type="number"><span>{{ $t('_pages.blocks._numberInput.default') }}</span></mk-input>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._numberInput.name') }}</span></mk-input>
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._numberInput.text') }}</span></mk-input>
<mk-input v-model:value="value.default" type="number"><span>{{ $t('_pages.blocks._numberInput.default') }}</span></mk-input>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.post.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faPaperPlane"/> {{ $t('_pages.blocks.post') }}</template>
<section style="padding: 16px;">
<mk-textarea v-model="value.text">{{ $t('_pages.blocks._post.text') }}</mk-textarea>
<mk-switch v-model="value.attachCanvasImage"><span>{{ $t('_pages.blocks._post.attachCanvasImage') }}</span></mk-switch>
<mk-input v-if="value.attachCanvasImage" v-model="value.canvasId"><span>{{ $t('_pages.blocks._post.canvasId') }}</span></mk-input>
<mk-textarea v-model:value="value.text">{{ $t('_pages.blocks._post.text') }}</mk-textarea>
<mk-switch v-model:value="value.attachCanvasImage"><span>{{ $t('_pages.blocks._post.attachCanvasImage') }}</span></mk-switch>
<mk-input v-if="value.attachCanvasImage" v-model:value="value.canvasId"><span>{{ $t('_pages.blocks._post.canvasId') }}</span></mk-input>
</section>
</x-container>
</template>

8
src/client/pages/page-editor/els/page-editor.el.radio-button.vue
View File

@ -3,10 +3,10 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.radioButton') }}</template>
<section style="padding: 0 16px 16px 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._radioButton.name') }}</span></mk-input>
<mk-input v-model="value.title"><span>{{ $t('_pages.blocks._radioButton.title') }}</span></mk-input>
<mk-textarea v-model="values"><span>{{ $t('_pages.blocks._radioButton.values') }}</span></mk-textarea>
<mk-input v-model="value.default"><span>{{ $t('_pages.blocks._radioButton.default') }}</span></mk-input>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._radioButton.name') }}</span></mk-input>
<mk-input v-model:value="value.title"><span>{{ $t('_pages.blocks._radioButton.title') }}</span></mk-input>
<mk-textarea v-model:value="values"><span>{{ $t('_pages.blocks._radioButton.values') }}</span></mk-textarea>
<mk-input v-model:value="value.default"><span>{{ $t('_pages.blocks._radioButton.default') }}</span></mk-input>
</section>
</x-container>
</template>

2
src/client/pages/page-editor/els/page-editor.el.section.vue
View File

@ -11,7 +11,7 @@
</template>
<section class="ilrvjyvi">
<x-blocks class="children" v-model="value.children" :hpml="hpml"/>
<x-blocks class="children" v-model:value="value.children" :hpml="hpml"/>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.switch.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.switch') }}</template>
<section class="kjuadyyj">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._switch.name') }}</span></mk-input>
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._switch.text') }}</span></mk-input>
<mk-switch v-model="value.default"><span>{{ $t('_pages.blocks._switch.default') }}</span></mk-switch>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._switch.name') }}</span></mk-input>
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._switch.text') }}</span></mk-input>
<mk-switch v-model:value="value.default"><span>{{ $t('_pages.blocks._switch.default') }}</span></mk-switch>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.text-input.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.textInput') }}</template>
<section style="padding: 0 16px 0 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._textInput.name') }}</span></mk-input>
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._textInput.text') }}</span></mk-input>
<mk-input v-model="value.default" type="text"><span>{{ $t('_pages.blocks._textInput.default') }}</span></mk-input>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._textInput.name') }}</span></mk-input>
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._textInput.text') }}</span></mk-input>
<mk-input v-model:value="value.default" type="text"><span>{{ $t('_pages.blocks._textInput.default') }}</span></mk-input>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/els/page-editor.el.textarea-input.vue
View File

@ -3,9 +3,9 @@
<template #header><fa :icon="faBolt"/> {{ $t('_pages.blocks.textareaInput') }}</template>
<section style="padding: 0 16px 16px 16px;">
<mk-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._textareaInput.name') }}</span></mk-input>
<mk-input v-model="value.text"><span>{{ $t('_pages.blocks._textareaInput.text') }}</span></mk-input>
<mk-textarea v-model="value.default"><span>{{ $t('_pages.blocks._textareaInput.default') }}</span></mk-textarea>
<mk-input v-model:value="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('_pages.blocks._textareaInput.name') }}</span></mk-input>
<mk-input v-model:value="value.text"><span>{{ $t('_pages.blocks._textareaInput.text') }}</span></mk-input>
<mk-textarea v-model:value="value.default"><span>{{ $t('_pages.blocks._textareaInput.default') }}</span></mk-textarea>
</section>
</x-container>
</template>

6
src/client/pages/page-editor/page-editor.blocks.vue
View File

@ -1,6 +1,6 @@
<template>
<x-draggable tag="div" :list="blocks" handle=".drag-handle" :group="{ name: 'blocks' }" animation="150" swap-threshold="0.5">
<component v-for="block in blocks" :is="'x-' + block.type" :value="block" @input="updateItem" @remove="() => removeItem(block)" :key="block.id" :hpml="hpml"/>
<component v-for="block in blocks" :is="'x-' + block.type" :value="block" @onUpdate:value="updateItem" @remove="() => removeItem(block)" :key="block.id" :hpml="hpml"/>
</x-draggable>
</template>
@ -51,7 +51,7 @@ export default defineComponent({
v,
...this.blocks.slice(i + 1)
];
this.$emit('input', newValue);
this.$emit('update:value', newValue);
},
removeItem(el) {
@ -60,7 +60,7 @@ export default defineComponent({
...this.blocks.slice(0, i),
...this.blocks.slice(i + 1)
];
this.$emit('input', newValue);
this.$emit('update:value', newValue);
},
}
});

8
src/client/pages/page-editor/page-editor.script-block.vue
View File

@ -40,17 +40,17 @@
<input v-model="value.value"/>
</section>
<section v-else-if="value.type === 'fn'" class="" style="padding:0 16px 16px 16px;">
<mk-textarea v-model="slots">
<mk-textarea v-model:value="slots">
<span>{{ $t('_pages.script.blocks._fn.slots') }}</span>
<template #desc>{{ $t('_pages.script.blocks._fn.slots-info') }}</template>
</mk-textarea>
<x-v v-if="value.value.expression" v-model="value.value.expression" :title="$t(`_pages.script.blocks._fn.arg1`)" :get-expected-type="() => null" :hpml="hpml" :fn-slots="value.value.slots" :name="name"/>
<x-v v-if="value.value.expression" v-model:value="value.value.expression" :title="$t(`_pages.script.blocks._fn.arg1`)" :get-expected-type="() => null" :hpml="hpml" :fn-slots="value.value.slots" :name="name"/>
</section>
<section v-else-if="value.type.startsWith('fn:')" class="" style="padding:16px;">
<x-v v-for="(x, i) in value.args" v-model="value.args[i]" :title="hpml.getVarByName(value.type.split(':')[1]).value.slots[i].name" :get-expected-type="() => null" :hpml="hpml" :name="name" :key="i"/>
<x-v v-for="(x, i) in value.args" v-model:value="value.args[i]" :title="hpml.getVarByName(value.type.split(':')[1]).value.slots[i].name" :get-expected-type="() => null" :hpml="hpml" :name="name" :key="i"/>
</section>
<section v-else class="" style="padding:16px;">
<x-v v-for="(x, i) in value.args" v-model="value.args[i]" :title="$t(`_pages.script.blocks._${value.type}.arg${i + 1}`)" :get-expected-type="() => _getExpectedType(i)" :hpml="hpml" :name="name" :fn-slots="fnSlots" :key="i"/>
<x-v v-for="(x, i) in value.args" v-model:value="value.args[i]" :title="$t(`_pages.script.blocks._${value.type}.arg${i + 1}`)" :get-expected-type="() => _getExpectedType(i)" :hpml="hpml" :name="name" :fn-slots="fnSlots" :key="i"/>
</section>
</x-container>
</template>

18
src/client/pages/page-editor/page-editor.vue
View File

@ -13,29 +13,29 @@
<section>
<router-link class="view" v-if="pageId" :to="`/@${ author.username }/pages/${ currentName }`"><fa :icon="faExternalLinkSquareAlt"/> {{ $t('_pages.viewPage') }}</router-link>
<mk-input v-model="title">
<mk-input v-model:value="title">
<span>{{ $t('_pages.title') }}</span>
</mk-input>
<template v-if="showOptions">
<mk-input v-model="summary">
<mk-input v-model:value="summary">
<span>{{ $t('_pages.summary') }}</span>
</mk-input>
<mk-input v-model="name">
<mk-input v-model:value="name">
<template #prefix>{{ url }}/@{{ author.username }}/pages/</template>
<span>{{ $t('_pages.url') }}</span>
</mk-input>
<mk-switch v-model="alignCenter">{{ $t('_pages.alignCenter') }}</mk-switch>
<mk-switch v-model:value="alignCenter">{{ $t('_pages.alignCenter') }}</mk-switch>
<mk-select v-model="font">
<mk-select v-model:value="font">
<template #label>{{ $t('_pages.font') }}</template>
<option value="serif">{{ $t('_pages.fontSerif') }}</option>
<option value="sans-serif">{{ $t('_pages.fontSansSerif') }}</option>
</mk-select>
<mk-switch v-model="hideTitleWhenPinned">{{ $t('_pages.hideTitleWhenPinned') }}</mk-switch>
<mk-switch v-model:value="hideTitleWhenPinned">{{ $t('_pages.hideTitleWhenPinned') }}</mk-switch>
<div class="eyeCatch">
<mk-button v-if="eyeCatchingImageId == null && !readonly" @click="setEyeCatchingImage()"><fa :icon="faPlus"/> {{ $t('_pages.eyeCatchingImageSet') }}</mk-button>
@ -46,7 +46,7 @@
</div>
</template>
<x-blocks class="content" v-model="content" :hpml="hpml"/>
<x-blocks class="content" v-model:value="content" :hpml="hpml"/>
<mk-button @click="add()" v-if="!readonly"><fa :icon="faPlus"/></mk-button>
</section>
@ -59,7 +59,7 @@
<x-variable v-for="variable in variables"
:value="variable"
:removable="true"
@input="v => updateVariable(v)"
@onUpdate:value="v => updateVariable(v)"
@remove="() => removeVariable(variable)"
:key="variable.name"
:hpml="hpml"
@ -76,7 +76,7 @@
<mk-container :body-togglable="true" :expanded="true">
<template #header><fa :icon="faCode"/> {{ $t('script') }}</template>
<div>
<prism-editor class="_code" v-model="script" :highlight="highlighter" :line-numbers="false"/>
<prism-editor class="_code" v-model:value="script" :highlight="highlighter" :line-numbers="false"/>
</div>
</mk-container>
</div>

2
src/client/pages/pages.vue
View File

@ -2,7 +2,7 @@
<div>
<portal to="header"><fa :icon="faStickyNote"/>{{ $t('pages') }}</portal>
<mk-tab v-model="tab" :items="[{ label: $t('_pages.my'), value: 'my', icon: faEdit }, { label: $t('_pages.liked'), value: 'liked', icon: faHeart }]"/>
<mk-tab v-model:value="tab" :items="[{ label: $t('_pages.my'), value: 'my', icon: faEdit }, { label: $t('_pages.liked'), value: 'liked', icon: faHeart }]"/>
<div class="rknalgpo my" v-if="tab === 'my'">
<mk-button class="new" @click="create()"><fa :icon="faPlus"/></mk-button>

56
src/client/pages/preferences/index.vue
View File

@ -13,43 +13,43 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faMusic"/> {{ $t('sounds') }}</div>
<div class="_content">
<mk-range v-model="sfxVolume" :min="0" :max="1" :step="0.1">
<mk-range v-model:value="sfxVolume" :min="0" :max="1" :step="0.1">
<fa slot="icon" :icon="volumeIcon"/>
<span slot="title">{{ $t('volume') }}</span>
</mk-range>
</div>
<div class="_content">
<mk-select v-model="sfxNote">
<mk-select v-model:value="sfxNote">
<template #label>{{ $t('_sfx.note') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxNote)" v-if="sfxNote"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxNoteMy">
<mk-select v-model:value="sfxNoteMy">
<template #label>{{ $t('_sfx.noteMy') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxNoteMy)" v-if="sfxNoteMy"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxNotification">
<mk-select v-model:value="sfxNotification">
<template #label>{{ $t('_sfx.notification') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxNotification)" v-if="sfxNotification"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxChat">
<mk-select v-model:value="sfxChat">
<template #label>{{ $t('_sfx.chat') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxChat)" v-if="sfxChat"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxChatBg">
<mk-select v-model:value="sfxChatBg">
<template #label>{{ $t('_sfx.chatBg') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxChatBg)" v-if="sfxChatBg"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxAntenna">
<mk-select v-model:value="sfxAntenna">
<template #label>{{ $t('_sfx.antenna') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxAntenna)" v-if="sfxAntenna"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
</mk-select>
<mk-select v-model="sfxChannel">
<mk-select v-model:value="sfxChannel">
<template #label>{{ $t('_sfx.channel') }}</template>
<option v-for="sound in sounds" :value="sound" :key="sound">{{ sound || $t('none') }}</option>
<template #text><button class="_textButton" @click="listen(sfxChannel)" v-if="sfxChannel"><fa :icon="faPlay"/> {{ $t('listen') }}</button></template>
@ -60,34 +60,34 @@
<section class="_card _vMargin">
<div class="_title"><fa :icon="faColumns"/> {{ $t('deck') }}</div>
<div class="_content">
<mk-switch v-model="deckAlwaysShowMainColumn">
<mk-switch v-model:value="deckAlwaysShowMainColumn">
{{ $t('_deck.alwaysShowMainColumn') }}
</mk-switch>
</div>
<div class="_content">
<div>{{ $t('_deck.columnAlign') }}</div>
<mk-radio v-model="deckColumnAlign" value="left">{{ $t('left') }}</mk-radio>
<mk-radio v-model="deckColumnAlign" value="center">{{ $t('center') }}</mk-radio>
<mk-radio v-model:value="deckColumnAlign" value="left">{{ $t('left') }}</mk-radio>
<mk-radio v-model:value="deckColumnAlign" value="center">{{ $t('center') }}</mk-radio>
</div>
</section>
<section class="_card _vMargin">
<div class="_title"><fa :icon="faCog"/> {{ $t('appearance') }}</div>
<div class="_content">
<mk-switch v-model="disableAnimatedMfm">{{ $t('disableAnimatedMfm') }}</mk-switch>
<mk-switch v-model="reduceAnimation">{{ $t('reduceUiAnimation') }}</mk-switch>
<mk-switch v-model="useBlurEffectForModal">{{ $t('useBlurEffectForModal') }}</mk-switch>
<mk-switch v-model="useOsNativeEmojis">
<mk-switch v-model:value="disableAnimatedMfm">{{ $t('disableAnimatedMfm') }}</mk-switch>
<mk-switch v-model:value="reduceAnimation">{{ $t('reduceUiAnimation') }}</mk-switch>
<mk-switch v-model:value="useBlurEffectForModal">{{ $t('useBlurEffectForModal') }}</mk-switch>
<mk-switch v-model:value="useOsNativeEmojis">
{{ $t('useOsNativeEmojis') }}
<template #desc><mfm text="🍮🍦🍭🍩🍰🍫🍬🥞🍪"/></template>
</mk-switch>
</div>
<div class="_content">
<div>{{ $t('fontSize') }}</div>
<mk-radio v-model="fontSize" value="small"><span style="font-size: 14px;">Aa</span></mk-radio>
<mk-radio v-model="fontSize" :value="null"><span style="font-size: 16px;">Aa</span></mk-radio>
<mk-radio v-model="fontSize" value="large"><span style="font-size: 18px;">Aa</span></mk-radio>
<mk-radio v-model="fontSize" value="veryLarge"><span style="font-size: 20px;">Aa</span></mk-radio>
<mk-radio v-model:value="fontSize" value="small"><span style="font-size: 14px;">Aa</span></mk-radio>
<mk-radio v-model:value="fontSize" :value="null"><span style="font-size: 16px;">Aa</span></mk-radio>
<mk-radio v-model:value="fontSize" value="large"><span style="font-size: 18px;">Aa</span></mk-radio>
<mk-radio v-model:value="fontSize" value="veryLarge"><span style="font-size: 20px;">Aa</span></mk-radio>
</div>
</section>
@ -95,19 +95,19 @@
<div class="_title"><fa :icon="faCog"/> {{ $t('general') }}</div>
<div class="_content">
<div>{{ $t('whenServerDisconnected') }}</div>
<mk-radio v-model="serverDisconnectedBehavior" value="reload">{{ $t('_serverDisconnectedBehavior.reload') }}</mk-radio>
<mk-radio v-model="serverDisconnectedBehavior" value="dialog">{{ $t('_serverDisconnectedBehavior.dialog') }}</mk-radio>
<mk-radio v-model="serverDisconnectedBehavior" value="quiet">{{ $t('_serverDisconnectedBehavior.quiet') }}</mk-radio>
<mk-radio v-model:value="serverDisconnectedBehavior" value="reload">{{ $t('_serverDisconnectedBehavior.reload') }}</mk-radio>
<mk-radio v-model:value="serverDisconnectedBehavior" value="dialog">{{ $t('_serverDisconnectedBehavior.dialog') }}</mk-radio>
<mk-radio v-model:value="serverDisconnectedBehavior" value="quiet">{{ $t('_serverDisconnectedBehavior.quiet') }}</mk-radio>
</div>
<div class="_content">
<mk-switch v-model="imageNewTab">{{ $t('openImageInNewTab') }}</mk-switch>
<mk-switch v-model="showFixedPostForm">{{ $t('showFixedPostForm') }}</mk-switch>
<mk-switch v-model="enableInfiniteScroll">{{ $t('enableInfiniteScroll') }}</mk-switch>
<mk-switch v-model="fixedWidgetsPosition">{{ $t('fixedWidgetsPosition') }}</mk-switch>
<mk-switch v-model="disablePagesScript">{{ $t('disablePagesScript') }}</mk-switch>
<mk-switch v-model:value="imageNewTab">{{ $t('openImageInNewTab') }}</mk-switch>
<mk-switch v-model:value="showFixedPostForm">{{ $t('showFixedPostForm') }}</mk-switch>
<mk-switch v-model:value="enableInfiniteScroll">{{ $t('enableInfiniteScroll') }}</mk-switch>
<mk-switch v-model:value="fixedWidgetsPosition">{{ $t('fixedWidgetsPosition') }}</mk-switch>
<mk-switch v-model:value="disablePagesScript">{{ $t('disablePagesScript') }}</mk-switch>
</div>
<div class="_content">
<mk-select v-model="lang">
<mk-select v-model:value="lang">
<template #label>{{ $t('uiLanguage') }}</template>
<option v-for="x in langs" :value="x[0]" :key="x[0]">{{ x[1] }}</option>

4
src/client/pages/preferences/plugins.vue
View File

@ -5,7 +5,7 @@
<details>
<summary><fa :icon="faDownload"/> {{ $t('install') }}</summary>
<mk-info warn>{{ $t('pluginInstallWarn') }}</mk-info>
<mk-textarea v-model="script" tall>
<mk-textarea v-model:value="script" tall>
<span>{{ $t('script') }}</span>
</mk-textarea>
<mk-button @click="install()" primary><fa :icon="faSave"/> {{ $t('install') }}</mk-button>
@ -14,7 +14,7 @@
<div class="_content">
<details>
<summary><fa :icon="faFolderOpen"/> {{ $t('manage') }}</summary>
<mk-select v-model="selectedPluginId">
<mk-select v-model:value="selectedPluginId">
<option v-for="x in $store.state.deviceUser.plugins" :value="x.id" :key="x.id">{{ x.name }}</option>
</mk-select>
<template v-if="selectedPlugin">

8
src/client/pages/preferences/sidebar.vue
View File

@ -2,16 +2,16 @@
<section class="_card">
<div class="_title"><fa :icon="faListUl"/> {{ $t('sidebar') }}</div>
<div class="_content">
<mk-textarea v-model="items" tall>
<mk-textarea v-model:value="items" tall>
<span>{{ $t('sidebar') }}</span>
<template #desc><button class="_textButton" @click="addItem">{{ $t('addItem') }}</button></template>
</mk-textarea>
</div>
<div class="_content">
<div>{{ $t('display') }}</div>
<mk-radio v-model="sidebarDisplay" value="full">{{ $t('_sidebar.full') }}</mk-radio>
<mk-radio v-model="sidebarDisplay" value="icon">{{ $t('_sidebar.icon') }}</mk-radio>
<!-- <mk-radio v-model="sidebarDisplay" value="hide" disabled>{{ $t('_sidebar.hide') }}</mk-radio>--> <!-- TODO: サイドバーを完全に隠せるようにすると、別途ハンバーガーボタンのようなものをUIに表示する必要があり面倒 -->
<mk-radio v-model:value="sidebarDisplay" value="full">{{ $t('_sidebar.full') }}</mk-radio>
<mk-radio v-model:value="sidebarDisplay" value="icon">{{ $t('_sidebar.icon') }}</mk-radio>
<!-- <mk-radio v-model:value="sidebarDisplay" value="hide" disabled>{{ $t('_sidebar.hide') }}</mk-radio>--> <!-- TODO: サイドバーを完全に隠せるようにすると、別途ハンバーガーボタンのようなものをUIに表示する必要があり面倒 -->
</div>
<div class="_footer">
<mk-button inline @click="save()" primary><fa :icon="faSave"/> {{ $t('save') }}</mk-button>

10
src/client/pages/preferences/theme.vue
View File

@ -22,10 +22,10 @@
</label>
</div>
</div>
<mk-switch v-model="syncDeviceDarkMode">{{ $t('syncDeviceDarkMode') }}</mk-switch>
<mk-switch v-model:value="syncDeviceDarkMode">{{ $t('syncDeviceDarkMode') }}</mk-switch>
</div>
<div class="_content">
<mk-select v-model="lightTheme">
<mk-select v-model:value="lightTheme">
<template #label>{{ $t('themeForLightMode') }}</template>
<optgroup :label="$t('lightThemes')">
<option v-for="x in lightThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
@ -34,7 +34,7 @@
<option v-for="x in darkThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
</optgroup>
</mk-select>
<mk-select v-model="darkTheme">
<mk-select v-model:value="darkTheme">
<template #label>{{ $t('themeForDarkMode') }}</template>
<optgroup :label="$t('darkThemes')">
<option v-for="x in darkThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
@ -52,7 +52,7 @@
<div class="_content">
<details>
<summary><fa :icon="faDownload"/> {{ $t('_theme.install') }}</summary>
<mk-textarea v-model="installThemeCode">
<mk-textarea v-model:value="installThemeCode">
<span>{{ $t('_theme.code') }}</span>
</mk-textarea>
<mk-button @click="() => install(installThemeCode)" :disabled="installThemeCode == null" primary inline><fa :icon="faCheck"/> {{ $t('install') }}</mk-button>
@ -62,7 +62,7 @@
<div class="_content">
<details>
<summary><fa :icon="faFolderOpen"/> {{ $t('_theme.manage') }}</summary>
<mk-select v-model="selectedThemeId">
<mk-select v-model:value="selectedThemeId">
<option v-for="x in installedThemes" :value="x.id" :key="x.id">{{ x.name }}</option>
</mk-select>
<template v-if="selectedTheme">

2
src/client/pages/room/room.vue
View File

@ -39,7 +39,7 @@
<mk-button @click="add()"><fa :icon="faBoxOpen"/> {{ $t('_rooms.addFurniture') }}</mk-button>
</div>
<div class="_content">
<mk-select :value="roomType" @input="updateRoomType($event)">
<mk-select :value="roomType" @onUpdate:value="updateRoomType($event)">
<template #label>{{ $t('_rooms.roomType') }}</template>
<option value="default">{{ $t('_rooms._roomType.default') }}</option>
<option value="washitsu">{{ $t('_rooms._roomType.washitsu') }}</option>

2
src/client/pages/scratchpad.vue
View File

@ -3,7 +3,7 @@
<portal to="header"><fa :icon="faTerminal"/>{{ $t('scratchpad') }}</portal>
<div class="_panel">
<prism-editor class="_code" v-model="code" :highlight="highlighter" :line-numbers="false"/>
<prism-editor class="_code" v-model:value="code" :highlight="highlighter" :line-numbers="false"/>
<mk-button style="position: absolute; top: 8px; right: 8px;" @click="run()" primary><fa :icon="faPlay"/></mk-button>
</div>

24
src/client/pages/theme-editor.vue
View File

@ -4,13 +4,13 @@
<section class="_card">
<div class="_content">
<mk-input v-model="name" required><span>{{ $t('name') }}</span></mk-input>
<mk-input v-model="author" required><span>{{ $t('author') }}</span></mk-input>
<mk-textarea v-model="description"><span>{{ $t('description') }}</span></mk-textarea>
<mk-input v-model:value="name" required><span>{{ $t('name') }}</span></mk-input>
<mk-input v-model:value="author" required><span>{{ $t('author') }}</span></mk-input>
<mk-textarea v-model:value="description"><span>{{ $t('description') }}</span></mk-textarea>
<div class="_inputs">
<div v-text="$t('_theme.base')" />
<mk-radio v-model="baseTheme" value="light">{{ $t('light') }}</mk-radio>
<mk-radio v-model="baseTheme" value="dark">{{ $t('dark') }}</mk-radio>
<mk-radio v-model:value="baseTheme" value="light">{{ $t('light') }}</mk-radio>
<mk-radio v-model:value="baseTheme" value="dark">{{ $t('dark') }}</mk-radio>
</div>
</div>
<div class="_content">
@ -30,25 +30,25 @@
<!-- color -->
<div v-else-if="typeof v === 'string'" class="color">
<input type="color" :value="v" @input="colorChanged($event.target.value, i)"/>
<mk-input class="select" :value="v" @input="colorChanged($event, i)"/>
<mk-input class="select" :value="v" @onUpdate:value="colorChanged($event, i)"/>
</div>
<!-- ref const -->
<mk-input v-else-if="v.type === 'refConst'" v-model="v.key">
<mk-input v-else-if="v.type === 'refConst'" v-model:value="v.key">
<template #prefix>$</template>
<span>{{ $t('name') }}</span>
</mk-input>
<!-- ref props -->
<mk-select class="select" v-else-if="v.type === 'refProp'" v-model="v.key">
<mk-select class="select" v-else-if="v.type === 'refProp'" v-model:value="v.key">
<option v-for="key in themeProps" :value="key" :key="key">{{ $t('_theme.keys.' + key) }}</option>
</mk-select>
<!-- func -->
<template v-else-if="v.type === 'func'">
<mk-select class="select" v-model="v.name">
<mk-select class="select" v-model:value="v.name">
<template #label>{{ $t('_theme.funcKind') }}</template>
<option v-for="n in ['alpha', 'darken', 'lighten']" :value="n" :key="n">{{ $t('_theme.' + n) }}</option>
</mk-select>
<mk-input type="number" v-model="v.arg"><span>{{ $t('_theme.argument') }}</span></mk-input>
<mk-select class="select" v-model="v.value">
<mk-input type="number" v-model:value="v.arg"><span>{{ $t('_theme.argument') }}</span></mk-input>
<mk-select class="select" v-model:value="v.value">
<template #label>{{ $t('_theme.basedProp') }}</template>
<option v-for="key in themeProps" :value="key" :key="key">{{ $t('_theme.keys.' + key) }}</option>
</mk-select>
@ -60,7 +60,7 @@
</div>
</div>
<div class="_content">
<mk-textarea v-model="themeToImport">
<mk-textarea v-model:value="themeToImport">
{{ $t('_theme.importInfo') }}
</mk-textarea>
<mk-button :disabled="!themeToImport.trim()" @click="importTheme">{{ $t('import') }}</mk-button>