18 |
69 |
85 |
70 |
77 | 71 | 75 |
76 |
78 |
84 | 79 | 80 | Post comment 81 | 82 |
83 |cleaner.py - cleaner for the files in uploads/ directory: Deletes files which are not included in the data/data.json. Also finds duplicates.poster.py - for creating multiple blog posts using files from a specified directory. One file per post. Reqires a python-magic installed.Screenshots
![](\"screenshots/0.png\")
![](\"screenshots/1.png\")
![](\"screenshots/2.png\")
" 11 | } 12 | ] 13 | } -------------------------------------------------------------------------------- /dbschema.json: -------------------------------------------------------------------------------- 1 | { 2 | "db_name": "Poster", 3 | "db_file": "data/poster.db", 4 | "version": 2, 5 | "maps": { 6 | "users/.+/data.json": { 7 | "to_table": [ 8 | "comment", 9 | {"node": "comment_vote", "table": "comment_vote", "key_col": "comment_uri", "val_col": "vote"}, 10 | {"node": "post_vote", "table": "post_vote", "key_col": "post_id", "val_col": "vote"} 11 | ] 12 | }, 13 | "users/.+/content.json": { 14 | "to_keyvalue": [ "cert_user_id" ] 15 | }, 16 | "data.json": { 17 | "to_table": [ "post" ], 18 | "to_keyvalue": [ "next_post_id", "modified" ] 19 | } 20 | 21 | }, 22 | "tables": { 23 | "comment": { 24 | "cols": [ 25 | ["comment_id", "INTEGER"], 26 | ["post_id", "INTEGER"], 27 | ["body", "TEXT"], 28 | ["date_added", "INTEGER"], 29 | ["json_id", "INTEGER REFERENCES json (json_id)"] 30 | ], 31 | "indexes": ["CREATE UNIQUE INDEX comment_key ON comment(json_id, comment_id)", "CREATE INDEX comment_post_id ON comment(post_id)"], 32 | "schema_changed": 1426195823 33 | }, 34 | "comment_vote": { 35 | "cols": [ 36 | ["comment_uri", "TEXT"], 37 | ["vote", "INTEGER"], 38 | ["json_id", "INTEGER REFERENCES json (json_id)"] 39 | ], 40 | "indexes": ["CREATE INDEX comment_vote_comment_uri ON comment_vote(comment_uri)", "CREATE INDEX comment_vote_json_id ON comment_vote(json_id)"], 41 | "schema_changed": 1426195822 42 | }, 43 | "post": { 44 | "cols": [ 45 | ["post_id", "INTEGER"], 46 | ["body", "TEXT"], 47 | ["date_published", "INTEGER"], 48 | ["json_id", "INTEGER REFERENCES json (json_id)"] 49 | ], 50 | "indexes": ["CREATE UNIQUE INDEX post_uri ON post(json_id, post_id)", "CREATE INDEX post_id ON post(post_id)"], 51 | "schema_changed": 1426195824 52 | }, 53 | "post_vote": { 54 | "cols": [ 55 | ["post_id", "INTEGER"], 56 | ["vote", "INTEGER"], 57 | ["json_id", "INTEGER REFERENCES json (json_id)"] 58 | ], 59 | "indexes": ["CREATE INDEX post_vote_post_id ON post_vote(post_id)", "CREATE INDEX post_vote_json_id ON post_vote(post_id)"], 60 | "schema_changed": 1426195826 61 | } 62 | } 63 | } 64 | -------------------------------------------------------------------------------- /js/likes.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | Vue.component('likes', { 4 | template: ` 5 |
6 |
37 | `,
38 |
39 | props: ['post'],
40 |
41 | computed: {
42 | likes() {
43 | if (this.post.post_id in storage.state.likes) {
44 | return storage.state.likes[this.post.post_id].length
45 | }
46 | },
47 |
48 | date_published() {
49 | return moment(this.post.date_published, 'x').fromNow()
50 | },
51 |
52 | url() {
53 | return '?post=' + this.post.post_id
54 | },
55 |
56 | likedClass() {
57 | let liked = false
58 | if (this.post.post_id in storage.state.likes) {
59 | liked = storage.state.likes[this.post.post_id]
60 | .indexOf(storage.state.site_info.auth_address) != -1
61 | }
62 | if (liked) {
63 | return 'fa-heart'
64 | } else {
65 | return 'fa-heart-o'
66 | }
67 | }
68 | },
69 |
70 | methods: {
71 | like() {
72 | poster.like(this.post.post_id)
73 | }
74 | }
75 | })
76 |
--------------------------------------------------------------------------------
/js/post.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 |
3 | Vue.component('post', {
4 | template: `
5 |
7 |
16 | 8 | {{ date_published }} 9 |
10 | 11 | 13 | {{ likes }} 14 | 15 |
17 |
35 |
36 |
6 |
28 |
34 | `,
35 |
36 | props: ['ownAndMainPage', 'post'],
37 |
38 | data: () => {
39 | return {
40 | isFullPost: true
41 | }
42 | },
43 |
44 | mounted() {
45 | this.hideLongPost()
46 | storage.watch(storage.getters.getPosts, () => {
47 | // When posts are reloaded, (e.g. clicked 'last comments' button)
48 | this.hideLongPost()
49 | })
50 | },
51 |
52 | methods: {
53 | hideLongPost() {
54 | setTimeout(() => {
55 | // Hack! Hack! I don't know how to catch the event
56 | // when images in post are loaded and it's height
57 | // is known
58 | if (storage.state.url == ''
59 | && this.$refs.postbody.clientHeight > 2000) {
60 | // Crop long posts only on a multipost view
61 | this.isFullPost = false
62 | } else {
63 | this.isFullPost = true
64 | }
65 | }, 300)
66 | },
67 |
68 | showFullPost() {
69 | this.isFullPost = true
70 | },
71 |
72 | del(id) {
73 | storage.commit('createModal', {
74 | 'message': "Are you sure to delete this post?",
75 | 'buttonText': 'Delete',
76 | 'buttonClass': 'is-danger',
77 | 'action': 'delPost',
78 | 'id': id
79 | })
80 | },
81 |
82 | edit(post) {
83 | storage.commit('setPosteditor', {
84 | 'post_id': post.post_id,
85 | 'body': post.body.replace(/
30 | Show full post...
32 |
33 | /g, '\n') 86 | }) 87 | scroll(0, 0) 88 | } 89 | } 90 | }) 91 | -------------------------------------------------------------------------------- /utils/poster.py: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env python3 2 | 3 | from magic import Magic 4 | from argparse import ArgumentParser 5 | from os import listdir, path 6 | from json import load, dump 7 | from re import match 8 | from random import randint 9 | from shutil import copyfile 10 | from time import time 11 | 12 | ''' 13 | Creates multiple blog posts using files from a specified directory. 14 | One file per post. Reqires a python-magic installed. 15 | ''' 16 | 17 | class File: 18 | '''This class stores information about file.''' 19 | def __init__(self, path): 20 | self.path = path 21 | if '/' in path: 22 | self.filename = path.rsplit('/', 1)[1] 23 | else: 24 | self.filename = path 25 | self.extension = path.rsplit('.', 1)[1] 26 | self.mime_type = Magic(mime=True).from_file(path) 27 | if not self.is_good_name(): 28 | self.new_name = "{}.{}".format(randint(0, 10**9), self.extension) 29 | else: 30 | self.new_name = self.filename 31 | 32 | def is_good_name(self): 33 | '''Check if name is short and contains only good characters.''' 34 | if (len(self.filename) < 256 35 | and match("^[a-z\[\]\(\) A-Z0-9_@=\.\+-/]+$", self.filename) 36 | and '..' not in self.filename): 37 | return True 38 | else: 39 | return False 40 | 41 | 42 | def body(file): 43 | '''Makes the post body.''' 44 | if 'video' in file.mime_type: 45 | result = ('').format(file.new_name, file.mime_type) 48 | elif 'audio' in file.mime_type: 49 | result = ('').format(file.new_name, file.mime_type) 52 | elif 'image' in file.mime_type: 53 | result = ('
6 |
40 | `,
41 |
42 | computed: {
43 | posteditorBody: {
44 | get() {
45 | return storage.state.posteditor.body
46 | },
47 | set(value) {
48 | return storage.commit('setPosteditor', {'body': value})
49 | }
50 | }
51 | },
52 |
53 | mounted() {
54 | storage.watch(storage.getters.getModal, () => {
55 | if (storage.getters.getModal().affirmed == true
56 | && storage.getters.getModal().action == 'info') {
57 | storage.commit('destroyModal')
58 | }
59 | }, { deep: true })
60 | },
61 |
62 | methods: {
63 | initiateUpload(type) {
64 | this.$refs.inputFile.click()
65 | },
66 |
67 | upload(event) {
68 | let file = this.$refs.inputFile.files[0]
69 | poster.uploadFile(file).then((res) => {
70 | if (res) {
71 | this.posteditorBody += this.createLink(file)
72 | }
73 | })
74 | },
75 |
76 | insertTags(tags) {
77 | if (tags == 'ol') {
78 | this.posteditorBody += "
7 |
9 |
36 |
38 |
39 | - \n\n\n
- \n\n\n
6 |
7 |
18 |
78 | `,
79 |
80 | computed: {
81 | mainPageView() {
82 | return storage.state.url == ''
83 | },
84 |
85 | mainPageLink() {
86 | return window.location.origin + window.location.pathname
87 | },
88 |
89 | likesText() {
90 | if (this.likesSel == null) {
91 | return "Most liked"
92 | } else {
93 | return "Top " + this.likesSel
94 | }
95 | },
96 |
97 | title() {
98 | return storage.state.site_title
99 | },
100 |
101 | description() {
102 | return storage.state.site_description
103 | }
104 | },
105 |
106 | data() {
107 | return {
108 | showDropdown: false,
109 | commentsSelected: false,
110 | commentsHover: false,
111 | likesSel: null, // Selected filter: day, week, month, year, all
112 | likesHover: false
113 | }
114 | },
115 |
116 | mounted() {
117 | window.addEventListener('click', () => {
118 | if (this.commentsHover == true) {
119 | if (this.commentsSelected) {
120 | this.commentsSelected = false
121 | storage.commit('loadPosts')
122 | } else {
123 | this.commentsSelected = true
124 | this.likesSel = null
125 | storage.commit('loadPosts', {order: 'comments'})
126 | }
127 | }
128 | if (this.likesHover == true) {
129 | if (this.showDropdown) {
130 | this.showDropdown = false
131 | this.likesSel = null
132 | storage.commit('loadPosts')
133 | } else {
134 | this.showDropdown = true
135 | }
136 | } else {
137 | this.showDropdown = false
138 | }
139 | })
140 | },
141 |
142 | methods: {
143 | likes(state) {
144 | this.likesHover = state
145 | },
146 |
147 | comments(state) {
148 | this.commentsHover = state
149 | },
150 |
151 | select(elem) {
152 | this.likesSel = elem
153 | this.commentsSelected = false
154 | storage.commit('loadPosts', {order: 'likes', timespan: elem})
155 | }
156 | }
157 | })
158 |
--------------------------------------------------------------------------------
/js/storage.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 |
3 | const storage = new Vuex.Store({
4 | strict: true,
5 | state: {
6 | site_title: '',
7 | site_description: '',
8 | posts: [],
9 | likes: {},
10 | comments: {},
11 | url: '',
12 | site_info: {},
13 | posteditor: {
14 | post_id: null,
15 | body: ''
16 | },
17 | modal: {
18 | show: false,
19 | message: '',
20 | buttonText: '',
21 | buttonClass: '',
22 | action: '', // One of: 'delPost', 'delComment' and 'info'
23 | id: null,
24 | affirmed: false
25 | }
26 | },
27 |
28 | getters: {
29 | getModal: state => () => state.modal,
30 | getPosts: state => () => state.posts
31 | },
32 |
33 | mutations: {
34 | createModal(state, payload) {
35 | state.modal.show = true
36 | state.modal.message = payload.message
37 | state.modal.buttonText = payload.buttonText
38 | state.modal.buttonClass = payload.buttonClass
39 | state.modal.action = payload.action
40 | state.modal.id = payload.id
41 | state.modal.affirmed = false
42 | },
43 |
44 | destroyModal(state) {
45 | state.modal.show = false
46 | state.modal.message = ''
47 | state.modal.buttonText = ''
48 | state.modal.buttonClass = ''
49 | state.modal.action = ''
50 | state.modal.affirmed = ''
51 | state.modal.id = null
52 | },
53 |
54 | modalAffirmed(state) {
55 | state.modal.affirmed = true
56 | state.modal.show = false
57 | },
58 |
59 | updateState(state, payload) {
60 | for (let i in payload) {
61 | state[i] = payload[i]
62 | }
63 | },
64 |
65 | setPosteditor(state, payload) {
66 | if (payload.post_id !== undefined) {
67 | state.posteditor.post_id = payload.post_id
68 | }
69 | state.posteditor.body = payload.body
70 | },
71 |
72 | loadURL(state) {
73 | // Get post id from address bar
74 | state.url = window.location.search.substring(1)
75 | .replace(/[&?]*wrapper_nonce=[A-Za-z0-9]+/, '')
76 | .replace(/post=/, '')
77 | },
78 |
79 | async loadSiteInfo(state) {
80 | let contentJSON = JSON.parse(await poster.getContentJSON())
81 | this.commit('updateState', {
82 | 'site_info': await poster.getSiteInfo(),
83 | 'site_title': contentJSON.title,
84 | 'site_description': contentJSON.description
85 | })
86 | },
87 |
88 | async loadPosts(state, payload) {
89 | let query = null
90 |
91 | if (state.url != '') {
92 | query = "SELECT * FROM post WHERE post_id=" + state.url
93 | } else {
94 | if (payload === undefined) {
95 | query = "SELECT * FROM post ORDER BY date_published DESC"
96 | } else {
97 | let date = 0
98 | let order = null
99 | if (payload.order == 'likes') {
100 | order = 'votes'
101 | switch (payload.timespan) {
102 | case 'day':
103 | date = + new Date() - 24 * 3600 * 1000
104 | break
105 | case 'week':
106 | date = + new Date() - 7 * 24 * 3600 * 1000
107 | break
108 | case 'month':
109 | date = + new Date() - 30 * 24 * 3600 * 1000
110 | break
111 | case 'year':
112 | date = + new Date() - 365 * 24 * 3600 * 1000
113 | break
114 | }
115 | }
116 | if (payload.order == 'comments') {
117 | order = 'last_comment'
118 | }
119 | query = "SELECT post.*, COUNT(comment_id) AS comments, "
120 | + "MAX(comment.date_added) AS last_comment, "
121 | + "(SELECT COUNT(*) FROM post_vote "
122 | + "WHERE post_vote.post_id = post.post_id) "
123 | + "AS votes FROM post LEFT JOIN comment "
124 | + "USING (post_id) WHERE date_published > "
125 | + date + " GROUP BY post_id "
126 | + "ORDER BY " + order + " DESC"
127 | }
128 | }
129 | this.commit('updateState', {'posts': await poster.sqlQuery(query)})
130 | },
131 |
132 | async loadLikes(state) {
133 | let query = "SELECT post_id, directory FROM json "
134 | + "LEFT JOIN post_vote USING (json_id) "
135 | + "WHERE file_name='data.json' "
136 | + "AND directory != ''"
137 | let likes_arr = await poster.sqlQuery(query)
138 | this.commit('updateState', {'likes': {}})
139 | likes_arr.forEach((like) => {
140 | if ( !(like.post_id in state.likes) ) {
141 | state.likes[like.post_id] = []
142 | }
143 | state.likes[like.post_id].push(
144 | like.directory.replace('users/', ''))
145 | })
146 | },
147 |
148 | async loadComments(state) {
149 | let query = "SELECT comment.*, json_content.json_id "
150 | + "AS content_json_id, keyvalue.value AS cert_user_id, "
151 | + "json.directory, (SELECT COUNT(*) FROM comment_vote "
152 | + "WHERE comment_vote.comment_uri = comment.comment_id || "
153 | + "'@' || json.directory)+1 AS votes "
154 | + "FROM comment "
155 | + "LEFT JOIN json USING (json_id) "
156 | + "LEFT JOIN json AS json_content ON "
157 | + "(json_content.directory = json.directory "
158 | + "AND json_content.file_name='content.json') "
159 | + "LEFT JOIN keyvalue ON "
160 | + "(keyvalue.json_id = json_content.json_id "
161 | + "AND key = 'cert_user_id') "
162 | + "ORDER BY date_added DESC"
163 | let comments_arr = await poster.sqlQuery(query)
164 | this.commit('updateState', {'comments': {}})
165 | comments_arr.forEach((comment) => {
166 | if ( !(comment.post_id in state.comments) ) {
167 | state.comments[comment.post_id] = []
168 | }
169 | state.comments[comment.post_id].push(comment)
170 | })
171 | }
172 | }
173 | })
174 |
--------------------------------------------------------------------------------
/js/poster.js:
--------------------------------------------------------------------------------
1 | 'use strict'
2 |
3 | class Poster extends ZeroFrame {
4 | constructor(url) {
5 | super(url)
6 | this.site_info = null
7 | }
8 |
9 | get isCertSelected() {
10 | if (storage.state.site_info.cert_user_id == null) {
11 | this.cmdp('certSelect', {'accepted_domains': ['zeroid.bit']})
12 | return false
13 | } else {
14 | return true
15 | }
16 | }
17 |
18 | onRequest(cmd, message) {
19 | if (cmd == 'setSiteInfo') {
20 | storage.commit('loadSiteInfo')
21 | }
22 | }
23 |
24 | findPostById(posts, id) {
25 | // Find an index of the post in the array by its id
26 | let index = 0
27 | while (index < posts.length) {
28 | if (posts[index].post_id == id) {
29 | break
30 | }
31 | index++
32 | }
33 | return index
34 | }
35 |
36 | findCommentById(comments, id) {
37 | // Find an index of the comment in the array by its id
38 | let index = 0
39 | while (index < comments.length) {
40 | if (comments[index].comment_id == id) {
41 | break
42 | }
43 | index++
44 | }
45 | return index
46 | }
47 |
48 | writePublish(inner_path, data) {
49 | let json_raw = unescape(encodeURIComponent(
50 | JSON.stringify(data, undefined, ' ')))
51 | this.cmdp('fileWrite', [inner_path, btoa(json_raw)]).then(() => {
52 | if (inner_path == 'data/data.json') {
53 | return this.cmdp('sitePublish', ['stored'])
54 | } else {
55 | return this.cmdp('sitePublish', [undefined, inner_path])
56 | }
57 | }).catch((err) => { console.log('Error: ' + err) })
58 | }
59 |
60 | async getUserDataJSON() {
61 | return await this.cmdp('fileGet', ['data/users/'
62 | + storage.state.site_info.auth_address + '/data.json'])
63 | }
64 |
65 | async getRootDataJSON() {
66 | return await this.cmdp('fileGet', ['data/data.json'])
67 | }
68 |
69 | async getContentJSON() {
70 | return await this.cmdp('fileGet', ['content.json'])
71 | }
72 |
73 | async sqlQuery(query) {
74 | return await this.cmdp('dbQuery', [query])
75 | }
76 |
77 | async getSiteInfo() {
78 | return await this.cmdp('siteInfo', [])
79 | }
80 |
81 | async like(post_id) {
82 | if (this.isCertSelected) {
83 | let data = await this.getUserDataJSON()
84 | if (data) {
85 | data = JSON.parse(data)
86 | } else {
87 | data = {
88 | 'next_comment_id': 1,
89 | 'comment': [],
90 | 'comment_vote': {},
91 | 'post_vote': {}
92 | }
93 | }
94 |
95 | if (post_id in data.post_vote) {
96 | delete data.post_vote[post_id]
97 | } else {
98 | data.post_vote[post_id] = 1
99 | }
100 | await this.writePublish('data/users/'
101 | + storage.state.site_info.auth_address + '/data.json', data)
102 | storage.commit('loadLikes')
103 | }
104 | }
105 |
106 | async saveComment(post_id, text, comment_id) {
107 | if (this.isCertSelected) {
108 | let data = await this.getUserDataJSON()
109 | if (data) {
110 | data = JSON.parse(data)
111 | } else {
112 | data = {
113 | 'next_comment_id': 1,
114 | 'comment': [],
115 | 'comment_vote': {},
116 | 'post_vote': {}
117 | }
118 | }
119 |
120 | if (comment_id == undefined) {
121 | // Append a new comment
122 | data.comment.push({
123 | 'comment_id': data.next_comment_id,
124 | 'body': text,
125 | 'post_id': post_id,
126 | 'date_added': + new Date()
127 | })
128 | data.next_comment_id += 1
129 | } else {
130 | let index = this.findCommentById(data.comment, comment_id)
131 | data.comment[index].body = text
132 | }
133 |
134 | await this.writePublish('data/users/'
135 | + storage.state.site_info.auth_address + '/data.json', data)
136 | storage.commit('loadComments')
137 | }
138 | }
139 |
140 | async savePost(text) {
141 | text = text.replace(/(?:\r\n|\r|\n)/g, '
8 |
16 |
17 |
19 |
77 |
20 |
24 | Last commented
25 |
26 |
76 |
27 |
75 |
28 |
29 |
35 |
36 | {{ likesText }}
37 |
38 |
39 |
40 |
41 |
42 |
43 |
74 | ') 142 | let data = await this.getRootDataJSON() 143 | let id = storage.state.posteditor.post_id 144 | data = JSON.parse(data) 145 | if (id == null) { 146 | // Append a new post 147 | data.post.push({ 148 | 'post_id': data.next_post_id, 149 | 'date_published': + new Date(), 150 | 'body': text 151 | }) 152 | data.next_post_id += 1 153 | } else { 154 | data.post[this.findPostById(data.post, id)].body = text 155 | } 156 | 157 | await this.writePublish('data/data.json', data) 158 | storage.commit('setPosteditor', {'post_id': null, 'body': ''}) 159 | await storage.commit('loadPosts') 160 | } 161 | 162 | async delPost(id) { 163 | let data = await this.getRootDataJSON() 164 | data = JSON.parse(data) 165 | data.post.splice(this.findPostById(data.post, id), 1) 166 | await this.writePublish('data/data.json', data) 167 | storage.commit('loadPosts') 168 | } 169 | 170 | async delComment(id) { 171 | let data = await this.getUserDataJSON() 172 | data = JSON.parse(data) 173 | data.comment.splice(this.findCommentById(data.comment, id), 1) 174 | await this.writePublish('data/users/' 175 | + storage.state.site_info.auth_address + '/data.json', data) 176 | storage.commit('loadComments') 177 | } 178 | 179 | isValidName(filename) { 180 | if (filename.length > 255) { 181 | return false 182 | } else { 183 | return filename.match(/^[a-z\[\]\(\) A-Z0-9_@=\.\+-]+$/) != null 184 | } 185 | } 186 | 187 | pFileReader(file){ 188 | return new Promise((resolve, reject) => { 189 | let fr = new FileReader() 190 | fr.onload = () => { 191 | resolve(fr.result.split(',')[1]) 192 | } 193 | fr.readAsDataURL(file) 194 | }) 195 | } 196 | 197 | async uploadFile(file) { 198 | if (file == undefined) { 199 | return false 200 | } else if ( !this.isValidName(file.name) ) { 201 | storage.commit('createModal', { 202 | 'message': "Filename should be shorter than 256 characters " 203 | + "and contain only english letters, digits, spaces " 204 | + "and the following characters: []()_@=.+-", 205 | 'buttonText': 'OK', 206 | 'action': 'info', 207 | 'buttonClass': 'is-primary' 208 | }) 209 | return false 210 | } 211 | let base64 = await this.pFileReader(file) 212 | this.cmdp('fileWrite', ['uploads/' + file.name, base64]) 213 | return true 214 | } 215 | } 216 | -------------------------------------------------------------------------------- /js/comments.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | Vue.component('comments', { 4 | template: ` 5 |
6 |
92 | `,
93 |
94 | props: ['post'],
95 |
96 | data() {
97 | return {
98 | commentText: '',
99 | comment_id: undefined,
100 | isDeleteHover: false,
101 | isSaveHover: false,
102 | newComment: '',
103 | // Hide comments only on a multipost view
104 | isHideCommentsMobile: storage.state.url == ''
105 | }
106 | },
107 |
108 | computed: {
109 | comments() {
110 | if (this.post.post_id in storage.state.comments) {
111 | return storage.state.comments[this.post.post_id]
112 | }
113 | }
114 | },
115 |
116 | filters: {
117 | fromNow: (value) => {
118 | return moment(value, 'x').fromNow()
119 | }
120 | },
121 |
122 | mounted() {
123 | storage.watch(storage.getters.getModal, () => {
124 | if (storage.getters.getModal().affirmed == true) {
125 | if (storage.getters.getModal().action == 'delComment') {
126 | if (storage.getters.getModal().id != null) {
127 | poster.delComment(storage.getters.getModal().id)
128 | storage.commit('destroyModal')
129 | }
130 | } else if (storage.getters.getModal().action == 'info') {
131 | storage.commit('destroyModal')
132 | }
133 | }
134 | }, { deep: true })
135 | },
136 |
137 | methods: {
138 | showComments() {
139 | this.isHideCommentsMobile = false
140 | },
141 |
142 | save(id) {
143 | if (id == undefined) {
144 | // A new comment
145 | if (this.newComment == '') {
146 | storage.commit('createModal', {
147 | 'message': "The comment is empty.",
148 | 'buttonText': 'OK',
149 | 'action': 'info',
150 | 'buttonClass': 'is-primary'
151 | })
152 | } else {
153 | poster.saveComment(this.post.post_id, this.newComment, id)
154 | this.newComment = ''
155 | }
156 | } else {
157 | // Edited comment
158 | if (this.$refs['comment' + id][0].innerHTML == '') {
159 | storage.commit('createModal', {
160 | 'message': "The comment is empty.",
161 | 'action': 'info',
162 | 'buttonText': 'OK',
163 | 'buttonClass': 'is-primary'
164 | })
165 | this.$refs['comment' + id][0].innerHTML = this.commentText
166 | } else {
167 | poster.saveComment(this.post.post_id,
168 | this.$refs['comment' + id][0].innerHTML, id)
169 | this.newComment = ''
170 | }
171 | }
172 | },
173 |
174 | reply(id) {
175 | this.newComment += this.cropIdProvider(id) + ", "
176 | this.$refs['textarea'].focus()
177 | },
178 |
179 | userTitle(comment) {
180 | return comment.cert_user_id + ': '
181 | + comment.directory.replace('users/', '')
182 | },
183 |
184 | cropIdProvider(id) {
185 | return id.split('@')[0]
186 | },
187 |
188 | own(cert) {
189 | return cert == storage.state.site_info.cert_user_id
190 | },
191 |
192 | del(id) {
193 | storage.commit('createModal', {
194 | 'message': "Are you sure to delete this comment?",
195 | 'buttonText': 'Delete',
196 | 'action': 'delComment',
197 | 'buttonClass': 'is-danger',
198 | 'id': id
199 | })
200 | },
201 |
202 | edit(comment) {
203 | this.commentText = comment.body
204 | this.comment_id = comment.comment_id
205 | this.$nextTick(() => {
206 | this.$refs['comment' + comment.comment_id][0].focus()
207 | })
208 | },
209 |
210 | deleteHover(state) {
211 | this.isDeleteHover = state
212 | },
213 |
214 | saveHover(state) {
215 | this.isSaveHover = state
216 | },
217 |
218 | blur(id) {
219 | if (this.isDeleteHover) {
220 | // A known bug here. Steps to reproduce:
221 | // 1. Edit comment
222 | // 2. Click 'Delete'
223 | // 3. Close window
224 | // ...
225 | // Comment looks like changed
226 | // You can uncomment the next line:
227 | //
228 | //this.$refs['comment' + id][0].innerHTML = this.commentText
229 | //
230 | // And this problem will gone
231 | // But if you:
232 | // 1. Edit comment
233 | // 2. Click 'Delete'
234 | // 3. Click 'Delete' again
235 | // ...
236 | // The previous comment will be replaced with current
237 | //
238 | // Probably the best solution is to move a comment body editor
239 | // to a separate component or use a textarea instead of
240 | // contenteditable div
241 | this.del(id)
242 | } else if (this.isSaveHover) {
243 | this.save(id)
244 | } else {
245 | this.$refs['comment' + id][0].innerHTML = this.commentText
246 | }
247 | this.isDeleteHover = false
248 | this.isSaveHover = false
249 | this.commentText = ''
250 | this.comment_id = undefined
251 | }
252 | }
253 | })
254 |
--------------------------------------------------------------------------------
/js/vuex.js:
--------------------------------------------------------------------------------
1 | /**
2 | * vuex v3.0.0
3 | * (c) 2017 Evan You
4 | * @license MIT
5 | */
6 | (function (global, factory) {
7 | typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
8 | typeof define === 'function' && define.amd ? define(factory) :
9 | (global.Vuex = factory());
10 | }(this, (function () { 'use strict';
11 |
12 | var applyMixin = function (Vue) {
13 | var version = Number(Vue.version.split('.')[0]);
14 |
15 | if (version >= 2) {
16 | Vue.mixin({ beforeCreate: vuexInit });
17 | } else {
18 | // override init and inject vuex init procedure
19 | // for 1.x backwards compatibility.
20 | var _init = Vue.prototype._init;
21 | Vue.prototype._init = function (options) {
22 | if ( options === void 0 ) options = {};
23 |
24 | options.init = options.init
25 | ? [vuexInit].concat(options.init)
26 | : vuexInit;
27 | _init.call(this, options);
28 | };
29 | }
30 |
31 | /**
32 | * Vuex init hook, injected into each instances init hooks list.
33 | */
34 |
35 | function vuexInit () {
36 | var options = this.$options;
37 | // store injection
38 | if (options.store) {
39 | this.$store = typeof options.store === 'function'
40 | ? options.store()
41 | : options.store;
42 | } else if (options.parent && options.parent.$store) {
43 | this.$store = options.parent.$store;
44 | }
45 | }
46 | };
47 |
48 | var devtoolHook =
49 | typeof window !== 'undefined' &&
50 | window.__VUE_DEVTOOLS_GLOBAL_HOOK__;
51 |
52 | function devtoolPlugin (store) {
53 | if (!devtoolHook) { return }
54 |
55 | store._devtoolHook = devtoolHook;
56 |
57 | devtoolHook.emit('vuex:init', store);
58 |
59 | devtoolHook.on('vuex:travel-to-state', function (targetState) {
60 | store.replaceState(targetState);
61 | });
62 |
63 | store.subscribe(function (mutation, state) {
64 | devtoolHook.emit('vuex:mutation', mutation, state);
65 | });
66 | }
67 |
68 | /**
69 | * Get the first item that pass the test
70 | * by second argument function
71 | *
72 | * @param {Array} list
73 | * @param {Function} f
74 | * @return {*}
75 | */
76 | /**
77 | * Deep copy the given object considering circular structure.
78 | * This function caches all nested objects and its copies.
79 | * If it detects circular structure, use cached copy to avoid infinite loop.
80 | *
81 | * @param {*} obj
82 | * @param {Array
7 |
8 |
67 |
68 |
86 |
87 | 8 |
67 |
89 | Show comments...
90 |
91 |
13 | 18 | 19 |
20 | 21 |
29 | 30 | Delete 35 | 36 | Save 41 | 42 |
44 | 45 |
47 | 48 | 49 | Reply 52 | · {{ comment.date_added | fromNow }} 53 | 54 | 55 |