├── LICENSE ├── README.md ├── index.html ├── lib ├── angular.js └── es5-shim.js └── stop-watch-app ├── index.html └── stop-watch-app.js /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 Ahsan Ayaz 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # angular-elements-demos 2 | Demo apps / widgets based on angular elements (custom elements) 3 | 4 | # Angular Elements 5 | Angular Elements is an intiative by the Angular Team and has a label of a new idea Angular Labs. 6 | You can learn about that in [Rob Wormald](https://github.com/robwormald)'s amazing [talk](https://www.youtube.com/watch?v=ljsOPm4MMEo) at Angular Mix. 7 | 8 | ## Repo's purpose 9 | 10 | The idea is to share demo apps / widgets using angular-elements that are reusable as Custom Elements throughout 11 | web pages built on any framework (or no framework at all). 12 | 13 | You can build amazing web components using angular-elements and share them here so anyone can use them. 14 | 15 | ## Demos 16 | 17 | You can see the demos in this repository [here](https://ahsanayaz.github.io/angular-elements-demos) -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Ng Elements Playground 8 | 41 | 42 | 43 |

44 | Angular Elements Demo Apps / Widgets 45 |

46 |

48 | Stop Watch App 49 |
Angular Element App being used in a usual html5 page without any js framework
50 |

