depau/HackMD
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Convert cover.js to es6

Browse source
This commit is contained in:
Yukai Huang 2017-01-05 18:10:55 +08:00
parent 47d7ff2561
commit 71aece7429
1 changed files with 125 additions and 124 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

249
public/js/cover.js
View file

@ -3,30 +3,30 @@ require('./locale');
require('../css/cover.css'); require('../css/cover.css');
require('../css/site.css'); require('../css/site.css');
var common = require('./common'); import {
var checkIfAuth = common.checkIfAuth; checkIfAuth,
var urlpath = common.urlpath; clearLoginState,
var resetCheckAuth = common.resetCheckAuth; getLoginState,
var getLoginState = common.getLoginState; resetCheckAuth,
var clearLoginState = common.clearLoginState; setloginStateChangeEvent
var loginStateChangeEvent = common.loginStateChangeEvent; } from './common';
var historyModule = require('./history'); import historyModule from './history';
var parseStorageToHistory = historyModule.parseStorageToHistory; const parseStorageToHistory = historyModule.parseStorageToHistory;
var parseHistory = historyModule.parseHistory; const parseHistory = historyModule.parseHistory;
var getStorageHistory = historyModule.getStorageHistory; const getStorageHistory = historyModule.getStorageHistory;
var getHistory = historyModule.getHistory; const getHistory = historyModule.getHistory;
var saveHistory = historyModule.saveHistory; const saveHistory = historyModule.saveHistory;
var removeHistory = historyModule.removeHistory; const removeHistory = historyModule.removeHistory;
var postHistoryToServer = historyModule.postHistoryToServer; const postHistoryToServer = historyModule.postHistoryToServer;
var deleteServerHistory = historyModule.deleteServerHistory; const deleteServerHistory = historyModule.deleteServerHistory;
var parseServerToHistory = historyModule.parseServerToHistory; const parseServerToHistory = historyModule.parseServerToHistory;
var saveStorageHistoryToServer = historyModule.saveStorageHistoryToServer; const saveStorageHistoryToServer = historyModule.saveStorageHistoryToServer;
var clearDuplicatedHistory = historyModule.clearDuplicatedHistory; const clearDuplicatedHistory = historyModule.clearDuplicatedHistory;
var saveAs = require('file-saver').saveAs; import {saveAs} from 'file-saver';
var List = require('list.js'); import List from 'list.js';
var S = require('string'); import S from 'string';
import Cover from './views/Cover'; import Cover from './views/Cover';
import Vue from 'vue'; import Vue from 'vue';
@ -36,13 +36,13 @@ new Vue({
render: (h) => h(Cover) render: (h) => h(Cover)
}) })
var options = { const options = {
valueNames: ['id', 'text', 'timestamp', 'fromNow', 'time', 'tags', 'pinned'], valueNames: ['id', 'text', 'timestamp', 'fromNow', 'time', 'tags', 'pinned'],
item: '<li class="col-xs-12 col-sm-6 col-md-6 col-lg-4">\ item: '<li class="col-xs-12 col-sm-6 col-md-6 col-lg-4">\
<span class="id" style="display:none;"></span>\ <span class="id" style="display:none;"></span>\
<a href="#">\ <a href="#">\
<div class="item">\ <div class="item">\
<div class="ui-history-pin fa fa-thumb-tack fa-fw"></div>\ <div class="ui-history-pin fa fa-thumb-tack fa-fw"></div>\
<div class="ui-history-close fa fa-close fa-fw" data-toggle="modal" data-target=".delete-modal"></div>\ <div class="ui-history-close fa fa-close fa-fw" data-toggle="modal" data-target=".delete-modal"></div>\
<div class="content">\ <div class="content">\
<h4 class="text"></h4>\ <h4 class="text"></h4>\
@ -64,15 +64,16 @@ var options = {
}) })
] ]
}; };
var historyList = new List('history', options); const historyList = new List('history', options);
migrateHistoryFromTempCallback = pageInit; migrateHistoryFromTempCallback = pageInit;
loginStateChangeEvent = pageInit; setloginStateChangeEvent(pageInit);
pageInit(); pageInit();
function pageInit() { function pageInit() {
checkIfAuth( checkIfAuth(
function (data) { data => {
$('.ui-signin').hide(); $('.ui-signin').hide();
$('.ui-or').hide(); $('.ui-or').hide();
$('.ui-welcome').show(); $('.ui-welcome').show();
@ -83,7 +84,7 @@ function pageInit() {
$(".ui-history").click(); $(".ui-history").click();
parseServerToHistory(historyList, parseHistoryCallback); parseServerToHistory(historyList, parseHistoryCallback);
}, },
function () { () => {
$('.ui-signin').show(); $('.ui-signin').show();
$('.ui-or').show(); $('.ui-or').show();
$('.ui-welcome').hide(); $('.ui-welcome').hide();
@ -100,14 +101,14 @@ $(".masthead-nav li").click(function () {
$(this).addClass("active"); $(this).addClass("active");
}); });
$(".ui-home").click(function () { $(".ui-home").click(() => {
if (!$("#home").is(':visible')) { if (!$("#home").is(':visible')) {
$(".section:visible").hide(); $(".section:visible").hide();
$("#home").fadeIn(); $("#home").fadeIn();
} }
}); });
$(".ui-history").click(function () { $(".ui-history").click(() => {
if (!$("#history").is(':visible')) { if (!$("#history").is(':visible')) {
$(".section:visible").hide(); $(".section:visible").hide();
$("#history").fadeIn(); $("#history").fadeIn();
@ -120,7 +121,7 @@ function checkHistoryList() {
$(".ui-import-from-browser").hide(); $(".ui-import-from-browser").hide();
} else if ($("#history-list").children().length == 0) { } else if ($("#history-list").children().length == 0) {
$(".ui-nohistory").slideDown(); $(".ui-nohistory").slideDown();
getStorageHistory(function (data) { getStorageHistory(data => {
if (data && data.length > 0 && getLoginState() && historyList.items.length == 0) { if (data && data.length > 0 && getLoginState() && historyList.items.length == 0) {
$(".ui-import-from-browser").slideDown(); $(".ui-import-from-browser").slideDown();
} }
@ -130,35 +131,35 @@ function checkHistoryList() {
function parseHistoryCallback(list, notehistory) { function parseHistoryCallback(list, notehistory) {
checkHistoryList(); checkHistoryList();
//sort by pinned then timestamp //sort by pinned then timestamp
list.sort('', { list.sort('', {
sortFunction: function (a, b) { sortFunction(a, b) {
var notea = a.values(); const notea = a.values();
var noteb = b.values(); const noteb = b.values();
if (notea.pinned && !noteb.pinned) { if (notea.pinned && !noteb.pinned) {
return -1; return -1;
} else if (!notea.pinned && noteb.pinned) { } else if (!notea.pinned && noteb.pinned) {
return 1; return 1;
} else { } else {
if (notea.timestamp > noteb.timestamp) { if (notea.timestamp > noteb.timestamp) {
return -1; return -1;
} else if (notea.timestamp < noteb.timestamp) { } else if (notea.timestamp < noteb.timestamp) {
return 1; return 1;
} else { } else {
return 0; return 0;
} }
} }
} }
}); });
// parse filter tags // parse filter tags
var filtertags = []; const filtertags = [];
for (var i = 0, l = list.items.length; i < l; i++) { for (let i = 0, l = list.items.length; i < l; i++) {
var tags = list.items[i]._values.tags; const tags = list.items[i]._values.tags;
if (tags && tags.length > 0) { if (tags && tags.length > 0) {
for (var j = 0; j < tags.length; j++) { for (let j = 0; j < tags.length; j++) {
//push info filtertags if not found //push info filtertags if not found
var found = false; let found = false;
if (filtertags.indexOf(tags[j]) != -1) if (filtertags.includes(tags[j]))
found = true; found = true;
if (!found) if (!found)
filtertags.push(tags[j]); filtertags.push(tags[j]);
@ -169,17 +170,17 @@ function parseHistoryCallback(list, notehistory) {
} }
// update items whenever list updated // update items whenever list updated
historyList.on('updated', function (e) { historyList.on('updated', e => {
for (var i = 0, l = e.items.length; i < l; i++) { for (let i = 0, l = e.items.length; i < l; i++) {
var item = e.items[i]; const item = e.items[i];
if (item.visible()) { if (item.visible()) {
var itemEl = $(item.elm); const itemEl = $(item.elm);
var values = item._values; const values = item._values;
var a = itemEl.find("a"); const a = itemEl.find("a");
var pin = itemEl.find(".ui-history-pin"); const pin = itemEl.find(".ui-history-pin");
var tagsEl = itemEl.find(".tags"); const tagsEl = itemEl.find(".tags");
//parse link to element a //parse link to element a
a.attr('href', serverurl + '/' + values.id); a.attr('href', `${serverurl}/${values.id}`);
//parse pinned //parse pinned
if (values.pinned) { if (values.pinned) {
pin.addClass('active'); pin.addClass('active');
@ -187,12 +188,12 @@ historyList.on('updated', function (e) {
pin.removeClass('active'); pin.removeClass('active');
} }
//parse tags //parse tags
var tags = values.tags; const tags = values.tags;
if (tags && tags.length > 0 && tagsEl.children().length <= 0) { if (tags && tags.length > 0 && tagsEl.children().length <= 0) {
var labels = []; const labels = [];
for (var j = 0; j < tags.length; j++) { for (let j = 0; j < tags.length; j++) {
//push into the item label //push into the item label
labels.push("<span class='label label-default'>" + tags[j] + "</span>"); labels.push(`<span class='label label-default'>${tags[j]}</span>`);
} }
tagsEl.html(labels.join(' ')); tagsEl.html(labels.join(' '));
} }
@ -206,21 +207,21 @@ historyList.on('updated', function (e) {
function historyCloseClick(e) { function historyCloseClick(e) {
e.preventDefault(); e.preventDefault();
var id = $(this).closest("a").siblings("span").html(); const id = $(this).closest("a").siblings("span").html();
var value = historyList.get('id', id)[0]._values; const value = historyList.get('id', id)[0]._values;
$('.ui-delete-modal-msg').text('Do you really want to delete below history?'); $('.ui-delete-modal-msg').text('Do you really want to delete below history?');
$('.ui-delete-modal-item').html('<i class="fa fa-file-text"></i> ' + value.text + '<br><i class="fa fa-clock-o"></i> ' + value.time); $('.ui-delete-modal-item').html(`<i class="fa fa-file-text"></i> ${value.text}<br><i class="fa fa-clock-o"></i> ${value.time}`);
clearHistory = false; clearHistory = false;
deleteId = id; deleteId = id;
} }
function historyPinClick(e) { function historyPinClick(e) {
e.preventDefault(); e.preventDefault();
var $this = $(this); const $this = $(this);
var id = $this.closest("a").siblings("span").html(); const id = $this.closest("a").siblings("span").html();
var item = historyList.get('id', id)[0]; const item = historyList.get('id', id)[0];
var values = item._values; const values = item._values;
var pinned = values.pinned; let pinned = values.pinned;
if (!values.pinned) { if (!values.pinned) {
pinned = true; pinned = true;
item._values.pinned = true; item._values.pinned = true;
@ -228,10 +229,10 @@ function historyPinClick(e) {
pinned = false; pinned = false;
item._values.pinned = false; item._values.pinned = false;
} }
checkIfAuth(function () { checkIfAuth(() => {
postHistoryToServer(id, { postHistoryToServer(id, {
pinned: pinned pinned
}, function (err, result) { }, (err, result) => {
if (!err) { if (!err) {
if (pinned) if (pinned)
$this.addClass('active'); $this.addClass('active');
@ -239,9 +240,9 @@ function historyPinClick(e) {
$this.removeClass('active'); $this.removeClass('active');
} }
}); });
}, function () { }, () => {
getHistory(function (notehistory) { getHistory(notehistory => {
for(var i = 0; i < notehistory.length; i++) { for(let i = 0; i < notehistory.length; i++) {
if (notehistory[i].id == id) { if (notehistory[i].id == id) {
notehistory[i].pinned = pinned; notehistory[i].pinned = pinned;
break; break;
@ -260,10 +261,10 @@ function historyPinClick(e) {
setInterval(updateItemFromNow, 60000); setInterval(updateItemFromNow, 60000);
function updateItemFromNow() { function updateItemFromNow() {
var items = $('.item').toArray(); const items = $('.item').toArray();
for (var i = 0; i < items.length; i++) { for (let i = 0; i < items.length; i++) {
var item = $(items[i]); const item = $(items[i]);
var timestamp = parseInt(item.find('.timestamp').text()); const timestamp = parseInt(item.find('.timestamp').text());
item.find('.fromNow').text(moment(timestamp).fromNow()); item.find('.fromNow').text(moment(timestamp).fromNow());
} }
} }
@ -272,8 +273,8 @@ var clearHistory = false;
var deleteId = null; var deleteId = null;
function deleteHistory() { function deleteHistory() {
checkIfAuth(function () { checkIfAuth(() => {
deleteServerHistory(deleteId, function (err, result) { deleteServerHistory(deleteId, (err, result) => {
if (!err) { if (!err) {
if (clearHistory) { if (clearHistory) {
historyList.clear(); historyList.clear();
@ -287,7 +288,7 @@ function deleteHistory() {
deleteId = null; deleteId = null;
clearHistory = false; clearHistory = false;
}); });
}, function () { }, () => {
if (clearHistory) { if (clearHistory) {
saveHistory([]); saveHistory([]);
historyList.clear(); historyList.clear();
@ -295,8 +296,8 @@ function deleteHistory() {
deleteId = null; deleteId = null;
} else { } else {
if (!deleteId) return; if (!deleteId) return;
getHistory(function (notehistory) { getHistory(notehistory => {
var newnotehistory = removeHistory(deleteId, notehistory); const newnotehistory = removeHistory(deleteId, notehistory);
saveHistory(newnotehistory); saveHistory(newnotehistory);
historyList.remove('id', deleteId); historyList.remove('id', deleteId);
checkHistoryList(); checkHistoryList();
@ -308,36 +309,36 @@ function deleteHistory() {
}); });
} }
$(".ui-delete-modal-confirm").click(function () { $(".ui-delete-modal-confirm").click(() => {
deleteHistory(); deleteHistory();
}); });
$(".ui-import-from-browser").click(function () { $(".ui-import-from-browser").click(() => {
saveStorageHistoryToServer(function () { saveStorageHistoryToServer(() => {
parseStorageToHistory(historyList, parseHistoryCallback); parseStorageToHistory(historyList, parseHistoryCallback);
}); });
}); });
$(".ui-save-history").click(function () { $(".ui-save-history").click(() => {
getHistory(function (data) { getHistory(data => {
var history = JSON.stringify(data); const history = JSON.stringify(data);
var blob = new Blob([history], { const blob = new Blob([history], {
type: "application/json;charset=utf-8" type: "application/json;charset=utf-8"
}); });
saveAs(blob, 'hackmd_history_' + moment().format('YYYYMMDDHHmmss')); saveAs(blob, `hackmd_history_${moment().format('YYYYMMDDHHmmss')}`);
}); });
}); });
$(".ui-open-history").bind("change", function (e) { $(".ui-open-history").bind("change", e => {
var files = e.target.files || e.dataTransfer.files; const files = e.target.files || e.dataTransfer.files;
var file = files[0]; const file = files[0];
var reader = new FileReader(); const reader = new FileReader();
reader.onload = function () { reader.onload = () => {
var notehistory = JSON.parse(reader.result); const notehistory = JSON.parse(reader.result);
//console.log(notehistory); //console.log(notehistory);
if (!reader.result) return; if (!reader.result) return;
getHistory(function (data) { getHistory(data => {
var mergedata = data.concat(notehistory); let mergedata = data.concat(notehistory);
mergedata = clearDuplicatedHistory(mergedata); mergedata = clearDuplicatedHistory(mergedata);
saveHistory(mergedata); saveHistory(mergedata);
parseHistory(historyList, parseHistoryCallback); parseHistory(historyList, parseHistoryCallback);
@ -347,18 +348,18 @@ $(".ui-open-history").bind("change", function (e) {
reader.readAsText(file); reader.readAsText(file);
}); });
$(".ui-clear-history").click(function () { $(".ui-clear-history").click(() => {
$('.ui-delete-modal-msg').text('Do you really want to clear all history?'); $('.ui-delete-modal-msg').text('Do you really want to clear all history?');
$('.ui-delete-modal-item').html('There is no turning back.'); $('.ui-delete-modal-item').html('There is no turning back.');
clearHistory = true; clearHistory = true;
deleteId = null; deleteId = null;
}); });
$(".ui-refresh-history").click(function () { $(".ui-refresh-history").click(() => {
var lastTags = $(".ui-use-tags").select2('val'); const lastTags = $(".ui-use-tags").select2('val');
$(".ui-use-tags").select2('val', ''); $(".ui-use-tags").select2('val', '');
historyList.filter(); historyList.filter();
var lastKeyword = $('.search').val(); const lastKeyword = $('.search').val();
$('.search').val(''); $('.search').val('');
historyList.search(); historyList.search();
$('#history-list').slideUp('fast'); $('#history-list').slideUp('fast');
@ -366,7 +367,7 @@ $(".ui-refresh-history").click(function () {
resetCheckAuth(); resetCheckAuth();
historyList.clear(); historyList.clear();
parseHistory(historyList, function (list, notehistory) { parseHistory(historyList, (list, notehistory) => {
parseHistoryCallback(list, notehistory); parseHistoryCallback(list, notehistory);
$(".ui-use-tags").select2('val', lastTags); $(".ui-use-tags").select2('val', lastTags);
$(".ui-use-tags").trigger('change'); $(".ui-use-tags").trigger('change');
@ -378,16 +379,16 @@ $(".ui-refresh-history").click(function () {
}); });
}); });
$(".ui-logout").click(function () { $(".ui-logout").click(() => {
clearLoginState(); clearLoginState();
location.href = serverurl + '/logout'; location.href = `${serverurl}/logout`;
}); });
var filtertags = []; let filtertags = [];
$(".ui-use-tags").select2({ $(".ui-use-tags").select2({
placeholder: $(".ui-use-tags").attr('placeholder'), placeholder: $(".ui-use-tags").attr('placeholder'),
multiple: true, multiple: true,
data: function () { data() {
return { return {
results: filtertags results: filtertags
}; };
@ -397,7 +398,7 @@ $('.select2-input').css('width', 'inherit');
buildTagsFilter([]); buildTagsFilter([]);
function buildTagsFilter(tags) { function buildTagsFilter(tags) {
for (var i = 0; i < tags.length; i++) for (let i = 0; i < tags.length; i++)
tags[i] = { tags[i] = {
id: i, id: i,
text: S(tags[i]).unescapeHTML().s text: S(tags[i]).unescapeHTML().s
@ -405,17 +406,17 @@ function buildTagsFilter(tags) {
filtertags = tags; filtertags = tags;
} }
$(".ui-use-tags").on('change', function () { $(".ui-use-tags").on('change', function () {
var tags = []; const tags = [];
var data = $(this).select2('data'); const data = $(this).select2('data');
for (var i = 0; i < data.length; i++) for (let i = 0; i < data.length; i++)
tags.push(data[i].text); tags.push(data[i].text);
if (tags.length > 0) { if (tags.length > 0) {
historyList.filter(function (item) { historyList.filter(item => {
var values = item.values(); const values = item.values();
if (!values.tags) return false; if (!values.tags) return false;
var found = false; let found = false;
for (var i = 0; i < tags.length; i++) { for (let i = 0; i < tags.length; i++) {
if (values.tags.indexOf(tags[i]) != -1) { if (values.tags.includes(tags[i])) {
found = true; found = true;
break; break;
} }
@ -428,6 +429,6 @@ $(".ui-use-tags").on('change', function () {
checkHistoryList(); checkHistoryList();
}); });
$('.search').keyup(function () { $('.search').keyup(() => {
checkHistoryList(); checkHistoryList();
}); });