|
1 | 1 | /* |
2 | | - * Gijgo JavaScript Library v1.9.7 |
| 2 | + * Gijgo JavaScript Library v1.9.9 |
3 | 3 | * http://gijgo.com/ |
4 | 4 | * |
5 | 5 | * Copyright 2014, 2018 gijgo.com |
@@ -595,6 +595,154 @@ gj.core = { |
595 | 595 | } |
596 | 596 | } |
597 | 597 | }; |
| 598 | +gj.picker = { |
| 599 | + messages: { |
| 600 | + 'en-us': { |
| 601 | + } |
| 602 | + } |
| 603 | +}; |
| 604 | + |
| 605 | +gj.picker.methods = { |
| 606 | + |
| 607 | + initialize: function ($input, data, methods) { |
| 608 | + var $calendar, $rightIcon, |
| 609 | + $picker = methods.createPicker($input, data), |
| 610 | + $wrapper = $input.parent('div[role="wrapper"]'); |
| 611 | + |
| 612 | + if (data.uiLibrary === 'bootstrap') { |
| 613 | + $rightIcon = $('<span class="input-group-addon">' + data.icons.rightIcon + '</span>'); |
| 614 | + } else if (data.uiLibrary === 'bootstrap4') { |
| 615 | + $rightIcon = $('<span class="input-group-append"><button class="btn btn-outline-secondary border-left-0" type="button">' + data.icons.rightIcon + '</button></span>'); |
| 616 | + } else { |
| 617 | + $rightIcon = $(data.icons.rightIcon); |
| 618 | + } |
| 619 | + $rightIcon.attr('role', 'right-icon'); |
| 620 | + |
| 621 | + if ($wrapper.length === 0) { |
| 622 | + $wrapper = $('<div role="wrapper" />').addClass(data.style.wrapper); // The css class needs to be added before the wrapping, otherwise doesn't work. |
| 623 | + $input.wrap($wrapper); |
| 624 | + } else { |
| 625 | + $wrapper.addClass(data.style.wrapper); |
| 626 | + } |
| 627 | + $wrapper = $input.parent('div[role="wrapper"]'); |
| 628 | + |
| 629 | + data.width && $wrapper.css('width', data.width); |
| 630 | + |
| 631 | + $input.val(data.value).addClass(data.style.input).attr('role', 'input'); |
| 632 | + |
| 633 | + data.fontSize && $input.css('font-size', data.fontSize); |
| 634 | + |
| 635 | + if (data.uiLibrary === 'bootstrap' || data.uiLibrary === 'bootstrap4') { |
| 636 | + if (data.size === 'small') { |
| 637 | + $wrapper.addClass('input-group-sm'); |
| 638 | + $input.addClass('form-control-sm'); |
| 639 | + } else if (data.size === 'large') { |
| 640 | + $wrapper.addClass('input-group-lg'); |
| 641 | + $input.addClass('form-control-lg'); |
| 642 | + } |
| 643 | + } else { |
| 644 | + if (data.size === 'small') { |
| 645 | + $wrapper.addClass('small'); |
| 646 | + } else if (data.size === 'large') { |
| 647 | + $wrapper.addClass('large'); |
| 648 | + } |
| 649 | + } |
| 650 | + |
| 651 | + $rightIcon.on('click', function (e) { |
| 652 | + if ($picker.is(':visible')) { |
| 653 | + $input.close(); |
| 654 | + } else { |
| 655 | + $input.open(); |
| 656 | + } |
| 657 | + }); |
| 658 | + $wrapper.append($rightIcon); |
| 659 | + |
| 660 | + if (data.footer !== true) { |
| 661 | + $input.on('blur', function () { |
| 662 | + $input.timeout = setTimeout(function () { |
| 663 | + $input.close(); |
| 664 | + }, 500); |
| 665 | + }); |
| 666 | + $picker.mousedown(function () { |
| 667 | + clearTimeout($input.timeout); |
| 668 | + $input.focus(); |
| 669 | + return false; |
| 670 | + }); |
| 671 | + $picker.on('click', function () { |
| 672 | + clearTimeout($input.timeout); |
| 673 | + $input.focus(); |
| 674 | + }); |
| 675 | + } |
| 676 | + } |
| 677 | +}; |
| 678 | + |
| 679 | + |
| 680 | +gj.picker.widget = function ($element, jsConfig) { |
| 681 | + var self = this, |
| 682 | + methods = gj.picker.methods; |
| 683 | + |
| 684 | + self.destroy = function () { |
| 685 | + return methods.destroy(this); |
| 686 | + }; |
| 687 | + |
| 688 | + return $element; |
| 689 | +}; |
| 690 | + |
| 691 | +gj.picker.widget.prototype = new gj.widget(); |
| 692 | +gj.picker.widget.constructor = gj.picker.widget; |
| 693 | + |
| 694 | +gj.picker.widget.prototype.init = function (jsConfig, type, methods) { |
| 695 | + gj.widget.prototype.init.call(this, jsConfig, type); |
| 696 | + this.attr('data-' + type, 'true'); |
| 697 | + gj.picker.methods.initialize(this, this.data(), gj[type].methods); |
| 698 | + return this; |
| 699 | +}; |
| 700 | + |
| 701 | +gj.picker.widget.prototype.open = function (type) { |
| 702 | + var data = this.data(), |
| 703 | + $picker = $('body').find('[role="picker"][guid="' + this.attr('data-guid') + '"]'); |
| 704 | + |
| 705 | + $picker.show(); |
| 706 | + $picker.closest('div[role="modal"]').show(); |
| 707 | + if (data.modal) { |
| 708 | + gj.core.center($picker); |
| 709 | + } else { |
| 710 | + gj.core.setChildPosition(this[0], $picker[0]); |
| 711 | + this.focus(); |
| 712 | + } |
| 713 | + clearTimeout(this.timeout); |
| 714 | + |
| 715 | + gj[type].events.open(this); |
| 716 | + |
| 717 | + return this; |
| 718 | +}; |
| 719 | + |
| 720 | +gj.picker.widget.prototype.close = function (type) { |
| 721 | + var $picker = $('body').find('[role="picker"][guid="' + this.attr('data-guid') + '"]'); |
| 722 | + $picker.hide(); |
| 723 | + $picker.closest('div[role="modal"]').hide(); |
| 724 | + gj[type].events.close(this); |
| 725 | + return this; |
| 726 | +}; |
| 727 | + |
| 728 | +gj.picker.widget.prototype.destroy = function (type) { |
| 729 | + var data = this.data(), |
| 730 | + $parent = this.parent(), |
| 731 | + $picker = $('body').find('[role="picker"][guid="' + this.attr('data-guid') + '"]'); |
| 732 | + if (data) { |
| 733 | + this.off(); |
| 734 | + if ($picker.parent('[role="modal"]').length > 0) { |
| 735 | + $picker.unwrap(); |
| 736 | + } |
| 737 | + $picker.remove(); |
| 738 | + this.removeData(); |
| 739 | + this.removeAttr('data-type').removeAttr('data-guid').removeAttr('data-' + type); |
| 740 | + this.removeClass(); |
| 741 | + $parent.children('[role="right-icon"]').remove(); |
| 742 | + this.unwrap(); |
| 743 | + } |
| 744 | + return this; |
| 745 | +}; |
598 | 746 | /* global window alert jQuery */ |
599 | 747 | /** |
600 | 748 | * @widget Dialog |
|
0 commit comments