+
+ 
+
+
-
+
+
+
+
+
+
+
-
-
+
+
+
+
-
-
-
-
-
+
- 
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ @on-keydown="down" />
@@ -212,13 +165,14 @@
Content of dialog
-- {{$t("message.askTodelete")}} + {{ $t("message.askTodelete") }}
- +
-
-
-
+
+
-
-
@@ -185,7 +215,9 @@ button span {
-
+
@@ -202,10 +234,11 @@ button span {
@@ -220,14 +253,13 @@ button span {
import { aesDecrypt, md5, unzip } from "@/libs/secret";
import Jquery from "jquery";
import { getSecretKey, getStoreKey } from "@/api/lock";
-import { deleteNote } from "@/api/note";
+import { deleteNote, getNote } from "@/api/note";
import storage from "@/libs/storage";
import { getEscapeText } from "@/libs/noteStorage";
import QRCode from "qrcode";
import Clipboard from "clipboard";
import { saveAs } from 'file-saver';
-import { isWeixin } from "@/libs/utils";
-// import html2canvas from 'html2canvas';
+import { isWeixin, getNoteUrl } from "@/libs/utils";
export default {
name: 'ViewNote',
@@ -244,7 +276,7 @@ export default {
md5: '',
lock: 0,
ttl: 3600,
- ttlDesc: '',
+ ttlDesc: '-- : --',
},
secret: {
storeKey: '',
@@ -263,24 +295,48 @@ export default {
showDelete: false,
showShare: false,
deleting: false,
- showDownloadText: true,
+ showDownloadText: false,
},
toTopState: false,
+ contextMenuData: {
+ menuName: 'textMenu',
+ //菜单显示的位置
+ axis: {
+ x: null,
+ y: null
+ },
+ //菜单选项
+ menulists: [{
+ fnHandler: 'selectAllText', //绑定事件
+ btnName: this.$t("button.selectAll") //菜单名称
+ }, {
+ fnHandler: 'copySelectedText',
+ btnName: this.$t("button.copy")
+ }, {
+ fnHandler: 'copyAllText',
+ btnName: this.$t("button.copyAll")
+ }]
+ },
+ tempFragment: null,
}
},
created() {
+ // read $route
+ this.noteForm.key = this.$route.params.name;
+ let noteMeta = this.$route.meta.noteMeta;
+ //ipad chrome url not redirect
+ let path = location.pathname;
+ if ("/" == path) {
+ history.pushState('', '', '/' + this.noteForm.key);
+ }
+ //wx does not show downloadText
this.model.showDownloadText = !isWeixin();
-
- let noteMeta = this.$route.meta.noteMeta;
- this.noteForm.key = this.$route.params.name;
-
- this.noteForm.noteUrl = "https://flagnote.com/" + this.noteForm.key;
- let storeKey = getStoreKey(this.noteForm.key);
- this.secret.storeKey = storeKey;
+ this.noteForm.noteUrl = getNoteUrl(this.noteForm.key);
+ this.secret.storeKey = getStoreKey(this.noteForm.key);
if (noteMeta) {
this.state.lock = noteMeta.lock;
@@ -292,79 +348,79 @@ export default {
this.noteForm.ttl = noteMeta.ttl;
this.startClock();
+
+ storage.local.dynamicClear();
+
this.loadText();
- storage.local.dynamicClear(this.secret.currentTime);
+
+ this.bindCtrlAllEvent();
+ this.bindCopyUrlEvent();
+ this.bindToTopEvent();
+ this.bindMouseEvent();
+
+ } else {
+ alert("Unconnected.");
}
- this.bindEvent();
-
- var clipboard = new Clipboard("#tag-copy")
- let that = this;
- clipboard.on('success', function () {
- //console.log("url copied")
- //that.$Message.success({content:'url copied',duration: 10,closable:true});
- that.$Message.success({ content: 'url copied' });
- });
-
- clipboard.on('error', function () {
- that.$Message.error('not allow to copy');
- });
-
-
-
- window.onscroll = function () {
- //变量scrollTop是滚动条滚动时，距离顶部的距离
- var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
- // //变量windowHeight是可视区的高度
- // var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
- // //变量scrollHeight是滚动条的总高度
- // var scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
- //滚动条到底部的条件
-
- if (scrollTop >= 20) {
- //写后台加载数据的函数
- //console.log("距顶部" + scrollTop + "可视区高度" + windowHeight + "滚动条总高度" + scrollHeight);
-
- that.toTopState = true;
- } else {
- //toTop.style.setProperty("display", "none")
- that.toTopState = false;
- }
- }
-
-
-
-
-
-
-
},
- methods: {
+ mounted() {
+ this.bindCopyTextEvent();
+ const myObserver = new ResizeObserver(entries => {
+ // iterate over the entries, do something.
+ entries.forEach(entry => {
+ let affix = document.querySelector('.ivu-affix');
+ if (affix) {
+ affix.setAttribute("style", "top: 0px; width: " + entry.contentRect.width + "px;");
+ }
+
+ });
+ });
+
+ const someOtherEl = document.querySelector('#wrapper');
+ myObserver.observe(someOtherEl);
+
+ },
+ updated() {
+ },
+ beforeDestroy() {
+ },
+ destroyed() {
+ },
+ computed: {},
+ watch: {},
+ methods: {
+ selectAllText() {
+ var element = document.getElementById("noteText");
+ if (window.getSelection) {
+ let selection = window.getSelection();
+ let range = document.createRange();
+ range.selectNodeContents(element);
+ selection.removeAllRanges();
+ selection.addRange(range);
+ }
+ },
+ copySelectedText() {
+
+ },
+ copyAllText() {
+
+ },
+ showMenu(event) {
+ event.preventDefault()
+ var x = event.clientX
+ var y = event.clientY
+ // Get the current location
+ this.contextMenuData.axis = {
+ x, y
+ }
+ },
downLoadText() {
var blob = new Blob([this.noteForm.text], { type: "application/octet-stream;charset=utf-8" });
saveAs(blob, this.noteForm.key + ".txt");
- },
- downLoadImage() {
-
- //let that = this;
-
- //html2canvas(document.getElementById("noteText")).then(function(canvas) {
-
- // var canvas = document.getElementById("my-canvas");
- //canvas.toBlob(function(blob) {
- // saveAs(blob, that.noteForm.key+".png");
- // });
-
- // alert(canvas)
- // document.body.appendChild(canvas);
- //});
-
-
},
toTop() {
window.scrollTo(0, 0);
- this.downLoadImage();
},
startClock() {
let that = this;
@@ -403,7 +459,6 @@ export default {
window.open("/");
},
showShareModel() {
-
this.model.showShare = true;
let qrimg = document.getElementById("qrimg");
let qrurl = "https://flagnote.com/" + this.noteForm.key;
@@ -423,7 +478,6 @@ export default {
},
showDeleteModel() {
this.model.showDelete = true;
-
},
dropNote() {
this.model.deleting = true;
@@ -431,7 +485,6 @@ export default {
deleteNote(this.noteForm.key).then(res => {
if (res) {
storage.local.delete(that.secret.storeKey + '.text');
- storage.session.delete(that.secret.storeKey + '.keyMeta');
location.reload();
} else {
that.model.deleting = false;
@@ -439,25 +492,28 @@ export default {
});
},
loadText() {
- let password;
+ let password = '';
if (this.noteForm.lock == 1) {
password = "FLAGNOTE"; //默认密码
}
- if (!password) {
- password = "";
- }
-
let secretKey = getSecretKey(this.noteForm.key, password);
let storeText = storage.local.getText(this.secret.storeKey + '.text');
if (!storeText || (md5(storeText.substring(51)) != this.noteForm.md5)) {
- let note = this.getNote(this.noteForm.key);
- storeText = this.noteForm.lock + '|' + this.secret.cipher + '|1|' + this.noteForm.currentTime + '|' + note.text;
- storage.local.setText(this.secret.storeKey + '.text', storeText);
+ // local is useless
+ let note = getNote(this.noteForm.key);
+ // if lack of local , not set local
+ if (storage.local.getAvailableSize() > 1 * 1024 * 1024) {
+ storeText = this.noteForm.lock + '|' + this.secret.cipher + '|1|' + this.secret.currentTime + '|' + note.text;
+ storage.local.setText(this.secret.storeKey + '.text', storeText);
+ }
} else {
+ // local is usable, and set commited flag
var starray = storeText.split('|');
- storage.local.setText(this.secret.storeKey + '.text', starray[0] + "|" + starray[1] + "|1|" + starray[3] + "|" + starray[4]);
+ if ("0" == starray[2]) {
+ storage.local.setText(this.secret.storeKey + '.text', starray[0] + "|" + starray[1] + "|1|" + starray[3] + "|" + starray[4]);
+ }
}
if (storeText) {
@@ -465,36 +521,84 @@ export default {
let plainText = aesDecrypt(storeText, secretKey);
if (plainText.startsWith("FLAGNOTE#")) {
this.noteForm.text = plainText.substring(9);
- let escapeText = getEscapeText(this.noteForm.text);
- this.noteForm.escapeText = escapeText;
+ this.noteForm.escapeText = getEscapeText(this.noteForm.text);
}
}
},
- getNote(key) {
- let noteObject;
- Jquery.ajax({
- url: '/note/' + key,
- async: false,
- success: function (data) {
- noteObject = data;
+ bindToTopEvent() {
+ let that = this;
+ window.onscroll = function () {
+ var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+ if (scrollTop >= 20) {
+ that.toTopState = true;
+ } else {
+ that.toTopState = false;
+ }
+ }
+ },
+ bindCopyUrlEvent() {
+ let that = this;
+ var clipboard = new Clipboard("#tag-copy")
+ clipboard.on('success', function () {
+ that.$Message.success({ content: 'url copied' });
+ });
+
+ clipboard.on('error', function () {
+ that.$Message.error('not allow to copy');
+ });
+ },
+ bindCopyTextEvent() {
+
+ let ele1 = document.getElementsByClassName("vue-contextmenuName-textMenu")[0].children[1].children[0].children[0];
+ let ele2 = document.getElementsByClassName("vue-contextmenuName-textMenu")[0].children[2].children[0].children[0];
+
+ let that = this;
+
+ const clipboard1 = new Clipboard(ele1, { // 绑定需要的触发的dom
+ text: function () {
+ let fragment = that.tempFragment;
+
+ if (fragment) {
+ let copyText = "";
+
+ fragment.childNodes.forEach(element => {
+ if (3 == element.nodeType) {
+ copyText += element.textContent.replace(new RegExp('\u00a0', 'gm'), " ");
+ } else if (1 == element.nodeType) {
+ if ("BR" == element.nodeName) {
+ copyText += "\r\n";
+ } else if ("PRE" == element.nodeName) {
+ copyText += "\t";
+ }
+ }
+ });
+
+ return copyText;
+ }
+ return null;
}
});
- return noteObject;
+ clipboard1.on('success', function () {
+ that.$Message.success({ content: 'selected text copied' });
+ });
+ clipboard1.on('error', function () {
+ that.$Message.error('not allow to copy');
+ });
+
+ const clipboard2 = new Clipboard(ele2, { // 绑定需要的触发的dom
+ text: function () {
+ return that.noteForm.text;
+ }
+ });
+ clipboard2.on('success', function () {
+ that.$Message.success({ content: 'text copied' });
+ });
+ clipboard2.on('error', function () {
+ that.$Message.error('not allow to copy');
+ });
},
- bindEvent() {
- if (document.body.createTextRange) {
- Jquery(document).keydown(function (e) {
- if ((e.ctrlKey || e.metaKey) && e.keyCode == 65) {
- e.preventDefault();
-
- var element = document.getElementById("noteText");
- let range = document.body.createTextRange();
- range.moveToElementText(element);
- range.select();
-
- }
- });
- } else if (window.getSelection) {
+ bindCtrlAllEvent() {
+ if (window.getSelection) {
Jquery(document).keydown(function (e) {
if ((e.ctrlKey || e.metaKey) && e.keyCode == 65) {
@@ -511,11 +615,20 @@ export default {
}
});
- } else {
- //alert('none');
}
-
-
+ },
+ bindMouseEvent() {
+ let that = this;
+ document.addEventListener('mouseup', function (e) {
+ if (e.button === 2) {
+ if (window.getSelection) {
+ let sel = window.getSelection();
+ if (sel.rangeCount > 0) {
+ that.tempFragment = sel.getRangeAt(0).cloneContents();
+ }
+ }
+ }
+ }, false)
}
}
diff --git a/vue.config.js b/vue.config.js
index 11b3234..1a6eff8 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -2,7 +2,10 @@ const { defineConfig } = require("@vue/cli-service");
const CompressionPlugin = require("compression-webpack-plugin");
module.exports = defineConfig({
+ assetsDir:'static',
+ productionSourceMap: false,
configureWebpack: {
+ devtool: false,
plugins: [
new CompressionPlugin({
algorithm: "gzip", // 使用gzip压缩
diff --git a/yarn.lock b/yarn.lock
index b20d4fe..09c0f34 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -920,7 +920,7 @@
"@babel/types" "^7.4.4"
esutils "^2.0.2"
-"@babel/runtime@^7.12.13", "@babel/runtime@^7.8.4":
+"@babel/runtime@^7.12.13", "@babel/runtime@^7.13.10", "@babel/runtime@^7.8.4":
version "7.18.9"
resolved "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.18.9.tgz"
integrity sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==
@@ -2323,7 +2323,7 @@ compressible@~2.0.16:
compression-webpack-plugin@^10.0.0:
version "10.0.0"
- resolved "https://registry.npmmirror.com/compression-webpack-plugin/-/compression-webpack-plugin-10.0.0.tgz#3496af1b0dc792e13efc474498838dbff915c823"
+ resolved "https://registry.npmmirror.com/compression-webpack-plugin/-/compression-webpack-plugin-10.0.0.tgz"
integrity sha512-wLXLIBwpul/ALcm7Aj+69X0pYT3BYt6DdPn3qrgBIh9YejV9Bju9ShhlAsjujLyWMo6SAweFIWaUoFmXZNuNrg==
dependencies:
schema-utils "^4.0.0"
@@ -5898,6 +5898,13 @@ vue-cli-plugin-iview@^2.0.0:
resolved "https://registry.npmmirror.com/vue-cli-plugin-iview/-/vue-cli-plugin-iview-2.0.0.tgz"
integrity sha512-aHkGrn4MKa4Tb2u14TI8t50bemcOyhxwuzeAZnTbJvs7o/v0AfdBMyMuAyUEeAl0hWCy+jveCfUEEO54SHHrsQ==
+vue-contextmenu@^1.5.11:
+ version "1.5.11"
+ resolved "https://registry.npmmirror.com/vue-contextmenu/-/vue-contextmenu-1.5.11.tgz"
+ integrity sha512-H9CdXqiVMRJsUX+ah9k2olywZUiJ+sq6EkCGkLza+DFx0PChIJzZPlsVNPOMgcFInYkigh+QRw2S4Bu7nUXGlA==
+ dependencies:
+ vue "^2.6.9"
+
vue-eslint-parser@^8.0.1:
version "8.3.0"
resolved "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz"
@@ -5916,9 +5923,9 @@ vue-hot-reload-api@^2.3.0:
resolved "https://registry.npmmirror.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz"
integrity sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==
-vue-i18n@8.27.2:
+vue-i18n@^8.27.2:
version "8.27.2"
- resolved "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-8.27.2.tgz#b649a65ff42b7d1a482679b732902f889965a068"
+ resolved "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-8.27.2.tgz"
integrity sha512-QVzn7u2WVH8F7eSKIM00lujC7x1mnuGPaTnDTmB01Hd709jDtB9kYtBqM+MWmp5AJRx3gnqAdZbee9MelqwFBg==
vue-loader@^17.0.0:
@@ -5930,6 +5937,13 @@ vue-loader@^17.0.0:
hash-sum "^2.0.0"
loader-utils "^2.0.0"
+vue-resize@^1.0.1:
+ version "1.0.1"
+ resolved "https://registry.npmmirror.com/vue-resize/-/vue-resize-1.0.1.tgz#c120bed4e09938771d622614f57dbcf58a5147ee"
+ integrity sha512-z5M7lJs0QluJnaoMFTIeGx6dIkYxOwHThlZDeQnWZBizKblb99GSejPnK37ZbNE/rVwDcYcHY+Io+AxdpY952w==
+ dependencies:
+ "@babel/runtime" "^7.13.10"
+
vue-router@^3.5.1:
version "3.5.4"
resolved "https://registry.npmmirror.com/vue-router/-/vue-router-3.5.4.tgz"
@@ -5956,7 +5970,7 @@ vue-template-es2015-compiler@^1.9.0:
resolved "https://registry.npmmirror.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz"
integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
-vue@^2.6.14:
+vue@^2.6.14, vue@^2.6.9:
version "2.7.7"
resolved "https://registry.npmmirror.com/vue/-/vue-2.7.7.tgz"
integrity sha512-osfkncsGCWqtch+YWYxbqTNQ9hl/UQ6TFRkdmK/VqAjuMpxzr5QotFsYpmJ1AB1ez2LJeIKXDmtMkXUotMOTsA==
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
+
-
-
-
-
-
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ v-html="noteForm.escapeText">
+
- {{$t("message.askTodelete")}} + {{ $t("message.askTodelete") }}
- +