Upload files to 'public_html/scripts'

public_html/scripts/login.js

@@ -0,0 +1,161 @@
+/*  Authors         :   Carlos C. Corrada-Bravo
+                        David J. Ortiz-Rivera
+
+    Organization    :   Centro de Desarrollo y Consultoria Computacional
+    Project         :   OPASO Material Registry   
+    File            :   login.js
+    Description     :   Validate and submit login info */
+
+/* global variables */
+var status,message;
+
+/* set listeners when document is ready */ 
+$(document).ready(function(){
+
+    /* check for errors */
+    error_handler();
+
+    /* animate form on hover */
+    $(".login-field").hover(function(){
+        /* extract arg */
+        let id = $(this).attr("id");
+        hover_input(id,true);
+    },function(){
+        /* extract arg */
+        let text = $(this).val();
+
+        /* remove  */
+        if(!is_valid(text)){
+            let id = $(this).attr("id");
+            hover_input(id,false);
+        }
+    });
+
+    /* animate form on input */
+    $(".login-field").on("input",function(){
+        /* extract args */
+        let text = $(this).val();
+        let id = $(this).attr("id");
+
+        /* remove */
+        if(!is_valid(text)){
+            hover_input(id);
+        }
+
+        else{
+            hover_input(id,true);    
+        }
+    });
+
+    /* submit login */
+    $(".submit-login").click(log_in);
+    
+    /* show/hide password */
+    $(".view-password").click(function(){
+        /* extract args */
+        let id = `#${$(this).attr("value")}`;
+        let type = $(id).attr("type");
+
+        /* hide password */
+        if(type === "text"){
+            $(id).attr("type","password");
+        }
+
+        /* show password */
+        else{
+            $(id).attr("type","text");
+        }
+
+        $(this).toggleClass("fa-eye");
+        $(this).toggleClass("fa-eye-slash");
+    });
+});
+
+/* hover_input(id: string) - animate field placeholder */
+function hover_input(id,flag){
+    /* generate selectors */
+    let field = `#${id}`;
+    let placeholder = `.${id}`;
+    let circle = `.${id}-circle`;
+    $(field).toggleClass("shrink",flag);
+    $(placeholder).toggleClass("slide",flag);
+    $(circle).toggleClass("hide",flag);
+}
+
+/* log_in() - validate and submit credentials */ 
+function log_in(){
+    /* extract args */
+    let email = $("#email").val();
+    let password = $("#password").val();
+
+    /* validate credentials */
+    if(is_valid(email) && is_valid(password)){
+        $(".invalid").removeClass("invalid");
+        $(".invalid-icon").removeClass("invalid-icon");
+
+        $.post("/scripts/opaso",{query:1,email:email,password:password},function(data){
+            // console.log(data);
+            /* extract response */
+            let response = JSON.parse(data);
+            let status = response["status"];
+
+            /* handle by status */
+            switch(status){
+                case "success":                 /* on success, redirect */
+                    window.location.href = "/menu";
+                    break;
+               
+                default:                        /* on failure/error, display message */
+                    set_alert(status,response["message"]);
+                    break;
+            }
+        });
+    }
+
+    /* invalid login info */ 
+    else{
+        $(".login-field").each(function(){
+            /* extract id */
+            var id = $(this).attr("id");
+            var selector = `.${id}-circle`;
+
+            /* highlight invalid field */
+            if(!$(this).val()){
+                $(this).parent().addClass("invalid");
+                $(selector).addClass("invalid-icon");
+            }
+            /* unhighighlight valid field */
+            else{
+                $(this).parent().removeClass("invalid");
+                $(selector).removeClass("invalid-icon");
+            }
+        });
+
+        /* display alert */
+        status = "warning";
+        message = "All fields required";
+        set_alert(status,message);
+    }
+}
+
+/*  error_handler() - handle token errors */
+function error_handler(){
+    /* extract error */
+    let error = get_arg("error");
+    if(error){
+        switch(error){
+            case "login_failed":
+                set_alert("error","Login failed");
+                break;
+            case "token_expired":
+                set_alert("error","Invalid token");
+                break;
+            case "session_expired":
+                set_alert("error","Session expired");
+                break;
+            default:
+                set_alert("error","Some error occurred");
+                break;
+        }
+    }
+}