Tag and name validation to only alphanumeric characters and tags can only be 1 word

Author: agavgavi

static/js/admin.js

@@ -16,11 +16,11 @@ let init = (app) => {
         all_tags: [],
         add_tag_text: "",
         length_check: false,
+        tag_wrong: false,
         user_email : user_email,
 
     };
 
-
     app.reindex = (a) => {
         let idx = 0;
         for (p of a) {
@@ -120,6 +120,13 @@ let init = (app) => {
 
     };
 
+
+    app.sleep = (ms) => {
+            return function (x) {
+                return new Promise(resolve => setTimeout(() => resolve(x), ms));
+            };
+        };
+
     app.saveTag = (tag_index) => {
 
         let tag = app.data.all_tags[tag_index];
@@ -143,10 +150,20 @@ let init = (app) => {
     app.addTag = () => {
 
         let val = app.data.add_tag_text;
+
         if(val.trim().length === 0) {
             app.data.length_check = true;
             return;
         }
+
+         if(sluggo.checkTagsString(val) == false) {
+                app.data.tag_wrong = true;
+                app.sleep(3000)()
+                    .then(() => {
+                        app.data.tag_wrong = false;
+                    });
+                return;
+            }
         app.data.length_check = false;
 
         app.data.text_check = false;

static/js/creation.js

@@ -16,6 +16,7 @@ let init = (app) => {
         options: tags,
         bio_empty: false,
         tag_empty: false,
+        tag_wrong: false,
         admin: admin === "True" ? true : false,
 
         // Complete.
@@ -29,6 +30,13 @@ let init = (app) => {
         }
 
         if(app.data.bio_text.trim().length !== 0) {
+
+
+            if(sluggo.checkTagsList(app.data.selected) == false) {
+                app.data.tag_wrong = true;
+                return;
+            }
+
             axios.post(add_user_url, {
                 bio: app.data.bio_text,
                 tags: app.data.selected

static/js/sluggo.js

@@ -16,12 +16,71 @@ sluggo.capitalizeString = (str) => {
 sluggo.isOverdue = (dueDate) => {
     // get current date
     let currDateTime = new Date(new Date().toDateString());
-    // round due date 
+    // round due date
     let fixedDueDate = new Date(new Date(dueDate).getTime() + (new Date()).getTimezoneOffset()*60*1000)
 
     let difference = currDateTime.getTime() - fixedDueDate.getTime();
-    
+
     console.log(difference);
 
     return (difference > 0);
 }
+
+
+sluggo.checkTagsList = (tag_list) => {
+
+    if(tag_list.length === 0) {
+        return true;
+    }
+
+    let patt = /^[\w]+$/;
+
+    let matches = tag_list.filter((e) => e.match(patt));
+
+
+    if(matches.length < tag_list.length) {
+        return false;
+    }
+
+    return true;
+};
+
+
+sluggo.checkTagsString = (tag) => {
+
+    if(tag.length === 0) {
+        return true;
+    }
+
+    let patt = /^[\w]+$/;
+
+    let matches = patt.test(tag);
+
+
+    if(!matches) {
+        return false;
+    }
+
+    return true;
+};
+
+
+
+
+sluggo.checkNameString = (name) => {
+
+    if(name.length === 0) {
+        return true;
+    }
+
+    let patt = /^[\w ]+$/;
+
+    let matches = patt.test(name);
+
+
+    if(!matches) {
+        return false;
+    }
+
+    return true;
+};

static/js/specific-user.js

@@ -19,6 +19,8 @@ let init = (app) => {
         is_pending: false,
         error: false,
         success: false,
+        tag_wrong: false,
+        name_wrong: false,
         id: id,
         selected: "",
         isAdmin: admin == "True",
@@ -52,6 +54,8 @@ let init = (app) => {
     };
 
 
+
+
     app.updateCurrent = () => {
         let user = app.data.current_user;
 
@@ -63,6 +67,20 @@ let init = (app) => {
                 return;
             }
 
+            if(sluggo.checkTagsList(user.tags_list) == false) {
+                app.data.tag_wrong = true;
+                app.show_value(0);
+                return;
+            }
+
+            if(sluggo.checkNameString(user.full_name) == false) {
+                app.data.name_wrong = true;
+                app.show_value(0);
+                return;
+            }
+
+            app.data.tag_wrong = false;
+            app.data.name_wrong = false;
 
             axios.post(edit_user_url, { bio : user.bio,
                                         role : app.data.selected,

templates/admin.html

@@ -160,6 +160,7 @@
                 </div>
               </div>
               <p v-if="length_check" class="has-text-danger">Tag cannot be blank </p>
+              <p v-if="tag_wrong" class="has-text-danger">Tags must be one word and alphanumeric.</p>
             </div>
           </div>
 

templates/create_profile.html

@@ -32,6 +32,7 @@
                             </template>
                         </v-select>
                         <p v-if="tag_empty" class="has-text-danger">Please create at least one tag</p>
+                        <p v-if="tag_wrong" class="has-text-danger">Tags must be one word and alphanumeric.</p>
                     </div>
                     <div class="field">
                         <span class="subtitle">Bio</span>

templates/specific_user.html

@@ -22,6 +22,7 @@
           <div class="control">
             <input v-if="checkUser()" v-model="current_user.full_name" class="input is-hovered" type="text">
             <input v-else disabled v-model="current_user.full_name" class="input is-hovered" type="text">
+            <p v-if="name_wrong" class="has-text-danger">No special characters allowed</p>
           </div>
         </div>
 
@@ -32,6 +33,7 @@
           <v-select v-if="checkUnapproved()" multiple v-model="current_user.tags_list" :options="options"> </v-select>
           <v-select v-else-if="checkUser() || checkAdmin()" taggable multiple push-tags v-model="current_user.tags_list" :options="options"> </v-select>
           <v-select v-else disabled multiple v-model="current_user.tags_list"> </v-select>
+          <p v-if="tag_wrong" class="has-text-danger">Tags must be one word and alphanumeric.</p>
         </div>
 
         <!-- Role Field -->