webui-popover-rails 1.2.18

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: cde44a82d2439978213086c0e48b6d6fe4e12452
+  data.tar.gz: b0db2b1e43abc028fba98427e0e0a5c872f1331e
+SHA512:
+  metadata.gz: da73c9bfd2650ff37b8890ad369b70d793cb2fa7714231b547484692f9a162b35991ab563f21f99847354108e0285d96eae294ed7ef98747935302f516bf2e5f
+  data.tar.gz: 2cb9be579b5cb3ef0410d31df7a830940db3e6183055a22b024f8ed65ce73c84a32bf072dea89f916688ff305de8146ec53ef2912d1dc8a7bcceaffc2fa06008

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,74 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, gender identity and expression, level of experience,
+nationality, personal appearance, race, religion, or sexual identity and
+orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at Michael.Grubb@acxiom.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at [http://contributor-covenant.org/version/1/4][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/4/

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2018 Michael Grubb
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,59 @@
+# Webui::Popover::Rails
+
+This gem is a wrapper for [https://github.com/sandywalker/webui-popover](https://github.com/sandywalker/webui-popover)
+
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'webui-popover-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install webui-popover-rails
+
+
+## Usage
+
+Add the following to your `app/assets/application.css`:
+
+``` css
+*= require webui-popover
+```
+
+Or if you have `app/assets/application.scss`:
+
+``` scss
+@import "webui-popover";
+```
+
+Also add the following to your `app/assets/javascripts/application.js`:
+
+``` javascript
+//= require webui-popover
+```
+
+## Development
+
+After checking out the repo, run `bin/setup` to install dependencies. 
+
+To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/mgrubb/webui-popover-rails. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
+## Code of Conduct
+
+Everyone interacting in the Webui::Popover::Rails project’s codebases, issue trackers, chat rooms and mailing lists is expected to follow the [code of conduct](https://github.com/mgrubb/webui-popover-rails/blob/master/CODE_OF_CONDUCT.md).

data/app/assets/javascript/webui-popover.js

@@ -0,0 +1,1225 @@
+/*
+ *  webui popover plugin  - v1.2.17
+ *  A lightWeight popover plugin with jquery ,enchance the  popover plugin of bootstrap with some awesome new features. It works well with bootstrap ,but bootstrap is not necessary!
+ *  https://github.com/sandywalker/webui-popover
+ *
+ *  Made by Sandy Duan
+ *  Under MIT License
+ */
+(function(window, document, undefined) {
+    'use strict';
+    (function(factory) {
+        if (typeof define === 'function' && define.amd) {
+            // Register as an anonymous AMD module.
+            define(['jquery'], factory);
+        } else if (typeof exports === 'object') {
+            // Node/CommonJS
+            module.exports = factory(require('jquery'));
+        } else {
+            // Browser globals
+            factory(window.jQuery);
+        }
+    }(function($) {
+        // Create the defaults once
+        var pluginName = 'webuiPopover';
+        var pluginClass = 'webui-popover';
+        var pluginType = 'webui.popover';
+        var defaults = {
+            placement: 'auto',
+            container: null,
+            width: 'auto',
+            height: 'auto',
+            trigger: 'click', //hover,click,sticky,manual
+            style: '',
+            selector: false, // jQuery selector, if a selector is provided, popover objects will be delegated to the specified. 
+            delay: {
+                show: null,
+                hide: 300
+            },
+            async: {
+                type: 'GET',
+                before: null, //function(that, xhr, settings){}
+                success: null, //function(that, xhr){}
+                error: null //function(that, xhr, data){}
+            },
+            cache: true,
+            multi: false,
+            arrow: true,
+            title: '',
+            content: '',
+            closeable: false,
+            padding: true,
+            url: '',
+            type: 'html',
+            direction: '', // ltr,rtl
+            animation: null,
+            template: '<div class="webui-popover">' +
+                '<div class="webui-arrow"></div>' +
+                '<div class="webui-popover-inner">' +
+                '<a href="#" class="close"></a>' +
+                '<h3 class="webui-popover-title"></h3>' +
+                '<div class="webui-popover-content"><i class="icon-refresh"></i> <p>&nbsp;</p></div>' +
+                '</div>' +
+                '</div>',
+            backdrop: false,
+            dismissible: true,
+            onShow: null,
+            onHide: null,
+            abortXHR: true,
+            autoHide: false,
+            offsetTop: 0,
+            offsetLeft: 0,
+            iframeOptions: {
+                frameborder: '0',
+                allowtransparency: 'true',
+                id: '',
+                name: '',
+                scrolling: '',
+                onload: '',
+                height: '',
+                width: ''
+            },
+            hideEmpty: false
+        };
+
+        var rtlClass = pluginClass + '-rtl';
+        var _srcElements = [];
+        var backdrop = $('<div class="webui-popover-backdrop"></div>');
+        var _globalIdSeed = 0;
+        var _isBodyEventHandled = false;
+        var _offsetOut = -2000; // the value offset  out of the screen
+        var $document = $(document);
+
+        var toNumber = function(numeric, fallback) {
+            return isNaN(numeric) ? (fallback || 0) : Number(numeric);
+        };
+
+        var getPopFromElement = function($element) {
+            return $element.data('plugin_' + pluginName);
+        };
+
+        var hideAllPop = function() {
+            var pop = null;
+            for (var i = 0; i < _srcElements.length; i++) {
+                pop = getPopFromElement(_srcElements[i]);
+                if (pop) {
+                    pop.hide(true);
+                }
+            }
+            $document.trigger('hiddenAll.' + pluginType);
+        };
+
+        var hideOtherPops = function(currentPop) {
+            var pop = null;
+            for (var i = 0; i < _srcElements.length; i++) {
+                pop = getPopFromElement(_srcElements[i]);
+                if (pop && pop.id !== currentPop.id) {
+                    pop.hide(true);
+                }
+            }
+            $document.trigger('hiddenAll.' + pluginType);
+        };
+
+        var isMobile = ('ontouchstart' in document.documentElement) && (/Mobi/.test(navigator.userAgent));
+
+        var pointerEventToXY = function(e) {
+            var out = {
+                x: 0,
+                y: 0
+            };
+            if (e.type === 'touchstart' || e.type === 'touchmove' || e.type === 'touchend' || e.type === 'touchcancel') {
+                var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
+                out.x = touch.pageX;
+                out.y = touch.pageY;
+            } else if (e.type === 'mousedown' || e.type === 'mouseup' || e.type === 'click') {
+                out.x = e.pageX;
+                out.y = e.pageY;
+            }
+            return out;
+        };
+
+
+
+        // The actual plugin constructor
+        function WebuiPopover(element, options) {
+            this.$element = $(element);
+            if (options) {
+                if ($.type(options.delay) === 'string' || $.type(options.delay) === 'number') {
+                    options.delay = {
+                        show: options.delay,
+                        hide: options.delay
+                    }; // bc break fix
+                }
+            }
+            this.options = $.extend({}, defaults, options);
+            this._defaults = defaults;
+            this._name = pluginName;
+            this._targetclick = false;
+            this.init();
+            _srcElements.push(this.$element);
+            return this;
+
+        }
+
+        WebuiPopover.prototype = {
+            //init webui popover
+            init: function() {
+                if (this.$element[0] instanceof document.constructor && !this.options.selector) {
+                    throw new Error('`selector` option must be specified when initializing ' + this.type + ' on the window.document object!');
+                }
+
+                if (this.getTrigger() !== 'manual') {
+                    //init the event handlers
+                    if (isMobile) {
+                        this.$element.off('touchend', this.options.selector).on('touchend', this.options.selector, $.proxy(this.toggle, this));
+                    } else if (this.getTrigger() === 'click') {
+                        this.$element.off('click', this.options.selector).on('click', this.options.selector, $.proxy(this.toggle, this));
+                    } else if (this.getTrigger() === 'hover') {
+                        this.$element
+                            .off('mouseenter mouseleave click', this.options.selector)
+                            .on('mouseenter', this.options.selector, $.proxy(this.mouseenterHandler, this))
+                            .on('mouseleave', this.options.selector, $.proxy(this.mouseleaveHandler, this));
+                    }
+                }
+                this._poped = false;
+                this._inited = true;
+                this._opened = false;
+                this._idSeed = _globalIdSeed;
+                this.id = pluginName + this._idSeed;
+                // normalize container
+                this.options.container = $(this.options.container || document.body).first();
+
+                if (this.options.backdrop) {
+                    backdrop.appendTo(this.options.container).hide();
+                }
+                _globalIdSeed++;
+                if (this.getTrigger() === 'sticky') {
+                    this.show();
+                }
+
+                if (this.options.selector) {
+                    this._options = $.extend({}, this.options, {
+                        selector: ''
+                    });
+                }
+
+            },
+            /* api methods and actions */
+            destroy: function() {
+                var index = -1;
+
+                for (var i = 0; i < _srcElements.length; i++) {
+                    if (_srcElements[i] === this.$element) {
+                        index = i;
+                        break;
+                    }
+                }
+
+                _srcElements.splice(index, 1);
+
+
+                this.hide();
+                this.$element.data('plugin_' + pluginName, null);
+                if (this.getTrigger() === 'click') {
+                    this.$element.off('click');
+                } else if (this.getTrigger() === 'hover') {
+                    this.$element.off('mouseenter mouseleave');
+                }
+                if (this.$target) {
+                    this.$target.remove();
+                }
+            },
+            getDelegateOptions: function() {
+                var options = {};
+
+                this._options && $.each(this._options, function(key, value) {
+                    if (defaults[key] !== value) {
+                        options[key] = value;
+                    }
+                });
+                return options;
+            },
+            /*
+                param: force    boolean value, if value is true then force hide the popover
+                param: event    dom event,
+            */
+            hide: function(force, event) {
+
+                if (!force && this.getTrigger() === 'sticky') {
+                    return;
+                }
+                if (!this._opened) {
+                    return;
+                }
+                if (event) {
+                    event.preventDefault();
+                    event.stopPropagation();
+                }
+
+                if (this.xhr && this.options.abortXHR === true) {
+                    this.xhr.abort();
+                    this.xhr = null;
+                }
+
+
+                var e = $.Event('hide.' + pluginType);
+                this.$element.trigger(e, [this.$target]);
+                if (this.$target) {
+                    this.$target.removeClass('in').addClass(this.getHideAnimation());
+                    var that = this;
+                    setTimeout(function() {
+                        that.$target.hide();
+                        if (!that.getCache()) {
+                            that.$target.remove();
+                            //that.getTriggerElement.removeAttr('data-target');
+                        }
+                    }, that.getHideDelay());
+                }
+                if (this.options.backdrop) {
+                    backdrop.hide();
+                }
+                this._opened = false;
+                this.$element.trigger('hidden.' + pluginType, [this.$target]);
+
+                if (this.options.onHide) {
+                    this.options.onHide(this.$target);
+                }
+
+            },
+            resetAutoHide: function() {
+                var that = this;
+                var autoHide = that.getAutoHide();
+                if (autoHide) {
+                    if (that.autoHideHandler) {
+                        clearTimeout(that.autoHideHandler);
+                    }
+                    that.autoHideHandler = setTimeout(function() {
+                        that.hide();
+                    }, autoHide);
+                }
+            },
+            delegate: function(eventTarget) {
+                var self = $(eventTarget).data('plugin_' + pluginName);
+                if (!self) {
+                    self = new WebuiPopover(eventTarget, this.getDelegateOptions());
+                    $(eventTarget).data('plugin_' + pluginName, self);
+                }
+                return self;
+            },
+            toggle: function(e) {
+                var self = this;
+                if (e) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    if (this.options.selector) {
+                        self = this.delegate(e.currentTarget);
+                    }
+                }
+                self[self.getTarget().hasClass('in') ? 'hide' : 'show']();
+            },
+            hideAll: function() {
+                hideAllPop();
+            },
+            hideOthers: function() {
+                hideOtherPops(this);
+            },
+            /*core method ,show popover */
+            show: function() {
+                if (this._opened) {
+                    return;
+                }
+                //removeAllTargets();
+                var
+                    $target = this.getTarget().removeClass().addClass(pluginClass).addClass(this._customTargetClass);
+                if (!this.options.multi) {
+                    this.hideOthers();
+                }
+
+                // use cache by default, if not cache setted  , reInit the contents
+                if (!this.getCache() || !this._poped || this.content === '') {
+                    this.content = '';
+                    this.setTitle(this.getTitle());
+                    if (!this.options.closeable) {
+                        $target.find('.close').off('click').remove();
+                    }
+                    if (!this.isAsync()) {
+                        this.setContent(this.getContent());
+                    } else {
+                        this.setContentASync(this.options.content);
+                    }
+
+                    if (this.canEmptyHide() && this.content === '') {
+                        return;
+                    }
+                    $target.show();
+                }
+
+                this.displayContent();
+
+                if (this.options.onShow) {
+                    this.options.onShow($target);
+                }
+
+                this.bindBodyEvents();
+                if (this.options.backdrop) {
+                    backdrop.show();
+                }
+                this._opened = true;
+                this.resetAutoHide();
+            },
+            displayContent: function() {
+                var
+                //element postion
+                    elementPos = this.getElementPosition(),
+                    //target postion
+                    $target = this.getTarget().removeClass().addClass(pluginClass).addClass(this._customTargetClass),
+                    //target content
+                    $targetContent = this.getContentElement(),
+                    //target Width
+                    targetWidth = $target[0].offsetWidth,
+                    //target Height
+                    targetHeight = $target[0].offsetHeight,
+                    //placement
+                    placement = 'bottom',
+                    e = $.Event('show.' + pluginType);
+
+                if (this.canEmptyHide()) {
+
+                    var content = $targetContent.children().html();
+                    if (content !== null && content.trim().length === 0) {
+                        return;
+                    }
+                }
+
+                //if (this.hasContent()){
+                this.$element.trigger(e, [$target]);
+                //}
+                // support width as data attribute
+                var optWidth = this.$element.data('width') || this.options.width;
+                if (optWidth === '') {
+                    optWidth = this._defaults.width;
+                }
+
+                if (optWidth !== 'auto') {
+                    $target.width(optWidth);
+                }
+
+                // support height as data attribute
+                var optHeight = this.$element.data('height') || this.options.height;
+                if (optHeight === '') {
+                    optHeight = this._defaults.height;
+                }
+
+                if (optHeight !== 'auto') {
+                    $targetContent.height(optHeight);
+                }
+
+                if (this.options.style) {
+                    this.$target.addClass(pluginClass + '-' + this.options.style);
+                }
+
+                //check rtl
+                if (this.options.direction === 'rtl' && !$targetContent.hasClass(rtlClass)) {
+                    $targetContent.addClass(rtlClass);
+                }
+
+                //init the popover and insert into the document body
+                if (!this.options.arrow) {
+                    $target.find('.webui-arrow').remove();
+                }
+                $target.detach().css({
+                    top: _offsetOut,
+                    left: _offsetOut,
+                    display: 'block'
+                });
+
+                if (this.getAnimation()) {
+                    $target.addClass(this.getAnimation());
+                }
+                $target.appendTo(this.options.container);
+
+
+                placement = this.getPlacement(elementPos);
+
+                //This line is just for compatible with knockout custom binding
+                this.$element.trigger('added.' + pluginType);
+
+                this.initTargetEvents();
+
+                if (!this.options.padding) {
+                    if (this.options.height !== 'auto') {
+                        $targetContent.css('height', $targetContent.outerHeight());
+                    }
+                    this.$target.addClass('webui-no-padding');
+                }
+
+                // add maxHeight and maxWidth support by limodou@gmail.com 2016/10/1
+                if (this.options.maxHeight) {
+                    $targetContent.css('maxHeight', this.options.maxHeight);
+                }
+
+                if (this.options.maxWidth) {
+                    $targetContent.css('maxWidth', this.options.maxWidth);
+                }
+                // end
+
+                targetWidth = $target[0].offsetWidth;
+                targetHeight = $target[0].offsetHeight;
+
+                var postionInfo = this.getTargetPositin(elementPos, placement, targetWidth, targetHeight);
+
+                this.$target.css(postionInfo.position).addClass(placement).addClass('in');
+
+                if (this.options.type === 'iframe') {
+                    var $iframe = $target.find('iframe');
+                    var iframeWidth = $target.width();
+                    var iframeHeight = $iframe.parent().height();
+
+                    if (this.options.iframeOptions.width !== '' && this.options.iframeOptions.width !== 'auto') {
+                        iframeWidth = this.options.iframeOptions.width;
+                    }
+
+                    if (this.options.iframeOptions.height !== '' && this.options.iframeOptions.height !== 'auto') {
+                        iframeHeight = this.options.iframeOptions.height;
+                    }
+
+                    $iframe.width(iframeWidth).height(iframeHeight);
+                }
+
+                if (!this.options.arrow) {
+                    this.$target.css({
+                        'margin': 0
+                    });
+                }
+                if (this.options.arrow) {
+                    var $arrow = this.$target.find('.webui-arrow');
+                    $arrow.removeAttr('style');
+
+                    //prevent arrow change by content size
+                    if (placement === 'left' || placement === 'right') {
+                        $arrow.css({
+                            top: this.$target.height() / 2
+                        });
+                    } else if (placement === 'top' || placement === 'bottom') {
+                        $arrow.css({
+                            left: this.$target.width() / 2
+                        });
+                    }
+
+                    if (postionInfo.arrowOffset) {
+                        //hide the arrow if offset is negative
+                        if (postionInfo.arrowOffset.left === -1 || postionInfo.arrowOffset.top === -1) {
+                            $arrow.hide();
+                        } else {
+                            $arrow.css(postionInfo.arrowOffset);
+                        }
+                    }
+
+                }
+                this._poped = true;
+                this.$element.trigger('shown.' + pluginType, [this.$target]);
+            },
+
+            isTargetLoaded: function() {
+                return this.getTarget().find('i.glyphicon-refresh').length === 0;
+            },
+
+            /*getter setters */
+            getTriggerElement: function() {
+                return this.$element;
+            },
+            getTarget: function() {
+                if (!this.$target) {
+                    var id = pluginName + this._idSeed;
+                    this.$target = $(this.options.template)
+                        .attr('id', id);
+                    this._customTargetClass = this.$target.attr('class') !== pluginClass ? this.$target.attr('class') : null;
+                    this.getTriggerElement().attr('data-target', id);
+                }
+                if (!this.$target.data('trigger-element')) {
+                    this.$target.data('trigger-element', this.getTriggerElement());
+                }
+                return this.$target;
+            },
+            removeTarget: function() {
+                this.$target.remove();
+                this.$target = null;
+                this.$contentElement = null;
+            },
+            getTitleElement: function() {
+                return this.getTarget().find('.' + pluginClass + '-title');
+            },
+            getContentElement: function() {
+                if (!this.$contentElement) {
+                    this.$contentElement = this.getTarget().find('.' + pluginClass + '-content');
+                }
+                return this.$contentElement;
+            },
+            getTitle: function() {
+                return this.$element.attr('data-title') || this.options.title || this.$element.attr('title');
+            },
+            getUrl: function() {
+                return this.$element.attr('data-url') || this.options.url;
+            },
+            getAutoHide: function() {
+                return this.$element.attr('data-auto-hide') || this.options.autoHide;
+            },
+            getOffsetTop: function() {
+                return toNumber(this.$element.attr('data-offset-top')) || this.options.offsetTop;
+            },
+            getOffsetLeft: function() {
+                return toNumber(this.$element.attr('data-offset-left')) || this.options.offsetLeft;
+            },
+            getCache: function() {
+                var dataAttr = this.$element.attr('data-cache');
+                if (typeof(dataAttr) !== 'undefined') {
+                    switch (dataAttr.toLowerCase()) {
+                        case 'true':
+                        case 'yes':
+                        case '1':
+                            return true;
+                        case 'false':
+                        case 'no':
+                        case '0':
+                            return false;
+                    }
+                }
+                return this.options.cache;
+            },
+            getTrigger: function() {
+                return this.$element.attr('data-trigger') || this.options.trigger;
+            },
+            getDelayShow: function() {
+                var dataAttr = this.$element.attr('data-delay-show');
+                if (typeof(dataAttr) !== 'undefined') {
+                    return dataAttr;
+                }
+                return this.options.delay.show === 0 ? 0 : this.options.delay.show || 100;
+            },
+            getHideDelay: function() {
+                var dataAttr = this.$element.attr('data-delay-hide');
+                if (typeof(dataAttr) !== 'undefined') {
+                    return dataAttr;
+                }
+                return this.options.delay.hide === 0 ? 0 : this.options.delay.hide || 100;
+            },
+            getAnimation: function() {
+                var dataAttr = this.$element.attr('data-animation');
+                return dataAttr || this.options.animation;
+            },
+            getHideAnimation: function() {
+                var ani = this.getAnimation();
+                return ani ? ani + '-out' : 'out';
+            },
+            setTitle: function(title) {
+                var $titleEl = this.getTitleElement();
+                if (title) {
+                    //check rtl
+                    if (this.options.direction === 'rtl' && !$titleEl.hasClass(rtlClass)) {
+                        $titleEl.addClass(rtlClass);
+                    }
+                    $titleEl.html(title);
+                } else {
+                    $titleEl.remove();
+                }
+            },
+            hasContent: function() {
+                return this.getContent();
+            },
+            canEmptyHide: function() {
+                return this.options.hideEmpty && this.options.type === 'html';
+            },
+            getIframe: function() {
+                var $iframe = $('<iframe></iframe>').attr('src', this.getUrl());
+                var self = this;
+                $.each(this._defaults.iframeOptions, function(opt) {
+                    if (typeof self.options.iframeOptions[opt] !== 'undefined') {
+                        $iframe.attr(opt, self.options.iframeOptions[opt]);
+                    }
+                });
+
+                return $iframe;
+            },
+            getContent: function() {
+                if (this.getUrl()) {
+                    switch (this.options.type) {
+                        case 'iframe':
+                            this.content = this.getIframe();
+                            break;
+                        case 'html':
+                            try {
+                                this.content = $(this.getUrl());
+                                if (!this.content.is(':visible')) {
+                                    this.content.show();
+                                }
+                            } catch (error) {
+                                throw new Error('Unable to get popover content. Invalid selector specified.');
+                            }
+                            break;
+                    }
+                } else if (!this.content) {
+                    var content = '';
+                    if ($.isFunction(this.options.content)) {
+                        content = this.options.content.apply(this.$element[0], [this]);
+                    } else {
+                        content = this.options.content;
+                    }
+                    this.content = this.$element.attr('data-content') || content;
+                    if (!this.content) {
+                        var $next = this.$element.next();
+
+                        if ($next && $next.hasClass(pluginClass + '-content')) {
+                            this.content = $next;
+                        }
+                    }
+                }
+                return this.content;
+            },
+            setContent: function(content) {
+                var $target = this.getTarget();
+                var $ct = this.getContentElement();
+                if (typeof content === 'string') {
+                    $ct.html(content);
+                } else if (content instanceof $) {
+                    $ct.html('');
+                    //Don't want to clone too many times.
+                    if (!this.options.cache) {
+                        content.clone(true, true).removeClass(pluginClass + '-content').appendTo($ct);
+                    } else {
+                        content.removeClass(pluginClass + '-content').appendTo($ct);
+                    }
+                }
+                this.$target = $target;
+            },
+            isAsync: function() {
+                return this.options.type === 'async';
+            },
+            setContentASync: function(content) {
+                var that = this;
+                if (this.xhr) {
+                    return;
+                }
+                this.xhr = $.ajax({
+                    url: this.getUrl(),
+                    type: this.options.async.type,
+                    cache: this.getCache(),
+                    beforeSend: function(xhr, settings) {
+                        if (that.options.async.before) {
+                            that.options.async.before(that, xhr, settings);
+                        }
+                    },
+                    success: function(data) {
+                        that.bindBodyEvents();
+                        if (content && $.isFunction(content)) {
+                            that.content = content.apply(that.$element[0], [data]);
+                        } else {
+                            that.content = data;
+                        }
+                        that.setContent(that.content);
+                        var $targetContent = that.getContentElement();
+                        $targetContent.removeAttr('style');
+                        that.displayContent();
+                        if (that.options.async.success) {
+                            that.options.async.success(that, data);
+                        }
+                    },
+                    complete: function() {
+                        that.xhr = null;
+                    },
+                    error: function(xhr, data) {
+                        if (that.options.async.error) {
+                            that.options.async.error(that, xhr, data);
+                        }
+                    }
+                });
+            },
+
+            bindBodyEvents: function() {
+                if (_isBodyEventHandled) {
+                    return;
+                }
+                if (this.options.dismissible && this.getTrigger() === 'click') {
+                    if (isMobile) {
+                        $document.off('touchstart.webui-popover').on('touchstart.webui-popover', $.proxy(this.bodyTouchStartHandler, this));
+                    } else {
+                        $document.off('keyup.webui-popover').on('keyup.webui-popover', $.proxy(this.escapeHandler, this));
+                        $document.off('click.webui-popover').on('click.webui-popover', $.proxy(this.bodyClickHandler, this));
+                    }
+                } else if (this.getTrigger() === 'hover') {
+                    $document.off('touchend.webui-popover')
+                        .on('touchend.webui-popover', $.proxy(this.bodyClickHandler, this));
+                }
+            },
+
+            /* event handlers */
+            mouseenterHandler: function(e) {
+                var self = this;
+
+                if (e && this.options.selector) {
+                    self = this.delegate(e.currentTarget);
+                }
+
+                if (self._timeout) {
+                    clearTimeout(self._timeout);
+                }
+                self._enterTimeout = setTimeout(function() {
+                    if (!self.getTarget().is(':visible')) {
+                        self.show();
+                    }
+                }, this.getDelayShow());
+            },
+            mouseleaveHandler: function() {
+                var self = this;
+                clearTimeout(self._enterTimeout);
+                //key point, set the _timeout  then use clearTimeout when mouse leave
+                self._timeout = setTimeout(function() {
+                    self.hide();
+                }, this.getHideDelay());
+            },
+            escapeHandler: function(e) {
+                if (e.keyCode === 27) {
+                    this.hideAll();
+                }
+            },
+            bodyTouchStartHandler: function(e) {
+                var self = this;
+                var $eventEl = $(e.currentTarget);
+                $eventEl.on('touchend', function(e) {
+                    self.bodyClickHandler(e);
+                    $eventEl.off('touchend');
+                });
+                $eventEl.on('touchmove', function() {
+                    $eventEl.off('touchend');
+                });
+            },
+            bodyClickHandler: function(e) {
+                _isBodyEventHandled = true;
+                var canHide = true;
+                for (var i = 0; i < _srcElements.length; i++) {
+                    var pop = getPopFromElement(_srcElements[i]);
+                    if (pop && pop._opened) {
+                        var offset = pop.getTarget().offset();
+                        var popX1 = offset.left;
+                        var popY1 = offset.top;
+                        var popX2 = offset.left + pop.getTarget().width();
+                        var popY2 = offset.top + pop.getTarget().height();
+                        var pt = pointerEventToXY(e);
+                        var inPop = pt.x >= popX1 && pt.x <= popX2 && pt.y >= popY1 && pt.y <= popY2;
+                        if (inPop) {
+                            canHide = false;
+                            break;
+                        }
+                    }
+                }
+                if (canHide) {
+                    hideAllPop();
+                }
+            },
+
+            /*
+            targetClickHandler: function() {
+                this._targetclick = true;
+            },
+            */
+
+            //reset and init the target events;
+            initTargetEvents: function() {
+                if (this.getTrigger() === 'hover') {
+                    this.$target
+                        .off('mouseenter mouseleave')
+                        .on('mouseenter', $.proxy(this.mouseenterHandler, this))
+                        .on('mouseleave', $.proxy(this.mouseleaveHandler, this));
+                }
+                this.$target.find('.close').off('click').on('click', $.proxy(this.hide, this, true));
+                //this.$target.off('click.webui-popover').on('click.webui-popover', $.proxy(this.targetClickHandler, this));
+            },
+            /* utils methods */
+            //caculate placement of the popover
+            getPlacement: function(pos) {
+                var
+                    placement,
+                    container = this.options.container,
+                    clientWidth = container.innerWidth(),
+                    clientHeight = container.innerHeight(),
+                    scrollTop = container.scrollTop(),
+                    scrollLeft = container.scrollLeft(),
+                    pageX = Math.max(0, pos.left - scrollLeft),
+                    pageY = Math.max(0, pos.top - scrollTop);
+                //arrowSize = 20;
+
+                //if placement equals auto，caculate the placement by element information;
+                if (typeof(this.options.placement) === 'function') {
+                    placement = this.options.placement.call(this, this.getTarget()[0], this.$element[0]);
+                } else {
+                    placement = this.$element.data('placement') || this.options.placement;
+                }
+
+                var isH = placement === 'horizontal';
+                var isV = placement === 'vertical';
+                var detect = placement === 'auto' || isH || isV;
+
+                if (detect) {
+                    if (pageX < clientWidth / 3) {
+                        if (pageY < clientHeight / 3) {
+                            placement = isH ? 'right-bottom' : 'bottom-right';
+                        } else if (pageY < clientHeight * 2 / 3) {
+                            if (isV) {
+                                placement = pageY <= clientHeight / 2 ? 'bottom-right' : 'top-right';
+                            } else {
+                                placement = 'right';
+                            }
+                        } else {
+                            placement = isH ? 'right-top' : 'top-right';
+                        }
+                        //placement= pageY>targetHeight+arrowSize?'top-right':'bottom-right';
+                    } else if (pageX < clientWidth * 2 / 3) {
+                        if (pageY < clientHeight / 3) {
+                            if (isH) {
+                                placement = pageX <= clientWidth / 2 ? 'right-bottom' : 'left-bottom';
+                            } else {
+                                placement = 'bottom';
+                            }
+                        } else if (pageY < clientHeight * 2 / 3) {
+                            if (isH) {
+                                placement = pageX <= clientWidth / 2 ? 'right' : 'left';
+                            } else {
+                                placement = pageY <= clientHeight / 2 ? 'bottom' : 'top';
+                            }
+                        } else {
+                            if (isH) {
+                                placement = pageX <= clientWidth / 2 ? 'right-top' : 'left-top';
+                            } else {
+                                placement = 'top';
+                            }
+                        }
+                    } else {
+                        //placement = pageY>targetHeight+arrowSize?'top-left':'bottom-left';
+                        if (pageY < clientHeight / 3) {
+                            placement = isH ? 'left-bottom' : 'bottom-left';
+                        } else if (pageY < clientHeight * 2 / 3) {
+                            if (isV) {
+                                placement = pageY <= clientHeight / 2 ? 'bottom-left' : 'top-left';
+                            } else {
+                                placement = 'left';
+                            }
+                        } else {
+                            placement = isH ? 'left-top' : 'top-left';
+                        }
+                    }
+                } else if (placement === 'auto-top') {
+                    if (pageX < clientWidth / 3) {
+                        placement = 'top-right';
+                    } else if (pageX < clientWidth * 2 / 3) {
+                        placement = 'top';
+                    } else {
+                        placement = 'top-left';
+                    }
+                } else if (placement === 'auto-bottom') {
+                    if (pageX < clientWidth / 3) {
+                        placement = 'bottom-right';
+                    } else if (pageX < clientWidth * 2 / 3) {
+                        placement = 'bottom';
+                    } else {
+                        placement = 'bottom-left';
+                    }
+                } else if (placement === 'auto-left') {
+                    if (pageY < clientHeight / 3) {
+                        placement = 'left-top';
+                    } else if (pageY < clientHeight * 2 / 3) {
+                        placement = 'left';
+                    } else {
+                        placement = 'left-bottom';
+                    }
+                } else if (placement === 'auto-right') {
+                    if (pageY < clientHeight / 3) {
+                        placement = 'right-bottom';
+                    } else if (pageY < clientHeight * 2 / 3) {
+                        placement = 'right';
+                    } else {
+                        placement = 'right-top';
+                    }
+                }
+                return placement;
+            },
+            getElementPosition: function() {
+                // If the container is the body or normal conatiner, just use $element.offset()
+                var elRect = this.$element[0].getBoundingClientRect();
+                var container = this.options.container;
+                var cssPos = container.css('position');
+
+                if (container.is(document.body) || cssPos === 'static') {
+                    return $.extend({}, this.$element.offset(), {
+                        width: this.$element[0].offsetWidth || elRect.width,
+                        height: this.$element[0].offsetHeight || elRect.height
+                    });
+                    // Else fixed container need recalculate the  position
+                } else if (cssPos === 'fixed') {
+                    var containerRect = container[0].getBoundingClientRect();
+                    return {
+                        top: elRect.top - containerRect.top + container.scrollTop(),
+                        left: elRect.left - containerRect.left + container.scrollLeft(),
+                        width: elRect.width,
+                        height: elRect.height
+                    };
+                } else if (cssPos === 'relative') {
+                    return {
+                        top: this.$element.offset().top - container.offset().top,
+                        left: this.$element.offset().left - container.offset().left,
+                        width: this.$element[0].offsetWidth || elRect.width,
+                        height: this.$element[0].offsetHeight || elRect.height
+                    };
+                }
+            },
+
+            getTargetPositin: function(elementPos, placement, targetWidth, targetHeight) {
+                var pos = elementPos,
+                    container = this.options.container,
+                    //clientWidth = container.innerWidth(),
+                    //clientHeight = container.innerHeight(),
+                    elementW = this.$element.outerWidth(),
+                    elementH = this.$element.outerHeight(),
+                    scrollTop = document.documentElement.scrollTop + container.scrollTop(),
+                    scrollLeft = document.documentElement.scrollLeft + container.scrollLeft(),
+                    position = {},
+                    arrowOffset = null,
+                    arrowSize = this.options.arrow ? 20 : 0,
+                    padding = 10,
+                    fixedW = elementW < arrowSize + padding ? arrowSize : 0,
+                    fixedH = elementH < arrowSize + padding ? arrowSize : 0,
+                    refix = 0,
+                    pageH = document.documentElement.clientHeight + scrollTop,
+                    pageW = document.documentElement.clientWidth + scrollLeft;
+
+                var validLeft = pos.left + pos.width / 2 - fixedW > 0;
+                var validRight = pos.left + pos.width / 2 + fixedW < pageW;
+                var validTop = pos.top + pos.height / 2 - fixedH > 0;
+                var validBottom = pos.top + pos.height / 2 + fixedH < pageH;
+
+
+                switch (placement) {
+                    case 'bottom':
+                        position = {
+                            top: pos.top + pos.height,
+                            left: pos.left + pos.width / 2 - targetWidth / 2
+                        };
+                        break;
+                    case 'top':
+                        position = {
+                            top: pos.top - targetHeight,
+                            left: pos.left + pos.width / 2 - targetWidth / 2
+                        };
+                        break;
+                    case 'left':
+                        position = {
+                            top: pos.top + pos.height / 2 - targetHeight / 2,
+                            left: pos.left - targetWidth
+                        };
+                        break;
+                    case 'right':
+                        position = {
+                            top: pos.top + pos.height / 2 - targetHeight / 2,
+                            left: pos.left + pos.width
+                        };
+                        break;
+                    case 'top-right':
+                        position = {
+                            top: pos.top - targetHeight,
+                            left: validLeft ? pos.left - fixedW : padding
+                        };
+                        arrowOffset = {
+                            left: validLeft ? Math.min(elementW, targetWidth) / 2 + fixedW : _offsetOut
+                        };
+                        break;
+                    case 'top-left':
+                        refix = validRight ? fixedW : -padding;
+                        position = {
+                            top: pos.top - targetHeight,
+                            left: pos.left - targetWidth + pos.width + refix
+                        };
+                        arrowOffset = {
+                            left: validRight ? targetWidth - Math.min(elementW, targetWidth) / 2 - fixedW : _offsetOut
+                        };
+                        break;
+                    case 'bottom-right':
+                        position = {
+                            top: pos.top + pos.height,
+                            left: validLeft ? pos.left - fixedW : padding
+                        };
+                        arrowOffset = {
+                            left: validLeft ? Math.min(elementW, targetWidth) / 2 + fixedW : _offsetOut
+                        };
+                        break;
+                    case 'bottom-left':
+                        refix = validRight ? fixedW : -padding;
+                        position = {
+                            top: pos.top + pos.height,
+                            left: pos.left - targetWidth + pos.width + refix
+                        };
+                        arrowOffset = {
+                            left: validRight ? targetWidth - Math.min(elementW, targetWidth) / 2 - fixedW : _offsetOut
+                        };
+                        break;
+                    case 'right-top':
+                        refix = validBottom ? fixedH : -padding;
+                        position = {
+                            top: pos.top - targetHeight + pos.height + refix,
+                            left: pos.left + pos.width
+                        };
+                        arrowOffset = {
+                            top: validBottom ? targetHeight - Math.min(elementH, targetHeight) / 2 - fixedH : _offsetOut
+                        };
+                        break;
+                    case 'right-bottom':
+                        position = {
+                            top: validTop ? pos.top - fixedH : padding,
+                            left: pos.left + pos.width
+                        };
+                        arrowOffset = {
+                            top: validTop ? Math.min(elementH, targetHeight) / 2 + fixedH : _offsetOut
+                        };
+                        break;
+                    case 'left-top':
+                        refix = validBottom ? fixedH : -padding;
+                        position = {
+                            top: pos.top - targetHeight + pos.height + refix,
+                            left: pos.left - targetWidth
+                        };
+                        arrowOffset = {
+                            top: validBottom ? targetHeight - Math.min(elementH, targetHeight) / 2 - fixedH : _offsetOut
+                        };
+                        break;
+                    case 'left-bottom':
+                        position = {
+                            top: validTop ? pos.top - fixedH : padding,
+                            left: pos.left - targetWidth
+                        };
+                        arrowOffset = {
+                            top: validTop ? Math.min(elementH, targetHeight) / 2 + fixedH : _offsetOut
+                        };
+                        break;
+
+                }
+                position.top += this.getOffsetTop();
+                position.left += this.getOffsetLeft();
+
+                return {
+                    position: position,
+                    arrowOffset: arrowOffset
+                };
+            }
+        };
+        $.fn[pluginName] = function(options, noInit) {
+            var results = [];
+            var $result = this.each(function() {
+
+                var webuiPopover = $.data(this, 'plugin_' + pluginName);
+                if (!webuiPopover) {
+                    if (!options) {
+                        webuiPopover = new WebuiPopover(this, null);
+                    } else if (typeof options === 'string') {
+                        if (options !== 'destroy') {
+                            if (!noInit) {
+                                webuiPopover = new WebuiPopover(this, null);
+                                results.push(webuiPopover[options]());
+                            }
+                        }
+                    } else if (typeof options === 'object') {
+                        webuiPopover = new WebuiPopover(this, options);
+                    }
+                    $.data(this, 'plugin_' + pluginName, webuiPopover);
+                } else {
+                    if (options === 'destroy') {
+                        webuiPopover.destroy();
+                    } else if (typeof options === 'string') {
+                        results.push(webuiPopover[options]());
+                    }
+                }
+            });
+            return (results.length) ? results : $result;
+        };
+
+        //Global object exposes to window.
+        var webuiPopovers = (function() {
+            var _hideAll = function() {
+                hideAllPop();
+            };
+            var _create = function(selector, options) {
+                options = options || {};
+                $(selector).webuiPopover(options);
+            };
+            var _isCreated = function(selector) {
+                var created = true;
+                $(selector).each(function(i, item) {
+                    created = created && $(item).data('plugin_' + pluginName) !== undefined;
+                });
+                return created;
+            };
+            var _show = function(selector, options) {
+                if (options) {
+                    $(selector).webuiPopover(options).webuiPopover('show');
+                } else {
+                    $(selector).webuiPopover('show');
+                }
+            };
+            var _hide = function(selector) {
+                $(selector).webuiPopover('hide');
+            };
+
+            var _setDefaultOptions = function(options) {
+                defaults = $.extend({}, defaults, options);
+            };
+
+            var _updateContent = function(selector, content) {
+                var pop = $(selector).data('plugin_' + pluginName);
+                if (pop) {
+                    var cache = pop.getCache();
+                    pop.options.cache = false;
+                    pop.options.content = content;
+                    if (pop._opened) {
+                        pop._opened = false;
+                        pop.show();
+                    } else {
+                        if (pop.isAsync()) {
+                            pop.setContentASync(content);
+                        } else {
+                            pop.setContent(content);
+                        }
+                    }
+                    pop.options.cache = cache;
+                }
+            };
+
+            var _updateContentAsync = function(selector, url) {
+                var pop = $(selector).data('plugin_' + pluginName);
+                if (pop) {
+                    var cache = pop.getCache();
+                    var type = pop.options.type;
+                    pop.options.cache = false;
+                    pop.options.url = url;
+
+                    if (pop._opened) {
+                        pop._opened = false;
+                        pop.show();
+                    } else {
+                        pop.options.type = 'async';
+                        pop.setContentASync(pop.content);
+                    }
+                    pop.options.cache = cache;
+                    pop.options.type = type;
+                }
+            };
+
+            return {
+                show: _show,
+                hide: _hide,
+                create: _create,
+                isCreated: _isCreated,
+                hideAll: _hideAll,
+                updateContent: _updateContent,
+                updateContentAsync: _updateContentAsync,
+                setDefaultOptions: _setDefaultOptions
+            };
+        })();
+        window.WebuiPopovers = webuiPopovers;
+    }));
+})(window, document);