diff options
Diffstat (limited to 'priv/static/js/metricsgraphics/layout')
-rwxr-xr-x | priv/static/js/metricsgraphics/layout/bootstrap_dropdown.js | 177 | ||||
-rw-r--r-- | priv/static/js/metricsgraphics/layout/button.js | 126 |
2 files changed, 303 insertions, 0 deletions
diff --git a/priv/static/js/metricsgraphics/layout/bootstrap_dropdown.js b/priv/static/js/metricsgraphics/layout/bootstrap_dropdown.js new file mode 100755 index 0000000..41dbfc5 --- /dev/null +++ b/priv/static/js/metricsgraphics/layout/bootstrap_dropdown.js @@ -0,0 +1,177 @@ +if (mg_jquery_exists()) { + /*! + * Bootstrap v3.3.1 (http://getbootstrap.com) + * Copyright 2011-2014 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + + /*! + * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=c3834cc5b59ef727da53) + * Config saved to config.json and https://gist.github.com/c3834cc5b59ef727da53 + */ + + /* ======================================================================== + * Bootstrap: dropdown.js v3.3.1 + * http://getbootstrap.com/javascript/#dropdowns + * ======================================================================== + * Copyright 2011-2014 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * ======================================================================== */ + + + +function ($) { + 'use strict'; + + if(typeof $().dropdown == 'function') + return true; + + // DROPDOWN CLASS DEFINITION + // ========================= + + var backdrop = '.dropdown-backdrop'; + var toggle = '[data-toggle="dropdown"]'; + var Dropdown = function (element) { + $(element).on('click.bs.dropdown', this.toggle); + }; + + Dropdown.VERSION = '3.3.1'; + + Dropdown.prototype.toggle = function (e) { + var $this = $(this); + + if ($this.is('.disabled, :disabled')) return; + + var $parent = getParent($this); + var isActive = $parent.hasClass('open'); + + clearMenus(); + + if (!isActive) { + if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) { + // if mobile we use a backdrop because click events don't delegate + $('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus); + } + + var relatedTarget = { relatedTarget: this }; + $parent.trigger(e = $.Event('show.bs.dropdown', relatedTarget)); + + if (e.isDefaultPrevented()) return; + + $this + .trigger('focus') + .attr('aria-expanded', 'true'); + + $parent + .toggleClass('open') + .trigger('shown.bs.dropdown', relatedTarget); + } + + return false; + }; + + Dropdown.prototype.keydown = function (e) { + if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return; + + var $this = $(this); + + e.preventDefault(); + e.stopPropagation(); + + if ($this.is('.disabled, :disabled')) return; + + var $parent = getParent($this); + var isActive = $parent.hasClass('open'); + + if ((!isActive && e.which != 27) || (isActive && e.which == 27)) { + if (e.which == 27) $parent.find(toggle).trigger('focus'); + return $this.trigger('click'); + } + + var desc = ' li:not(.divider):visible a'; + var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc); + + if (!$items.length) return; + + var index = $items.index(e.target); + + if (e.which == 38 && index > 0) index--; // up + if (e.which == 40 && index < $items.length - 1) index++; // down + if (!~index) index = 0; + + $items.eq(index).trigger('focus'); + }; + + function clearMenus(e) { + if (e && e.which === 3) return; + $(backdrop).remove(); + $(toggle).each(function () { + var $this = $(this); + var $parent = getParent($this); + var relatedTarget = { relatedTarget: this }; + + if (!$parent.hasClass('open')) return; + + $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget)); + + if (e.isDefaultPrevented()) return; + + $this.attr('aria-expanded', 'false'); + $parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget); + }); + } + + function getParent($this) { + var selector = $this.attr('data-target'); + + if (!selector) { + selector = $this.attr('href'); + selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, ''); // strip for ie7 + } + + var $parent = selector && $(selector); + + return $parent && $parent.length ? $parent : $this.parent(); + } + + + // DROPDOWN PLUGIN DEFINITION + // ========================== + + function Plugin(option) { + return this.each(function () { + var $this = $(this); + var data = $this.data('bs.dropdown'); + + if (!data) $this.data('bs.dropdown', (data = new Dropdown(this))); + if (typeof option == 'string') data[option].call($this); + }); + } + + var old = $.fn.dropdown; + + $.fn.dropdown = Plugin; + $.fn.dropdown.Constructor = Dropdown; + + + // DROPDOWN NO CONFLICT + // ==================== + + $.fn.dropdown.noConflict = function () { + $.fn.dropdown = old; + return this; + }; + + + // APPLY TO STANDARD DROPDOWN ELEMENTS + // =================================== + + $(document) + .on('click.bs.dropdown.data-api', clearMenus) + .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation(); }) + .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle) + .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown) + .on('keydown.bs.dropdown.data-api', '[role="menu"]', Dropdown.prototype.keydown) + .on('keydown.bs.dropdown.data-api', '[role="listbox"]', Dropdown.prototype.keydown); + + }(jQuery); +} diff --git a/priv/static/js/metricsgraphics/layout/button.js b/priv/static/js/metricsgraphics/layout/button.js new file mode 100644 index 0000000..b122273 --- /dev/null +++ b/priv/static/js/metricsgraphics/layout/button.js @@ -0,0 +1,126 @@ +MG.button_layout = function(target) { + 'use strict'; + this.target = target; + this.feature_set = {}; + this.public_name = {}; + this.sorters = {}; + this.manual = []; + this.manual_map = {}; + this.manual_callback = {}; + + this._strip_punctuation = function(s) { + var punctuationless = s.replace(/[^a-zA-Z0-9 _]+/g, ''); + var finalString = punctuationless.replace(/ +?/g, ''); + return finalString; + }; + + this.data = function(data) { + this._data = data; + return this; + }; + + this.manual_button = function(feature, feature_set, callback) { + this.feature_set[feature] = feature_set; + this.manual_map[this._strip_punctuation(feature)] = feature; + this.manual_callback[feature] = callback; // the default is going to be the first feature. + return this; + }; + + this.button = function(feature) { + if (arguments.length > 1) { + this.public_name[feature] = arguments[1]; + } + + if (arguments.length > 2) { + this.sorters[feature] = arguments[2]; + } + + this.feature_set[feature] = []; + return this; + }; + + this.callback = function(callback) { + this._callback = callback; + return this; + }; + + this.display = function() { + var callback = this._callback; + var manual_callback = this.manual_callback; + var manual_map = this.manual_map; + + var d, f, features, feat; + features = Object.keys(this.feature_set); + + var mapDtoF = function(f) { + return d[f]; }; + + var i; + + // build out this.feature_set with this.data + for (i = 0; i < this._data.length; i++) { + d = this._data[i]; + f = features.map(mapDtoF); + for (var j = 0; j < features.length; j++) { + feat = features[j]; + if (this.feature_set[feat].indexOf(f[j]) === -1) { + this.feature_set[feat].push(f[j]); + } + } + } + + for (feat in this.feature_set) { + if (this.sorters.hasOwnProperty(feat)) { + this.feature_set[feat].sort(this.sorters[feat]); + } + } + + $(this.target).empty(); + + $(this.target).append("<div class='col-lg-12 segments text-center'></div>"); + + var dropdownLiAClick = function() { + var k = $(this).data('key'); + var feature = $(this).data('feature'); + var manual_feature; + $('.' + feature + '-btns button.btn span.title').html(k); + if (!manual_map.hasOwnProperty(feature)) { + callback(feature, k); + } else { + manual_feature = manual_map[feature]; + manual_callback[manual_feature](k); + } + + return false; + }; + + for (var feature in this.feature_set) { + features = this.feature_set[feature]; + $(this.target + ' div.segments').append( + '<div class="btn-group ' + this._strip_punctuation(feature) + '-btns text-left">' + // This never changes. + '<button type="button" class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown">' + + "<span class='which-button'>" + (this.public_name.hasOwnProperty(feature) ? this.public_name[feature] : feature) + "</span>" + + "<span class='title'>" + (this.manual_callback.hasOwnProperty(feature) ? this.feature_set[feature][0] : 'all') + "</span>" + // if a manual button, don't default to all in label. + '<span class="caret"></span>' + + '</button>' + + '<ul class="dropdown-menu" role="menu">' + + (!this.manual_callback.hasOwnProperty(feature) ? '<li><a href="#" data-feature="' + feature + '" data-key="all">All</a></li>' : "") + + (!this.manual_callback.hasOwnProperty(feature) ? '<li class="divider"></li>' : "") + + '</ul>' + '</div>'); + + for (i = 0; i < features.length; i++) { + if (features[i] !== 'all' && features[i] !== undefined) { // strange bug with undefined being added to manual buttons. + $(this.target + ' div.' + this._strip_punctuation(feature) + '-btns ul.dropdown-menu').append( + '<li><a href="#" data-feature="' + this._strip_punctuation(feature) + '" data-key="' + features[i] + '">' + features[i] + '</a></li>' + ); + } + } + + $('.' + this._strip_punctuation(feature) + '-btns .dropdown-menu li a').on('click', dropdownLiAClick); + } + + return this; + }; + + return this; +}; |