select.min.js 18.1 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 SelectDirective(e,t,n,r,a,o){function l(a,l){var i=angular.element("<md-select-value><span></span></md-select-value>");if(i.append('<span class="_md-select-icon" aria-hidden="true"></span>'),i.addClass("_md-select-value"),i[0].hasAttribute("id")||i.attr("id","select_value_label_"+t.nextUid()),a.find("md-content").length||a.append(angular.element("<md-content>").append(a.contents())),l.mdOnOpen&&(a.find("md-content").prepend(angular.element('<div> <md-progress-circular md-mode="{{progressMode}}" ng-hide="$$loadingAsyncDone"></md-progress-circular></div>')),a.find("md-option").attr("ng-show","$$loadingAsyncDone")),l.name){var d=angular.element('<select class="_md-visually-hidden">');d.attr({name:"."+l.name,"ng-model":l.ngModel,"aria-hidden":"true",tabindex:"-1"});var c=a.find("md-option");angular.forEach(c,function(e){var t=angular.element("<option>"+e.innerHTML+"</option>");e.hasAttribute("ng-value")?t.attr("ng-value",e.getAttribute("ng-value")):e.hasAttribute("value")&&t.attr("value",e.getAttribute("value")),d.append(t)}),a.parent().append(d)}var s=t.parseAttributeBoolean(l.multiple),u=s?"multiple":"",p='<div class="_md-select-menu-container" aria-hidden="true"><md-select-menu {0}>{1}</md-select-menu></div>';return p=t.supplant(p,[u,a.html()]),a.empty().append(i),a.append(p),l.tabindex=l.tabindex||"0",function(a,l,i,d){function c(){var e=l.attr("aria-label")||l.attr("placeholder");!e&&y&&y.label&&(e=y.label.text()),b=e,r.expect(l,"aria-label",e)}function u(){x&&(A=A||x.find("md-select-menu").controller("mdSelectMenu"),C.setLabelText(A.selectedLabels()))}function p(){if(b){var e=A.selectedLabels({mode:"aria"});l.attr("aria-label",e.length?b+": "+e:b)}}function f(){y&&y.setHasValue(A.selectedLabels().length>0||(l[0].validity||{}).badInput)}function m(){if(x=angular.element(l[0].querySelector("._md-select-menu-container")),D=a,i.mdContainerClass){var e=x[0].getAttribute("class")+" "+i.mdContainerClass;x[0].setAttribute("class",e)}A=x.find("md-select-menu").controller("mdSelectMenu"),A.init(M,i.ngModel),l.on("$destroy",function(){x.remove()})}function h(e){var t=[32,13,38,40];if(-1!=t.indexOf(e.keyCode))e.preventDefault(),g(e);else if(e.keyCode<=90&&e.keyCode>=31){e.preventDefault();var n=A.optNodeForKeyboardSearch(e);if(!n)return;var r=angular.element(n).controller("mdOption");A.isMultiple||A.deselect(Object.keys(A.selected)[0]),A.select(r.hashKey,r.value),A.refreshViewValue()}}function g(){D.isOpen=!0,l.attr("aria-expanded","true"),e.show({scope:D,preserveScope:!0,skipCompile:!0,element:x,target:l[0],selectCtrl:C,preserveElement:!0,hasBackdrop:!0,loadingAsync:i.mdOnOpen?a.$eval(i.mdOnOpen)||!0:!1})["finally"](function(){D.isOpen=!1,l.focus(),l.attr("aria-expanded","false"),M.$setTouched()})}var v,b,$=!0,y=d[0],C=d[1],M=d[2],k=d[3],w=l.find("md-select-value"),E=angular.isDefined(i.readonly);if(y){var S=y.isErrorGetter||function(){return M.$invalid&&M.$touched};if(y.input)throw new Error("<md-input-container> can only have *one* child <input>, <textarea> or <select> element!");y.input=l,y.label||r.expect(l,"aria-label",l.attr("placeholder")),a.$watch(S,y.setInvalid)}var x,D,A;if(m(),n(l),i.name&&k){var O=l.parent()[0].querySelector('select[name=".'+i.name+'"]');t.nextTick(function(){var e=angular.element(O).controller("ngModel");e&&k.$removeControl(e)})}k&&angular.isDefined(i.multiple)&&t.nextTick(function(){var e=M.$modelValue||M.$viewValue;e&&k.$setPristine()});var T=M.$render;M.$render=function(){T(),u(),p(),f()},i.$observe("placeholder",M.$render),C.setLabelText=function(e){C.setIsPlaceholder(!e);var t=i.placeholder||(y&&y.label?y.label.text():"");e=e||t||"";var n=w.children().eq(0);n.html(e)},C.setIsPlaceholder=function(e){e?(w.addClass("_md-select-placeholder"),y&&y.label&&y.label.addClass("_md-placeholder")):(w.removeClass("_md-select-placeholder"),y&&y.label&&y.label.removeClass("_md-placeholder"))},E||(l.on("focus",function(e){y&&y.element.hasClass("md-input-has-value")&&y.setFocused(!0)}),t.nextTick(function(){l.on("blur",function(){$&&($=!1,M.$setUntouched()),D.isOpen||(y&&y.setFocused(!1),f())})})),C.triggerClose=function(){o(i.mdOnClose)(a)},a.$$postDigest(function(){c(),u(),p()}),a.$watch(A.selectedLabels,u);var _;i.$observe("ngMultiple",function(e){_&&_();var t=o(e);_=a.$watch(function(){return t(a)},function(e,t){void 0===e&&void 0===t||(e?l.attr("multiple","multiple"):l.removeAttr("multiple"),l.attr("aria-multiselectable",e?"true":"false"),x&&(A.setMultiple(e),T=M.$render,M.$render=function(){T(),u(),p(),f()},M.$render()))})}),i.$observe("disabled",function(e){angular.isString(e)&&(e=!0),void 0!==v&&v===e||(v=e,e?(l.attr({tabindex:-1,"aria-disabled":"true"}),l.off("click",g),l.off("keydown",h)):(l.attr({tabindex:i.tabindex,"aria-disabled":"false"}),l.on("click",g),l.on("keydown",h)))}),i.disabled||i.ngDisabled||(l.attr({tabindex:i.tabindex,"aria-disabled":"false"}),l.on("click",g),l.on("keydown",h));var R={role:"listbox","aria-expanded":"false","aria-multiselectable":s&&!i.ngMultiple?"true":"false"};l[0].hasAttribute("id")||(R.id="select_"+t.nextUid());var L="select_container_"+t.nextUid();x.attr("id",L),R["aria-owns"]=L,l.attr(R),a.$on("$destroy",function(){e.destroy()["finally"](function(){y&&(y.setFocused(!1),y.setHasValue(!1),y.input=null),M.$setTouched()})})}}return{restrict:"E",require:["^?mdInputContainer","mdSelect","ngModel","?^form"],compile:l,controller:function(){}}}function SelectMenuDirective(e,t,n){function r(e,r,a,o){function l(e){13!=e.keyCode&&32!=e.keyCode||i(e)}function i(n){var r=t.getClosest(n.target,"md-option"),a=r&&angular.element(r).data("$mdOptionController");if(r&&a){if(r.hasAttribute("disabled"))return n.stopImmediatePropagation(),!1;var o=d.hashGetter(a.value),l=angular.isDefined(d.selected[o]);e.$apply(function(){d.isMultiple?l?d.deselect(o):d.select(o,a.value):l||(d.deselect(Object.keys(d.selected)[0]),d.select(o,a.value)),d.refreshViewValue()})}}var d=o[0];n(r),r.on("click",i),r.on("keypress",l)}function a(n,r,a){function o(){var e=i.ngModel.$modelValue||i.ngModel.$viewValue||[];if(angular.isArray(e)){var t=Object.keys(i.selected),n=e.map(i.hashGetter),r=t.filter(function(e){return-1===n.indexOf(e)});r.forEach(i.deselect),n.forEach(function(t,n){i.select(t,e[n])})}}function l(){var e=i.ngModel.$viewValue||i.ngModel.$modelValue;Object.keys(i.selected).forEach(i.deselect),i.select(i.hashGetter(e),e)}var i=this;i.isMultiple=angular.isDefined(r.multiple),i.selected={},i.options={},n.$watchCollection(function(){return i.options},function(){i.ngModel.$render()});var d,c;i.setMultiple=function(e){function t(e,t){return angular.isArray(e||t||[])}var r=i.ngModel;c=c||r.$isEmpty,i.isMultiple=e,d&&d(),i.isMultiple?(r.$validators["md-multiple"]=t,r.$render=o,n.$watchCollection(i.modelBinding,function(e){t(e)&&o(e),i.ngModel.$setPristine()}),r.$isEmpty=function(e){return!e||0===e.length}):(delete r.$validators["md-multiple"],r.$render=l)};var s,u,p,f="",m=300;i.optNodeForKeyboardSearch=function(e){s&&clearTimeout(s),s=setTimeout(function(){s=void 0,f="",p=void 0,u=void 0},m),f+=String.fromCharCode(e.keyCode);var t=new RegExp("^"+f,"i");u||(u=a.find("md-option"),p=new Array(u.length),angular.forEach(u,function(e,t){p[t]=e.textContent.trim()}));for(var n=0;n<p.length;++n)if(t.test(p[n]))return u[n]},i.init=function(t,r){if(i.ngModel=t,i.modelBinding=r,t.$options&&t.$options.trackBy){var a={},o=e(t.$options.trackBy);i.hashGetter=function(e,t){return a.$value=e,o(t||n,a)}}else i.hashGetter=function(e){return angular.isObject(e)?"object_"+(e.$$mdSelectId||(e.$$mdSelectId=++selectNextId)):e};i.setMultiple(i.isMultiple)},i.selectedLabels=function(e){e=e||{};var n=e.mode||"html",r=t.nodesToArray(a[0].querySelectorAll("md-option[selected]"));if(r.length){var o;return"html"==n?o=function(e){var t=e.innerHTML,n=e.querySelector(".md-ripple-container");return n?t.replace(n.outerHTML,""):t}:"aria"==n&&(o=function(e){return e.hasAttribute("aria-label")?e.getAttribute("aria-label"):e.textContent}),r.map(o).join(", ")}return""},i.select=function(e,t){var n=i.options[e];n&&n.setSelected(!0),i.selected[e]=t},i.deselect=function(e){var t=i.options[e];t&&t.setSelected(!1),delete i.selected[e]},i.addOption=function(e,t){if(angular.isDefined(i.options[e]))throw new Error('Duplicate md-option values are not allowed in a select. Duplicate value "'+t.value+'" found.');i.options[e]=t,angular.isDefined(i.selected[e])&&(i.select(e,t.value),i.refreshViewValue())},i.removeOption=function(e){delete i.options[e]},i.refreshViewValue=function(){var e,t=[];for(var n in i.selected)(e=i.options[n])?t.push(e.value):t.push(i.selected[n]);var r=i.ngModel.$options&&i.ngModel.$options.trackBy,a=i.isMultiple?t:t[0],o=i.ngModel.$modelValue;(r?angular.equals(o,a):o==a)||(i.ngModel.$setViewValue(a),i.ngModel.$render())}}return a.$inject=["$scope","$attrs","$element"],{restrict:"E",require:["mdSelectMenu"],scope:!0,controller:a,link:{pre:r}}}function OptionDirective(e,t){function n(e,t){return e.append(angular.element('<div class="_md-text">').append(e.contents())),e.attr("tabindex",t.tabindex||"0"),r}function r(n,r,a,o){function l(e,t,r){if(!c.hashGetter)return void(r||n.$$postDigest(function(){l(e,t,!0)}));var a=c.hashGetter(t,n),o=c.hashGetter(e,n);d.hashKey=o,d.value=e,c.removeOption(a,d),c.addOption(o,d)}function i(){var e={role:"option","aria-selected":"false"};r[0].hasAttribute("id")||(e.id="select_option_"+t.nextUid()),r.attr(e)}var d=o[0],c=o[1];angular.isDefined(a.ngValue)?n.$watch(a.ngValue,l):angular.isDefined(a.value)?l(a.value):n.$watch(function(){return r.text().trim()},l),a.$observe("disabled",function(e){e?r.attr("tabindex","-1"):r.attr("tabindex","0")}),n.$$postDigest(function(){a.$observe("selected",function(e){angular.isDefined(e)&&("string"==typeof e&&(e=!0),e?(c.isMultiple||c.deselect(Object.keys(c.selected)[0]),c.select(d.hashKey,d.value)):c.deselect(d.hashKey),c.refreshViewValue())})}),e.attach(n,r),i(),n.$on("$destroy",function(){c.removeOption(d.hashKey,d)})}function a(e){this.selected=!1,this.setSelected=function(t){t&&!this.selected?e.attr({selected:"selected","aria-selected":"true"}):!t&&this.selected&&(e.removeAttr("selected"),e.attr("aria-selected","false")),this.selected=t}}return a.$inject=["$element"],{restrict:"E",require:["mdOption","^^mdSelectMenu"],controller:a,compile:n}}function OptgroupDirective(){function e(e,t){var n=e.find("label");n.length||(n=angular.element("<label>"),e.prepend(n)),n.addClass("_md-container-ignore"),t.label&&n.text(t.label)}return{restrict:"E",compile:e}}function SelectProvider(e){function t(e,t,l,i,d,c,s,u,p){function f(e,t,n){function r(){return s(t,{addClass:"_md-leave"}).start()}function a(){t.removeClass("_md-active"),t.attr("aria-hidden","true"),t[0].style.display="none",h(n),!n.$destroy&&n.restoreFocus&&n.target.focus()}return n=n||{},n.cleanupInteraction(),n.cleanupResizing(),n.hideBackdrop(),n.$destroy===!0?a():r().then(a)}function m(n,r,a){function o(e,t,n){return n.parent.append(t),d(function(e,n){try{s(t,{removeClass:"_md-leave",duration:0}).start().then(f).then(e)}catch(r){n(r)}})}function f(){return d(function(e){if(a.isRemoved)return d.reject(!1);var t=g(n,r,a);t.container.element.css(b.toCss(t.container.styles)),t.dropDown.element.css(b.toCss(t.dropDown.styles)),c(function(){r.addClass("_md-active"),t.dropDown.element.css(b.toCss({transform:""})),h(a.focusedNode),e()})})}function m(e,t,n){return n.disableParentScroll&&!l.getClosest(n.target,"MD-DIALOG")?n.restoreScroll=l.disableScrollAround(n.element,n.parent):n.disableParentScroll=!1,n.hasBackdrop&&(n.backdrop=l.createBackdrop(e,"_md-select-backdrop _md-click-catcher"),u.enter(n.backdrop,p[0].body,null,{duration:0})),function(){n.backdrop&&n.backdrop.remove(),n.disableParentScroll&&n.restoreScroll(),delete n.restoreScroll}}function h(e){e&&!e.hasAttribute("disabled")&&e.focus()}function $(e,t){var n=r.find("md-select-menu");if(!t.target)throw new Error(l.supplant(v,[t.target]));angular.extend(t,{isRemoved:!1,target:angular.element(t.target),parent:angular.element(t.parent),selectEl:n,contentEl:r.find("md-content"),optionNodes:n[0].getElementsByTagName("md-option")})}function y(){var e=function(e,t,n){return function(){if(!n.isRemoved){var r=g(e,t,n),a=r.container,o=r.dropDown;a.element.css(b.toCss(a.styles)),o.element.css(b.toCss(o.styles))}}}(n,r,a),t=angular.element(i);return t.on("resize",e),t.on("orientationchange",e),function(){t.off("resize",e),t.off("orientationchange",e)}}function C(){a.loadingAsync&&!a.isRemoved&&(n.$$loadingAsyncDone=!1,n.progressMode="indeterminate",d.when(a.loadingAsync).then(function(){n.$$loadingAsyncDone=!0,n.progressMode="",delete a.loadingAsync}).then(function(){c(f)}))}function M(){function n(t){t.preventDefault(),t.stopPropagation(),a.restoreFocus=!1,l.nextTick(e.hide,!0)}function o(n){var r=t.KEY_CODE;switch(n.preventDefault(),n.stopPropagation(),n.keyCode){case r.UP_ARROW:return c();case r.DOWN_ARROW:return d();case r.SPACE:case r.ENTER:var o=l.getClosest(n.target,"md-option");o&&(u.triggerHandler({type:"click",target:o}),n.preventDefault()),s(n);break;case r.TAB:case r.ESCAPE:n.stopPropagation(),n.preventDefault(),a.restoreFocus=!0,l.nextTick(e.hide,!0);break;default:if(n.keyCode>=31&&n.keyCode<=90){var i=u.controller("mdSelectMenu").optNodeForKeyboardSearch(n);a.focusedNode=i||a.focusedNode,i&&i.focus()}}}function i(e){var t,n=l.nodesToArray(a.optionNodes),r=n.indexOf(a.focusedNode);do-1===r?r=0:"next"===e&&r<n.length-1?r++:"prev"===e&&r>0&&r--,t=n[r],t.hasAttribute("disabled")&&(t=void 0);while(!t&&r<n.length-1&&r>0);t&&t.focus(),a.focusedNode=t}function d(){i("next")}function c(){i("prev")}function s(t){function n(){var e=!1;if(t&&t.currentTarget.children.length>0){var n=t.currentTarget.children[0],r=n.scrollHeight>n.clientHeight;if(r&&n.children.length>0){var a=t.pageX-t.currentTarget.getBoundingClientRect().left;a>n.querySelector("md-option").offsetWidth&&(e=!0)}}return e}if(!(t&&"click"==t.type&&t.currentTarget!=u[0]||n())){var r=l.getClosest(t.target,"md-option");r&&r.hasAttribute&&!r.hasAttribute("disabled")&&(t.preventDefault(),t.stopPropagation(),p.isMultiple||(a.restoreFocus=!0,l.nextTick(function(){e.hide(p.ngModel.$viewValue)},!0)))}}if(!a.isRemoved){var u=a.selectEl,p=u.controller("mdSelectMenu")||{};return r.addClass("_md-clickable"),a.backdrop&&a.backdrop.on("click",n),u.on("keydown",o),u.on("click",s),function(){a.backdrop&&a.backdrop.off("click",n),u.off("keydown",o),u.off("click",s),r.removeClass("_md-clickable"),a.isRemoved=!0}}}return C(),$(n,a),a.hideBackdrop=m(n,r,a),o(n,r,a).then(function(e){return r.attr("aria-hidden","false"),a.alreadyOpen=!0,a.cleanupInteraction=M(),a.cleanupResizing=y(),e},a.hideBackdrop)}function h(e){var t=e.selectCtrl;if(t){var n=e.selectEl.controller("mdSelectMenu");t.setLabelText(n.selectedLabels()),t.triggerClose()}}function g(e,t,d){var c,s=t[0],u=d.target[0].children[0],f=p[0].body,m=d.selectEl[0],h=d.contentEl[0],g=f.getBoundingClientRect(),v=u.getBoundingClientRect(),b=!1,$={left:g.left+SELECT_EDGE_MARGIN,top:SELECT_EDGE_MARGIN,bottom:g.height-SELECT_EDGE_MARGIN,right:g.width-SELECT_EDGE_MARGIN-(l.floatingScrollbars()?16:0)},y={top:v.top-$.top,left:v.left-$.left,right:$.right-(v.left+v.width),bottom:$.bottom-(v.top+v.height)},C=g.width-2*SELECT_EDGE_MARGIN,M=m.querySelector("md-option[selected]"),k=m.getElementsByTagName("md-option"),w=m.getElementsByTagName("md-optgroup"),E=o(t,h),S=n(d.loadingAsync);c=S?h.firstElementChild||h:M?M:w.length?w[0]:k.length?k[0]:h.firstElementChild||h,h.offsetWidth>C?h.style["max-width"]=C+"px":h.style.maxWidth=null,b&&(h.style["min-width"]=v.width+"px"),E&&m.classList.add("_md-overflow");var x=c;"MD-OPTGROUP"===(x.tagName||"").toUpperCase()&&(x=k[0]||h.firstElementChild||h,c=x),d.focusedNode=x,s.style.display="block";var D=m.getBoundingClientRect(),A=a(c);if(c){var O=i.getComputedStyle(c);A.paddingLeft=parseInt(O.paddingLeft,10)||0,A.paddingRight=parseInt(O.paddingRight,10)||0}if(E){var T=h.offsetHeight/2;h.scrollTop=A.top+A.height/2-T,y.top<T?h.scrollTop=Math.min(A.top,h.scrollTop+T-y.top):y.bottom<T&&(h.scrollTop=Math.max(A.top+A.height-D.height,h.scrollTop-T+y.bottom))}var _,R,L,N;b?(_=v.left,R=v.top+v.height,L="50% 0",R+D.height>$.bottom&&(R=v.top-D.height,L="50% 100%")):(_=v.left+A.left-A.paddingLeft+2,R=Math.floor(v.top+v.height/2-A.height/2-A.top+h.scrollTop)+2,L=A.left+v.width/2+"px "+(A.top+A.height/2-h.scrollTop)+"px 0px",N=Math.min(v.width+A.paddingLeft+A.paddingRight,C));var V=s.getBoundingClientRect(),B=Math.round(100*Math.min(v.width/D.width,1))/100,G=Math.round(100*Math.min(v.height/D.height,1))/100;return{container:{element:angular.element(s),styles:{left:Math.floor(r($.left,_,$.right-V.width)),top:Math.floor(r($.top,R,$.bottom-V.height)),"min-width":N}},dropDown:{element:angular.element(m),styles:{transformOrigin:L,transform:d.alreadyOpen?"":l.supplant("scale({0},{1})",[B,G])}}}}var v="$mdSelect.show() expected a target element in options.target but got '{0}'!",b=l.dom.animator;return{parent:"body",themable:!0,onShow:m,onRemove:f,hasBackdrop:!0,disableParentScroll:!0}}function n(e){return e&&angular.isFunction(e.then)}function r(e,t,n){return Math.max(e,Math.min(t,n))}function a(e){return e?{left:e.offsetLeft,top:e.offsetTop,width:e.offsetWidth,height:e.offsetHeight}:{left:0,top:0,width:0,height:0}}function o(e,t){var n=!1;try{var r=e[0].style.display;e[0].style.display="block",n=t.scrollHeight>t.offsetHeight,e[0].style.display=r}finally{}return n}return t.$inject=["$mdSelect","$mdConstant","$mdUtil","$window","$q","$$rAF","$animateCss","$animate","$document"],e("$mdSelect").setDefaults({methods:["target"],options:t})}goog.provide("ng.material.components.select"),goog.require("ng.material.components.backdrop"),goog.require("ng.material.core");var SELECT_EDGE_MARGIN=8,selectNextId=0;angular.module("material.components.select",["material.core","material.components.backdrop"]).directive("mdSelect",SelectDirective).directive("mdSelectMenu",SelectMenuDirective).directive("mdOption",OptionDirective).directive("mdOptgroup",OptgroupDirective).provider("$mdSelect",SelectProvider),SelectDirective.$inject=["$mdSelect","$mdUtil","$mdTheming","$mdAria","$compile","$parse"],SelectMenuDirective.$inject=["$parse","$mdUtil","$mdTheming"],OptionDirective.$inject=["$mdButtonInkRipple","$mdUtil"],SelectProvider.$inject=["$$interimElementProvider"],ng.material.components.select=angular.module("material.components.select");