error message

src/App.vue

@@ -38,11 +38,6 @@ body {
   font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 }
 
-#nprogress .bar {
-  background: red !important;
-}
-
-
 .showBlock {
   display: block;
 }

src/api/note.js

@@ -68,13 +68,23 @@ export function getNoteBlob(key) {
 
 export function getNoteMeta(key) {
   let url = servicePath + "/note/" + key + "/noteMeta";
-  let noteMeta = ajaxGet(url);
+  let noteMeta = null;
+  try {
+    noteMeta = ajaxGet(url);
+  } catch (error) {
+    console.log(error);
+  }
   return noteMeta;
 }
 
 export function getKeyMeta() {
   let url = servicePath + "/note/keyMeta";
-  let keyMeta = ajaxGet(url);
+  let keyMeta = null;
+  try {
+    keyMeta = ajaxGet(url);
+  } catch (error) {
+    console.log(error);
+  }
   return keyMeta;
 }
 

src/i18n/config/en.js

@@ -22,7 +22,9 @@ const en = {
     "100003": "Deleted！",
     "100004": "Expired!",
     "100005": "Not Available!",
-    "100006": "100006",
+    "100006": "Server Unavailable!",
+    "100011": "Empty Note!",
+    "100012": "Too Large, Beyond 200K!",
   }
 };
 export default en;

src/i18n/config/zh.js

@@ -22,7 +22,9 @@ const zh = {
     "100003": "内容已删除！",
     "100004": "内容已过期！",
     "100005": "内容不存在！",
-    "100006": "100006",
+    "100006": "服务器不可用！",
+    "100011": "内容为空!",
+    "100012": "内容过大，超过200K!",
   }
 };
 export default zh;

src/router/index.js

