autocomplete.min.js 15.2 KB
Newer Older
Thitichaipun Wutthisak committed
1 2 3 4 5 6 7
/*!
 * Angular Material Design
 * https://github.com/angular/material
 * @license MIT
 * v1.0.5-master-f171fd2
 */
function MdAutocompleteCtrl(e,t,n,o,i,l,a,r,c,u){function m(){n.initOptionalProperties(e,c,{searchText:null,selectedItem:null}),i(t),h(),n.nextTick(function(){f(),s(),p(),t.on("focus",p)})}function d(){function o(){var e=0,n=t.find("md-input-container");if(n.length){var o=n.find("input");e=n.prop("offsetHeight"),e-=o.prop("offsetTop"),e-=o.prop("offsetHeight"),e+=n.prop("offsetTop")}return e}function i(){var e=ae.scrollContainer.getBoundingClientRect(),t={};e.right>u.right-MENU_PADDING&&(t.left=a.right-e.width+"px"),ae.$.scrollContainer.css(t)}if(!ae)return n.nextTick(d,!1,e);var l,a=ae.wrap.getBoundingClientRect(),r=ae.snap.getBoundingClientRect(),u=ae.root.getBoundingClientRect(),m=r.bottom-u.top,s=u.bottom-r.top,p=a.left-u.left,h=a.width,g=o();c.mdFloatingLabel&&(p+=INPUT_PADDING,h-=2*INPUT_PADDING),l={left:p+"px",minWidth:h+"px",maxWidth:Math.max(a.right-u.left,u.right-a.left)-MENU_PADDING+"px"},m>s&&u.height-a.bottom-MENU_PADDING<MAX_HEIGHT?(l.top="auto",l.bottom=s+"px",l.maxHeight=Math.min(MAX_HEIGHT,a.top-u.top-MENU_PADDING)+"px"):(l.top=m-g+"px",l.bottom="auto",l.maxHeight=Math.min(MAX_HEIGHT,u.bottom+n.scrollTop()-a.bottom-MENU_PADDING)+"px"),ae.$.scrollContainer.css(l),n.nextTick(i,!1)}function s(){ae.$.root.length&&(i(ae.$.scrollContainer),ae.$.scrollContainer.detach(),ae.$.root.append(ae.$.scrollContainer),a.pin&&a.pin(ae.$.scrollContainer,r))}function p(){e.autofocus&&ae.input.focus()}function h(){var t=parseInt(e.delay,10)||0;c.$observe("disabled",function(e){oe.isDisabled=n.parseAttributeBoolean(e,!1)}),c.$observe("required",function(e){oe.isRequired=n.parseAttributeBoolean(e,!1)}),e.$watch("searchText",t?n.debounce(N,t):N),e.$watch("selectedItem",T),angular.element(l).on("resize",d),e.$on("$destroy",g)}function g(){if(oe.hidden||n.enableScrolling(),angular.element(l).off("resize",d),ae){var e="ul scroller scrollContainer input".split(" ");angular.forEach(e,function(e){ae.$[e].remove()})}}function f(){ae={main:t[0],scrollContainer:t[0].getElementsByClassName("md-virtual-repeat-container")[0],scroller:t[0].getElementsByClassName("md-virtual-repeat-scroller")[0],ul:t.find("ul")[0],input:t.find("input")[0],wrap:t.find("md-autocomplete-wrap")[0],root:document.body},ae.li=ae.ul.getElementsByTagName("li"),ae.snap=$(),ae.$=x(ae)}function $(){for(var e=t;e.length;e=e.parent())if(angular.isDefined(e.attr("md-autocomplete-snap")))return e[0];return ae.wrap}function x(e){var t={};for(var n in e)e.hasOwnProperty(n)&&(t[n]=angular.element(e[n]));return t}function C(t,o){!t&&o?(d(),ae&&n.nextTick(function(){n.disableScrollAround(ae.ul)},!1,e)):t&&!o&&n.nextTick(function(){n.enableScrolling()},!1,e)}function v(){ce=!0}function A(){me||ae.input.focus(),ce=!1,oe.hidden=F()}function b(){ae.input.focus()}function T(t,n){t&&L(t).then(function(o){e.searchText=o,E(t,n)}),t!==n&&I()}function I(){angular.isFunction(e.itemChange)&&e.itemChange(O(e.selectedItem))}function M(){angular.isFunction(e.textChange)&&e.textChange()}function E(e,t){ue.forEach(function(n){n(e,t)})}function D(e){-1==ue.indexOf(e)&&ue.push(e)}function w(e){var t=ue.indexOf(e);-1!=t&&ue.splice(t,1)}function N(t,n){oe.index=S(),t!==n&&L(e.selectedItem).then(function(o){t!==o&&(e.selectedItem=null,t!==n&&M(),W()?te():(oe.matches=[],R(!1),X()))})}function y(){me=!1,ce||(oe.hidden=F())}function H(e){e&&(ce=!1,me=!1),ae.input.blur()}function k(){me=!0,angular.isString(e.searchText)||(e.searchText=""),oe.hidden=F(),oe.hidden||te()}function _(e){switch(e.keyCode){case o.KEY_CODE.DOWN_ARROW:if(oe.loading)return;e.stopPropagation(),e.preventDefault(),oe.index=Math.min(oe.index+1,oe.matches.length-1),Q(),X();break;case o.KEY_CODE.UP_ARROW:if(oe.loading)return;e.stopPropagation(),e.preventDefault(),oe.index=oe.index<0?oe.matches.length-1:Math.max(0,oe.index-1),Q(),X();break;case o.KEY_CODE.TAB:if(A(),oe.hidden||oe.loading||oe.index<0||oe.matches.length<1)return;K(oe.index);break;case o.KEY_CODE.ENTER:if(oe.hidden||oe.loading||oe.index<0||oe.matches.length<1)return;if(q())return;e.stopPropagation(),e.preventDefault(),K(oe.index);break;case o.KEY_CODE.ESCAPE:e.stopPropagation(),e.preventDefault(),Y(),H(!0)}}function P(){return angular.isNumber(e.minLength)?e.minLength:1}function L(t){function n(t){return t&&e.itemText?e.itemText(O(t)):null}return u.when(n(t)||t)}function O(e){if(e){var t={};return oe.itemName&&(t[oe.itemName]=e),t}}function S(){return e.autoselect?0:-1}function R(e){oe.loading!=e&&(oe.loading=e),oe.hidden=F()}function F(){return oe.loading&&!U()?!0:q()?!0:me?!G():!0}function G(){return W()&&U()||ee()}function U(){return!!oe.matches.length}function q(){return!!oe.scope.selectedItem}function B(){return oe.loading&&!q()}function V(){return L(oe.matches[oe.index])}function W(){return(e.searchText||"").length>=P()}function j(e,t,n){Object.defineProperty(oe,e,{get:function(){return n},set:function(e){var o=n;n=e,t(e,o)}})}function K(t){n.nextTick(function(){L(oe.matches[t]).then(function(e){var t=ae.$.input.controller("ngModel");t.$setViewValue(e),t.$render()})["finally"](function(){e.selectedItem=oe.matches[t],R(!1)})},!1)}function Y(){R(!0),oe.index=0,oe.matches=[],e.searchText="",K(-1);var t=document.createEvent("CustomEvent");t.initCustomEvent("input",!0,!0,{value:e.searchText}),ae.input.dispatchEvent(t),ae.input.focus()}function z(t){function o(t){t&&(t=u.when(t),R(!0),se=!0,n.nextTick(function(){t.then(i)["finally"](function(){R(!1),se=!1})},!0,e))}function i(n){re[a]=n,(t||"")===(e.searchText||"")&&(oe.matches=n,oe.hidden=F(),e.selectOnMatch&&ne(),X(),d())}var l=e.$parent.$eval(le),a=t.toLowerCase(),r=angular.isArray(l);r?i(l):o(l)}function X(){V().then(function(e){oe.messages=[J(),e]})}function J(){if(de===oe.matches.length)return"";switch(de=oe.matches.length,oe.matches.length){case 0:return"There are no matches available.";case 1:return"There is 1 match available.";default:return"There are "+oe.matches.length+" matches available."}}function Q(){if(ae.li[0]){var e=ae.li[0].offsetHeight,t=e*oe.index,n=t+e,o=ae.scroller.clientHeight,i=ae.scroller.scrollTop;i>t?Z(t):n>i+o&&Z(n-o)}}function Z(e){ae.$.scrollContainer.controller("mdVirtualRepeatContainer").scrollTo(e)}function ee(){var e=(oe.scope.searchText||"").length;return oe.hasNotFound&&!U()&&(!oe.loading||se)&&e>=P()&&(me||ce)&&!q()}function te(){var t=e.searchText||"",n=t.toLowerCase();!e.noCache&&re[n]?(oe.matches=re[n],X()):z(t),oe.hidden=F()}function ne(){var t=e.searchText,n=oe.matches,o=n[0];1===n.length&&L(o).then(function(n){var o=t==n;e.matchInsensitive&&!o&&(o=t.toLowerCase()==n.toLowerCase()),o&&K(0)})}var oe=this,ie=e.itemsExpr.split(/ in /i),le=ie[1],ae=null,re={},ce=!1,ue=[],me=!1,de=0,se=!1;return j("hidden",C,!0),oe.scope=e,oe.parent=e.$parent,oe.itemName=ie[0],oe.matches=[],oe.loading=!1,oe.hidden=!0,oe.index=null,oe.messages=[],oe.id=n.nextUid(),oe.isDisabled=null,oe.isRequired=null,oe.hasNotFound=!1,oe.keydown=_,oe.blur=y,oe.focus=k,oe.clear=Y,oe.select=K,oe.listEnter=v,oe.listLeave=A,oe.mouseUp=b,oe.getCurrentDisplayValue=V,oe.registerSelectedItemWatcher=D,oe.unregisterSelectedItemWatcher=w,oe.notFoundVisible=ee,oe.loadingIsVisible=B,m()}function MdAutocomplete(){return{controller:"MdAutocompleteCtrl",controllerAs:"$mdAutocompleteCtrl",scope:{inputName:"@mdInputName",inputMinlength:"@mdInputMinlength",inputMaxlength:"@mdInputMaxlength",searchText:"=?mdSearchText",selectedItem:"=?mdSelectedItem",itemsExpr:"@mdItems",itemText:"&mdItemText",placeholder:"@placeholder",noCache:"=?mdNoCache",selectOnMatch:"=?mdSelectOnMatch",matchInsensitive:"=?mdMatchCaseInsensitive",itemChange:"&?mdSelectedItemChange",textChange:"&?mdSearchTextChange",minLength:"=?mdMinLength",delay:"=?mdDelay",autofocus:"=?mdAutofocus",floatingLabel:"@?mdFloatingLabel",autoselect:"=?mdAutoselect",menuClass:"@?mdMenuClass",inputId:"@?mdInputId"},link:function(e,t,n,o){o.hasNotFound=!!t.attr("md-has-not-found")},template:function(e,t){function n(){var t=e.find("md-item-template").detach(),n=t.length?t.html():e.html();return t.length||e.empty(),"<md-autocomplete-parent-scope md-autocomplete-replace>"+n+"</md-autocomplete-parent-scope>"}function o(){var t=e.find("md-not-found").detach(),n=t.length?t.html():"";return n?'<li ng-if="$mdAutocompleteCtrl.notFoundVisible()"                         md-autocomplete-parent-scope>'+n+"</li>":""}function i(){return t.mdFloatingLabel?'            <md-input-container flex ng-if="floatingLabel">              <label>{{floatingLabel}}</label>              <input type="search"                  '+(null!=c?'tabindex="'+c+'"':"")+'                  id="{{ inputId || \'fl-input-\' + $mdAutocompleteCtrl.id }}"                  name="{{inputName}}"                  autocomplete="off"                  ng-required="$mdAutocompleteCtrl.isRequired"                  ng-minlength="inputMinlength"                  ng-maxlength="inputMaxlength"                  ng-disabled="$mdAutocompleteCtrl.isDisabled"                  ng-model="$mdAutocompleteCtrl.scope.searchText"                  ng-keydown="$mdAutocompleteCtrl.keydown($event)"                  ng-blur="$mdAutocompleteCtrl.blur()"                  ng-focus="$mdAutocompleteCtrl.focus()"                  aria-owns="ul-{{$mdAutocompleteCtrl.id}}"                  '+(null!=t.mdSelectOnFocus?'md-select-on-focus=""':"")+'                  aria-label="{{floatingLabel}}"                  aria-autocomplete="list"                  aria-haspopup="true"                  aria-activedescendant=""                  aria-expanded="{{!$mdAutocompleteCtrl.hidden}}"/>              <div md-autocomplete-parent-scope md-autocomplete-replace>'+r+"</div>            </md-input-container>":'            <input flex type="search"                '+(null!=c?'tabindex="'+c+'"':"")+'                id="{{ inputId || \'input-\' + $mdAutocompleteCtrl.id }}"                name="{{inputName}}"                ng-if="!floatingLabel"                autocomplete="off"                ng-required="$mdAutocompleteCtrl.isRequired"                ng-disabled="$mdAutocompleteCtrl.isDisabled"                ng-model="$mdAutocompleteCtrl.scope.searchText"                ng-keydown="$mdAutocompleteCtrl.keydown($event)"                ng-blur="$mdAutocompleteCtrl.blur()"                ng-focus="$mdAutocompleteCtrl.focus()"                placeholder="{{placeholder}}"                aria-owns="ul-{{$mdAutocompleteCtrl.id}}"                '+(null!=t.mdSelectOnFocus?'md-select-on-focus=""':"")+'                aria-label="{{placeholder}}"                aria-autocomplete="list"                aria-haspopup="true"                aria-activedescendant=""                aria-expanded="{{!$mdAutocompleteCtrl.hidden}}"/>            <button                type="button"                tabindex="-1"                ng-if="$mdAutocompleteCtrl.scope.searchText && !$mdAutocompleteCtrl.isDisabled"                ng-click="$mdAutocompleteCtrl.clear()">              <md-icon md-svg-icon="md-close"></md-icon>              <span class="_md-visually-hidden">Clear</span>            </button>                '}var l=o(),a=n(),r=e.html(),c=t.tabindex;return l&&e.attr("md-has-not-found",!0),e.attr("tabindex","-1"),'        <md-autocomplete-wrap            layout="row"            ng-class="{ \'md-whiteframe-z1\': !floatingLabel, \'md-menu-showing\': !$mdAutocompleteCtrl.hidden }"            role="listbox">          '+i()+'          <md-progress-linear              class="'+(t.mdFloatingLabel?"md-inline":"")+'"              ng-if="$mdAutocompleteCtrl.loadingIsVisible()"              md-mode="indeterminate"></md-progress-linear>          <md-virtual-repeat-container              md-auto-shrink              md-auto-shrink-min="1"              ng-mouseenter="$mdAutocompleteCtrl.listEnter()"              ng-mouseleave="$mdAutocompleteCtrl.listLeave()"              ng-mouseup="$mdAutocompleteCtrl.mouseUp()"              ng-hide="$mdAutocompleteCtrl.hidden"              class="md-autocomplete-suggestions-container md-whiteframe-z1"              ng-class="{ \'md-not-found\': $mdAutocompleteCtrl.notFoundVisible() }"              role="presentation">            <ul class="md-autocomplete-suggestions"                ng-class="::menuClass"                id="ul-{{$mdAutocompleteCtrl.id}}">              <li md-virtual-repeat="item in $mdAutocompleteCtrl.matches"                  ng-class="{ selected: $index === $mdAutocompleteCtrl.index }"                  ng-click="$mdAutocompleteCtrl.select($index)"                  md-extra-name="$mdAutocompleteCtrl.itemName">                  '+a+"                  </li>"+l+'            </ul>          </md-virtual-repeat-container>        </md-autocomplete-wrap>        <aria-status            class="_md-visually-hidden"            role="status"            aria-live="assertive">          <p ng-repeat="message in $mdAutocompleteCtrl.messages track by $index" ng-if="message">{{message}}</p>        </aria-status>'}}}function MdAutocompleteItemScopeDirective(e,t){function n(e,n,o){return function(e,n,i){function l(n,o){c[o]=e[n],e.$watch(n,function(e){t.nextTick(function(){c[o]=e})})}function a(){var t=!1,n=!1;e.$watch(function(){n||t||(t=!0,e.$$postDigest(function(){n||c.$digest(),t=n=!1}))}),c.$watch(function(){n=!0})}var r=e.$mdAutocompleteCtrl,c=r.parent.$new(),u=r.itemName;l("$index","$index"),l("item",u),a(),o(c,function(e){n.after(e)})}}return{restrict:"AE",compile:n,terminal:!0,transclude:"element"}}function MdHighlightCtrl(e,t,n){function o(o,i){var a=null,r=null,c=n.mdHighlightFlags||"",u=e.$watch(function(e){return{term:o(e),unsafeText:i(e)}},function(e,n){null!==a&&e.unsafeText===n.unsafeText||(a=angular.element("<div>").text(e.unsafeText).html()),null!==r&&e.term===n.term||(r=l(e.term,c)),t.html(a.replace(r,'<span class="highlight">$&</span>'))},!0);t.on("$destroy",u)}function i(e){return e&&e.replace(/[\\\^\$\*\+\?\.\(\)\|\{}\[\]]/g,"\\$&")}function l(e,t){var n="";return t.indexOf("^")>=1&&(n+="^"),n+=e,t.indexOf("$")>=1&&(n+="$"),new RegExp(i(n),t.replace(/[\$\^]/g,""))}this.init=o}function MdHighlight(e,t){return{terminal:!0,controller:"MdHighlightCtrl",compile:function(n,o){var i=t(o.mdHighlightText),l=e(n.html());return function(e,t,n,o){o.init(i,l)}}}}goog.provide("ng.material.components.autocomplete"),goog.require("ng.material.components.icon"),goog.require("ng.material.components.virtualRepeat"),goog.require("ng.material.core"),angular.module("material.components.autocomplete",["material.core","material.components.icon","material.components.virtualRepeat"]),angular.module("material.components.autocomplete").controller("MdAutocompleteCtrl",MdAutocompleteCtrl);var ITEM_HEIGHT=41,MAX_HEIGHT=5.5*ITEM_HEIGHT,MENU_PADDING=8,INPUT_PADDING=2;MdAutocompleteCtrl.$inject=["$scope","$element","$mdUtil","$mdConstant","$mdTheming","$window","$animate","$rootElement","$attrs","$q"],angular.module("material.components.autocomplete").directive("mdAutocomplete",MdAutocomplete),angular.module("material.components.autocomplete").directive("mdAutocompleteParentScope",MdAutocompleteItemScopeDirective),MdAutocompleteItemScopeDirective.$inject=["$compile","$mdUtil"],angular.module("material.components.autocomplete").controller("MdHighlightCtrl",MdHighlightCtrl),MdHighlightCtrl.$inject=["$scope","$element","$attrs"],angular.module("material.components.autocomplete").directive("mdHighlightText",MdHighlight),MdHighlight.$inject=["$interpolate","$parse"],ng.material.components.autocomplete=angular.module("material.components.autocomplete");