X-Git-Url: https://git.opendaylight.org/gerrit/gitweb?p=controller.git;a=blobdiff_plain;f=opendaylight%2Fweb%2Froot%2Fsrc%2Fmain%2Fresources%2Fjs%2Flib.js;h=00eacdfce6b9eba6fed4b472a95f4a265748877b;hp=81188571644552e6159aeca5b4cec813d0eda1bd;hb=9cec08e30cb7d7da40d6bb716623c92c1db41f54;hpb=3591b13ae3e6f237db9e4b63cb3b07e020f576ca

diff --git a/opendaylight/web/root/src/main/resources/js/lib.js b/opendaylight/web/root/src/main/resources/js/lib.js
index 8118857164..00eacdfce6 100644
--- a/opendaylight/web/root/src/main/resources/js/lib.js
+++ b/opendaylight/web/root/src/main/resources/js/lib.js
@@ -26,6 +26,17 @@ one.lib.dashlet = {
         $h4.text(header);
         return $h4;
     },
+    label : function(name, type) {
+        var $span = $(document.createElement('span'));
+        $span.addClass('label');
+        if (type !== undefined) {
+            $span.addClass(type);
+        } else if (type !== null) {
+            $span.addClass('label-info');
+        }
+        $span.append(name);
+        return $span;
+    },
     list : function(list) {
         var $ul = $(document.createElement('ul'));
         $(list).each(function(index, value) {
@@ -67,6 +78,68 @@ one.lib.dashlet = {
             return $buttonGroup;
         }
     },
+    datagrid: {
+        /*
+         * The init function returns HTML markup for the datagrid per the options provided. Each consumer 
+         * of the datagrid must first call init and then provide the datasource for the grid.   
+         * id: this is the id of the table
+         * options: {
+         * searchable: true/false,
+         * pagination: turned off for now,
+         * flexibleRowsPerPage: turned off
+         * }
+         * classes : String containing bootstrap related classes. For ex: "table-striped table-condensed"
+         * The classes "table", "table-bordered" and "datagrid" will be added by default
+         */
+        init: function(id, options, classes) {
+            var $fuelGridContainerDiv = $(document.createElement("div"));
+            $fuelGridContainerDiv.addClass("fuelux");
+            $table = $(document.createElement("table"));
+            $table.attr("id", id);
+            $table.addClass("table table-bordered datagrid");
+            $table.addClass(classes);
+            // create datagrid header
+            $thead = $(document.createElement("thead"));
+            $headertr = $(document.createElement("tr"));
+            $headerth = $(document.createElement("th"));
+            // create datagrid footer
+            $tfoot = $(document.createElement("tfoot"));
+            $footertr = $(document.createElement("tr"));
+            $footerth = $(document.createElement("th"));
+            if(options.searchable == true) {
+                $headerth.append(one.lib.dashlet.datagrid._searchable());
+            }
+            if(options.flexibleRowsPerPage == true) {
+                $footerth.append(one.lib.dashlet.datagrid._rowsPerPage(options.popout));
+            }
+            if(options.pagination == true) {
+                $footerth.append(one.lib.dashlet.datagrid._pagination());
+            }
+            $headertr.append($headerth);
+            $thead.append($headertr);
+            $footertr.append($footerth);
+            $tfoot.append($footertr);
+            $table.append($thead).append($tfoot);
+            $fuelGridContainerDiv.append($table);
+            return $fuelGridContainerDiv;
+        },
+        _searchable: function() {
+            var searchHTML = "<div class='datagrid-header-left'><div class='input-append search datagrid-search'> <input type='text' class='input-medium' placeholder='Search'><button type='button' class='btn'><i class='icon-search'></i></button></div></div>";
+            return searchHTML;
+        },
+        _pagination: function() {
+            var html = '<div class="datagrid-footer-right" style="display:none;"><div class="grid-pager"><button type="button" class="btn grid-prevpage"><i class="icon-chevron-left"></i></button><span>Page</span> <div style="display:inline-block;"><input type="text" name="pagenumber" style="width:25px;margin-bottom:-10px;vertical-align:middle;margin-right:5px;"></div><span>of <span class="grid-pages"></span></span><button type="button" class="btn grid-nextpage"><i class="icon-chevron-right"></i></button></div></div>';
+            return html;
+        },
+        _rowsPerPage: function(popout) {
+            if(popout) {
+                var html = '<div class="datagrid-footer-left" style="display:none;"><div class="grid-controls"><span><span class="grid-start"></span>-<span class="grid-end"></span> of <span class="grid-count"></span></span><div class="select grid-pagesize" data-resize="auto" style="visibility:hidden;"><button type="button" data-toggle="dropdown" class="btn dropdown-toggle"><span class="dropdown-label"></span><span class="caret"></span></button><ul class="dropdown-menu"><li data-value="10" data-selected="true"><a href="#">5</a></li><li data-value="10"><a href="#">10</a></li><li data-value="20"><a href="#">20</a></li><li data-value="50"><a href="#">50</a></li><li data-value="100"><a href="#">100</a></li></ul></div><span style="display:none;">Per Page</span></div></div>';
+            } else {
+                var html = '<div class="datagrid-footer-left" style="display:none;"><div class="grid-controls"><span><span class="grid-start"></span>-<span class="grid-end"></span> of <span class="grid-count"></span></span><div class="select grid-pagesize" data-resize="auto" style="visibility:hidden;"><button type="button" data-toggle="dropdown" class="btn dropdown-toggle"><span class="dropdown-label"></span><span class="caret"></span></button><ul class="dropdown-menu"><li data-value="5" data-selected="true"><a href="#">5</a></li><li data-value="10"><a href="#">10</a></li><li data-value="20"><a href="#">20</a></li><li data-value="50"><a href="#">50</a></li><li data-value="100"><a href="#">100</a></li></ul></div><span style="display:none;">Per Page</span></div></div>';
+            }
+            return html;
+        }
+    },
     table : {
         table : function(classes, id) {
             var $table = $(document.createElement('table'));
@@ -95,9 +168,9 @@ one.lib.dashlet = {
             if (body.length == 0 && !(typeof thead === 'undefined')) {
                 var $tr = $(document.createElement('tr'));
                 var $td = $(document.createElement('td'));
-                $td.attr("colspan", thead.length);
-                $td.text("No data available");
-                $td.addClass("empty");
+                $td.attr('colspan', thead.length);
+                $td.text('No data available');
+                $td.addClass('empty');
                 $tr.append($td);
                 $tbody.append($tr);
                 return $tbody;
@@ -105,21 +178,25 @@ one.lib.dashlet = {
             // else, populate as usual
             $(body).each(function(index, value) {
                 var $tr = $(document.createElement('tr'));
-                // data-id
-                if (value['id'] != undefined) {
-                    $tr.attr('data-id', value['id']);
-                }
-                // add classes
-                $(value["type"]).each(function(index, value) {
-                    $tr.addClass(value);
-                });
-                // add entries
-                $(value["entry"]).each(function(index, value) {
-                    var $td = $(document.createElement('td'));
-                    $td.append(value);
-                    $tr.append($td);
+                $.each(value, function(key, value) {
+                    if (key == 'type') {
+                        // add classes
+                        $(value).each(function(index, value) {
+                            $tr.addClass(value);
+                        });
+                    } else if (key == 'entry') {
+                        // add entries
+                        $(value).each(function(index, value) {
+                            var $td = $(document.createElement('td'));
+                            $td.append(value);
+                            $tr.append($td);
+                        });
+                    } else {
+                        // data field
+                        $tr.attr('data-' + key, value);
+                    }
+                    $tbody.append($tr);
                 });
-                $tbody.append($tr);
             });
             return $tbody;
         }
@@ -149,7 +226,10 @@ one.lib.modal = {
         return $clone;
     },
     // populate modal
-    populate : function($modal, header, $body, footer) {
+    populate : function($modal, header, $body, footer, ajax) {
+      if (ajax === undefined && ajax !== false) {
+        $.getJSON('/web.json'); // session check per modal
+      }
         var $h3 = $modal.find("h3");
         $h3.text(header);
 
@@ -164,6 +244,9 @@ one.lib.modal = {
     spawn : function(id, header, $body, footer) {
         var $modal = one.lib.modal.clone(id);
         one.lib.modal.populate($modal, header, $body, footer);
+        $modal.on('hide', function () {
+            $('.modal-body').scrollTop(0);
+        });
         return $modal;
     },
     // empty modal
@@ -185,7 +268,7 @@ one.lib.modal = {
 one.lib.form = {
     // create select-option form element
     select : {
-        create : function(options, multiple) {
+        create : function(options, multiple, sort) {
             // assert - auto assign
             if (options == undefined)
                 options = {};
@@ -195,6 +278,24 @@ one.lib.form = {
                 $select.attr("multiple", "multiple");
             }
             var optionArray = one.lib.form.select.options(options);
+
+            // If specified, sort the option elements based on their text field
+            if (sort == true && optionArray.length > 1) {
+                var shifted = true;
+                var limit = optionArray.length;
+                while (shifted) {
+                    shifted = false;
+                    for ( var i = 1; i < limit; i++) {
+                        if (optionArray[i - 1].text() > optionArray[i].text()) {
+                            var swap = optionArray[i - 1];
+                            optionArray[i - 1] = optionArray[i];
+                            optionArray[i] = swap;
+                            shifted = true;
+                        }
+                    }
+                }
+            }
+
             $(optionArray).each(function(index, value) {
                 $select.append(value);
             });
@@ -270,6 +371,18 @@ one.lib.nav = {
     }
 }
 
+one.lib.helper = {
+    parseInt : function(value) {
+        return (value !== null && value !== '') ?
+            parseInt(value) : ''
+    },
+    parseFloat : function(value) {
+        return (value !== null && value !== '') ?
+            parseFloat(value) : ''
+    }
+}
+
+
 /** ALERT */
 one.lib.alert = function(alert) {
     $("#alert p").text(alert);
@@ -279,4 +392,4 @@ one.lib.alert = function(alert) {
     one.lib.registry.alert = setTimeout(function() {
         $("#alert").slideUp();
     }, 8000);
-}
\ No newline at end of file
+}