wip
This commit is contained in:
parent
79698314ad
commit
62d16db008
5 changed files with 25 additions and 16 deletions
|
@ -37,7 +37,7 @@ export default Vue.extend({
|
||||||
d.x = x;
|
d.x = x;
|
||||||
d.date.weekday = (new Date(d.date.year, d.date.month - 1, d.date.day)).getDay();
|
d.date.weekday = (new Date(d.date.year, d.date.month - 1, d.date.day)).getDay();
|
||||||
|
|
||||||
d.v = d.total / (peak / 2);
|
d.v = peak == 0 ? 0 : d.total / (peak / 2);
|
||||||
if (d.v > 1) d.v = 1;
|
if (d.v > 1) d.v = 1;
|
||||||
const ch = d.date.weekday == 0 || d.date.weekday == 6 ? 275 : 170;
|
const ch = d.date.weekday == 0 || d.date.weekday == 6 ? 275 : 170;
|
||||||
const cs = d.v * 100;
|
const cs = d.v * 100;
|
||||||
|
|
|
@ -62,10 +62,12 @@ export default Vue.extend({
|
||||||
methods: {
|
methods: {
|
||||||
render() {
|
render() {
|
||||||
const peak = Math.max.apply(null, this.data.map(d => d.total));
|
const peak = Math.max.apply(null, this.data.map(d => d.total));
|
||||||
this.pointsPost = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.posts / peak)) * this.viewBoxY}`).join(' ');
|
if (peak != 0) {
|
||||||
this.pointsReply = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.replies / peak)) * this.viewBoxY}`).join(' ');
|
this.pointsPost = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.posts / peak)) * this.viewBoxY}`).join(' ');
|
||||||
this.pointsRepost = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.reposts / peak)) * this.viewBoxY}`).join(' ');
|
this.pointsReply = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.replies / peak)) * this.viewBoxY}`).join(' ');
|
||||||
this.pointsTotal = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.total / peak)) * this.viewBoxY}`).join(' ');
|
this.pointsRepost = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.reposts / peak)) * this.viewBoxY}`).join(' ');
|
||||||
|
this.pointsTotal = this.data.map((d, i) => `${(i * this.zoom) + this.pos},${(1 - (d.total / peak)) * this.viewBoxY}`).join(' ');
|
||||||
|
}
|
||||||
},
|
},
|
||||||
onMousedown(e) {
|
onMousedown(e) {
|
||||||
const clickX = e.clientX;
|
const clickX = e.clientX;
|
||||||
|
|
|
@ -3,20 +3,20 @@
|
||||||
<p class="title">気になるユーザーをフォロー:</p>
|
<p class="title">気になるユーザーをフォロー:</p>
|
||||||
<div class="users" v-if="!fetching && users.length > 0">
|
<div class="users" v-if="!fetching && users.length > 0">
|
||||||
<div class="user" v-for="user in users" :key="user.id">
|
<div class="user" v-for="user in users" :key="user.id">
|
||||||
<a class="avatar-anchor" :href="`/${user.username}`">
|
<router-link class="avatar-anchor" :to="`/${user.username}`">
|
||||||
<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="user.id"/>
|
<img class="avatar" :src="`${user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="user.id"/>
|
||||||
</a>
|
</router-link>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<a class="name" :href="`/${user.username}`" target="_blank" v-user-preview="user.id">{{ user.name }}</a>
|
<router-link class="name" :to="`/${user.username}`" v-user-preview="user.id">{{ user.name }}</router-link>
|
||||||
<p class="username">@{{ user.username }}</p>
|
<p class="username">@{{ user.username }}</p>
|
||||||
</div>
|
</div>
|
||||||
<mk-follow-button user="user"/>
|
<mk-follow-button :user="user"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="empty" v-if="!fetching && users.length == 0">おすすめのユーザーは見つかりませんでした。</p>
|
<p class="empty" v-if="!fetching && users.length == 0">おすすめのユーザーは見つかりませんでした。</p>
|
||||||
<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%読み込んでいます<mk-ellipsis/></p>
|
<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%読み込んでいます<mk-ellipsis/></p>
|
||||||
<a class="refresh" @click="refresh">もっと見る</a>
|
<a class="refresh" @click="refresh">もっと見る</a>
|
||||||
<button class="close" @click="$destroy" title="閉じる">%fa:times%</button>
|
<button class="close" @click="$destroy()" title="閉じる">%fa:times%</button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -4,8 +4,15 @@
|
||||||
<div class="fetching" v-if="fetching">
|
<div class="fetching" v-if="fetching">
|
||||||
<mk-ellipsis-icon/>
|
<mk-ellipsis-icon/>
|
||||||
</div>
|
</div>
|
||||||
<p class="empty" v-if="posts.length == 0 && !fetching">%fa:R comments%自分の投稿や、自分がフォローしているユーザーの投稿が表示されます。</p>
|
<p class="empty" v-if="posts.length == 0 && !fetching">
|
||||||
<mk-posts :posts="posts" ref="timeline"/>
|
%fa:R comments%自分の投稿や、自分がフォローしているユーザーの投稿が表示されます。
|
||||||
|
</p>
|
||||||
|
<mk-posts :posts="posts" ref="timeline">
|
||||||
|
<div slot="footer">
|
||||||
|
<template v-if="!moreFetching">%fa:comments%</template>
|
||||||
|
<template v-if="moreFetching">%fa:spinner .pulse .fw%</template>
|
||||||
|
</div>
|
||||||
|
</mk-posts>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -69,8 +76,8 @@ export default Vue.extend({
|
||||||
(this as any).api('posts/timeline', {
|
(this as any).api('posts/timeline', {
|
||||||
until_id: this.posts[this.posts.length - 1].id
|
until_id: this.posts[this.posts.length - 1].id
|
||||||
}).then(posts => {
|
}).then(posts => {
|
||||||
|
this.posts = this.posts.concat(posts);
|
||||||
this.moreFetching = false;
|
this.moreFetching = false;
|
||||||
this.posts.unshift(posts);
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
onPost(post) {
|
onPost(post) {
|
||||||
|
@ -104,7 +111,7 @@ export default Vue.extend({
|
||||||
border solid 1px rgba(0, 0, 0, 0.075)
|
border solid 1px rgba(0, 0, 0, 0.075)
|
||||||
border-radius 6px
|
border-radius 6px
|
||||||
|
|
||||||
> .mk-following-setuper
|
> .mk-friends-maker
|
||||||
border-bottom solid 1px #eee
|
border-bottom solid 1px #eee
|
||||||
|
|
||||||
> .fetching
|
> .fetching
|
||||||
|
|
|
@ -7,11 +7,11 @@
|
||||||
<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%%i18n:common.loading%<mk-ellipsis/></p>
|
<p class="fetching" v-if="fetching">%fa:spinner .pulse .fw%%i18n:common.loading%<mk-ellipsis/></p>
|
||||||
<template v-else-if="users.length != 0">
|
<template v-else-if="users.length != 0">
|
||||||
<div class="user" v-for="_user in users">
|
<div class="user" v-for="_user in users">
|
||||||
<router-link class="avatar-anchor" :href="`/${_user.username}`">
|
<router-link class="avatar-anchor" :to="`/${_user.username}`">
|
||||||
<img class="avatar" :src="`${_user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="_user.id"/>
|
<img class="avatar" :src="`${_user.avatar_url}?thumbnail&size=42`" alt="" v-user-preview="_user.id"/>
|
||||||
</router-link>
|
</router-link>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<a class="name" :href="`/${_user.username}`" v-user-preview="_user.id">{{ _user.name }}</a>
|
<router-link class="name" :to="`/${_user.username}`" v-user-preview="_user.id">{{ _user.name }}</router-link>
|
||||||
<p class="username">@{{ _user.username }}</p>
|
<p class="username">@{{ _user.username }}</p>
|
||||||
</div>
|
</div>
|
||||||
<mk-follow-button :user="_user"/>
|
<mk-follow-button :user="_user"/>
|
||||||
|
|
Loading…
Reference in a new issue