ion-header-scroll-opacity/bundles/ion-header-scroll-opacity.umd.min.js

Change header background opacity on content scroll

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@ionic/angular")):"function"==typeof define&&define.amd?define("ion-header-scroll-opacity",["exports","@angular/core","@ionic/angular"],e):e((t=t||self)["ion-header-scroll-opacity"]={},t.ng.core,t["@ionic/angular"])}(this,function(t,e,n){"use strict";function o(t,e,n,o){var r,i=arguments.length,c=i<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)c=Reflect.decorate(t,e,n,o);else for(var l=t.length-1;l>=0;l--)(r=t[l])&&(c=(i<3?r(c):i>3?r(e,n,c):r(e,n))||c);return i>3&&c&&Object.defineProperty(e,n,c),c}function r(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}function i(t,e){var n,o,r,i,c={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return i={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function l(i){return function(l){return function(i){if(n)throw new TypeError("Generator is already executing.");for(;c;)try{if(n=1,o&&(r=2&i[0]?o.return:i[0]?o.throw||((r=o.return)&&r.call(o),0):o.next)&&!(r=r.call(o,i[1])).done)return r;switch(o=0,r&&(i=[2&i[0],r.value]),i[0]){case 0:case 1:r=i;break;case 4:return c.label++,{value:i[1],done:!1};case 5:c.label++,o=i[1],i=[0];continue;case 7:i=c.ops.pop(),c.trys.pop();continue;default:if(!(r=(r=c.trys).length>0&&r[r.length-1])&&(6===i[0]||2===i[0])){c=0;continue}if(3===i[0]&&(!r||i[1]>r[0]&&i[1]<r[3])){c.label=i[1];break}if(6===i[0]&&c.label<r[1]){c.label=r[1],r=i;break}if(r&&c.label<r[2]){c.label=r[2],c.ops.push(i);break}r[2]&&c.ops.pop(),c.trys.pop();continue}i=e.call(t,c)}catch(t){i=[6,t],o=0}finally{n=r=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,l])}}}var c=function(){function t(t){this.renderer=t,this.scrollAmount=88,this.isTransparent=!0}return t.prototype.ngOnInit=function(){return t=this,e=void 0,o=function(){var t,e=this;return i(this,function(n){switch(n.label){case 0:if(!this.toolbar)throw new Error("IonToolbar component not found for scrollOpacity directive");return t=this,[4,this.ionContentRef.getScrollElement()];case 1:return t.scrollArea=n.sent(),this.scrollSbuscription=this.ionContentRef.ionScroll.subscribe(function(){e.changeOpacity()}),this.toolbarEl=this.toolbar.el,this.toolbarEl.componentOnReady().then(function(){e.renderer.setStyle(e.toolbarBackgroundEl,"opacity",e.isTransparent?0:1)}),[2]}})},new((n=void 0)||(n=Promise))(function(r,i){function c(t){try{a(o.next(t))}catch(t){i(t)}}function l(t){try{a(o.throw(t))}catch(t){i(t)}}function a(t){t.done?r(t.value):new n(function(e){e(t.value)}).then(c,l)}a((o=o.apply(t,e||[])).next())});var t,e,n,o},t.prototype.ngOnDestroy=function(){this.scrollSbuscription.unsubscribe()},Object.defineProperty(t.prototype,"toolbarBackgroundEl",{get:function(){return this.toolbarEl.shadowRoot.children[0]},enumerable:!0,configurable:!0}),t.prototype.changeOpacity=function(){var t=((this.isTransparent?1:2)-(this.scrollArea.scrollTop+this.scrollAmount)/this.scrollAmount)*(this.isTransparent?-1:1);t>1&&(t=1),t<0&&(t=0),this.renderer.setStyle(this.toolbarBackgroundEl,"opacity",t)},o([e.Input(),r("design:type",n.IonContent)],t.prototype,"ionContentRef",void 0),o([e.Input(),r("design:type",Object)],t.prototype,"scrollAmount",void 0),o([e.Input(),r("design:type",Object)],t.prototype,"isTransparent",void 0),o([e.ContentChild(n.IonToolbar,{static:!0}),r("design:type",n.IonToolbar)],t.prototype,"toolbar",void 0),t=o([e.Directive({selector:"ion-header[scrollOpacity]"}),r("design:paramtypes",[e.Renderer2])],t)}(),l=function(){function t(){}return t=o([e.NgModule({declarations:[c],exports:[c]})],t)}();t.IonHeaderScrollOpacityModule=l,t.ɵa=c,Object.defineProperty(t,"__esModule",{value:!0})});
//# sourceMappingURL=ion-header-scroll-opacity.umd.min.js.map