@@ -27,6 +27,10 @@ function getErrorMetaParam() {
 }
 
 function getNoteView() {
+  if(errorMeta){
+    return;
+  }
+
   let path = location.pathname;
 
   let key = path.substring(1, path.length);
@@ -49,8 +53,14 @@ function getNoteView() {
   //set noteMeta
   noteMeta = getNoteMeta(key);
 
+  //server error
+  if (!noteMeta) {
+    errorMeta = 100006;
+    return InvalidateNote;
+  }
+
   //invalidated key
-  if (!noteMeta || !noteMeta.key) {
+  if (!noteMeta.key) {
     errorMeta = 100002;
     return InvalidateNote;
   }
@@ -105,6 +115,13 @@ function getHomeRedirect() {
 
   //setKeyMeta
   keyMeta = getKeyMeta();
+
+  // server error
+  if (!keyMeta) {
+    errorMeta = 100006;
+    return "/invalidatenote";
+  }
+
   return "/" + keyMeta.key;
 }
 
@@ -114,6 +131,7 @@ const routes = [
     name: "home",
     redirect: getHomeRedirect(),
   },
+  { path: "/invalidatenote", component: InvalidateNote },
   {
     path: "/:name([a-z0-9]{1,20})",
     name: "note",

src/views/EditNote.vue

@@ -149,7 +149,7 @@
                 <div id="wrapper" style="border-left: 0px solid #FF3366;">
                   <Input element-id="noteText" type="textarea" :border="false" v-model="noteForm.text" autofocus
                     :autosize="{ minRows: 30, maxRows: 20480 }"  :placeholder="$t('content.noteTip')" @input="recordText"
-                    @on-keydown="recordEventKdown" />
+                    @on-keydown="recordEventKdown" @on-keyup="recordEventKup"/>
                 </div>
               </Form>
             </Card>
@@ -174,6 +174,16 @@
       </p>
     </Modal>
 
+    <Modal v-model="model.showError" width="360" footer-hide class-name="fnmodal" :styles="{ borderRadius: 0 }">
+      <p style="text-align: center;font-size:medium ;margin-bottom: 20px;">
+        {{ errorInfo }}
+      </p>
+      <p style="text-align: center;">
+        <Button type="error" style="border-radius: 0px;font-size: 19px;"
+          @click="cloaseErrorMessage()">{{ $t("button.close") }}</Button>
+      </p>
+    </Modal>
+
 
   </div>
 
@@ -216,9 +226,11 @@ export default {
         showDelete: false,
         deleting: false,
         showDownloadText: false,
+        showError: false,
       },
       toTopState: false,
       showMenuState: false,
+      errorInfo: '',
     }
   },
   created() {
@@ -325,24 +337,28 @@ export default {
     },
     recordText() {
       let text = this.noteForm.text;
-      if (text.length > 102400) {
-        alert("text length is " + text.length + ",beyond 102400!!!");
+      if (text.length > 204800) {
+        this.errorInfo = this.$t('error.100012');
+        this.model.showError = true;
+        return;
       }
 
       setStoreText(this.noteForm, this.state, this.secret);
     },
-    // recordEventKup(event) {
-      // let tn = event.currentTarget.value;
-      // let ss = event.currentTarget.selectionStart;
-      // let cline = tn.substring(0, ss).split('\n').length;
+    recordEventKup(event) {
+      let tn = event.currentTarget.value;
+      let ss = event.currentTarget.selectionStart;
+      let cline = tn.substring(0, ss).split('\n').length;
 
-      // var noteTop = parseFloat(window.getComputedStyle(event.currentTarget).lineHeight) * cline;
-      // var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
-      // if (noteTop < scrollTop + 10) {
-      //   window.scrollTo(0, noteTop - 10);
-      // }
+      var noteTop = parseFloat(window.getComputedStyle(event.currentTarget).lineHeight) * cline;
+      console.log(noteTop)
+      var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+      console.log(scrollTop)
+      if (noteTop < scrollTop+10) {
+        window.scrollTo(0, noteTop-10);
+      }
 
-    // },
+    },
     recordEventKdown(event) {
 
       if (event.key == "Tab") {
@@ -351,8 +367,10 @@ export default {
         let end = event.currentTarget.selectionEnd;
         let text = event.currentTarget.value;
 
-        if (text.length > 102400) {
-          alert("text length is " + text.length + ",beyond 102400!!!");
+        if (text.length > 204800) {
+          this.errorInfo = this.$t('error.100012');
+          this.model.showError = true;
+          return;
         }
 
         let tab = '\t';//\t
@@ -395,16 +413,22 @@ export default {
     },
     validateForm() {
       let text = this.noteForm.text;
-      if (text.length > 102400) {
-        alert("text length is " + text.length + ",beyond 102400!!!");
+      if (text.length > 204800) {
+        this.errorInfo = this.$t('error.100012');
+        this.model.showError = true;
         return false;
       }
       if (text.length == 0) {
-        alert("text is empty!!!");
+        this.errorInfo = this.$t('error.100011');
+        this.model.showError = true;
         return false;
       }
       return true;
     },
+    cloaseErrorMessage(){
+      this.errorInfo = '';
+      this.model.showError = false;
+    },
     submitNote() {
       if (this.state.locking == 1) {
         return;

src/views/ErrorNote.vue

@@ -1,21 +0,0 @@
-<template>
-    <div>
-      error
-    </div>
-  </template>
-  
-  <script>
-  export default {
-    name: 'ErrorView',
-    components: {
-    },
-    data() {
-      return {
-      }
-    },
-    created() {
-        alert("error")
-    }
-  }
-  </script>
-  

src/views/ErrorView.vue

@@ -12,6 +12,7 @@ export default {
     return {}
   },
     created() {
+        alert("error")
     }
 }
 </script>

src/views/InvalidateNote.vue

@@ -106,7 +106,7 @@
 
 <script>
 export default {
-  name: 'BlankNote',
+  name: 'InvalidateNote',
   components: {},
   props: {},
   data() {
@@ -136,7 +136,7 @@ export default {
   },
   created() {
     this.errorInfo.code = this.$route.meta.errorMeta;
-    this.noteForm.key = this.$route.params.name;
+    //this.noteForm.key = this.$route.params.name;
   },
   mounted() {
     //this.bindCopyTextEvent();

src/views/ViewNote.vue

@@ -271,8 +271,8 @@
         <canvas id="qrImg" class=""></canvas>
       </p>
       <p style="text-align: center;margin-top:10px;">
-        <Button type="error" style="border-radius: 0px;font-size:19px;"
-          @click="closeShareModel()">{{ $t("button.close") }}</Button>
+        <Button type="error" style="border-radius: 0px;font-size:19px;" @click="closeShareModel()">{{ $t("button.close")
+        }}</Button>
       </p>
     </Modal>
 
@@ -287,6 +287,17 @@
       </p>
     </Modal>
 
+    <Modal v-model="model.showError" width="360" footer-hide class-name="fnmodal" :styles="{ borderRadius: 0 }">
+      <p style="text-align: center;font-size:medium ;margin-bottom: 20px;">
+        {{ errorInfo }}
+      </p>
+      <p style="text-align: center;">
+        <Button type="error" style="border-radius: 0px;font-size: 19px;" @click="cloaseErrorMessage()">{{
+            $t("button.close")
+        }}</Button>
+      </p>
+    </Modal>
+
   </div>
 
 
@@ -338,11 +349,11 @@ export default {
         deleting: false,
         showDownloadText: false,
         copyTip: false,
+        showError: false,
       },
       toTopState: false,
       showMenuState: false,
-
-
+      errorInfo: '',
     }
   },
   created() {
@@ -384,7 +395,9 @@ export default {
       this.bindToTopEvent();
 
     } else {
-      alert("Unconnected.");
+      this.errorInfo = this.$t('error.100001');
+      this.model.showError = true;
+      return false;
     }
 
   },
@@ -469,6 +482,10 @@ export default {
     createNote() {
       window.open("/");
     },
+    cloaseErrorMessage() {
+      this.errorInfo = '';
+      this.model.showError = false;
+    },
     showShareModel() {
       this.model.showShare = true;
       let qrimg = document.getElementById("qrImg");