Switch from moment.js to vue-timeago.

Much smaller filesize for vendor.js, although we'll have to see if all
the intervals are ok.
This commit is contained in:
Roger Braun 2016-11-28 17:37:47 +01:00
parent 2f7e5c8770
commit cc00eb898f
8 changed files with 17 additions and 29 deletions

View file

@ -15,12 +15,12 @@
"dependencies": { "dependencies": {
"diff": "^3.0.1", "diff": "^3.0.1",
"karma-mocha-reporter": "^2.2.1", "karma-mocha-reporter": "^2.2.1",
"moment": "^2.15.2",
"node-sass": "^3.10.1", "node-sass": "^3.10.1",
"sanitize-html": "^1.13.0", "sanitize-html": "^1.13.0",
"sass-loader": "^4.0.2", "sass-loader": "^4.0.2",
"vue": "^2.0.1", "vue": "^2.0.1",
"vue-router": "^2.0.1", "vue-router": "^2.0.1",
"vue-timeago": "^3.1.2",
"vuex": "^2.0.0" "vuex": "^2.0.0"
}, },
"devDependencies": { "devDependencies": {

View file

@ -36,7 +36,6 @@ const conversation = {
const conversationId = this.status.statusnet_conversation_id const conversationId = this.status.statusnet_conversation_id
this.$store.state.api.backendInteractor.fetchConversation({id: conversationId}) this.$store.state.api.backendInteractor.fetchConversation({id: conversationId})
.then((statuses) => this.$store.dispatch('addNewStatuses', { statuses })) .then((statuses) => this.$store.dispatch('addNewStatuses', { statuses }))
.then(() => this.$store.commit('updateTimestamps'))
} else { } else {
const id = this.$route.params.id const id = this.$route.params.id
this.$store.state.api.backendInteractor.fetchStatus({id}) this.$store.state.api.backendInteractor.fetchStatus({id})

View file

@ -1,6 +1,6 @@
import Status from '../status/status.vue' import Status from '../status/status.vue'
// Temporary // Temporary
import { prepareStatus, updateTimestampsInStatuses } from '../../modules/statuses.js' import { prepareStatus } from '../../modules/statuses.js'
import { map } from 'lodash' import { map } from 'lodash'
const Mentions = { const Mentions = {
@ -20,7 +20,7 @@ const Mentions = {
created () { created () {
this.$store.state.api.backendInteractor.fetchMentions({username: this.username}) this.$store.state.api.backendInteractor.fetchMentions({username: this.username})
.then((mentions) => { .then((mentions) => {
this.mentions = updateTimestampsInStatuses(map(mentions, prepareStatus)) this.mentions = map(mentions, prepareStatus)
}) })
} }
} }

View file

@ -23,7 +23,7 @@
- -
<small> <small>
<router-link :to="{ name: 'conversation', params: { id: status.id } }"> <router-link :to="{ name: 'conversation', params: { id: status.id } }">
{{status.created_at_parsed}} <timeago :since="status.created_at" :auto-update="60"></timeago>
</router-link> </router-link>
</small> </small>
<small v-if="!status.is_local" class="source_url"> <small v-if="!status.is_local" class="source_url">

View file

@ -12,8 +12,16 @@ import statusesModule from './modules/statuses.js'
import usersModule from './modules/users.js' import usersModule from './modules/users.js'
import apiModule from './modules/api.js' import apiModule from './modules/api.js'
import VueTimeago from 'vue-timeago'
Vue.use(Vuex) Vue.use(Vuex)
Vue.use(VueRouter) Vue.use(VueRouter)
Vue.use(VueTimeago, {
locale: 'en-US',
locales: {
'en-US': require('vue-timeago/locales/en-US.json')
}
})
const store = new Vuex.Store({ const store = new Vuex.Store({
modules: { modules: {

View file

@ -1,5 +1,4 @@
import { remove, map, slice, sortBy, toInteger, each, find, flatten, maxBy, last, merge, max, isArray } from 'lodash' import { remove, slice, sortBy, toInteger, each, find, flatten, maxBy, last, merge, max, isArray } from 'lodash'
import moment from 'moment'
import apiService from '../services/api/api.service.js' import apiService from '../services/api/api.service.js'
// import parse from '../services/status_parser/status_parser.js' // import parse from '../services/status_parser/status_parser.js'
@ -46,22 +45,9 @@ export const prepareStatus = (status) => {
status.nsfw = !!status.text.match(nsfwRegex) status.nsfw = !!status.text.match(nsfwRegex)
} }
// Set created_at_parsed to initial value
status.created_at_parsed = status.created_at
return status return status
} }
export const updateTimestampsInStatuses = (statuses) => {
return map(statuses, (statusoid) => {
const status = statusoid.retweeted_status || statusoid
// Parse date
status.created_at_parsed = moment(status.created_at).fromNow()
return status
})
}
export const statusType = (status) => { export const statusType = (status) => {
if (status.is_post_verb) { if (status.is_post_verb) {
return 'status' return 'status'
@ -236,9 +222,6 @@ export const mutations = {
oldTimeline.newStatusCount = 0 oldTimeline.newStatusCount = 0
oldTimeline.visibleStatuses = slice(oldTimeline.statuses, 0, 50) oldTimeline.visibleStatuses = slice(oldTimeline.statuses, 0, 50)
}, },
updateTimestamps (state) {
updateTimestampsInStatuses(state.allStatuses)
},
setFavorited (state, { status, value }) { setFavorited (state, { status, value }) {
const newStatus = find(state.allStatuses, status) const newStatus = find(state.allStatuses, status)
newStatus.favorited = value newStatus.favorited = value

View file

@ -10,8 +10,6 @@ const update = ({store, statuses, timeline, showImmediately}) => {
statuses, statuses,
showImmediately showImmediately
}) })
store.commit('updateTimestamps')
} }
const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false}) => { const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false}) => {

View file

@ -3769,10 +3769,6 @@ mocha@^3.1.0:
mkdirp "0.5.1" mkdirp "0.5.1"
supports-color "3.1.2" supports-color "3.1.2"
moment:
version "2.15.2"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.15.2.tgz#1bfdedf6a6e345f322fe956d5df5bd08a8ce84dc"
ms@0.7.1: ms@0.7.1:
version "0.7.1" version "0.7.1"
resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098" resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098"
@ -5718,6 +5714,10 @@ vue-template-es2015-compiler@^1.0.0:
version "1.0.0" version "1.0.0"
resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.0.0.tgz#89add11c41224059c839ef0b9484e97a7f98abc5" resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.0.0.tgz#89add11c41224059c839ef0b9484e97a7f98abc5"
vue-timeago:
version "3.1.2"
resolved "https://registry.yarnpkg.com/vue-timeago/-/vue-timeago-3.1.2.tgz#bdd79613c0cf5192128b8921c3f332bbc3a513f1"
vue@^2.0.1: vue@^2.0.1:
version "2.0.3" version "2.0.3"
resolved "https://registry.yarnpkg.com/vue/-/vue-2.0.3.tgz#3f7698f83d6ad1f0e35955447901672876c63fde" resolved "https://registry.yarnpkg.com/vue/-/vue-2.0.3.tgz#3f7698f83d6ad1f0e35955447901672876c63fde"