X-Git-Url: https://git.opendaylight.org/gerrit/gitweb?p=controller.git;a=blobdiff_plain;f=opendaylight%2Fweb%2Froot%2Fsrc%2Fmain%2Fresources%2Fjs%2Ffuelux%2Fselect.js;fp=opendaylight%2Fweb%2Froot%2Fsrc%2Fmain%2Fresources%2Fjs%2Ffuelux%2Fselect.js;h=38e6a60f2deed90803014b89ac699feea0a1d92a;hp=0000000000000000000000000000000000000000;hb=a98556048975c29541849689396e58c813b7558e;hpb=abe7cd0f3412d447cf054e618ce1c7c7fa096745

diff --git a/opendaylight/web/root/src/main/resources/js/fuelux/select.js b/opendaylight/web/root/src/main/resources/js/fuelux/select.js
new file mode 100755
index 0000000000..38e6a60f2d
--- /dev/null
+++ b/opendaylight/web/root/src/main/resources/js/fuelux/select.js
@@ -0,0 +1,169 @@
+/*
+ * Fuel UX Select
+ * https://github.com/ExactTarget/fuelux
+ *
+ * Copyright (c) 2012 ExactTarget
+ * Licensed under the MIT license.
+ */
+
+define(['require','jquery','./util'],function(require) {
+
+    var $ = require('jquery');
+	require('./util');
+
+    // SELECT CONSTRUCTOR AND PROTOTYPE
+
+    var Select = function (element, options) {
+        this.$element = $(element);
+        this.options = $.extend({}, $.fn.select.defaults, options);
+        this.$element.on('click', 'a', $.proxy(this.itemclicked, this));
+        this.$button = this.$element.find('.btn');
+        this.$label = this.$element.find('.dropdown-label');
+        this.setDefaultSelection();
+
+        if (options.resize === 'auto') {
+            this.resize();
+        }
+    };
+
+    Select.prototype = {
+
+        constructor: Select,
+
+        itemclicked: function (e) {
+            this.$selectedItem = $(e.target).parent();
+            this.$label.text(this.$selectedItem.text());
+
+            // pass object including text and any data-attributes
+            // to onchange event
+            var data = this.selectedItem();
+
+            // trigger changed event
+            this.$element.trigger('changed', data);
+
+            e.preventDefault();
+        },
+
+        resize: function() {
+            var el = $('#selectTextSize')[0];
+
+            // create element if it doesn't exist
+            // used to calculate the length of the longest string
+            if(!el) {
+                $('<div/>').attr({id:'selectTextSize'}).appendTo('body');
+            }
+
+            var width = 0;
+            var newWidth = 0;
+
+            // iterate through each item to find longest string
+            this.$element.find('a').each(function () {
+                var $this = $(this);
+                var txt = $this.text();
+                var $txtSize = $('#selectTextSize');
+                $txtSize.text(txt);
+                newWidth = $txtSize.outerWidth();
+                if(newWidth > width) {
+                    width = newWidth;
+                }
+            });
+
+            this.$label.width(width);
+        },
+
+        selectedItem: function() {
+            var txt = this.$selectedItem.text();
+            return $.extend({ text: txt }, this.$selectedItem.data());
+        },
+
+        selectByText: function(text) {
+            var selector = 'li a:fuelTextExactCI(' + text + ')';
+            this.selectBySelector(selector);
+        },
+
+        selectByValue: function(value) {
+            var selector = 'li[data-value="' + value + '"]';
+            this.selectBySelector(selector);
+        },
+
+        selectByIndex: function(index) {
+            // zero-based index
+            var selector = 'li:eq(' + index + ')';
+            this.selectBySelector(selector);
+        },
+
+        selectBySelector: function(selector) {
+            var item = this.$element.find(selector);
+
+            this.$selectedItem = item;
+            this.$label.text(this.$selectedItem.text());
+        },
+
+        setDefaultSelection: function() {
+            var selector = 'li[data-selected=true]:first';
+            var item = this.$element.find(selector);
+            if(item.length === 0) {
+                // select first item
+                this.selectByIndex(0);
+            }
+            else {
+                // select by data-attribute
+                this.selectBySelector(selector);
+                item.removeData('selected');
+                item.removeAttr('data-selected');
+            }
+        },
+
+        enable: function() {
+            this.$button.removeClass('disabled');
+        },
+
+        disable: function() {
+            this.$button.addClass('disabled');
+        }
+
+    };
+
+
+    // SELECT PLUGIN DEFINITION
+
+    $.fn.select = function (option,value) {
+        var methodReturn;
+
+        var $set = this.each(function () {
+            var $this = $(this);
+            var data = $this.data('select');
+            var options = typeof option === 'object' && option;
+
+            if (!data) $this.data('select', (data = new Select(this, options)));
+            if (typeof option === 'string') methodReturn = data[option](value);
+        });
+
+        return (methodReturn === undefined) ? $set : methodReturn;
+    };
+
+    $.fn.select.defaults = {};
+
+    $.fn.select.Constructor = Select;
+
+
+    // SELECT DATA-API
+
+    $(function () {
+
+        $(window).on('load', function () {
+            $('.select').each(function () {
+                var $this = $(this);
+                if ($this.data('select')) return;
+                $this.select($this.data());
+            });
+        });
+
+        $('body').on('mousedown.select.data-api', '.select', function (e) {
+            var $this = $(this);
+            if ($this.data('select')) return;
+            $this.select($this.data());
+        });
+    });
+
+});