wip
This commit is contained in:
		| @@ -21,15 +21,21 @@ | ||||
| <script lang="typescript"> | ||||
| 	import anime from 'animejs'; | ||||
| 	import api from '../scripts/api'; | ||||
| 	import MkReactionIcon from './reaction-icon.vue'; | ||||
|  | ||||
| 	const placeholder = '%i18n:common.tags.mk-reaction-picker.choose-reaction%'; | ||||
|  | ||||
| 	export default { | ||||
| 		props: ['post', 'source', 'compact', 'cb'], | ||||
| 		data: { | ||||
| 			title: placeholder | ||||
| 		components: { | ||||
| 			MkReactionIcon | ||||
| 		}, | ||||
| 		created: function() { | ||||
| 		props: ['post', 'source', 'compact', 'cb'], | ||||
| 		data() { | ||||
| 			return { | ||||
| 				title: placeholder | ||||
| 			}; | ||||
| 		}, | ||||
| 		created() { | ||||
| 			const rect = this.source.getBoundingClientRect(); | ||||
| 			const width = this.$refs.popover.offsetWidth; | ||||
| 			const height = this.$refs.popover.offsetHeight; | ||||
| @@ -60,7 +66,7 @@ | ||||
| 			}); | ||||
| 		}, | ||||
| 		methods: { | ||||
| 			react: function(reaction) { | ||||
| 			react(reaction) { | ||||
| 				api('posts/reactions/create', { | ||||
| 					post_id: this.post.id, | ||||
| 					reaction: reaction | ||||
| @@ -69,13 +75,13 @@ | ||||
| 					this.$destroy(); | ||||
| 				}); | ||||
| 			}, | ||||
| 			onMouseover: function(e) { | ||||
| 			onMouseover(e) { | ||||
| 				this.title = e.target.title; | ||||
| 			}, | ||||
| 			onMouseout: function(e) { | ||||
| 			onMouseout(e) { | ||||
| 				this.title = placeholder; | ||||
| 			}, | ||||
| 			clo1se: function() { | ||||
| 			close() { | ||||
| 				this.$refs.backdrop.style.pointerEvents = 'none'; | ||||
| 				anime({ | ||||
| 					targets: this.$refs.backdrop, | ||||
|   | ||||
| @@ -18,7 +18,7 @@ | ||||
| 	export default { | ||||
| 		props: ['post'], | ||||
| 		computed: { | ||||
| 			reactions: function() { | ||||
| 			reactions() { | ||||
| 				return this.post.reaction_counts; | ||||
| 			} | ||||
| 		} | ||||
|   | ||||
| @@ -21,7 +21,7 @@ | ||||
|  | ||||
| 	export default { | ||||
| 		props: ['stream'], | ||||
| 		created: function() { | ||||
| 		created() { | ||||
| 			if (this.stream.state == 'connected') { | ||||
| 				this.root.style.opacity = 0; | ||||
| 			} | ||||
|   | ||||
| @@ -9,11 +9,13 @@ | ||||
| <script lang="typescript"> | ||||
| 	export default { | ||||
| 		props: ['time', 'mode'], | ||||
| 		data: { | ||||
| 			mode: 'relative', | ||||
| 			tickId: null, | ||||
| 		data() { | ||||
| 			return { | ||||
| 				mode: 'relative', | ||||
| 				tickId: null | ||||
| 			}; | ||||
| 		}, | ||||
| 		created: function() { | ||||
| 		created() { | ||||
| 			this.absolute = | ||||
| 				this.time.getFullYear()    + '年' + | ||||
| 				(this.time.getMonth() + 1) + '月' + | ||||
| @@ -27,25 +29,27 @@ | ||||
| 				this.tickId = setInterval(this.tick, 1000); | ||||
| 			} | ||||
| 		}, | ||||
| 		destroyed: function() { | ||||
| 		destroyed() { | ||||
| 			if (this.mode === 'relative' || this.mode === 'detail') { | ||||
| 				clearInterval(this.tickId); | ||||
| 			} | ||||
| 		}, | ||||
| 		tick: function() { | ||||
| 			const now = new Date(); | ||||
| 			const ago = (now - this.time) / 1000/*ms*/; | ||||
| 			this.relative = | ||||
| 				ago >= 31536000 ? '%i18n:common.time.years_ago%'  .replace('{}', ~~(ago / 31536000)) : | ||||
| 				ago >= 2592000  ? '%i18n:common.time.months_ago%' .replace('{}', ~~(ago / 2592000)) : | ||||
| 				ago >= 604800   ? '%i18n:common.time.weeks_ago%'  .replace('{}', ~~(ago / 604800)) : | ||||
| 				ago >= 86400    ? '%i18n:common.time.days_ago%'   .replace('{}', ~~(ago / 86400)) : | ||||
| 				ago >= 3600     ? '%i18n:common.time.hours_ago%'  .replace('{}', ~~(ago / 3600)) : | ||||
| 				ago >= 60       ? '%i18n:common.time.minutes_ago%'.replace('{}', ~~(ago / 60)) : | ||||
| 				ago >= 10       ? '%i18n:common.time.seconds_ago%'.replace('{}', ~~(ago % 60)) : | ||||
| 				ago >= 0        ? '%i18n:common.time.just_now%' : | ||||
| 				ago <  0        ? '%i18n:common.time.future%' : | ||||
| 				'%i18n:common.time.unknown%'; | ||||
| 		methods: { | ||||
| 			tick() { | ||||
| 				const now = new Date(); | ||||
| 				const ago = (now - this.time) / 1000/*ms*/; | ||||
| 				this.relative = | ||||
| 					ago >= 31536000 ? '%i18n:common.time.years_ago%'  .replace('{}', ~~(ago / 31536000)) : | ||||
| 					ago >= 2592000  ? '%i18n:common.time.months_ago%' .replace('{}', ~~(ago / 2592000)) : | ||||
| 					ago >= 604800   ? '%i18n:common.time.weeks_ago%'  .replace('{}', ~~(ago / 604800)) : | ||||
| 					ago >= 86400    ? '%i18n:common.time.days_ago%'   .replace('{}', ~~(ago / 86400)) : | ||||
| 					ago >= 3600     ? '%i18n:common.time.hours_ago%'  .replace('{}', ~~(ago / 3600)) : | ||||
| 					ago >= 60       ? '%i18n:common.time.minutes_ago%'.replace('{}', ~~(ago / 60)) : | ||||
| 					ago >= 10       ? '%i18n:common.time.seconds_ago%'.replace('{}', ~~(ago % 60)) : | ||||
| 					ago >= 0        ? '%i18n:common.time.just_now%' : | ||||
| 					ago <  0        ? '%i18n:common.time.future%' : | ||||
| 					'%i18n:common.time.unknown%'; | ||||
| 			} | ||||
| 		} | ||||
| 	}; | ||||
| </script> | ||||
|   | ||||
| @@ -17,7 +17,17 @@ | ||||
| <script lang="typescript"> | ||||
| 	export default { | ||||
| 		props: ['url'], | ||||
| 		created: function() { | ||||
| 		data() { | ||||
| 			return { | ||||
| 				fetching: true, | ||||
| 				title: null, | ||||
| 				description: null, | ||||
| 				thumbnail: null, | ||||
| 				icon: null, | ||||
| 				sitename: null | ||||
| 			}; | ||||
| 		}, | ||||
| 		created() { | ||||
| 			fetch('/api:url?url=' + this.url).then(res => { | ||||
| 				res.json().then(info => { | ||||
| 					this.title = info.title; | ||||
| @@ -29,14 +39,6 @@ | ||||
| 					this.fetching = false; | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		data: { | ||||
| 			fetching: true, | ||||
| 			title: null, | ||||
| 			description: null, | ||||
| 			thumbnail: null, | ||||
| 			icon: null, | ||||
| 			sitename: null | ||||
| 		} | ||||
| 	}; | ||||
| </script> | ||||
|   | ||||
| @@ -13,7 +13,17 @@ | ||||
| <script lang="typescript"> | ||||
| 	export default { | ||||
| 		props: ['url', 'target'], | ||||
| 		created: function() { | ||||
| 		data() { | ||||
| 			return { | ||||
| 				schema: null, | ||||
| 				hostname: null, | ||||
| 				port: null, | ||||
| 				pathname: null, | ||||
| 				query: null, | ||||
| 				hash: null | ||||
| 			}; | ||||
| 		}, | ||||
| 		created() { | ||||
| 			const url = new URL(this.url); | ||||
|  | ||||
| 			this.schema = url.protocol; | ||||
| @@ -22,14 +32,6 @@ | ||||
| 			this.pathname = url.pathname; | ||||
| 			this.query = url.search; | ||||
| 			this.hash = url.hash; | ||||
| 		}, | ||||
| 		data: { | ||||
| 			schema: null, | ||||
| 			hostname: null, | ||||
| 			port: null, | ||||
| 			pathname: null, | ||||
| 			query: null, | ||||
| 			hash: null | ||||
| 		} | ||||
| 	}; | ||||
| </script> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 syuilo
					syuilo