リファクタリングなど

This commit is contained in:
syuilo
2018-04-29 17:17:15 +09:00
parent 1625b37b44
commit 372bfaceda
64 changed files with 521 additions and 570 deletions

View File

@ -1,8 +1,6 @@
<template>
<div class="root sub">
<router-link class="avatar-anchor" :to="note.user | userPage">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="note.user"/>
<div class="main">
<header>
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
@ -43,18 +41,13 @@ root(isDark)
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
margin 0 12px 0 0
> .avatar
display block
width 48px
height 48px
margin 0
border-radius 8px
vertical-align bottom
width 48px
height 48px
border-radius 8px
> .main
float left

View File

@ -17,17 +17,12 @@
</div>
<div class="renote" v-if="isRenote">
<p>
<router-link class="avatar-anchor" :to="note.user | userPage">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=32`" alt="avatar"/>
</router-link>
%fa:retweet%<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>がRenote
<mk-avatar class="avatar" :user="note.user"/>%fa:retweet%<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>がRenote
</p>
</div>
<article>
<header>
<router-link class="avatar-anchor" :to="p.user | userPage">
<img class="avatar" :src="`${p.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="p.user"/>
<div>
<router-link class="name" :to="p.user | userPage">{{ p.user | userName }}</router-link>
<span class="username">@{{ p.user | acct }}</span>
@ -152,7 +147,7 @@ export default Vue.extend({
// Draw map
if (this.p.geo) {
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).os.i.clientSettings.showMaps : true;
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true;
if (shouldShowMap) {
(this as any).os.getGoogleMaps().then(maps => {
const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]);
@ -262,17 +257,12 @@ root(isDark)
margin 0
padding 16px 32px
.avatar-anchor
.avatar
display inline-block
.avatar
vertical-align bottom
min-width 28px
min-height 28px
max-width 28px
max-height 28px
margin 0 8px 0 0
border-radius 6px
width 28px
height 28px
margin 0 8px 0 0
border-radius 6px
[data-fa]
margin-right 4px
@ -301,21 +291,16 @@ root(isDark)
display flex
line-height 1.1em
> .avatar-anchor
> .avatar
display block
padding 0 12px 0 0
margin 0 12px 0 0
width 54px
height 54px
border-radius 8px
> .avatar
display block
width 54px
height 54px
margin 0
border-radius 8px
vertical-align bottom
@media (min-width 500px)
width 60px
height 60px
@media (min-width 500px)
width 60px
height 60px
> div

View File

@ -1,8 +1,6 @@
<template>
<div class="mk-note-preview">
<router-link class="avatar-anchor" :to="note.user | userPage">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="note.user"/>
<div class="main">
<header>
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
@ -37,18 +35,13 @@ root(isDark)
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
margin 0 12px 0 0
> .avatar
display block
width 48px
height 48px
margin 0
border-radius 8px
vertical-align bottom
width 48px
height 48px
border-radius 8px
> .main
float left

View File

@ -1,8 +1,6 @@
<template>
<div class="sub">
<router-link class="avatar-anchor" :to="note.user | userPage">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=96`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="note.user"/>
<div class="main">
<header>
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
@ -49,25 +47,18 @@ root(isDark)
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
margin 0 10px 0 0
width 44px
height 44px
border-radius 8px
@media (min-width 500px)
margin-right 16px
> .avatar
display block
width 44px
height 44px
margin 0
border-radius 8px
vertical-align bottom
@media (min-width 500px)
width 52px
height 52px
width 52px
height 52px
> .main
float left

View File

@ -1,12 +1,10 @@
<template>
<div class="note" :class="{ renote: isRenote }">
<div class="reply-to" v-if="p.reply && (!os.isSignedIn || os.i.clientSettings.showReplyTarget)">
<div class="reply-to" v-if="p.reply && (!os.isSignedIn || clientSettings.showReplyTarget)">
<x-sub :note="p.reply"/>
</div>
<div class="renote" v-if="isRenote">
<router-link class="avatar-anchor" :to="note.user | userPage">
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="note.user"/>
%fa:retweet%
<span>{{ '%i18n:!@reposted-by%'.substr(0, '%i18n:!@reposted-by%'.indexOf('{')) }}</span>
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
@ -14,9 +12,7 @@
<mk-time :time="note.createdAt"/>
</div>
<article>
<router-link class="avatar-anchor" :to="p.user | userPage">
<img class="avatar" :src="`${p.user.avatarUrl}?thumbnail&size=96`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="p.user"/>
<div class="main">
<header>
<router-link class="name" :to="p.user | userPage">{{ p.user | userName }}</router-link>
@ -154,7 +150,7 @@ export default Vue.extend({
// Draw map
if (this.p.geo) {
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).os.i.clientSettings.showMaps : true;
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true;
if (shouldShowMap) {
(this as any).os.getGoogleMaps().then(maps => {
const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]);
@ -268,15 +264,12 @@ root(isDark)
@media (min-width 600px)
padding 16px 32px
.avatar-anchor
.avatar
display inline-block
.avatar
vertical-align bottom
width 28px
height 28px
margin 0 8px 0 0
border-radius 6px
width 28px
height 28px
margin 0 8px 0 0
border-radius 6px
[data-fa]
margin-right 4px
@ -314,29 +307,22 @@ root(isDark)
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
margin 0 10px 8px 0
width 48px
height 48px
border-radius 6px
//position -webkit-sticky
//position sticky
//top 62px
@media (min-width 500px)
margin-right 16px
> .avatar
display block
width 48px
height 48px
margin 0
border-radius 6px
vertical-align bottom
@media (min-width 500px)
width 58px
height 58px
border-radius 8px
width 58px
height 58px
border-radius 8px
> .main
float left

View File

@ -116,13 +116,13 @@ export default Vue.extend({
const isMyNote = note.userId == (this as any).os.i.id;
const isPureRenote = note.renoteId != null && note.text == null && note.mediaIds.length == 0 && note.poll == null;
if ((this as any).os.i.clientSettings.showMyRenotes === false) {
if ((this as any).clientSettings.showMyRenotes === false) {
if (isMyNote && isPureRenote) {
return;
}
}
if ((this as any).os.i.clientSettings.showRenotedMyNotes === false) {
if ((this as any).clientSettings.showRenotedMyNotes === false) {
if (isPureRenote && (note.renote.userId == (this as any).os.i.id)) {
return;
}
@ -187,7 +187,7 @@ export default Vue.extend({
this.clearNotification();
}
if ((this as any).os.i.clientSettings.fetchOnScroll !== false) {
if ((this as any).clientSettings.fetchOnScroll !== false) {
const current = window.scrollY + window.innerHeight;
if (current > document.body.offsetHeight - 8) this.loadMore();
}

View File

@ -1,9 +1,7 @@
<template>
<div class="mk-notification">
<div class="notification reaction" v-if="notification.type == 'reaction'">
<router-link class="avatar-anchor" :to="notification.user | userPage">
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="notification.user"/>
<div>
<header>
<mk-reaction-icon :reaction="notification.reaction"/>
@ -18,9 +16,7 @@
</div>
<div class="notification renote" v-if="notification.type == 'renote'">
<router-link class="avatar-anchor" :to="notification.user | userPage">
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="notification.user"/>
<div>
<header>
%fa:retweet%
@ -34,9 +30,7 @@
</div>
<div class="notification follow" v-if="notification.type == 'follow'">
<router-link class="avatar-anchor" :to="notification.user | userPage">
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="notification.user"/>
<div>
<header>
%fa:user-plus%
@ -47,9 +41,7 @@
</div>
<div class="notification poll_vote" v-if="notification.type == 'poll_vote'">
<router-link class="avatar-anchor" :to="notification.user | userPage">
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="notification.user"/>
<div>
<header>
%fa:chart-pie%
@ -111,18 +103,16 @@ root(isDark)
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
width 36px
height 36px
border-radius 6px
img
width 36px
height 36px
border-radius 6px
@media (min-width 500px)
width 42px
height 42px
@media (min-width 500px)
width 42px
height 42px
> div
float right

View File

@ -166,7 +166,7 @@ export default Vue.extend({
post() {
this.posting = true;
const viaMobile = (this as any).os.i.clientSettings.disableViaMobile !== true;
const viaMobile = (this as any).clientSettings.disableViaMobile !== true;
(this as any).api('notes/create', {
text: this.text == '' ? undefined : this.text,
mediaIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined,

View File

@ -46,8 +46,8 @@ export default Vue.extend({
(this as any).api('notes/user-list-timeline', {
listId: this.list.id,
limit: fetchLimit + 1,
includeMyRenotes: (this as any).os.i.clientSettings.showMyRenotes,
includeRenotedMyNotes: (this as any).os.i.clientSettings.showRenotedMyNotes
includeMyRenotes: (this as any).clientSettings.showMyRenotes,
includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes
}).then(notes => {
if (notes.length == fetchLimit + 1) {
notes.pop();
@ -66,8 +66,8 @@ export default Vue.extend({
listId: this.list.id,
limit: fetchLimit + 1,
untilId: (this.$refs.timeline as any).tail().id,
includeMyRenotes: (this as any).os.i.clientSettings.showMyRenotes,
includeRenotedMyNotes: (this as any).os.i.clientSettings.showRenotedMyNotes
includeMyRenotes: (this as any).clientSettings.showMyRenotes,
includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes
}).then(notes => {
if (notes.length == fetchLimit + 1) {
notes.pop();

View File

@ -1,8 +1,6 @@
<template>
<div class="mk-user-preview">
<router-link class="avatar-anchor" :to="user | userPage">
<img class="avatar" :src="`${user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
</router-link>
<mk-avatar class="avatar" :user="user"/>
<div class="main">
<header>
<router-link class="name" :to="user | userPage">{{ user | userName }}</router-link>
@ -40,26 +38,19 @@ export default Vue.extend({
display block
clear both
> .avatar-anchor
> .avatar
display block
float left
margin 0 10px 0 0
width 48px
height 48px
border-radius 6px
@media (min-width 500px)
margin-right 16px
> .avatar
display block
width 48px
height 48px
margin 0
border-radius 6px
vertical-align bottom
@media (min-width 500px)
width 58px
height 58px
border-radius 8px
width 58px
height 58px
border-radius 8px
> .main
float left