52 | 53 | 54 | -------------------------------------------------------------------------------- /lib/angular.js: -------------------------------------------------------------------------------- 1 | !function(e){function t(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var n=window.webpackJsonp;window.webpackJsonp=function(r,i,u){for(var s,a,c,l=0,f=[];l-1)return t.push(e[n]),t;t.push(e[n])}return t}function x(e){if(e.length>1){return" ("+C(e.slice().reverse()).map(function(e){return u(e.token)}).join(" -> ")+")"}return""}function E(e,t,n,r){var o=[t],i=n(o),u=r?w(i,r):Error(i);return u.addKey=O,u.keys=o,u.injectors=[e],u.constructResolvingMessage=n,u[yi]=r,u}function O(e,t){this.injectors.push(e),this.keys.push(t),this.message=this.constructResolvingMessage(this.keys)}function k(e,t){return E(e,t,function(e){return"No provider for "+u(e[0].token)+"!"+x(e)})}function P(e,t){return E(e,t,function(e){return"Cannot instantiate cyclic dependency!"+x(e)})}function j(e,t,n,r){return E(e,r,function(e){var n=u(e[0].token);return t.message+": Error during instantiation of "+n+"!"+x(e)+"."},t)}function R(e){return Error("Invalid provider - only instances of Provider and Type are allowed, got: "+e)}function A(e,t){for(var n=[],r=0,o=t.length;r-1&&e.splice(n,1)}function he(e,t){var n=Iu.get(e);if(n)throw new Error("Duplicate module registered for "+e+" - "+n.moduleType.name+" vs "+t.moduleType.name);Iu.set(e,t)}function ye(e){var t=Iu.get(e);if(!t)throw new Error("No module with ID "+e+" loaded");return t}function ve(e){return e.reduce(function(e,t){var n=Array.isArray(t)?ve(t):t;return e.concat(n)},[])}function be(e,t,n){if(!e)throw new Error("Cannot find '"+n+"' in '"+t+"'");return e}function ge(e){return e.map(function(e){return e.nativeElement})}function me(e,t,n){e.childNodes.forEach(function(e){e instanceof zu&&(t(e)&&n.push(e),me(e,t,n))})}function _e(e,t,n){e instanceof zu&&e.childNodes.forEach(function(e){t(e)&&n.push(e),e instanceof zu&&_e(e,t,n)})}function we(e){return Ku.get(e)||null}function Ce(e){Ku.set(e.nativeNode,e)}function xe(e){Ku.delete(e.nativeNode)}/** 37 | * @license 38 | * Copyright Google Inc. All Rights Reserved. 39 | * 40 | * Use of this source code is governed by an MIT-style license that can be 41 | * found in the LICENSE file at https://angular.io/license 42 | */ 43 | function Ee(e,t){var n=Oe(e),r=Oe(t);if(n&&r)return ke(e,t,Ee);var o=e&&("object"==typeof e||"function"==typeof e),u=t&&("object"==typeof t||"function"==typeof t);return!(n||!o||r||!u)||i(e,t)}function Oe(e){return!!je(e)&&(Array.isArray(e)||!(e instanceof Map)&&r()in e)}function ke(e,t,n){for(var o=e[r()](),i=t[r()]();;){var u=o.next(),s=i.next();if(u.done&&s.done)return!0;if(u.done||s.done)return!1;if(!n(u.value,s.value))return!1}}function Pe(e,t){if(Array.isArray(e))for(var n=0;n0&&Tt(e,t,0,n)&&(d=!0),p>1&&Tt(e,t,1,r)&&(d=!0),p>2&&Tt(e,t,2,o)&&(d=!0),p>3&&Tt(e,t,3,i)&&(d=!0),p>4&&Tt(e,t,4,u)&&(d=!0),p>5&&Tt(e,t,5,s)&&(d=!0),p>6&&Tt(e,t,6,a)&&(d=!0),p>7&&Tt(e,t,7,c)&&(d=!0),p>8&&Tt(e,t,8,l)&&(d=!0),p>9&&Tt(e,t,9,f)&&(d=!0),d}function At(e,t,n){for(var r=!1,o=0;o0?o[n-1]:null,r)}function zt(e,t){var n=nt(t);if(n&&n!==e&&!(16&t.state)){t.state|=16;var r=n.template._projectedViews;r||(r=n.template._projectedViews=[]),r.push(t),Kt(t.parent.def,t.parentNodeDef)}}function Kt(e,t){if(!(4&t.flags)){e.nodeFlags|=4,t.flags|=4;for(var n=t.parent;n;)n.childFlags|=4,n=n.parent}}function Wt(e,t){var n=e.viewContainer._embeddedViews;if((null==t||t>=n.length)&&(t=n.length-1),t<0)return null;var r=n[t];return r.viewContainerParent=null,Xt(n,t),ws.dirtyParentQueries(r),Gt(r),r}function qt(e){if(16&e.state){var t=nt(e);if(t){var n=t.template._projectedViews;n&&(Xt(n,n.indexOf(e)),ws.dirtyParentQueries(e))}}}function Yt(e,t,n){var r=e.viewContainer._embeddedViews,o=r[t];return Xt(r,t),null==n&&(n=r.length),Jt(r,n,o),ws.dirtyParentQueries(o),Gt(o),$t(e,n>0?r[n-1]:null,o),o}function $t(e,t,n){var r=t?ot(t,t.def.lastRenderRootNode):e.renderElement;ht(n,2,n.renderer.parentNode(r),n.renderer.nextSibling(r),void 0)}function Gt(e){ht(e,3,null,null,void 0)}function Jt(e,t,n){t>=e.length?e.push(n):e.splice(t,0,n)}function Xt(e,t){t>=e.length-1?e.pop():e.splice(t,1)}function en(e,t,n,r,o,i){return new Ms(e,t,n,r,o,i)}function tn(e){return e.viewDefFactory}function nn(e,t,n){return new Ds(e,t,n)}function rn(e){return new Fs(e)}function on(e,t){return new Hs(e,t)}function un(e,t){return new Ls(e,t)}function sn(e,t){var n=e.def.nodes[t];if(1&n.flags){var r=Ve(e,n.index);return n.element.template?r.template:r.renderElement}if(2&n.flags)return Me(e,n.index).renderText;if(20240&n.flags)return De(e,n.index).instance;throw new Error("Illegal state: read nodeValue for node index "+t)}function an(e){return new Us(e.renderer)}function cn(e,t,n,r){return new Qs(e,t,n,r)}function ln(e,t,n,r,o,i,u){var s=[];if(i)for(var a in i){var c=i[a],l=c[0],f=c[1];s[l]={flags:8,name:a,nonMinifiedName:f,ns:null,securityContext:null,suffix:null}}var p=[];if(u)for(var d in u)p.push({type:1,propName:d,target:null,eventName:u[d]});return e|=16384,dn(e,t,n,r,r,o,s,p)}function fn(e,t,n){return e|=16,dn(e,null,0,t,t,n)}function pn(e,t,n,r,o){return dn(e,t,0,n,r,o)}function dn(e,t,n,r,o,i,u,s){var a=ct(t),c=a.matchedQueries,l=a.references,f=a.matchedQueryIds;s||(s=[]),u||(u=[]);var p=lt(i);return{index:-1,parent:null,renderParent:null,bindingIndex:-1,outputIndex:-1,flags:e,childFlags:0,directChildFlags:0,childMatchedQueries:0,matchedQueries:c,matchedQueryIds:f,references:l,ngContentIndex:-1,childCount:n,bindings:u,bindingFlags:_t(u),outputs:s,element:null,provider:{token:r,value:o,deps:p},text:null,query:null,ngContent:null}}function hn(e,t){return 4096&t.flags?$s:_n(e,t)}function yn(e,t){for(var n=e;n.parent&&!ut(n);)n=n.parent;return wn(n.parent,rt(n),!0,t.provider.value,t.provider.deps)}function vn(e,t){var n=(32768&t.flags)>0,r=wn(e,t.parent,n,t.provider.value,t.provider.deps);if(t.outputs.length)for(var o=0;o0&&$e(e,t,0,n)&&(h=!0,y=On(e,p,t,0,n,y)),v>1&&$e(e,t,1,r)&&(h=!0,y=On(e,p,t,1,r,y)),v>2&&$e(e,t,2,o)&&(h=!0,y=On(e,p,t,2,o,y)),v>3&&$e(e,t,3,i)&&(h=!0,y=On(e,p,t,3,i,y)),v>4&&$e(e,t,4,u)&&(h=!0,y=On(e,p,t,4,u,y)),v>5&&$e(e,t,5,s)&&(h=!0,y=On(e,p,t,5,s,y)),v>6&&$e(e,t,6,a)&&(h=!0,y=On(e,p,t,6,a,y)),v>7&&$e(e,t,7,c)&&(h=!0,y=On(e,p,t,7,c,y)),v>8&&$e(e,t,8,l)&&(h=!0,y=On(e,p,t,8,l,y)),v>9&&$e(e,t,9,f)&&(h=!0,y=On(e,p,t,9,f,y)),y&&d.ngOnChanges(y),2&e.state&&65536&t.flags&&d.ngOnInit(),262144&t.flags&&d.ngDoCheck(),h}function mn(e,t,n){for(var r=De(e,t.index),o=r.instance,i=!1,u=void 0,s=0;s0,o=t.provider;switch(201347067&t.flags){case 512:n=wn(e,t.parent,r,o.value,o.deps);break;case 1024:n=Cn(e,t.parent,r,o.value,o.deps);break;case 2048:n=xn(e,t.parent,r,o.deps[0]);break;case 256:n=o.value}return n}function wn(e,t,n,r,o){var i,u=o.length;switch(u){case 0:i=new r;break;case 1:i=new r(xn(e,t,n,o[0]));break;case 2:i=new r(xn(e,t,n,o[0]),xn(e,t,n,o[1]));break;case 3:i=new r(xn(e,t,n,o[0]),xn(e,t,n,o[1]),xn(e,t,n,o[2]));break;default:for(var s=new Array(u),a=0;a0&&Ge(e,t,0,n)&&(d=!0),h>1&&Ge(e,t,1,r)&&(d=!0),h>2&&Ge(e,t,2,o)&&(d=!0),h>3&&Ge(e,t,3,i)&&(d=!0),h>4&&Ge(e,t,4,u)&&(d=!0),h>5&&Ge(e,t,5,s)&&(d=!0),h>6&&Ge(e,t,6,a)&&(d=!0),h>7&&Ge(e,t,7,c)&&(d=!0),h>8&&Ge(e,t,8,l)&&(d=!0),h>9&&Ge(e,t,9,f)&&(d=!0),d){var y=Fe(e,t.index),v=void 0;switch(201347067&t.flags){case 32:v=new Array(p.length),h>0&&(v[0]=n),h>1&&(v[1]=r),h>2&&(v[2]=o),h>3&&(v[3]=i),h>4&&(v[4]=u),h>5&&(v[5]=s),h>6&&(v[6]=a),h>7&&(v[7]=c),h>8&&(v[8]=l),h>9&&(v[9]=f);break;case 64:v={},h>0&&(v[p[0].name]=n),h>1&&(v[p[1].name]=r),h>2&&(v[p[2].name]=o),h>3&&(v[p[3].name]=i),h>4&&(v[p[4].name]=u),h>5&&(v[p[5].name]=s),h>6&&(v[p[6].name]=a),h>7&&(v[p[7].name]=c),h>8&&(v[p[8].name]=l),h>9&&(v[p[9].name]=f);break;case 128:var b=n;switch(h){case 1:v=b.transform(n);break;case 2:v=b.transform(r);break;case 3:v=b.transform(r,o);break;case 4:v=b.transform(r,o,i);break;case 5:v=b.transform(r,o,i,u);break;case 6:v=b.transform(r,o,i,u,s);break;case 7:v=b.transform(r,o,i,u,s,a);break;case 8:v=b.transform(r,o,i,u,s,a,c);break;case 9:v=b.transform(r,o,i,u,s,a,c,l);break;case 10:v=b.transform(r,o,i,u,s,a,c,l,f)}}y.value=v}return d}function Bn(e,t,n){for(var r=t.bindings,o=!1,i=0;i0&&Ge(e,t,0,n)&&(p=!0),h>1&&Ge(e,t,1,r)&&(p=!0),h>2&&Ge(e,t,2,o)&&(p=!0),h>3&&Ge(e,t,3,i)&&(p=!0),h>4&&Ge(e,t,4,u)&&(p=!0),h>5&&Ge(e,t,5,s)&&(p=!0),h>6&&Ge(e,t,6,a)&&(p=!0),h>7&&Ge(e,t,7,c)&&(p=!0),h>8&&Ge(e,t,8,l)&&(p=!0),h>9&&Ge(e,t,9,f)&&(p=!0),p){var y=t.text.prefix;h>0&&(y+=qn(n,d[0])),h>1&&(y+=qn(r,d[1])),h>2&&(y+=qn(o,d[2])),h>3&&(y+=qn(i,d[3])),h>4&&(y+=qn(u,d[4])),h>5&&(y+=qn(s,d[5])),h>6&&(y+=qn(a,d[6])),h>7&&(y+=qn(c,d[7])),h>8&&(y+=qn(l,d[8])),h>9&&(y+=qn(f,d[9]));var v=Me(e,t.index).renderText;e.renderer.setValue(v,y)}return p}function Wn(e,t,n){for(var r=t.bindings,o=!1,i=0;ic.index+c.childCount;){var h=c.parent;h&&(h.childFlags|=c.childFlags,h.childMatchedQueries|=c.childMatchedQueries),c=h}var y=t[d];y.index=d,y.parent=c,y.bindingIndex=o,y.outputIndex=i;var v=void 0;if(v=c&&1&c.flags&&!c.element.name?c.renderParent:c,y.renderParent=v,y.element){var b=y.element;b.publicProviders=c?c.element.publicProviders:Object.create(null),b.allProviders=b.publicProviders,l=!1,f=!1}if($n(c,y,t.length),u|=y.flags,a|=y.matchedQueryIds,y.element&&y.element.template&&(a|=y.element.template.nodeMatchedQueries),c?(c.childFlags|=y.flags,c.directChildFlags|=y.flags,c.childMatchedQueries|=y.matchedQueryIds,y.element&&y.element.template&&(c.childMatchedQueries|=y.element.template.nodeMatchedQueries)):s|=y.flags,o+=y.bindings.length,i+=y.outputs.length,!v&&3&y.flags&&(p=y),20224&y.flags){l||(l=!0,c.element.publicProviders=Object.create(c.element.publicProviders),c.element.allProviders=c.element.publicProviders);var g=0!=(8192&y.flags),m=0!=(32768&y.flags);!g||m?c.element.publicProviders[Ke(y.provider.token)]=y:(f||(f=!0,c.element.allProviders=Object.create(c.element.publicProviders)),c.element.allProviders[Ke(y.provider.token)]=y),m&&(c.element.componentProvider=y)}y.childCount&&(c=y)}for(;c;){var h=c.parent;h&&(h.childFlags|=c.childFlags,h.childMatchedQueries|=c.childMatchedQueries),c=h}var _=function(e,n,r,o){return t[n].element.handleEvent(e,r,o)};return{factory:null,nodeFlags:u,rootNodeFlags:s,nodeMatchedQueries:a,flags:e,nodes:t,updateDirectives:n||Cs,updateRenderer:r||Cs,handleEvent:_||Cs,bindingCount:o,outputCount:i,lastRenderRootNode:p}}function $n(e,t,n){var r=t.element&&t.element.template;if(r){if(!r.lastRenderRootNode)throw new Error("Illegal State: Embedded templates without nodes are not allowed!");if(r.lastRenderRootNode&&16777216&r.lastRenderRootNode.flags)throw new Error("Illegal State: Last root node of a template can't have embedded views, at index "+t.index+"!")}if(20224&t.flags){if(0==(1&(e?e.flags:0)))throw new Error("Illegal State: Provider/Directive nodes need to be children of elements or anchors, at index "+t.index+"!")}if(t.query){if(67108864&t.flags&&(!e||0==(16384&e.flags)))throw new Error("Illegal State: Content Query nodes need to be children of directives, at index "+t.index+"!");if(134217728&t.flags&&e)throw new Error("Illegal State: View Query nodes have to be top level nodes, at index "+t.index+"!")}if(t.childCount){var o=e?e.index+e.childCount:n-1;if(t.index<=o&&t.index+t.childCount>o)throw new Error("Illegal State: childCount of node leads outside of parent, at index "+t.index+"!")}}function Gn(e,t,n,r){var o=er(e.root,e.renderer,e,t,n);return tr(o,e.component,r),nr(o),o}function Jn(e,t,n){var r=er(e,e.renderer,null,null,t);return tr(r,n,n),nr(r),r}function Xn(e,t,n,r){var o,i=t.element.componentRendererType;return o=i?e.root.rendererFactory.createRenderer(r,i):e.root.renderer,er(e.root,o,e,t.element.componentProvider,n)}function er(e,t,n,r,o){var i=new Array(o.nodes.length),u=o.outputCount?new Array(o.outputCount):null;return{def:o,parent:n,viewContainerParent:null,parentNodeDef:r,context:null,component:null,nodes:i,state:13,root:e,renderer:t,oldValues:new Array(o.bindingCount),disposables:u}}function tr(e,t,n){e.component=t,e.context=n}function nr(e){var t;if(ut(e)){var n=e.parentNodeDef;t=Ve(e.parent,n.parent.index).renderElement}for(var r=e.def,o=e.nodes,i=0;i0&&Je(e,t,0,n),p>1&&Je(e,t,1,r),p>2&&Je(e,t,2,o),p>3&&Je(e,t,3,i),p>4&&Je(e,t,4,u),p>5&&Je(e,t,5,s),p>6&&Je(e,t,6,a),p>7&&Je(e,t,7,c),p>8&&Je(e,t,8,l),p>9&&Je(e,t,9,f)}function fr(e,t,n){for(var r=0;r=this._providers.length)throw T(e);return this._providers[e]},e.prototype._new=function(e){if(this._constructionCounter++>this._getMaxNumberOfObjects())throw P(this,e.key);return this._instantiateProvider(e)},e.prototype._getMaxNumberOfObjects=function(){return this.objs.length},e.prototype._instantiateProvider=function(e){if(e.multiProvider){for(var t=new Array(e.resolvedFactories.length),n=0;n0)e._bootstrapComponents.forEach(function(e){return t.bootstrap(e)});else{if(!e.instance.ngDoBootstrap)throw new Error("The module "+u(e.instance.constructor)+' was bootstrapped, but it does not declare "@NgModule.bootstrap" components nor a "ngDoBootstrap" method. Please define one of these.');e.instance.ngDoBootstrap(t)}this._modules.push(e)},t}(_u);wu.decorators=[{type:ii}],wu.ctorParameters=function(){return[{type:pi}]};var Cu=function(){function e(){}return e.prototype.bootstrap=function(e,t){},e.prototype.tick=function(){},e.prototype.componentTypes=function(){},e.prototype.components=function(){},e.prototype.attachView=function(e){},e.prototype.detachView=function(e){},e.prototype.viewCount=function(){},e.prototype.isStable=function(){},e}(),xu=function(e){function t(t,n,r,i,u,s){var a=e.call(this)||this;a._zone=t,a._console=n,a._injector=r,a._exceptionHandler=i,a._componentFactoryResolver=u,a._initStatus=s,a._bootstrapListeners=[],a._rootComponents=[],a._rootComponentTypes=[],a._views=[],a._runningTick=!1,a._enforceNoNewChanges=!1,a._stable=!0,a._enforceNoNewChanges=ue(),a._zone.onMicrotaskEmpty.subscribe({next:function(){a._zone.run(function(){a.tick()})}});var c=new wo.Observable(function(e){a._stable=a._zone.isStable&&!a._zone.hasPendingMacrotasks&&!a._zone.hasPendingMicrotasks,a._zone.runOutsideAngular(function(){e.next(a._stable),e.complete()})}),l=new wo.Observable(function(e){var t=a._zone.onStable.subscribe(function(){lu.assertNotInAngularZone(),o(function(){a._stable||a._zone.hasPendingMacrotasks||a._zone.hasPendingMicrotasks||(a._stable=!0,e.next(!0))})}),n=a._zone.onUnstable.subscribe(function(){lu.assertInAngularZone(),a._stable&&(a._stable=!1,a._zone.runOutsideAngular(function(){e.next(!1)}))});return function(){t.unsubscribe(),n.unsubscribe()}});return a._isStable=Co.merge(c,xo.share.call(l)),a}return _o.a(t,e),t.prototype.attachView=function(e){var t=e;this._views.push(t),t.attachToAppRef(this)},t.prototype.detachView=function(e){var t=e;de(this._views,t),t.detachFromAppRef()},t.prototype.bootstrap=function(e,t){var n=this;if(!this._initStatus.done)throw new Error("Cannot bootstrap as there are still asynchronous initializers running. Bootstrap components in the `ngDoBootstrap` method of the root module.");var r;r=e instanceof qi?e:this._componentFactoryResolver.resolveComponentFactory(e),this._rootComponentTypes.push(r.componentType);var o=r instanceof tu?null:this._injector.get(nu),i=t||r.selector,u=r.create(pi.NULL,[],i,o);u.onDestroy(function(){n._unloadComponent(u)});var s=u.injector.get(fu,null);return s&&u.injector.get(pu).registerApplication(u.location.nativeElement,s),this._loadComponent(u),ue()&&this._console.log("Angular is running in the development mode. Call enableProdMode() to enable the production mode."),u},t.prototype._loadComponent=function(e){this.attachView(e.hostView),this.tick(),this._rootComponents.push(e),this._injector.get(Li,[]).concat(this._bootstrapListeners).forEach(function(t){return t(e)})},t.prototype._unloadComponent=function(e){this.detachView(e.hostView),de(this._rootComponents,e)},t.prototype.tick=function(){if(this._runningTick)throw new Error("ApplicationRef.tick is called recursively");var e=t._tickScope();try{this._runningTick=!0,this._views.forEach(function(e){return e.detectChanges()}),this._enforceNoNewChanges&&this._views.forEach(function(e){return e.checkNoChanges()})}catch(e){this._exceptionHandler.handleError(e)}finally{this._runningTick=!1,uu(e)}},t.prototype.ngOnDestroy=function(){this._views.slice().forEach(function(e){return e.destroy()})},Object.defineProperty(t.prototype,"viewCount",{get:function(){return this._views.length},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"componentTypes",{get:function(){return this._rootComponentTypes},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"components",{get:function(){return this._rootComponents},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isStable",{get:function(){return this._isStable},enumerable:!0,configurable:!0}),t}(Cu);xu._tickScope=iu("ApplicationRef#tick()"),xu.decorators=[{type:ii}],xu.ctorParameters=function(){return[{type:lu},{type:Qi},{type:pi},{type:bi},{type:Gi},{type:Mi}]};/** 184 | * @license 185 | * Copyright Google Inc. All Rights Reserved. 186 | * 187 | * Use of this source code is governed by an MIT-style license that can be 188 | * found in the LICENSE file at https://angular.io/license 189 | */ 190 | /** 191 | * @license 192 | * Copyright Google Inc. All Rights Reserved. 193 | * 194 | * Use of this source code is governed by an MIT-style license that can be 195 | * found in the LICENSE file at https://angular.io/license 196 | */ 197 | var Eu=function(){function e(e,t,n,r,o,i){this.id=e,this.templateUrl=t,this.slotCount=n,this.encapsulation=r,this.styles=o,this.animations=i}return e}(),Ou=function(){function e(){}return e.prototype.injector=function(){},e.prototype.component=function(){},e.prototype.providerTokens=function(){},e.prototype.references=function(){},e.prototype.context=function(){},e.prototype.source=function(){},e}(),ku=function(){function e(){}return e.prototype.selectRootElement=function(e,t){},e.prototype.createElement=function(e,t,n){},e.prototype.createViewRoot=function(e){},e.prototype.createTemplateAnchor=function(e,t){},e.prototype.createText=function(e,t,n){},e.prototype.projectNodes=function(e,t){},e.prototype.attachViewAfter=function(e,t){},e.prototype.detachView=function(e){},e.prototype.destroyView=function(e,t){},e.prototype.listen=function(e,t,n){},e.prototype.listenGlobal=function(e,t,n){},e.prototype.setElementProperty=function(e,t,n){},e.prototype.setElementAttribute=function(e,t,n){},e.prototype.setBindingDebugInfo=function(e,t,n){},e.prototype.setElementClass=function(e,t,n){},e.prototype.setElementStyle=function(e,t,n){},e.prototype.invokeElementMethod=function(e,t,n){},e.prototype.setText=function(e,t){},e.prototype.animate=function(e,t,n,r,o,i,u){},e}(),Pu=(new ko("Renderer2Interceptor"),function(){function e(){}return e.prototype.renderComponent=function(e){},e}()),ju=function(){function e(){}return e.prototype.createRenderer=function(e,t){},e.prototype.begin=function(){},e.prototype.end=function(){},e.prototype.whenRenderingDone=function(){},e}(),Ru={};Ru.Important=1,Ru.DashCase=2,Ru[Ru.Important]="Important",Ru[Ru.DashCase]="DashCase";var Au=function(){function e(){}return e.prototype.data=function(){},e.prototype.destroy=function(){},e.prototype.createElement=function(e,t){},e.prototype.createComment=function(e){},e.prototype.createText=function(e){},e.prototype.appendChild=function(e,t){},e.prototype.insertBefore=function(e,t,n){},e.prototype.removeChild=function(e,t){},e.prototype.selectRootElement=function(e){},e.prototype.parentNode=function(e){},e.prototype.nextSibling=function(e){},e.prototype.setAttribute=function(e,t,n,r){},e.prototype.removeAttribute=function(e,t,n){},e.prototype.addClass=function(e,t){},e.prototype.removeClass=function(e,t){},e.prototype.setStyle=function(e,t,n,r){},e.prototype.removeStyle=function(e,t,n){},e.prototype.setProperty=function(e,t,n){},e.prototype.setValue=function(e,t){},e.prototype.listen=function(e,t,n){},e}(),Tu=function(){function e(e){this.nativeElement=e}return e}(),Su=function(){function e(){}return e.prototype.load=function(e){},e}(),Iu=new Map,Nu=function(){function e(){this._dirty=!0,this._results=[],this._emitter=new cu}return Object.defineProperty(e.prototype,"changes",{get:function(){return this._emitter},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"length",{get:function(){return this._results.length},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"first",{get:function(){return this._results[0]},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"last",{get:function(){return this._results[this.length-1]},enumerable:!0,configurable:!0}),e.prototype.map=function(e){return this._results.map(e)},e.prototype.filter=function(e){return this._results.filter(e)},e.prototype.find=function(e){return this._results.find(e)},e.prototype.reduce=function(e,t){return this._results.reduce(e,t)},e.prototype.forEach=function(e){this._results.forEach(e)},e.prototype.some=function(e){return this._results.some(e)},e.prototype.toArray=function(){return this._results.slice()},e.prototype[r()]=function(){return this._results[r()]()},e.prototype.toString=function(){return this._results.toString()},e.prototype.reset=function(e){this._results=ve(e),this._dirty=!1},e.prototype.notifyOnChanges=function(){this._emitter.emit(this)},e.prototype.setDirty=function(){this._dirty=!0},Object.defineProperty(e.prototype,"dirty",{get:function(){return this._dirty},enumerable:!0,configurable:!0}),e}(),Mu=function(){function e(){}return e}(),Vu={factoryPathPrefix:"",factoryPathSuffix:".ngfactory"},Du=function(){function e(e,t){this._compiler=e,this._config=t||Vu}return e.prototype.load=function(e){return this._compiler instanceof Zi?this.loadFactory(e):this.loadAndCompile(e)},e.prototype.loadAndCompile=function(e){var t=this,r=e.split("#"),o=r[0],i=r[1];return void 0===i&&(i="default"),n(18)(o).then(function(e){return e[i]}).then(function(e){return be(e,o,i)}).then(function(e){return t._compiler.compileModuleAsync(e)})},e.prototype.loadFactory=function(e){var t=e.split("#"),r=t[0],o=t[1],i="NgFactory";return void 0===o&&(o="default",i=""),n(18)(this._config.factoryPathPrefix+r+this._config.factoryPathSuffix).then(function(e){return e[o+i]}).then(function(e){return be(e,r,o)})},e}();Du.decorators=[{type:ii}],Du.ctorParameters=function(){return[{type:Zi},{type:Mu,decorators:[{type:oi}]}]};/** 198 | * @license 199 | * Copyright Google Inc. All Rights Reserved. 200 | * 201 | * Use of this source code is governed by an MIT-style license that can be 202 | * found in the LICENSE file at https://angular.io/license 203 | */ 204 | var Fu=function(){function e(){}return e.prototype.elementRef=function(){},e.prototype.createEmbeddedView=function(e){},e}(),Hu=function(){function e(){}return e.prototype.element=function(){},e.prototype.injector=function(){},e.prototype.parentInjector=function(){},e.prototype.clear=function(){},e.prototype.get=function(e){},e.prototype.length=function(){},e.prototype.createEmbeddedView=function(e,t,n){},e.prototype.createComponent=function(e,t,n,r,o){},e.prototype.insert=function(e,t){},e.prototype.move=function(e,t){},e.prototype.indexOf=function(e){},e.prototype.remove=function(e){},e.prototype.detach=function(e){},e}(),Lu=function(){function e(){}return e.prototype.markForCheck=function(){},e.prototype.detach=function(){},e.prototype.detectChanges=function(){},e.prototype.checkNoChanges=function(){},e.prototype.reattach=function(){},e}(),Uu=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return _o.a(t,e),t.prototype.destroy=function(){},t.prototype.destroyed=function(){},t.prototype.onDestroy=function(e){},t}(Lu),Qu=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return _o.a(t,e),t.prototype.context=function(){},t.prototype.rootNodes=function(){},t}(Uu),Bu=function(){function e(e,t){this.name=e,this.callback=t}return e}(),Zu=function(){function e(e,t,n){this._debugContext=n,this.nativeNode=e,t&&t instanceof zu?t.addChild(this):this.parent=null,this.listeners=[]}return Object.defineProperty(e.prototype,"injector",{get:function(){return this._debugContext.injector},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"componentInstance",{get:function(){return this._debugContext.component},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"context",{get:function(){return this._debugContext.context},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"references",{get:function(){return this._debugContext.references},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"providerTokens",{get:function(){return this._debugContext.providerTokens},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"source",{get:function(){return"Deprecated since v4"},enumerable:!0,configurable:!0}),e}(),zu=function(e){function t(t,n,r){var o=e.call(this,t,n,r)||this;return o.properties={},o.attributes={},o.classes={},o.styles={},o.childNodes=[],o.nativeElement=t,o}return _o.a(t,e),t.prototype.addChild=function(e){e&&(this.childNodes.push(e),e.parent=this)},t.prototype.removeChild=function(e){var t=this.childNodes.indexOf(e);-1!==t&&(e.parent=null,this.childNodes.splice(t,1))},t.prototype.insertChildrenAfter=function(e,t){var n=this,r=this.childNodes.indexOf(e);-1!==r&&((o=this.childNodes).splice.apply(o,[r+1,0].concat(t)),t.forEach(function(e){e.parent&&e.parent.removeChild(e),e.parent=n}));var o},t.prototype.insertBefore=function(e,t){var n=this.childNodes.indexOf(e);-1===n?this.addChild(t):(t.parent&&t.parent.removeChild(t),t.parent=this,this.childNodes.splice(n,0,t))},t.prototype.query=function(e){return this.queryAll(e)[0]||null},t.prototype.queryAll=function(e){var t=[];return me(this,e,t),t},t.prototype.queryAllNodes=function(e){var t=[];return _e(this,e,t),t},Object.defineProperty(t.prototype,"children",{get:function(){return this.childNodes.filter(function(e){return e instanceof t})},enumerable:!0,configurable:!0}),t.prototype.triggerEventHandler=function(e,t){this.listeners.forEach(function(n){n.name==e&&n.callback(t)})},t}(Zu),Ku=new Map,Wu=function(){function e(e){this.wrapped=e}return e.wrap=function(t){return new e(t)},e}(),qu=function(){function e(){this.hasWrappedValue=!1}return e.prototype.unwrap=function(e){return e instanceof Wu?(this.hasWrappedValue=!0,e.wrapped):e},e.prototype.reset=function(){this.hasWrappedValue=!1},e}(),Yu=function(){function e(e,t,n){this.previousValue=e,this.currentValue=t,this.firstChange=n}return e.prototype.isFirstChange=function(){return this.firstChange},e}(),$u=function(){function e(){}return e.prototype.supports=function(e){return Oe(e)},e.prototype.create=function(e,t){return new Ju(t||e)},e}(),Gu=function(e,t){return t},Ju=function(){function e(e){this._length=0,this._collection=null,this._linkedRecords=null,this._unlinkedRecords=null,this._previousItHead=null,this._itHead=null,this._itTail=null,this._additionsHead=null,this._additionsTail=null,this._movesHead=null,this._movesTail=null,this._removalsHead=null,this._removalsTail=null,this._identityChangesHead=null,this._identityChangesTail=null,this._trackByFn=e||Gu}return Object.defineProperty(e.prototype,"collection",{get:function(){return this._collection},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"length",{get:function(){return this._length},enumerable:!0,configurable:!0}),e.prototype.forEachItem=function(e){var t;for(t=this._itHead;null!==t;t=t._next)e(t)},e.prototype.forEachOperation=function(e){for(var t=this._itHead,n=this._removalsHead,r=0,o=null;t||n;){var i=!n||t&&t.currentIndex"+u(this.currentIndex)+"]"},e}(),es=function(){function e(){this._head=null,this._tail=null}return e.prototype.add=function(e){null===this._head?(this._head=this._tail=e,e._nextDup=null,e._prevDup=null):(this._tail._nextDup=e,e._prevDup=this._tail,e._nextDup=null,this._tail=e)},e.prototype.get=function(e,t){var n;for(n=this._head;null!==n;n=n._nextDup)if((null===t||t=0;t--){var n=Wt(this._data,t);ws.destroyView(n)}},e.prototype.get=function(e){var t=this._embeddedViews[e];if(t){var n=new Fs(t);return n.attachToViewContainerRef(this),n}return null},Object.defineProperty(e.prototype,"length",{get:function(){return this._embeddedViews.length},enumerable:!0,configurable:!0}),e.prototype.createEmbeddedView=function(e,t,n){var r=e.createEmbeddedView(t||{});return this.insert(r,n),r},e.prototype.createComponent=function(e,t,n,r,o){var i=n||this.parentInjector;o||e instanceof tu||(o=i.get(nu));var u=e.create(i,r,void 0,o);return this.insert(u.hostView,t),u},e.prototype.insert=function(e,t){var n=e,r=n._view;return Zt(this._view,this._data,t,r),n.attachToViewContainerRef(this),e},e.prototype.move=function(e,t){var n=this._embeddedViews.indexOf(e._view);return Yt(this._data,n,t),e},e.prototype.indexOf=function(e){return this._embeddedViews.indexOf(e._view)},e.prototype.remove=function(e){var t=Wt(this._data,e);t&&ws.destroyView(t)},e.prototype.detach=function(e){var t=Wt(this._data,e);return t?new Fs(t):null},e}(),Fs=function(){function e(e){this._view=e,this._viewContainerRef=null,this._appRef=null}return Object.defineProperty(e.prototype,"rootNodes",{get:function(){return dt(this._view)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"context",{get:function(){return this._view.context},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"destroyed",{get:function(){return 0!=(128&this._view.state)},enumerable:!0,configurable:!0}),e.prototype.markForCheck=function(){Xe(this._view)},e.prototype.detach=function(){this._view.state&=-5},e.prototype.detectChanges=function(){var e=this._view.root.rendererFactory;e.begin&&e.begin(),ws.checkAndUpdateView(this._view),e.end&&e.end()},e.prototype.checkNoChanges=function(){ws.checkNoChangesView(this._view)},e.prototype.reattach=function(){this._view.state|=4},e.prototype.onDestroy=function(e){this._view.disposables||(this._view.disposables=[]),this._view.disposables.push(e)},e.prototype.destroy=function(){this._appRef?this._appRef.detachView(this):this._viewContainerRef&&this._viewContainerRef.detach(this._viewContainerRef.indexOf(this)),ws.destroyView(this._view)},e.prototype.detachFromAppRef=function(){this._appRef=null,Gt(this._view),ws.dirtyParentQueries(this._view)},e.prototype.attachToAppRef=function(e){if(this._viewContainerRef)throw new Error("This view is already attached to a ViewContainer!");this._appRef=e},e.prototype.attachToViewContainerRef=function(e){if(this._appRef)throw new Error("This view is already attached directly to the ApplicationRef!");this._viewContainerRef=e},e}(),Hs=function(e){function t(t,n){var r=e.call(this)||this;return r._parentView=t,r._def=n,r}return _o.a(t,e),t.prototype.createEmbeddedView=function(e){return new Fs(ws.createEmbeddedView(this._parentView,this._def,this._def.element.template,e))},Object.defineProperty(t.prototype,"elementRef",{get:function(){return new Tu(Ve(this._parentView,this._def.index).renderElement)},enumerable:!0,configurable:!0}),t}(Fu),Ls=function(){function e(e,t){this.view=e,this.elDef=t}return e.prototype.get=function(e,t){void 0===t&&(t=pi.THROW_IF_NOT_FOUND);var n=!!this.elDef&&0!=(33554432&this.elDef.flags);return ws.resolveDep(this.view,this.elDef,n,{flags:0,token:e,tokenKey:Ke(e)},t)},e}(),Us=function(){function e(e){this.delegate=e}return e.prototype.selectRootElement=function(e){return this.delegate.selectRootElement(e)},e.prototype.createElement=function(e,t){var n=mt(t),r=n[0],o=n[1],i=this.delegate.createElement(o,r);return e&&this.delegate.appendChild(e,i),i},e.prototype.createViewRoot=function(e){return e},e.prototype.createTemplateAnchor=function(e){var t=this.delegate.createComment("");return e&&this.delegate.appendChild(e,t),t},e.prototype.createText=function(e,t){var n=this.delegate.createText(t);return e&&this.delegate.appendChild(e,n),n},e.prototype.projectNodes=function(e,t){for(var n=0;n1&&"number"==typeof e[e.length-1]&&(n=e.pop())):"number"==typeof o&&(n=e.pop()),null===r&&1===e.length&&e[0]instanceof i.Observable?e[0]:new u.ArrayObservable(e,r).lift(new s.MergeAllOperator(n))}var i=n(1),u=n(28),s=n(31),a=n(16);t.merge=r,t.mergeStatic=o},function(e,t,n){"use strict";var r=this&&this.__extends||function(e,t){function n(){this.constructor=e}for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r]);e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},o=n(1),i=n(29),u=n(30),s=n(16),a=function(e){function t(t,n){e.call(this),this.array=t,this.scheduler=n,n||1!==t.length||(this._isScalar=!0,this.value=t[0])}return r(t,e),t.create=function(e,n){return new t(e,n)},t.of=function(){for(var e=[],n=0;n1?new t(e,r):1===o?new i.ScalarObservable(e[0],r):new u.EmptyObservable(r)},t.dispatch=function(e){var t=e.array,n=e.index,r=e.count,o=e.subscriber;if(n>=r)return void o.complete();o.next(t[n]),o.closed||(e.index=n+1,this.schedule(e))},t.prototype._subscribe=function(e){var n=this.array,r=n.length,o=this.scheduler;if(o)return o.schedule(t.dispatch,0,{array:n,index:0,count:r,subscriber:e});for(var i=0;i0?this._next(t.shift()):0===this.active&&this.hasCompleted&&this.destination.complete()},t}(i.OuterSubscriber);t.MergeAllSubscriber=a},function(e,t,n){"use strict";var r=this&&this.__extends||function(e,t){function n(){this.constructor=e}for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r]);e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},o=n(4),i=function(e){function t(){e.apply(this,arguments)}return r(t,e),t.prototype.notifyNext=function(e,t,n,r,o){this.destination.next(t)},t.prototype.notifyError=function(e,t){this.destination.error(e)},t.prototype.notifyComplete=function(e){this.destination.complete()},t}(o.Subscriber);t.OuterSubscriber=i},function(e,t,n){"use strict";function r(e,t,n,r){var p=new l.InnerSubscriber(e,n,r);if(p.closed)return null;if(t instanceof a.Observable)return t._isScalar?(p.next(t.value),p.complete(),null):t.subscribe(p);if(i.isArrayLike(t)){for(var d=0,h=t.length;d1)return void(this.connection=null);var n=this.connection,r=e._connection;this.connection=null,!r||n&&r!==n||r.unsubscribe()},t}(u.Subscriber)},function(e,t,n){"use strict";var r=this&&this.__extends||function(e,t){function n(){this.constructor=e}for(var r in t)t.hasOwnProperty(r)&&(e[r]=t[r]);e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)},o=n(5),i=function(e){function t(t,n){e.call(this),this.subject=t,this.subscriber=n,this.closed=!1}return r(t,e),t.prototype.unsubscribe=function(){if(!this.closed){this.closed=!0;var e=this.subject,t=e.observers;if(this.subject=null,t&&0!==t.length&&!e.isStopped&&!e.closed){var n=t.indexOf(this.subscriber);-1!==n&&t.splice(n,1)}}},t}(o.Subscription);t.SubjectSubscription=i},function(e,t,n){"use strict";function r(e,t,n){for(var o=0;o{'use strict';if(!window.customElements)return;const a=window.HTMLElement,b=window.customElements.define,c=window.customElements.get,d=new Map,e=new Map;let f=!1,g=!1;window.HTMLElement=function(){if(!f){const j=d.get(this.constructor),k=c.call(window.customElements,j);g=!0;const l=new k;return l}f=!1;},window.HTMLElement.prototype=a.prototype;Object.defineProperty(window,'customElements',{value:window.customElements,configurable:!0,writable:!0}),Object.defineProperty(window.customElements,'define',{value:(j,k)=>{const l=k.prototype,m=class extends a{constructor(){super(),Object.setPrototypeOf(this,l),g||(f=!0,k.call(this)),g=!1;}},n=m.prototype;m.observedAttributes=k.observedAttributes,n.connectedCallback=l.connectedCallback,n.disconnectedCallback=l.disconnectedCallback,n.attributeChangedCallback=l.attributeChangedCallback,n.adoptedCallback=l.adoptedCallback,d.set(k,j),e.set(j,k),b.call(window.customElements,j,m);},configurable:!0,writable:!0}),Object.defineProperty(window.customElements,'get',{value:(j)=>e.get(j),configurable:!0,writable:!0});})(); 5 | 6 | /** 7 | @license 8 | Copyright (c) 2017 The Polymer Project Authors. All rights reserved. 9 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 10 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 11 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 12 | Code distributed by Google as part of the polymer project is also 13 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 14 | */ 15 | 16 | }()); 17 | -------------------------------------------------------------------------------- /stop-watch-app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Ng Elements Playground 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /stop-watch-app/stop-watch-app.js: -------------------------------------------------------------------------------- 1 | webpackJsonp([1],{60:function(n,l,t){"use strict";Object.defineProperty(l,"__esModule",{value:!0});var e=t(2),i=t(61);e.default.define(i.a)},61:function(n,l,t){"use strict";function e(n){return s["ɵvid"](0,[(n()(),s["ɵted"](null,["\n\t "])),(n()(),s["ɵeld"](0,null,null,1,"h1",[],null,null,null,null,null)),(n()(),s["ɵted"](null,["Stop Watch App"])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,4,"div",[["class","watch-container"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"stop-watch",[],null,null,null,u.c,u.a)),s["ɵdid"](49152,null,0,o.a,[],{hours:[0,"hours"],minutes:[1,"minutes"],seconds:[2,"seconds"],milliseconds:[3,"milliseconds"]},null),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,10,"div",[["class","actions-container"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"button",[],[[8,"disabled",0]],[[null,"click"]],function(n,l,t){var e=!0,i=n.component;if("click"===l){e=!1!==i.start()&&e}return e},null,null)),(n()(),s["ɵted"](null,["Start"])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"button",[],[[8,"disabled",0]],[[null,"click"]],function(n,l,t){var e=!0,i=n.component;if("click"===l){e=!1!==i.stop()&&e}return e},null,null)),(n()(),s["ɵted"](null,["Stop"])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"button",[],[[8,"disabled",0]],[[null,"click"]],function(n,l,t){var e=!0,i=n.component;if("click"===l){e=!1!==i.clear()&&e}return e},null,null)),(n()(),s["ɵted"](null,["Clear"])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵted"](null,["\n\t"]))],function(n,l){var t=l.component;n(l,7,0,t.hours,t.minutes,t.seconds,t.milliseconds)},function(n,l){var t=l.component;n(l,12,0,t.isTimerRunning),n(l,15,0,!t.isTimerRunning),n(l,18,0,t.isTimerRunning)})}function i(n){return s["ɵvid"](0,[(n()(),s["ɵeld"](0,null,null,2,"stop-watch-app",[],null,null,null,e,a)),s["ɵprd"](512,null,c.b,c.b,[]),s["ɵdid"](49152,null,0,c.a,[s.ChangeDetectorRef,c.b],null,null)],null,null)}t.d(l,"a",function(){return r});var s=t(0),u=t(9),o=t(7),c=t(62),d=["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\theight: 300px;\n\t\t\twidth: 300px;\n margin: 0 auto;\n padding-top: 20px;\n }",":host h1{\n text-align: center;\n font-family: system-ui;\n }","\n .watch-container{\n padding: 20px;\n }","button{\n border-width: 0;\n padding: 10px;\n outline: none;\n border-radius: 2px;\n box-shadow: 0 1px 4px rgba(0, 0, 0, .6);\n background-color: #333;\n color: #ecf0f1;\n }","button[disabled]{\n background-color: #dcdcd;\n color: black;\n opacity: 0.7;\n }","\n .actions-container{\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-evenly;\n }"],a=s["ɵcrt"]({encapsulation:1,styles:d,data:{}}),r=s["ɵccf"]("stop-watch-app",c.a,i,{},{},[])},62:function(n,l,t){"use strict";t.d(l,"b",function(){return i}),t.d(l,"a",function(){return s});var e=t(0),i=function(){function n(){}return n.prototype.getTimeString=function(n){return(n?n>9?n:"0"+n:"00").toString()},n}(),s=function(){function n(n,l){this.cdr=n,this.watchService=l,this.hh=0,this.mm=0,this.ss=0,this.ms=0,this.hours="00",this.minutes="00",this.seconds="00",this.milliseconds="00",this.timer=null,this.isTimerRunning=!1}return n.prototype.start=function(){var n=this;this.isTimerRunning=!0,this.cdr.detectChanges(),this.timer=setInterval(function(){n.updateTime()},10)},n.prototype.updateTime=function(){this.ms++,this.ms>=100&&(this.ms=0,++this.ss>=60&&(this.ss=0,++this.mm>=60&&(this.mm=0,this.hh++))),this.setTime()},n.prototype.setTime=function(){this.hours=this.watchService.getTimeString(this.hh),this.minutes=this.watchService.getTimeString(this.mm),this.seconds=this.watchService.getTimeString(this.ss),this.milliseconds=this.watchService.getTimeString(this.ms),this.cdr.detectChanges()},n.prototype.stop=function(){this.isTimerRunning=!1,clearInterval(this.timer),this.cdr.detectChanges()},n.prototype.clear=function(){this.hh=0,this.mm=0,this.ss=0,this.ms=0,this.setTime()},n}();s.decorators=[{type:e.Component,args:[{selector:"stop-watch-app",template:'\n\t

Stop Watch App

\n \n

\n \n \n \n

\n\t',encapsulation:e.ViewEncapsulation.Native,providers:[i],styles:["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t\theight: 300px;\n\t\t\twidth: 300px;\n margin: 0 auto;\n padding-top: 20px;\n }",":host h1{\n text-align: center;\n font-family: system-ui;\n }","\n .watch-container{\n padding: 20px;\n }","button{\n border-width: 0;\n padding: 10px;\n outline: none;\n border-radius: 2px;\n box-shadow: 0 1px 4px rgba(0, 0, 0, .6);\n background-color: #333;\n color: #ecf0f1;\n }","button[disabled]{\n background-color: #dcdcd;\n color: black;\n opacity: 0.7;\n }","\n .actions-container{\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-evenly;\n }"]}]}],s.ctorParameters=function(){return[{type:e.ChangeDetectorRef},{type:i}]}},7:function(n,l,t){"use strict";t.d(l,"a",function(){return i});var e=t(0),i=function(){function n(){}return n}();i.decorators=[{type:e.Component,args:[{selector:"stop-watch",template:'\n

\n ',encapsulation:e.ViewEncapsulation.Native,changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[":host { \n background: #2196F3;\n padding: 20px;\n display: block;\n font-family: monospace;\n box-shadow: 0 16px 16px 0 rgba(0,0,0,0.1);\n }","\n :host .watch{\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-evenly;\n }","\n :host .watch .unit, :host .watch .sep{\n font-size: 32px;\n color: #FFEB3B;\n }\n "]}]}],i.ctorParameters=function(){return[]},i.propDecorators={hours:[{type:e.Input}],minutes:[{type:e.Input}],seconds:[{type:e.Input}],milliseconds:[{type:e.Input}]}},9:function(n,l,t){"use strict";function e(n){return s["ɵvid"](2,[(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,22,"div",[["class","watch"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","unit"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["",""])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","sep"]],null,null,null,null,null)),(n()(),s["ɵted"](null,[" : "])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","unit"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["",""])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","sep"]],null,null,null,null,null)),(n()(),s["ɵted"](null,[" : "])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","unit"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["",""])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","sep"]],null,null,null,null,null)),(n()(),s["ɵted"](null,[" : "])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵeld"](0,null,null,1,"div",[["class","unit"]],null,null,null,null,null)),(n()(),s["ɵted"](null,["",""])),(n()(),s["ɵted"](null,["\n "])),(n()(),s["ɵted"](null,["\n "]))],null,function(n,l){var t=l.component;n(l,4,0,t.hours),n(l,10,0,t.minutes),n(l,16,0,t.seconds),n(l,22,0,t.milliseconds)})}function i(n){return s["ɵvid"](0,[(n()(),s["ɵeld"](0,null,null,1,"stop-watch",[],null,null,null,e,c)),s["ɵdid"](49152,null,0,u.a,[],null,null)],null,null)}t.d(l,"a",function(){return c}),l.c=e,t.d(l,"b",function(){return d});var s=t(0),u=t(7),o=[":host { \n background: #2196F3;\n padding: 20px;\n display: block;\n font-family: monospace;\n box-shadow: 0 16px 16px 0 rgba(0,0,0,0.1);\n }","\n :host .watch{\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-evenly;\n }","\n :host .watch .unit, :host .watch .sep{\n font-size: 32px;\n color: #FFEB3B;\n }\n "],c=s["ɵcrt"]({encapsulation:1,styles:o,data:{}}),d=s["ɵccf"]("stop-watch",u.a,i,{hours:"hours",minutes:"minutes",seconds:"seconds",milliseconds:"milliseconds"},{},[])}},[60]); --------------------------------------------------------------------------------