inventarioSustancias/public_html/scripts/inventory.js

/*  Authors         :   Carlos C. Corrada-Bravo
                        David J. Ortiz-Rivera

    Organization    :   Centro de Desarrollo y Consultoria Computacional
    Project         :   OPASO Material Registry   
    File            :   inventory.js
    Description     :   Fetch lab inventory */

/* globals */ 
var editing,form_is_active,inventory,new_inventory,text;

/* get_inventory() - fetch lab inventory from server */ 
function get_inventory(){
    var laboratory = get_arg("lab");    /* get lab id from url */
    $.post("/scripts/opaso.php",{query: 4,laboratory: laboratory},function(data){
        console.log(data);
        try{    
            var response = JSON.parse(data);    /* parse response as json */ 
            switch(response["status"]){
                case "success":                 /* on success, generate table body */ 
                    /* update inventory header */ 
                    $(".header").text(response["laboratory"]);
                    /* extract inventory from response and generate table body */ 
                    inventory = response["inventory"];
                    var tbody = create_element("tbody","inventory-body");
                    var row_index = 1;
                    for(var row in inventory){
                        /* generate option buttons */ 
                        var edit = create_button("Edit","fas fa-pen","btn options","edit");
                        var copy = create_button("Copy","fas fa-copy","btn options","copy");
                        var remove = create_button("Remove","fas fa-minus-square","btn options","remove");
                        /* append buttons to cell */ 
                        var options = create_element("td","options-cell");
                        options.append(edit,copy,remove);
                        /* generate table row */
                        var index = create_element("td","index",row_index);
                        var tr = create_element("tr","inventory-row");
                        tr.setAttribute("id",row);
                        tr.append(options,index);
                        /* generate inventory columns */ 
                        for(var col in inventory[row]){
                            var cell = create_element("td","inventory-cell",inventory[row][col]);
                            cell.setAttribute("val",col);   /* identify cell field */
                            tr.append(cell);
                        }
                        tbody.append(tr);
                        row_index += 1;
                    }
                    $(".table").append(tbody);
                    break;
                case "error":                   /* on error, display message */ 
                    display_error(response["error"]);
                    break;
                default:                        /* undefined status */
                    display_error("Undefined status.");
                    break;

            }
            set_listeners();                    /* listen for cell/button clicks */
            loading_screen(false);              /* hide loading screen */
        }
        catch(error){
            console.log(error.message);
            display_error(error.message);
        }
    });
}
/* set_listeners() - set listeners for cell/button clicks */ 
function set_listeners(){
    /* set listener for option buttons */ 
    $(".options").click(function(){
        /* extract args */ 
        var option = $(this).attr("id");
        var row = $(this).parent().parent().attr("id"); /* row id */
        switch(option){
            case "edit":        /* edit inventory row (fallthrough) */
            case "copy":        /* copy inventory row */
                $(".form-header").text(option + " entry");
                set_form(row);  /* populate form */
                $(".submit").attr("id",option);
                $(".submit").attr("val",row);
                $(".close-form").attr("val",row);
                break;
            case "remove":       /* delete row form inventory */
                /* extract arg */ 
                var laboratory = get_arg("lab");
                $.post("/scripts/opaso.php",{query: 8,laboratory: laboratory,eid: row},function(data){  /* send row to be deleted */
                    // console.log(data);
                    try{    
                        var response = JSON.parse(data);    /* parse response as json */ 
                        switch(response["status"]){
                            case "success":                 /* on success, generate table body */ 
                                break;
                            case "error":                   /* on error, display message */ 
                                display_error(response["error"]);
                                break;
                            default:                        /* undefined status */
                                display_error("Undefined status.");
                                break;
                        }
                    }
                    catch(error){
                        display_error(error.message);
                    }
                });
                break;
            default:                        /* undefined option */
                display_error("Undefined option.");
                break;
        }
    });
    /* set listener for form submit button */
    $(".submit").click(function(){
        /* extract args */ 
        var option = $(this).attr("id");
        var row = $(this).attr("val"); /* row id */
        var laboratory = get_arg("lab");
        /* set query for option */
        var query = null;
        switch(option){
            case "edit":        /* edit row */
                query = 6;
                break;
            case "copy":        /* copy row */
                query = 7;
                break;
            default:        /* undefined option */ 
                display_error("Undefined option.");
                break;
        }
        /* get and validate form fields */ 
        var form = get_form(row);
        if(valid(form) && form_is_active){
            reset_form();   /* reset form */ 
            /* submit query for row */
            console.log(JSON.stringify(form));
            $.post("/scripts/opaso.php",{query: query,laboratory: laboratory,eid: row, fields: JSON.stringify(form)},function(data){
                console.log(data);
                /* parse response as json and display result of query */ 
                try{    
                    var response = JSON.parse(data);    /* parse response as json */ 
                    switch(response["status"]){
                        case "success":                 /* on success, generate table body */ 
                            break;
                        case "error":                   /* on error, display message */ 
                            display_error(response["error"]);
                            break;
                        default:                        /* undefined status */
                            display_error("Undefined status.");
                            break;
                    }
                }
                /* handle error */ 
                catch(error){
                    display_error(error.message);
                }
            });
        }
        /* non-valid form, display warning */ 
        else{
            $(".fields-required").show();
        }
    });
    /* set listener for form close buttons */
    $(".close-form").click(function(){
        reset_form();   /* reset form */
    });
    /* set listener for double clicks on cells */ 
    $(".inventory-cell").dblclick(function(){
        /* generate text area if user isn't editing */ 
        if(!editing){
            $(this).height($(this).height());   /* avoid cell from collapsing */ 
            $(this).css("padding","0px");       /* remove padding */
            /* generate textarea with text from clicked cell */
            text = $(this).text();
            var textarea = create_element("textarea","edit-text",text);
            textarea.style.width = $(this).width() + "px";
            textarea.style.height = $(this).height() + "px";
            /* insert text area into DOM */ 
            $(this).html(textarea);
            editing = true;     /* user is editing */ 
        }
    });
    /* set listener for clicks on body */ 
    $("body").click(function(element){
        /* extract class of clicked element */ 
        var target = $(element.target).attr("class");
        if(editing && target != "edit-text"){
            /* extract text from textarea and field and row id */ 
            var delta_text = $(".edit-text").val();
            var field = $(".edit-text").parent().val();
            var row = $(".edit-text").parent().parent().attr("id");
            /* reset styling and insert text to cell */ 
            $(".edit-text").parent().removeAttr("style");
            $(".edit-text").parent().html(delta_text);
            editing = false;    /* deactivate editing */
            /* submit row changes to inventory */
            if(text != delta_text){
                /* extract arg */
                var laboratory = get_arg("lab");
                /* send new field text */ 
                $.post("/scripts/opaso.php",{query: 5,laboratory: laboratory,eid: row,text: delta_text, field: field},function(data){
                    console.log(data);
                    try{    
                        var response = JSON.parse(data);    /* parse response as json */ 
                        switch(response["status"]){
                            case "success":                 /* on success, generate table body */ 
                                break;
                            case "error":                   /* on error, display message */ 
                                display_error(response["error"]);
                                break;
                            default:                        /* undefined status */
                                display_error("Undefined status.");
                                break;
                        }
                    }
                    catch(error){
                        display_error(error.message);
                    }
                });
            }
        }
        /* reset form on exit */
        else if(form_is_active && target == "form-window"){
            reset_form();   /* reset form */
        }
    });
    /* set listener for dropdown menu */ 
    $( ".navbar-wrapper" ).hover(function(){},   /* on hover in, do nothing */ 
        /* on hover out, hide dropdown menu */ 
        function(){
            /* check if menu is visible */ 
            if($(".dropdown-menu").is(':visible')){
                $(".dropdown-menu").removeClass("show");    /* hide menu */
            }
        }
    );
}
/* reset_form() - reset form and its styling */
function reset_form(){
    /* reset styling (label) */ 
    $(".required-field").each(function(){
        $(this).removeClass("required-field");
        $(this).text($(this).text().replace("*",""));
    });
    /* reset styling (input) */ 
    $(".empty-field").each(function(){
        $(this).removeClass("empty-field");
    });
    /* hide from */ 
    $(".form-window").hide();
    $(".fields-required").hide();
    form_is_active = false;   /* deactivate form */
}
/* valid(form: dictionary) - check for invalid form entries */
function valid(form){
    var valid = true;
    for(var field in form){
        /* highlight empty fields */ 
        if(!form[field]){
            /* if not currently highlighted */
            if($("[for=" + field + "]").attr("class") != "required-field"){
                /* highlight label */ 
                $("[for=" + field + "]").text($("[for=" + field + "]").text() + "*");
                $("[for=" + field + "]").addClass("required-field");
                /* highlight field */ 
                $("[name=" + field + "]").addClass("empty-field");
            }
            valid = false;
        }
        /* remove styling for non empty fields */ 
        else{
            /* if currently highlighted... */
            if($("[for=" + field + "]").attr("class") == "required-field"){
                /* reset styling for label */
                $("[for=" + field + "]").text($("[for=" + field + "]").text().replace("*",""));
                $("[for=" + field + "]").removeClass("required-field");
                /* reset styling for field */ 
                $("[name=" + field + "]").removeClass("empty-field");
            }
        }
    }
    return valid; 
}
/* get_form(row: string) - get form data */
function get_form(row){
    var form = {};
    for(var col in inventory[row]){
        form[col] = $("[name=" + col + "]").val();
    }
    return form;
}
/* set_form(row: string) - populate form using inventory data */
function set_form(row){
    /* fill form input by name */ 
    for(var col in inventory[row]){
        $("[name=" + col + "]").val(inventory[row][col]);
    }
    /* display form */ 
    $(".form-window").show();
    /* form is active */
    form_is_active = true;
}
/* Load navbar and footer into document and fetch inventory */ 
$(document).ready(function(){
    $(".navbar-wrapper").load("/navbar.html",function(){
        $(".footer-wrapper").load("/footer.html",function(){
            current();          /* highlight current navbar link */
            get_inventory();    /* fetch inventory from server */
        });
    });
});