Initial seed code contribution for CDT
Issue-ID: APPC-682
Change-Id: I0331ffce2a430195c29d0d1b2295966f9eb28699
Signed-off-by: Skip Wonnell <skip@att.com>
diff --git a/src/app/about-us/aboutus.component.css b/src/app/about-us/aboutus.component.css
new file mode 100644
index 0000000..93ac11c
--- /dev/null
+++ b/src/app/about-us/aboutus.component.css
@@ -0,0 +1,27 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.textarea {
+ width: 800px;
+ height: 200px
+}
\ No newline at end of file
diff --git a/src/app/about-us/aboutus.component.html b/src/app/about-us/aboutus.component.html
new file mode 100644
index 0000000..bfc6f9a
--- /dev/null
+++ b/src/app/about-us/aboutus.component.html
@@ -0,0 +1,103 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<div class="text-center">
+ <div class="card">
+ <div class="mdl-dialog__content">
+ <div class="card">
+ <div class="card-header" style="font-size: 20px">CONTACT DETAILS</div>
+ <div class="mdl-card__title">
+ <div class="text-center">
+ Contact us @: <a href="mailto:DL-APPCDEVELOPMENTTEAM@att.com?Subject=1710CDTContactus">APPC
+ DEVELOPMENT TEAM </a>
+ </div>
+ </div>
+ </div>    
+ <div class="card">
+ <div class="card-header" style="font-size: 20px">VERSION DETAILS</div>
+ <div class="mdl-card__title">
+ <table>
+ <thead></thead>
+ <tbody>
+ <tr>
+ <td>
+ <div class="android-title mdl-layout-title">Current Release :</div>
+ </td>
+ <td>
+ <div class="android-title mdl-layout-title">{{releaseName}}</div>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <div class="android-title mdl-layout-title">Current Version :</div>
+ </td>
+ <td>
+ <div class="android-title mdl-layout-title">{{versionNo}}</div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div class="text-right">
+ <div class="mdl-dialog__content">
+ <a class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary"
+ (click)="open(content)" (click)="versionLogFile()">VIEW CHANGE LOG</a>
+ </div>
+ </div>
+
+ </div>
+
+ </div>
+ </div>
+</div>
+
+<ng-template #content let-c="close" let-d="dismiss">
+ <div class="modal-content" style="width:800px;vertical-align:auto;">
+ <div class="modal-header">
+ <h4 class="modal-title" style="text-align:center">VERSION CHANGE LOG</h4>
+ <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+ <div class="modal-body">
+ <div class="form-group row">
+ <html>
+
+ <body>
+ <textarea class="textarea">{{this.data}}</textarea>
+ </body>
+
+ </html>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" (click)="downloadLogFile()" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent
+ " (click)="c('yes')">Download
+ </button>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary
+
+ " (click)="c('yes')">Cancel
+ </button>
+ </div>
+ </div>
+</ng-template>
\ No newline at end of file
diff --git a/src/app/about-us/aboutus.component.spec.ts b/src/app/about-us/aboutus.component.spec.ts
new file mode 100644
index 0000000..e5541eb
--- /dev/null
+++ b/src/app/about-us/aboutus.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {AboutUsComponent} from './aboutus.component';
+
+describe('ContacUsComponent', () => {
+ let component: AboutUsComponent;
+ let fixture: ComponentFixture<AboutUsComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [AboutUsComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AboutUsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/about-us/aboutus.component.ts b/src/app/about-us/aboutus.component.ts
new file mode 100644
index 0000000..360855e
--- /dev/null
+++ b/src/app/about-us/aboutus.component.ts
@@ -0,0 +1,83 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Component, OnInit} from '@angular/core';
+import {Http} from '@angular/http';
+import {saveAs} from 'file-saver';
+import {ModalDismissReasons, NgbModal} from '@ng-bootstrap/ng-bootstrap';
+
+@Component({
+ selector: 'app-help',
+ templateUrl: './aboutus.component.html',
+ styleUrls: ['./aboutus.component.css']
+})
+export class AboutUsComponent implements OnInit {
+
+ public releaseName: any;
+ public versionNo: any;
+
+ public data: any;
+ closeResult: string;
+
+ constructor(private http: Http, private modalService: NgbModal) {
+ }
+
+ ngOnInit() {
+ this.versionNo = require('./appVersion.json').versionNo;
+ this.releaseName = require('./appVersion.json').releaseName;
+ }
+
+ versionLogFile() {
+ this.http.get('app/shared/components/about-us/versionLog.txt')
+ .subscribe(res => this.data = res.text());
+ console.log('json data ', this.data);
+
+ }
+
+ open(content) {
+ this.modalService.open(content).result.then((result) => {
+ this.closeResult = `Closed with: ${result}`;
+ }, (reason) => {
+ this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
+ });
+ }
+
+ downloadLogFile() {
+ var blob = new Blob([this.data], {
+ type: 'text/plain;charset=utf-8'
+ });
+ saveAs(blob, 'versionLog.txt');
+ }
+
+ private getDismissReason(reason: any): string {
+ if (reason === ModalDismissReasons.ESC) {
+ return 'by pressing ESC';
+ } else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
+ return 'by clicking on a backdrop';
+ } else {
+ return `with: ${reason}`;
+ }
+ }
+
+}
diff --git a/src/app/about-us/appVersion.json b/src/app/about-us/appVersion.json
new file mode 100644
index 0000000..d4fc816
--- /dev/null
+++ b/src/app/about-us/appVersion.json
@@ -0,0 +1,4 @@
+{
+ "versionNo": "2.0.6",
+ "releaseName": "1806"
+}
\ No newline at end of file
diff --git a/src/app/about-us/versionLog.txt b/src/app/about-us/versionLog.txt
new file mode 100644
index 0000000..fea7248
--- /dev/null
+++ b/src/app/about-us/versionLog.txt
@@ -0,0 +1,101 @@
+Version 2.0.6
+===========================================================
+1. Fixed issues raised by ST in test screen. (sj108s)
+2. Added test spec file (sj108s)
+
+Version 2.0.5
+===========================================================
+1. Changed the location of Assign new Template Identifier.(Author-ug0221)
+2. Fixed an issue with retaining the selected value in the dropdown for Template Id's.(Author-ug0221)
+3. Added Artifact Name to the Filter box.(Author-ug0221)
+4. Added empty value validations on create new VNF pop up box.(Author-ug0221)
+
+Version 2.0.4
+===========================================================
+1. Added test cases to golden configuration spec file(sj108s)
+2. Fixed defect in test screen regarding request id while polling using getTestResponse() method (sj108s)
+3. Added validation to template configuration tab for accepting only xml and json files (sj108s)
+4. Added validation to param values tab to accept only json files (sj108s)
+
+Version 2.0.3
+===========================================================
+1. Fixed E2E defect 430809 in 1802 : Space is not getting ignored in param configure artifact
+ generated by CDT tool if VNF name / vnfc - type has spaces (sj108s)
+
+Version 2.0.2
+===========================================================
+1. Added Licence Info to Reference Data Screen.(ug0221)
+2. Added Config ScaleOut Action and Template Identifiers to the Reference screen.(ug0221)
+3. resolved a defect where the configscale out file uploaded doesnt populate the template is dropdown.(ug0221)
+
+Version 2.0.1
+===========================================================
+1. Added Licence Info to golden config/ My VNF and other modules for ONAP- Only Reference Page remaining.(sj108s)
+2. Added Test screen to the main menu.(sj108s)
+3. Created HTML for Test Screen and integrated ts code.(sj108s)
+
+Version 2.0.0
+===========================================================
+1. 18/06 Major release.(ak583p)
+
+Version 1.1.1
+===========================================================
+1. Defect 416768 Block Name should not be merged. Do not allow a merge with a value that double quotes around it, possibly a space and a colon at the end.(Author-ma926a)
+2. Populating PD using name/value pairs when Uploading key file.(Author-ma926a)
+
+Version 1.1.0
+===========================================================
+1. Added functionality for entering names in template through modal.(Author-sj108s)
+2. Enabled test screen and added basic test functionality.(Author-sj108s)
+
+Version 1.0.9
+===========================================================
+1. Allow user to upload of Key Data Files multiple times.(Author-ma926a)
+2. Removing INSTAR and its properties using key file.
+
+Version 1.0.8
+===========================================================
+1. Changed the color code for merge successful/ unsuccessful messages.(Author sj108s)
+
+Version 1.0.7
+===========================================================
+1. Fixed defect in reference screen where previous vm actions where not getting replaced on uploading the new ones.(Author sj108s)
+
+Version 1.0.6
+===========================================================
+1. Fixed defect 396019- Added functionality for syncing template from parameters.(Author sj108s)
+
+Version 1.0.5
+===========================================================
+1. Fixed protocol field while uploading reference artifact file for OpenStack Actions.(Author sj108s)
+
+Version 1.0.4
+===========================================================
+1. Fixed defect: Changed artifact-list to [] and vnfc-type to null in case of reference artifact generated for OpenStack Actions.(Author sj108s)
+
+Version 1.0.3
+===========================================================
+1. Fix for Defect#399542 Merge from Params should not Merge the commented section of the base template ( CDT Version : 1.2.1). (Author-ma926a)
+2. Fix for Defect#402786 While changing back to Manual from other sources, other fields is not return to previous. (Author-ma926a)
+3. With some minor ST issues on PD source, ruletype manipulation. (Author-ma926a)
+
+Version 1.0.2
+===========================================================
+1. Added functionality for hiding template and PD tabs on selection of OpenStack Actions in reference screen(Author sj108s)
+2. Fixed ST defect raised by Ed, wherein the user autoretrieves refrence data with multiple actions from myvnfs,
+ comes to reference screen, and navigates to template and pd pages and comes back to reference page, the data for the
+ multiple actions are saving and retrieving correctly now.(Author sj108s)
+
+Version 1.0.1
+===========================================================
+Story#330094 - Fixed the defects and left over tasks from this story.(Author-ma926a)
+ 1. Source Manual/INSTAR/A&AI selection handled properly.
+ 2. Disabling INSTAR to avoid manual selection of INSTAR.
+ 3. "" empty quates in PD file when we select empty value in dropdowns.
+ 4. Retrieval of A&AI, ruletype, filter columns.
+
+
+Version 1.0.0(18/02 Release)
+==========================================================
+First released version.
+
diff --git a/src/app/app.component.css b/src/app/app.component.css
new file mode 100644
index 0000000..57eb0ce
--- /dev/null
+++ b/src/app/app.component.css
@@ -0,0 +1,26 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.view-page {
+ padding: 0 100px 0 100px;
+}
\ No newline at end of file
diff --git a/src/app/app.component.html b/src/app/app.component.html
new file mode 100644
index 0000000..6447c28
--- /dev/null
+++ b/src/app/app.component.html
@@ -0,0 +1,29 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<app-header></app-header>
+<div class="view-page">
+ <app-navigation [id]="'userLogin'"></app-navigation>
+ <!--<app-tag-page></app-tag-page>-->
+ <router-outlet></router-outlet>
+</div>
\ No newline at end of file
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
new file mode 100644
index 0000000..a4922f5
--- /dev/null
+++ b/src/app/app.component.spec.ts
@@ -0,0 +1,61 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+
+import {async, TestBed} from '@angular/core/testing';
+import {AppComponent} from './app.component';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {RouterTestingModule} from '@angular/router/testing';
+
+describe('AppComponent', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ declarations: [
+ AppComponent
+ ],
+ schemas: [NO_ERRORS_SCHEMA]
+ , imports: [RouterTestingModule]
+ });
+ TestBed.compileComponents();
+ });
+
+ it('should create the app', async(() => {
+ const fixture = TestBed.createComponent(AppComponent);
+ const app = fixture.debugElement.componentInstance;
+ expect(app).toBeTruthy();
+ }));
+
+ it(`should have as title 'app works!'`, async(() => {
+ const fixture = TestBed.createComponent(AppComponent);
+ const app = fixture.debugElement.componentInstance;
+ expect(app.title).toEqual('app works!');
+ }));
+
+ it('should render title in a h1 tag', async(() => {
+ const fixture = TestBed.createComponent(AppComponent);
+ fixture.detectChanges();
+ const compiled = fixture.debugElement.nativeElement;
+ expect(compiled.querySelector('h1').textContent).toContain('app works!');
+ }));
+});
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
new file mode 100644
index 0000000..2d5d602
--- /dev/null
+++ b/src/app/app.component.ts
@@ -0,0 +1,55 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component} from '@angular/core';
+import {MappingEditorService} from './shared/services/mapping-editor.service';
+
+@Component({
+ selector: 'app-root',
+ templateUrl: './app.component.html',
+ styleUrls: ['./app.component.css']
+})
+export class AppComponent {
+ title = 'app works!';
+ item: any = {};
+ subscription: any;
+
+ constructor(private mappingEditorService: MappingEditorService) {
+
+ }
+
+ ngOnInit() {
+ this.item = this.mappingEditorService.navItem();
+ this.subscription = this.mappingEditorService.navChange$.subscribe(
+ item => this.selectedNavItem(item));
+ }
+
+ selectedNavItem(item: any) {
+ this.item = item;
+ }
+
+ ngOnDestroy() {
+ this.subscription.unsubscribe();
+ }
+
+}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
new file mode 100644
index 0000000..4824351
--- /dev/null
+++ b/src/app/app.module.ts
@@ -0,0 +1,51 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {BrowserModule} from '@angular/platform-browser';
+import {NgModule} from '@angular/core';
+import {FormsModule} from '@angular/forms';
+import {SimpleNotificationsModule} from 'angular2-notifications';
+import {HomeModule} from './home/home.module';
+import {AppComponent} from './app.component';
+import {AppRoutingModule} from './app.routing';
+import {SharedModule} from './shared/shared.module';
+import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
+import {HashLocationStrategy, LocationStrategy} from '@angular/common';
+import {NoopAnimationsModule} from '@angular/platform-browser/animations';
+import {RouterModule} from '@angular/router';
+import {TestComponent} from './test/test.component';
+import {AboutUsComponent} from './about-us/aboutus.component';
+import {NgProgressModule} from 'ngx-progressbar';
+
+@NgModule({
+ declarations: [AppComponent, TestComponent, AboutUsComponent],
+ imports: [BrowserModule, FormsModule, HomeModule, SharedModule.forRoot(),
+ NgbModule.forRoot(), NoopAnimationsModule, AppRoutingModule, SimpleNotificationsModule, NgProgressModule],
+ exports: [RouterModule],
+ providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
+
+ bootstrap: [AppComponent]
+})
+
+export class AppModule {
+}
\ No newline at end of file
diff --git a/src/app/app.routing.ts b/src/app/app.routing.ts
new file mode 100644
index 0000000..234487e
--- /dev/null
+++ b/src/app/app.routing.ts
@@ -0,0 +1,64 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {NgModule} from '@angular/core';
+import {RouterModule, Routes} from '@angular/router';
+import {HomeComponent} from './home/home/home.component';
+import {LogoutComponent} from './shared/components/logout/logout.component';
+import {HelpComponent} from './shared/components/help/help/help.component';
+import {AboutUsComponent} from './about-us/aboutus.component';
+import {TestComponent} from './test/test.component';
+
+const routes: Routes = [
+ {
+ path: 'home',
+ component: HomeComponent
+ }, {
+ path: 'vnfs',
+ loadChildren: './vnfs/vnfs.module#VnfsModule'
+ }, {
+ path: 'test',
+ component: TestComponent
+ },
+ {
+ path: 'help',
+ component: HelpComponent
+ }, {
+ path: 'aboutUs',
+ component: AboutUsComponent
+ }, {
+ path: 'logout',
+ component: LogoutComponent
+ }, {
+ path: '',
+ redirectTo: '/home',
+ pathMatch: 'full'
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forRoot(routes)],
+ exports: [RouterModule]
+})
+export class AppRoutingModule {
+}
\ No newline at end of file
diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts
new file mode 100644
index 0000000..9c2a43a
--- /dev/null
+++ b/src/app/home/home.module.ts
@@ -0,0 +1,28 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {HomeComponent} from './home/home.component';
+
+@NgModule({imports: [CommonModule], declarations: [HomeComponent]})
+export class HomeModule {
+}
\ No newline at end of file
diff --git a/src/app/home/home/home.component.css b/src/app/home/home/home.component.css
new file mode 100644
index 0000000..9d63aa1
--- /dev/null
+++ b/src/app/home/home/home.component.css
@@ -0,0 +1,21 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
\ No newline at end of file
diff --git a/src/app/home/home/home.component.html b/src/app/home/home/home.component.html
new file mode 100644
index 0000000..728f2ab
--- /dev/null
+++ b/src/app/home/home/home.component.html
@@ -0,0 +1,37 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ -->
+<div class="android-more-section">
+
+ <div class="android-section-title mdl-typography--display-1-color-contrast">WELCOME TO APPC SELF SERVICE
+ CONFIGURATION DESIGN TOOL
+ </div>
+ <div class="mdl-card__title">
+ <h4 class="mdl-card__title-text">The Application Configuration (AppC) Configuration Design Tool allows
+ technology owners to create artifacts for Configuration and Life Cycle Management
+ functions that are required to manage the lifecycle of Virtual Network Functions (VNFs).<br> Select My VNFS
+ to enter credentials and view existing
+ designs or create new ones.
+ </h4>
+
+ </div>
+
+</div>
\ No newline at end of file
diff --git a/src/app/home/home/home.component.spec.ts b/src/app/home/home/home.component.spec.ts
new file mode 100644
index 0000000..fdabce7
--- /dev/null
+++ b/src/app/home/home/home.component.spec.ts
@@ -0,0 +1,48 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {HomeComponent} from './home.component';
+
+describe('HomeComponent', () => {
+ let component: HomeComponent;
+ let fixture: ComponentFixture<HomeComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [HomeComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HomeComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create Home component', () => {
+ expect(component).toBeTruthy();
+ });
+
+});
diff --git a/src/app/home/home/home.component.ts b/src/app/home/home/home.component.ts
new file mode 100644
index 0000000..ca55179
--- /dev/null
+++ b/src/app/home/home/home.component.ts
@@ -0,0 +1,36 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-home',
+ templateUrl: './home.component.html',
+ styleUrls: ['./home.component.css']
+})
+export class HomeComponent implements OnInit {
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+}
+
diff --git a/src/app/pipes/vm-filtering.pipe.spec.ts b/src/app/pipes/vm-filtering.pipe.spec.ts
new file mode 100644
index 0000000..ccd487e
--- /dev/null
+++ b/src/app/pipes/vm-filtering.pipe.spec.ts
@@ -0,0 +1,29 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+import {VmFilteringPipe} from './vm-filtering.pipe';
+
+describe('VmFilteringPipe', () => {
+ it('create an instance', () => {
+ const pipe = new VmFilteringPipe();
+ expect(pipe).toBeTruthy();
+ });
+});
diff --git a/src/app/pipes/vm-filtering.pipe.ts b/src/app/pipes/vm-filtering.pipe.ts
new file mode 100644
index 0000000..fdeb272
--- /dev/null
+++ b/src/app/pipes/vm-filtering.pipe.ts
@@ -0,0 +1,43 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+import {Pipe, PipeTransform} from '@angular/core';
+
+@Pipe({name: 'vmFiltering', pure: false})
+export class VmFilteringPipe implements PipeTransform {
+
+ transform(value: any, action: any, templateId): any {
+
+ if (action == 'ConfigScaleOut') {
+ let x = value.filter(obj => {
+ //return value
+ return obj['template-id'] == templateId;
+ });
+
+ console.log(x);
+ return x;
+ } else {
+ return value;
+
+ }
+ }
+
+}
diff --git a/src/app/shared/components/header/header.component.css b/src/app/shared/components/header/header.component.css
new file mode 100644
index 0000000..f9996f3
--- /dev/null
+++ b/src/app/shared/components/header/header.component.css
@@ -0,0 +1,31 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* .app-header {
+ background: #0099CC;
+ padding: 4px;
+}
+
+.color-white {
+ color: white
+} */
\ No newline at end of file
diff --git a/src/app/shared/components/header/header.component.html b/src/app/shared/components/header/header.component.html
new file mode 100644
index 0000000..79dea91
--- /dev/null
+++ b/src/app/shared/components/header/header.component.html
@@ -0,0 +1,29 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+
+<!-- <nav class="navbar navbar-default navbar-fixed-top app-header" role="navigation ">
+ <div class="text-center">
+ <div style=" font-size: 23px;" class="color-white">APPLICATION CONTROLLER</div>
+ </div>
+</nav> -->
\ No newline at end of file
diff --git a/src/app/shared/components/header/header.component.spec.ts b/src/app/shared/components/header/header.component.spec.ts
new file mode 100644
index 0000000..3335101
--- /dev/null
+++ b/src/app/shared/components/header/header.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {HeaderComponent} from './header.component';
+
+describe('HeaderComponent', () => {
+ let component: HeaderComponent;
+ let fixture: ComponentFixture<HeaderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [HeaderComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HeaderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/header/header.component.ts b/src/app/shared/components/header/header.component.ts
new file mode 100644
index 0000000..c425fd7
--- /dev/null
+++ b/src/app/shared/components/header/header.component.ts
@@ -0,0 +1,40 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-header',
+ templateUrl: './header.component.html',
+ styleUrls: ['./header.component.css']
+})
+export class HeaderComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/shared/components/help/help/help.component.css b/src/app/shared/components/help/help/help.component.css
new file mode 100644
index 0000000..be35e44
--- /dev/null
+++ b/src/app/shared/components/help/help/help.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
diff --git a/src/app/shared/components/help/help/help.component.html b/src/app/shared/components/help/help/help.component.html
new file mode 100644
index 0000000..ecdd8c1
--- /dev/null
+++ b/src/app/shared/components/help/help/help.component.html
@@ -0,0 +1,26 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<p>
+ help works!
+</p>
diff --git a/src/app/shared/components/help/help/help.component.spec.ts b/src/app/shared/components/help/help/help.component.spec.ts
new file mode 100644
index 0000000..9e09053
--- /dev/null
+++ b/src/app/shared/components/help/help/help.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {HelpComponent} from './help.component';
+
+describe('HelpComponent', () => {
+ let component: HelpComponent;
+ let fixture: ComponentFixture<HelpComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [HelpComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HelpComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/help/help/help.component.ts b/src/app/shared/components/help/help/help.component.ts
new file mode 100644
index 0000000..1b79419
--- /dev/null
+++ b/src/app/shared/components/help/help/help.component.ts
@@ -0,0 +1,40 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-help',
+ templateUrl: './help.component.html',
+ styleUrls: ['./help.component.css']
+})
+export class HelpComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/shared/components/logout/logout.component.css b/src/app/shared/components/logout/logout.component.css
new file mode 100644
index 0000000..be35e44
--- /dev/null
+++ b/src/app/shared/components/logout/logout.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
diff --git a/src/app/shared/components/logout/logout.component.html b/src/app/shared/components/logout/logout.component.html
new file mode 100644
index 0000000..340cb38
--- /dev/null
+++ b/src/app/shared/components/logout/logout.component.html
@@ -0,0 +1,26 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<p>
+ logout works!
+</p>
diff --git a/src/app/shared/components/logout/logout.component.spec.ts b/src/app/shared/components/logout/logout.component.spec.ts
new file mode 100644
index 0000000..3e2561f
--- /dev/null
+++ b/src/app/shared/components/logout/logout.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {LogoutComponent} from './logout.component';
+
+describe('LogoutComponent', () => {
+ let component: LogoutComponent;
+ let fixture: ComponentFixture<LogoutComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [LogoutComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LogoutComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/logout/logout.component.ts b/src/app/shared/components/logout/logout.component.ts
new file mode 100644
index 0000000..0c0e3ee
--- /dev/null
+++ b/src/app/shared/components/logout/logout.component.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-logout',
+ templateUrl: './logout.component.html',
+ styleUrls: ['./logout.component.css']
+})
+export class LogoutComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/shared/components/navigation/navigation.component.css b/src/app/shared/components/navigation/navigation.component.css
new file mode 100644
index 0000000..5b7aee5
--- /dev/null
+++ b/src/app/shared/components/navigation/navigation.component.css
@@ -0,0 +1,44 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.active-tab > {
+ border-bottom: 5px solid #6ab344;
+}
+
+/* .custom-heade-nav {
+ border-bottom: none !important;
+}*/
+*
+
+/
+
+.nav-link {
+ font-size: 15PX;
+ color: black;
+
+}
+
+.mdl-navigation__link {
+ font-weight: 600;
+ font-size: 16px;
+}
\ No newline at end of file
diff --git a/src/app/shared/components/navigation/navigation.component.html b/src/app/shared/components/navigation/navigation.component.html
new file mode 100644
index 0000000..9e60b6e
--- /dev/null
+++ b/src/app/shared/components/navigation/navigation.component.html
@@ -0,0 +1,72 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+
+<!-- <div class="android-section-title mdl-typography--display-1-color-contrast">APPC Self Service Design Tool</div> -->
+<div class="mdl-layout__header-row" font-family='Roboto'>
+ <span class="android-title mdl-layout-title">
+
+ </span>
+ <!-- Add spacer, to align navigation to the right in desktop -->
+ <div class="android-header-spacer mdl-layout-spacer"></div>
+ <div class="android-navigation-container">
+ <nav class="android-navigation mdl-navigation">
+
+ <a [ngClass]="{'':((router.url.startsWith('/'+item.url)) || router.url.startsWith(item.url) )}"
+ *ngFor="let item of navigationTabs">
+ <a class="mdl-navigation__link mdl-typography--text-uppercase"
+ [routerLink]="[item.url]">{{item.name}}</a>
+ </a>
+
+ <!-- <a *ngIf="userLoggedIn"><b> {{userId}}</b></a> -->
+
+
+ </nav>
+ </div>
+ <button class="android-more-button mdl-button mdl-js-button mdl-button--primary" id="more-button">
+ <a *ngIf="userLoggedIn">{{userId}}</a>
+ </button>
+ <ul class="mdl-menu mdl-js-menu mdl-menu--bottom-right mdl-js-ripple-effect" for="more-button">
+ <!-- <li *ngIf="userLoggedIn" class="mdl-menu__item">My Profile</li> -->
+ <li *ngIf="userLoggedIn" class="mdl-menu__item" (click)="logout()">Logout</li>
+ </ul>
+</div>
+
+
+<ng-template #content let-c="close" let-d="dismiss">
+ <div class="modal-header">
+ <h4 class="modal-title">Modal title</h4>
+ <button type="button" class="android-more-button mdl-button mdl-js-button mdl-button--accent" aria-label="Close"
+ (click)="d('Cross click')">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+ <div class="modal-body">
+ <p>One fine body…</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="android-more-button mdl-button mdl-js-button mdl-button--accent"
+ (click)="c('Close click')">Close
+ </button>
+ </div>
+</ng-template>
diff --git a/src/app/shared/components/navigation/navigation.component.spec.ts b/src/app/shared/components/navigation/navigation.component.spec.ts
new file mode 100644
index 0000000..c5a436b
--- /dev/null
+++ b/src/app/shared/components/navigation/navigation.component.spec.ts
@@ -0,0 +1,50 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {NavigationComponent} from './navigation.component';
+
+describe('NavigationComponent', () => {
+ let component: NavigationComponent;
+ let fixture: ComponentFixture<NavigationComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [NavigationComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(NavigationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/navigation/navigation.component.ts b/src/app/shared/components/navigation/navigation.component.ts
new file mode 100644
index 0000000..acddf9e
--- /dev/null
+++ b/src/app/shared/components/navigation/navigation.component.ts
@@ -0,0 +1,110 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Component, Input, OnInit} from '@angular/core';
+import {Router} from '@angular/router';
+import {EmitterService} from '../../services/emitter.service';
+
+
+@Component({selector: 'app-navigation', templateUrl: './navigation.component.html', styleUrls: ['./navigation.component.css']})
+export class NavigationComponent implements OnInit {
+ navigationTabs: Array<Object> = [];
+ //@ViewChild(GoldenConfigurationComponent) goldenConfig: GoldenConfigurationComponent;
+ @Input() id: string;
+ userLoggedIn = false;
+ userId: string = localStorage['userId'];
+
+ constructor(private router: Router) {
+ };
+
+ ngOnChanges() {
+ EmitterService
+ .get(this.id)
+ .subscribe((value) => {
+ if (value != null && value != '' && value != undefined && value != 'undefined') {
+ this.userId = value;
+ this.userLoggedIn = true;
+ localStorage['userId'] = this.userId;
+ } else {
+ this.logout();
+ }
+
+ });
+ }
+
+ ngOnInit() {
+ this.userId = localStorage['userId'];
+ if (this.userId != undefined && this.userId != '') {
+ this.userLoggedIn = true;
+ }
+
+ this.navigationTabs = [
+
+ {
+ name: 'Home',
+ url: '/home'
+ }, {
+ name: 'MY VNFs',
+ url: 'vnfs'
+ },
+ {
+ name: 'Test',
+ url: 'test',
+ },
+ {
+ name: 'About us',
+ url: 'aboutUs'
+ }
+
+ ];
+ }
+
+
+ gotoDetail(url) {
+
+ if (url == 'vnfs') {
+ if (localStorage['userId'] != undefined && localStorage['userId'] != '' && localStorage['userId'] != null) {
+ this.router.navigate(['/vnfs/list']);
+ } else {
+ this.router.navigate(url);
+ }
+ } else {
+ this.router.navigate(url);
+ }
+
+
+ }
+
+ logout() {
+ window.localStorage.clear();
+ sessionStorage.clear();
+ localStorage.clear();
+ this.userLoggedIn = false;
+ //window.location.replace("/home");
+ this.router.navigate(['home']);
+
+
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/shared/confirmModal/confirm.component.ts b/src/app/shared/confirmModal/confirm.component.ts
new file mode 100644
index 0000000..79678b3
--- /dev/null
+++ b/src/app/shared/confirmModal/confirm.component.ts
@@ -0,0 +1,64 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+
+import {Component} from '@angular/core';
+import {DialogComponent, DialogService} from 'ng2-bootstrap-modal';
+
+export interface ConfirmModel {
+ title: string;
+ message: string;
+}
+
+@Component({
+ selector: 'confirm',
+ template: `
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" (click)="close()">×</button>
+ <h4 class="modal-title">Confirm</h4>
+ </div>
+ <div class="modal-body">
+ <p>Change Actions Without Saving?</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-primary" (click)="confirm()">Yes</button>
+ <button type="button" class="btn btn-default" (click)="close()">Cancel</button>
+ </div>
+ </div>
+ </div>`
+})
+export class ConfirmComponent extends DialogComponent<ConfirmModel, boolean> implements ConfirmModel {
+ title: string;
+ message: string;
+
+ constructor(dialogService: DialogService) {
+ super(dialogService);
+ }
+
+ confirm() {
+ // we set dialog result as true on click on confirm button,
+ // then we can get dialog result from caller code
+ this.result = true;
+ this.close();
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/collapse.component.ts b/src/app/shared/directives/collapse.component.ts
new file mode 100644
index 0000000..bf9c306
--- /dev/null
+++ b/src/app/shared/directives/collapse.component.ts
@@ -0,0 +1,94 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Directive, HostBinding, Input} from '@angular/core';
+
+
+@Directive({selector: '[collapse]'})
+export class Collapse {
+ // style
+ @HostBinding('style.height')
+ private height: string;
+ // shown
+ @HostBinding('class.in')
+ @HostBinding('attr.aria-expanded')
+ private isExpanded: boolean = true;
+ // hidden
+ @HostBinding('attr.aria-hidden')
+ private isCollapsed: boolean = false;
+ // stale state
+ @HostBinding('class.collapse')
+ private isCollapse: boolean = true;
+ // animation state
+ @HostBinding('class.collapsing')
+ private isCollapsing: boolean = false;
+
+ constructor() {
+ }
+
+ private get collapse(): boolean {
+ return this.isExpanded;
+ }
+
+ @Input()
+ private set collapse(value: boolean) {
+ this.isExpanded = value;
+ this.toggle();
+ }
+
+ toggle() {
+ if (this.isExpanded) {
+ this.hide();
+ } else {
+ this.show();
+ }
+ }
+
+ hide() {
+ this.isCollapse = false;
+ this.isCollapsing = true;
+
+ this.isExpanded = false;
+ this.isCollapsed = true;
+ setTimeout(() => {
+ this.height = '0';
+ this.isCollapse = true;
+ this.isCollapsing = false;
+ }, 4);
+ }
+
+ show() {
+ this.isCollapse = false;
+ this.isCollapsing = true;
+
+ this.isExpanded = true;
+ this.isCollapsed = false;
+ setTimeout(() => {
+ this.height = 'auto';
+
+ this.isCollapse = true;
+ this.isCollapsing = false;
+ }, 4);
+ }
+}
diff --git a/src/app/shared/directives/drop-down-toggle.directive.spec.ts b/src/app/shared/directives/drop-down-toggle.directive.spec.ts
new file mode 100644
index 0000000..b08d334
--- /dev/null
+++ b/src/app/shared/directives/drop-down-toggle.directive.spec.ts
@@ -0,0 +1,36 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {DropDownToggleDirective} from './drop-down-toggle.directive';
+import {ElementRef} from '@angular/core';
+
+
+describe('DropDownToggleDirective', () => {
+ it('should create an instance', () => {
+ const directive = new DropDownToggleDirective(new ElementRef(''));
+ expect(directive).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/directives/drop-down-toggle.directive.ts b/src/app/shared/directives/drop-down-toggle.directive.ts
new file mode 100644
index 0000000..7bf9fa8
--- /dev/null
+++ b/src/app/shared/directives/drop-down-toggle.directive.ts
@@ -0,0 +1,46 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Directive, ElementRef, Input, OnInit} from '@angular/core';
+
+@Directive({
+ selector: '[appDropDownToggle]'
+})
+export class DropDownToggleDirective implements OnInit {
+ @Input() type: string;
+
+ constructor(private el: ElementRef) {
+
+
+ }
+
+ ngOnInit() {
+
+ if (this.type == 'dropdown')
+ this.el.nativeElement.setAttribute('data-toggle', 'dropdown');
+
+
+ }
+
+}
diff --git a/src/app/shared/directives/dropdown.ts b/src/app/shared/directives/dropdown.ts
new file mode 100644
index 0000000..9057302
--- /dev/null
+++ b/src/app/shared/directives/dropdown.ts
@@ -0,0 +1,92 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {ContentChild, Directive, ElementRef, EventEmitter, Input, Output} from '@angular/core';
+import {DropdownNotClosableZone} from './dropdownnotclosablezone';
+
+@Directive({
+ selector: '[dropdown]',
+ exportAs: 'dropdown'
+})
+export class Dropdown {
+
+ // -------------------------------------------------------------------------
+ // Inputs / Outputs
+ // -------------------------------------------------------------------------
+
+ @Input('dropdownToggle')
+ toggleClick = true;
+
+ @Input('dropdownFocusActivate')
+ activateOnFocus = false;
+
+ @Output()
+ onOpen = new EventEmitter();
+
+ @Output()
+ onClose = new EventEmitter();
+
+ // -------------------------------------------------------------------------
+ // Properties
+ // -------------------------------------------------------------------------
+
+ @ContentChild(DropdownNotClosableZone)
+ notClosableZone: DropdownNotClosableZone;
+
+ // -------------------------------------------------------------------------
+ // Constructor
+ // -------------------------------------------------------------------------
+
+ constructor(private elementRef: ElementRef) {
+ }
+
+ // -------------------------------------------------------------------------
+ // Public Methods
+ // -------------------------------------------------------------------------
+
+ open() {
+ const element: HTMLElement = this.elementRef.nativeElement;
+ element.classList.add('open');
+ this.onOpen.emit(undefined);
+ }
+
+ close() {
+ const element: HTMLElement = this.elementRef.nativeElement;
+ element.classList.remove('open');
+ this.onClose.emit(undefined);
+ }
+
+ isOpened() {
+ const element: HTMLElement = this.elementRef.nativeElement;
+ return element.classList.contains('open');
+ }
+
+ isInClosableZone(element: HTMLElement) {
+ if (!this.notClosableZone)
+ return false;
+
+ return this.notClosableZone.contains(element);
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/dropdownnotclosablezone.ts b/src/app/shared/directives/dropdownnotclosablezone.ts
new file mode 100644
index 0000000..9ad351a
--- /dev/null
+++ b/src/app/shared/directives/dropdownnotclosablezone.ts
@@ -0,0 +1,45 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Directive, ElementRef, Input} from '@angular/core';
+
+@Directive({
+ selector: '[dropdown-not-closable-zone]'
+})
+export class DropdownNotClosableZone {
+
+ @Input('dropdown-not-closable-zone')
+ dropdownNotClosabledZone: boolean;
+
+ constructor(private elementRef: ElementRef) {
+ }
+
+ contains(element: HTMLElement) {
+ if (this.dropdownNotClosabledZone === false)
+ return false;
+
+ const thisElement: HTMLElement = this.elementRef.nativeElement;
+ return thisElement.contains(element);
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/dropdownopen.ts b/src/app/shared/directives/dropdownopen.ts
new file mode 100644
index 0000000..ea2858b
--- /dev/null
+++ b/src/app/shared/directives/dropdownopen.ts
@@ -0,0 +1,147 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Directive, ElementRef, Host, HostListener, OnDestroy} from '@angular/core';
+import {Dropdown} from './dropdown';
+
+@Directive({
+ selector: '[dropdown-open]',
+ exportAs: 'dropdownOpen'
+})
+export class DropdownOpen implements OnDestroy {
+
+ // -------------------------------------------------------------------------
+ // Private Properties
+ // -------------------------------------------------------------------------
+
+ /**
+ * This hack is needed for dropdown not to open and instantly closed
+ */
+ private openedByFocus: boolean = false;
+
+ private closeDropdownOnOutsideClick: (event: Event) => void;
+
+ // -------------------------------------------------------------------------
+ // Constructor
+ // -------------------------------------------------------------------------
+
+ constructor(@Host() public dropdown: Dropdown,
+ private elementRef: ElementRef) {
+ const _this = this;
+ this.closeDropdownOnOutsideClick = function closeDropdownOnOutsideClick(event: MouseEvent) {
+ _this.closeIfInClosableZone(event);
+ };
+ }
+
+ // -------------------------------------------------------------------------
+ // Public Methods
+ // -------------------------------------------------------------------------
+
+ toggle() {
+ if (this.dropdown.isOpened()) {
+ this.close();
+ } else {
+ this.open();
+ }
+ }
+
+ open() {
+ if (this.dropdown.isOpened())
+ return;
+
+ this.dropdown.open();
+ document.addEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+
+ close() {
+ if (!this.dropdown.isOpened())
+ return;
+
+ this.dropdown.close();
+ document.removeEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+
+ @HostListener('click')
+ openDropdown() {
+ if (this.dropdown.activateOnFocus && this.openedByFocus) {
+ this.openedByFocus = false;
+ return;
+ }
+
+ if (this.dropdown.isOpened() && this.dropdown.toggleClick) {
+ this.close();
+ } else {
+ this.open();
+ }
+ }
+
+ @HostListener('keydown', ['$event'])
+ dropdownKeydown(event: KeyboardEvent) {
+ if (event.keyCode === 40) { // down
+ this.openDropdown();
+ }
+ }
+
+ @HostListener('focus')
+ onFocus() {
+ if (!this.dropdown.activateOnFocus) return;
+ this.openedByFocus = true;
+ this.dropdown.open();
+ document.addEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+
+ @HostListener('blur', ['$event'])
+ onBlur(event: FocusEvent) {
+ if (!this.dropdown.activateOnFocus) return;
+ if (event.relatedTarget &&
+ !this.dropdown.isInClosableZone(<HTMLElement> event.relatedTarget) &&
+ event.relatedTarget !== this.elementRef.nativeElement) {
+
+ this.dropdown.close();
+ document.removeEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+ }
+
+ // -------------------------------------------------------------------------
+ // Lifecycle Methods
+ // -------------------------------------------------------------------------
+
+ ngOnDestroy() {
+ document.removeEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+
+ // -------------------------------------------------------------------------
+ // Private Methods
+ // -------------------------------------------------------------------------
+
+ private closeIfInClosableZone(event: Event) {
+ if (!this.dropdown.isInClosableZone(<HTMLElement> event.target)
+ && event.target !== this.elementRef.nativeElement
+ && !this.elementRef.nativeElement.contains(event.target)) {
+ this.dropdown.close();
+ document.removeEventListener('click', this.closeDropdownOnOutsideClick, true);
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/shared/modal/modal.component.css b/src/app/shared/modal/modal.component.css
new file mode 100644
index 0000000..f9c2a3c
--- /dev/null
+++ b/src/app/shared/modal/modal.component.css
@@ -0,0 +1,36 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.titlePopup {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: 1050;
+ /* display: none; */
+ overflow: hidden;
+ -webkit-overflow-scrolling: touch;
+ outline: 0;
+ background: rgba(62, 57, 57, 0.66);
+}
\ No newline at end of file
diff --git a/src/app/shared/modal/modal.component.html b/src/app/shared/modal/modal.component.html
new file mode 100644
index 0000000..e227568
--- /dev/null
+++ b/src/app/shared/modal/modal.component.html
@@ -0,0 +1,47 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<div id="modalId" class="titlePopup" role="dialog" *ngIf="isShow">
+ <div class="modal-dialog">
+
+
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="android-more-button mdl-button mdl-js-button mdl-button--accent"
+ data-dismiss="modal" (click)="isClose()">×
+ </button>
+ <h4 class="modal-title">{{title}}</h4>
+ </div>
+ <div class="modal-body">
+ <p>{{message}}</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button"
+ class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent"
+ data-dismiss="modal" (click)="isClose()">Close
+ </button>
+ </div>
+ </div>
+
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/modal/modal.component.ts b/src/app/shared/modal/modal.component.ts
new file mode 100644
index 0000000..ec88702
--- /dev/null
+++ b/src/app/shared/modal/modal.component.ts
@@ -0,0 +1,52 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, Input, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-modal',
+ templateUrl: './modal.component.html',
+ styleUrls: ['./modal.component.css']
+
+
+})
+export class ModalComponent implements OnInit {
+
+ @Input() title: string;
+ @Input() message: string;
+ @Input() onDismiss: boolean;
+ @Input() onConfirm: boolean;
+ @Input() isShow: boolean;
+
+ constructor() {
+
+ }
+
+ ngOnInit() {
+
+ }
+
+ isClose() {
+ this.isShow = false;
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/models/ArtifactRequest.ts b/src/app/shared/models/ArtifactRequest.ts
new file mode 100644
index 0000000..75438d0
--- /dev/null
+++ b/src/app/shared/models/ArtifactRequest.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+export class ArtifactRequest {
+ public vnfType: string;
+ public fileName: string;
+ public version: string;
+ public action: string;
+ public templateContent: string;
+ public pdContent: string;
+ public referenceContent: string;
+ public paramsContent: string;
+ public paramKeysContent: string;
+ public isTemplatePush: Boolean;
+ public isPdPush: Boolean;
+ public isReferenceePush: Boolean;
+
+}
\ No newline at end of file
diff --git a/src/app/shared/models/ConfigMapping.ts b/src/app/shared/models/ConfigMapping.ts
new file mode 100644
index 0000000..afe9d13
--- /dev/null
+++ b/src/app/shared/models/ConfigMapping.ts
@@ -0,0 +1,30 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+export class ConfigMapping {
+ public selectedRange: any;
+ public mappingKey: string;
+ public mappingValue: string;
+ public duplicateRanges: Array<any> = [];
+}
\ No newline at end of file
diff --git a/src/app/shared/models/Notification.ts b/src/app/shared/models/Notification.ts
new file mode 100644
index 0000000..02f7524
--- /dev/null
+++ b/src/app/shared/models/Notification.ts
@@ -0,0 +1,29 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+export class Notification {
+ constructor(public type: string = '',
+ public message: string = '') {
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/models/index.ts b/src/app/shared/models/index.ts
new file mode 100644
index 0000000..5c19bcf
--- /dev/null
+++ b/src/app/shared/models/index.ts
@@ -0,0 +1,31 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+// export * from './TemplateMapping';
+// export * from './TemplateRequest';
+// export * from './TemplateResponse';
+export * from './Notification';
+export * from './ArtifactRequest';
+//export * from './ArtifactResponse';
+export * from './ConfigMapping';
\ No newline at end of file
diff --git a/src/app/shared/modules/tidy-table/order-by.pipe.spec.ts b/src/app/shared/modules/tidy-table/order-by.pipe.spec.ts
new file mode 100644
index 0000000..82c57a1
--- /dev/null
+++ b/src/app/shared/modules/tidy-table/order-by.pipe.spec.ts
@@ -0,0 +1,34 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {OrderBy} from './order-by.pipe';
+
+describe('OrderByPipe', () => {
+ it('create an instance', () => {
+ const pipe = new OrderBy();
+ expect(pipe).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/modules/tidy-table/order-by.pipe.ts b/src/app/shared/modules/tidy-table/order-by.pipe.ts
new file mode 100644
index 0000000..45f44d9
--- /dev/null
+++ b/src/app/shared/modules/tidy-table/order-by.pipe.ts
@@ -0,0 +1,81 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Pipe, PipeTransform} from '@angular/core';
+
+@Pipe({name: 'orderBy'})
+export class OrderBy implements PipeTransform {
+
+ transform(array, orderBy, asc = true) {
+
+ if (!orderBy || orderBy.trim() == '') {
+ return array;
+ }
+
+ //ascending
+ if (asc) {
+ return Array
+ .from(array)
+ .sort((item1: any, item2: any) => {
+ return this.orderByComparator(item1[orderBy], item2[orderBy]);
+ });
+ } else {
+ //not asc
+ return Array
+ .from(array)
+ .sort((item1: any, item2: any) => {
+ return this.orderByComparator(item2[orderBy], item1[orderBy]);
+ });
+ }
+
+ }
+
+ orderByComparator(a: any, b: any): number {
+ if (a != undefined && b != undefined) {
+ if ((isNaN(parseFloat(a)) || !isFinite(a)) || (isNaN(parseFloat(b)) || !isFinite(b))) {
+ // Isn't a number so lowercase the string to properly compare
+ if (a.toLowerCase() < b.toLowerCase())
+ return -1;
+ if (a.toLowerCase() > b.toLowerCase())
+ return 1;
+ }
+ else {
+ //Parse strings as numbers to compare properly
+ if (parseFloat(a) < parseFloat(b))
+ return -1;
+ if (parseFloat(a) > parseFloat(b))
+ return 1;
+ }
+ } else {
+ if (a == undefined) {
+ return -1;
+ } else {
+ return 1;
+ }
+ }
+
+
+ return 0; //equal each other
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/modules/tidy-table/table-filter.pipe.spec.ts b/src/app/shared/modules/tidy-table/table-filter.pipe.spec.ts
new file mode 100644
index 0000000..d8fe6c7
--- /dev/null
+++ b/src/app/shared/modules/tidy-table/table-filter.pipe.spec.ts
@@ -0,0 +1,34 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {TableFilterPipe} from './table-filter.pipe';
+
+describe('TableFilterPipe', () => {
+ it('create an instance', () => {
+ const pipe = new TableFilterPipe();
+ expect(pipe).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/modules/tidy-table/table-filter.pipe.ts b/src/app/shared/modules/tidy-table/table-filter.pipe.ts
new file mode 100644
index 0000000..1eec34b
--- /dev/null
+++ b/src/app/shared/modules/tidy-table/table-filter.pipe.ts
@@ -0,0 +1,53 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Pipe, PipeTransform} from '@angular/core';
+import * as _ from 'underscore';
+
+@Pipe({name: 'tableFilter'})
+export class TableFilterPipe implements PipeTransform {
+
+ transform(array: any[], query: string, filetrColumns: Array<String>): any {
+ if (query) {
+ return _.filter(array, (row: Object) => this.filterRows(filetrColumns, row, query));
+ }
+ return array;
+ }
+
+ filterRows(columsn, row, query) {
+ let temp: Array<boolean> = [];
+ for (let x = 0; x < columsn.length; x++) {
+ if ((row[columsn[x]]) != null && query != null) {
+ temp.push((row[columsn[x]].toLowerCase().indexOf(query.toLowerCase()) > -1));
+ }
+ }
+
+ return _.reduce(temp, function (memoizer, value) {
+
+ return (memoizer || value);
+ }, false);
+
+ }
+
+}
diff --git a/src/app/shared/modules/tidy-table/tidy-table.module.ts b/src/app/shared/modules/tidy-table/tidy-table.module.ts
new file mode 100644
index 0000000..ae5f00a
--- /dev/null
+++ b/src/app/shared/modules/tidy-table/tidy-table.module.ts
@@ -0,0 +1,38 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {OrderBy} from './order-by.pipe';
+import {TableFilterPipe} from './table-filter.pipe';
+
+@NgModule({
+ imports: [CommonModule],
+ declarations: [
+ TableFilterPipe, OrderBy
+ ],
+ exports: [TableFilterPipe, OrderBy]
+})
+export class TidyTableModule {
+}
\ No newline at end of file
diff --git a/src/app/shared/services/emitter.service.spec.ts b/src/app/shared/services/emitter.service.spec.ts
new file mode 100644
index 0000000..f12154f
--- /dev/null
+++ b/src/app/shared/services/emitter.service.spec.ts
@@ -0,0 +1,40 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {inject, TestBed} from '@angular/core/testing';
+import {EmitterService} from './emitter.service';
+
+describe('EmitterService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [EmitterService]
+ });
+ });
+
+ it('should ...', inject([EmitterService], (service: EmitterService) => {
+ expect(service).toBeTruthy();
+ }));
+});
diff --git a/src/app/shared/services/emitter.service.ts b/src/app/shared/services/emitter.service.ts
new file mode 100644
index 0000000..1cedc63
--- /dev/null
+++ b/src/app/shared/services/emitter.service.ts
@@ -0,0 +1,42 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {EventEmitter, Injectable} from '@angular/core';
+
+@Injectable()
+export class EmitterService {
+ private static _emitters: {
+ [ID: string]: EventEmitter<any>
+ } = {};
+
+ constructor() {
+ }
+
+ static get(ID: string): EventEmitter<any> {
+ if (!this._emitters[ID])
+ this._emitters[ID] = new EventEmitter();
+ return this._emitters[ID];
+ }
+
+}
diff --git a/src/app/shared/services/httpUtil/http-util.service.spec.ts b/src/app/shared/services/httpUtil/http-util.service.spec.ts
new file mode 100644
index 0000000..c6923bb
--- /dev/null
+++ b/src/app/shared/services/httpUtil/http-util.service.spec.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+
+import {inject, TestBed} from '@angular/core/testing';
+import {HttpUtilService} from './http-util.service';
+
+describe('HttpUtilService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [HttpUtilService]
+ });
+ });
+
+ it('should ...', inject([HttpUtilService], (service: HttpUtilService) => {
+ expect(service).toBeTruthy();
+ }));
+});
diff --git a/src/app/shared/services/httpUtil/http-util.service.ts b/src/app/shared/services/httpUtil/http-util.service.ts
new file mode 100644
index 0000000..35c5047
--- /dev/null
+++ b/src/app/shared/services/httpUtil/http-util.service.ts
@@ -0,0 +1,57 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+import { observable } from 'rxjs/symbol/observable';
+import 'rxjs/add/operator/map';
+import 'rxjs/add/operator/toPromise';
+import { Injectable } from '@angular/core';
+import { Http, Response, Headers, RequestOptions } from '@angular/http';
+
+@Injectable()
+export class HttpUtilService {
+ headers: Headers;
+ options: RequestOptions
+ constructor (private http: Http) {
+ this.headers = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON
+ // this.options = new RequestOptions({headers: this.headers}); //
+ }
+
+ get(req) {
+
+ return this
+ .http
+ .get(req.url, this.options)
+ .map((res: Response) => res.json())
+ }
+
+ post(req) {
+
+ this.headers.append('Authorization', 'Basic ' + btoa('m97292@appc.att.com:enc:Ai8KDxN7EANwATsV'));
+ this.options = new RequestOptions({ headers: this.headers });
+
+ return this
+ .http
+ .post(req.url, req.data, this.options)
+ .map((res: Response) => res.json())
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/shared/services/mapping-editor.service.ts b/src/app/shared/services/mapping-editor.service.ts
new file mode 100644
index 0000000..00ef211
--- /dev/null
+++ b/src/app/shared/services/mapping-editor.service.ts
@@ -0,0 +1,684 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Injectable} from '@angular/core';
+import {ConfigMapping} from '../models/index';
+import {Observable} from 'rxjs/Observable';
+import {Observer} from 'rxjs/Observer';
+import 'rxjs/add/operator/share';
+
+
+@Injectable()
+export class MappingEditorService {
+
+ editor: any;
+ session: any;
+ editorContent: string;
+ configMappings: Array<ConfigMapping> = [];
+ paramContent: string = '{}';
+
+ KEY_EXPRESSION: string = '\\${\\(.+?\\)}';//new RegExp('${.+?}'); // \${.+?}
+ //SYNC_KEY_EXPRESSION: string = '\\${\\)}';
+ KEY_START: string = '${(';
+ KEY_MID: string = ')=(';
+ KEY_END: string = ')}';
+ KEY_START_LENGTH: number = 3;
+ KEY_MID_LENGTH: number = 3;
+ KEY_END_LENGTH: number = 2;
+ SYNC_T_KEY_EXPRESSION: string = '\\${.+?\\}';
+ T_KEY_EXPRESSION: string = '\\${.+?}';//new RegExp('${.+?}'); // \${.+?}
+ T_KEY_START: string = '${';
+ T_KEY_END: string = '}';
+ T_KEY_START_LENGTH: number = 2;
+ T_KEY_END_LENGTH: number = 1;
+ checkSpecialCharsReg: RegExp = /[^\w\s-_]/gi;
+ public paramData = [];
+ public referenceNameObjects: any;
+ prmName: string = '';
+ prmValue: string = '';
+ navChange$: Observable<any>;
+ public fromScreen: any = '';
+ public storedTemplateData: any;
+ public storedTemplateMappingData: any;
+ public fileType: any;
+ public hasErrorCode: boolean = false;
+ public appDataObject: any;
+ public downloadDataObject: any;
+ public markedarr: any;
+ public tempAllData: any;
+ public latestAction: any;
+ public selectedWord: any;
+ identifier: any;
+ private _navItem = {};
+ private _observer: Observer<any>;
+ private referenceList = [];
+
+ constructor() {
+ this.navChange$ = new Observable(observer =>
+ this._observer = observer).share();
+ }
+
+ setSelectedWord(selectedWord: any) {
+ this.selectedWord = selectedWord;
+ }
+
+ getSelectedWord() {
+ return this.selectedWord;
+ }
+
+ changeNav(object) {
+ this._navItem = object;
+ // this._observer.next(object);
+ this.referenceNameObjects = object;
+ }
+
+ changeNavAppData(object) {
+ this._navItem = object;
+ // this._observer.next(object);
+ this.appDataObject = object;
+ }
+
+ changeNavDownloadData(object) {
+ this._navItem = object;
+ // this._observer.next(object);
+ this.downloadDataObject = object;
+ }
+
+ saveLatestAction(data) {
+ this.latestAction = data;
+ }
+
+ saveLatestIdentifier(identifier) {
+ this.identifier = identifier;
+ }
+
+ public getParamContent() {
+ return this.paramContent;
+ }
+
+ saveTempAllData(data) {
+ this.tempAllData = data;
+ }
+
+ navItem() {
+ return this._navItem;
+ }
+
+ public setParamContent(paramContent: string): void {
+ this.paramContent = paramContent;
+ // localStorage["paramContent"]=paramContent;
+ }
+
+ public initialise(editor: any, editorContent: string, modal: any): void {
+ this.editor = editor;
+ this.editor.session = editor.session;
+ this.editor.selection.session.$backMarkers = {};
+ this.editorContent = editorContent;
+ this.editor.$blockScrolling = Infinity;
+ this.editor.$blockSelectEnabled = false;
+ this.initialiseCommands(modal);
+ this.editor.setValue(this.editorContent);
+ this.refreshEditor();
+ }
+
+
+ public initialiseCommands(modal): void {
+ /* this.editor.commands.addCommand({
+ name: 'annotateCommand',
+ bindKey: { win: 'ENTER', mac: 'ENTER' },
+ exec: (editor: any) => {
+ this.handleAnnotation(modal);
+ }
+ });*/
+
+
+ this.editor.commands.addCommand({
+ name: 'keyCompletionCommand',
+ bindKey: {win: 'Ctrl-s', mac: 'Command-s'},
+ exec: (editor: any) => {
+ this.handlekeyCompletion();
+ }
+ });
+
+ this.editor.commands.addCommand({
+ name: 'autoAnnotateCommand',
+ bindKey: {win: 'Ctrl-2', mac: 'Command-2'},
+ exec: (editor: any) => {
+ this.autoAnnotateDataForParams(this.fileType);
+ }
+ });
+
+ this.editor.commands.addCommand({
+ name: 'autoAnnotateCommand',
+ bindKey: {win: 'Ctrl-shift-z', mac: 'Command-shift-z'},
+ exec: (editor: any) => {
+ this.removeTheSelectedMarkers();
+ }
+ });
+ }
+
+ public getStartBeforeAfterSelection(selection: any, beforeCount: number, afterCount: number) {
+ let newSelctionRange: any = JSON.parse(JSON.stringify(selection));
+ if (selection) {
+ let newBeforeColumn: number = selection.start.column - beforeCount;
+ let newAfterColumn: number = selection.end.column + afterCount;
+ newSelctionRange.start.column = newBeforeColumn;
+ newSelctionRange.end.column = newAfterColumn;
+ }
+ return newSelctionRange;
+ }
+
+ public checkToDataAdd(value: string): boolean {
+ let toAdd = false;
+ if (value && (value.startsWith('"') || value.startsWith('>'))
+ && (value.endsWith('"') || value.endsWith('<'))
+ && !value.startsWith('"${')
+ ) {
+ toAdd = true;
+ }
+ return toAdd;
+ }
+
+ public autoAnnotateDataForParams(fileType: any): boolean {
+ this.paramContent = localStorage['paramsContent'];
+ //console.log("Param content=="+ this.paramContent)
+ var mergeStatus: boolean = false;
+ if (this.paramContent) {
+ var paramJson: JSON = JSON.parse(this.paramContent);
+ for (var prop in paramJson) {
+ let value: string = paramJson[prop];
+ if (value) {
+ var occurances = this.editor.findAll(value, {regExp: false});
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+
+ for (var r = 0; r < ranges.length; r++) {
+ let selectedRange: any = ranges[r];
+ let selectedWord: string = this.editor.session.getTextRange(selectedRange);
+ let prefixSuffixselectedWord: string = this.editor.session.getTextRange(this.getStartBeforeAfterSelection(selectedRange, 1, 1));
+ if (selectedWord && this.checkComments(selectedRange) && this.checkDelimiters(selectedRange) && this.checkApplied(selectedRange)) {
+ let replaceWord: any = this.KEY_START + selectedWord + this.KEY_MID + prop + this.KEY_END;
+ this.editor.session.replace(selectedRange, replaceWord);
+ mergeStatus = true;
+ }
+ }
+ }
+ }
+ }
+ }
+ return mergeStatus;
+ }
+
+ /* syncTemplateNames() {
+ if (this.paramContent != '{}') {
+ var paramJson: JSON = JSON.parse(this.paramContent);
+ for (var prop in paramJson) {
+ let value: string = paramJson[prop]
+ if (value) {
+ var occurances = this.editor.findAll(value, { regExp: false });
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ for (var r = 0; r < ranges.length; r++) {
+ let selectedRange: any = ranges[r];
+ let selectedWord: string = this.editor.session.getTextRange(selectedRange);
+ let prefixSuffixselectedWord: string = this.editor.session.getTextRange(this.getStartBeforeAfterSelection(selectedRange, 1, 1));
+ if (selectedWord && this.checkApplied(selectedRange)) {
+ let replaceWord: any = this.KEY_START + selectedWord + this.KEY_MID + prop + this.KEY_END;
+ this.editor.session.replace(selectedRange, replaceWord);
+ }
+ }
+ }
+ }
+ }
+ for (var prop in paramJson) {
+ var occurances = this.editor.findAll(prop, { regExp: false });
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ for (var r = 0; r < ranges.length; r++) {
+ let selectedRange: any = ranges[r];
+ let selectedWord: string = this.editor.session.getTextRange(selectedRange);
+ if (selectedWord && this.checkApplied(selectedRange)) {
+ let replaceWord: any = '(' + paramJson[prop] + this.KEY_MID + selectedWord + ')';
+ this.editor.session.replace(selectedRange, replaceWord);
+ }
+ }
+ }
+ else {
+ this.replaceNamesWithBlankValues();
+ }
+ }
+ }
+ else {
+ this.replaceNamesWithBlankValues()
+ }
+ }*/
+
+
+ checkComments(selectedRange: any) {
+ var tempStartColumn = selectedRange.start.column;
+ var result = false;
+ selectedRange.start.column = 0;
+ if (this.editor.session.getTextRange(selectedRange).trim().startsWith('//')) {
+ result = false;
+ } else {
+ result = true;
+ }
+ selectedRange.start.column = tempStartColumn;
+ return result;
+ }
+
+ checkApplied(selectedRange: any) {
+ var tempStartColumn = selectedRange.start.column;
+ for (var i = selectedRange.start.column; i >= 0; i--) {
+ selectedRange.start.column = i;
+ if (this.editor.session.getTextRange(selectedRange).startsWith(this.KEY_START)
+ || this.editor.session.getTextRange(selectedRange).startsWith(this.T_KEY_START)) {
+ selectedRange.start.column = tempStartColumn;
+ return false;
+ } else if (this.editor.session.getTextRange(selectedRange).startsWith(this.KEY_END)
+ || this.editor.session.getTextRange(selectedRange).startsWith(this.T_KEY_END)) {
+ selectedRange.start.column = tempStartColumn;
+ return true;
+ }
+
+ }
+ selectedRange.start.column = tempStartColumn;
+ return true;
+
+ }
+
+ checkDelimiters(selectedRange: any) {
+ let result = false;
+ let actualText = this.editor.session.getTextRange(selectedRange);
+ var tempStartColumn = selectedRange.start.column;
+ var tempEndcolumn = selectedRange.end.column;
+
+ selectedRange.start.column = selectedRange.start.column - 1;
+ selectedRange.end.column = selectedRange.end.column + 1;
+ if ((this.editor.session.getTextRange(selectedRange).startsWith(' ')
+ || this.editor.session.getTextRange(selectedRange).startsWith('"')
+ || this.editor.session.getTextRange(selectedRange).startsWith('>'))
+ && (this.editor.session.getTextRange(selectedRange).endsWith(' ')
+ || this.editor.session.getTextRange(selectedRange).endsWith('"')
+ || this.editor.session.getTextRange(selectedRange).endsWith(',')
+ || this.editor.session.getTextRange(selectedRange).endsWith(actualText)
+ || this.editor.session.getTextRange(selectedRange).endsWith('<'))) {
+ result = true;
+ }
+
+ //Ignore the JSON key names(which ends with :)
+ selectedRange.end.column = selectedRange.end.column + 1;
+ if (this.editor.session.getTextRange(selectedRange).endsWith('":')) {
+ result = false;
+ } else {
+ selectedRange.end.column = selectedRange.end.column + 1;
+ if (this.editor.session.getTextRange(selectedRange).endsWith('" :')) {
+ result = false;
+ }
+ }
+ selectedRange.start.column = tempStartColumn;
+ selectedRange.end.column = tempEndcolumn;
+ return result;
+ }
+
+ checkAppliedForNamesOnly(selectedRange: any) {
+ var tempStartColumn = selectedRange.start.column;
+ for (var i = selectedRange.start.column; i >= 0; i--) {
+ selectedRange.start.column = i;
+ if (this.editor.session.getTextRange(selectedRange).startsWith(this.KEY_START)) {
+ selectedRange.start.column = tempStartColumn;
+ return false;
+ } else if (this.editor.session.getTextRange(selectedRange).startsWith(this.KEY_END)) {
+ selectedRange.start.column = tempStartColumn;
+ return true;
+ }
+
+ }
+ selectedRange.start.column = tempStartColumn;
+ return true;
+
+ }
+
+ checkToDataAddForJson(value: string): boolean {
+ let toAdd = false;
+ if (value && !value.startsWith('"${') && !value.startsWith('(')) {
+ toAdd = true;
+ }
+ return toAdd;
+ }
+
+ public autoAnnotateTemplateForParam(): void {
+ var occurances = this.editor.findAll(this.T_KEY_EXPRESSION, {regExp: true});
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ for (var r = 0; r < ranges.length; r++) {
+ let selectedRange: any = ranges[r];
+ let selectedWord: string = this.editor.session.getTextRange(selectedRange);
+ if (selectedWord) {
+ let key: string = selectedWord.substring(this.T_KEY_START_LENGTH, selectedWord.lastIndexOf(this.T_KEY_END));
+ let value: string = this.getValueForKey(key);
+ let replaceWord: any = this.KEY_START + value + this.KEY_MID + key + this.KEY_END;
+ this.editor.session.replace(selectedRange, replaceWord);
+ }
+ }
+ }
+
+ }
+
+ /*
+ * Once you save command is triggered, We need to re populate all the params, which may be defined new
+ * and auto populate the key if any of the values maps to the keys
+ */
+ public handlekeyCompletion(): void {
+ this.refreshEditor();
+ }
+
+ /* public handleAnnotation(modal): void {
+ let selectedWord: string = this.editor.session.getTextRange(this.editor.selectionRange);
+ this.setSelectedWord(selectedWord);
+ modal.open();
+
+ /* let selectedWord: string = this.editor.session.getTextRange(this.editor.selectionRange);
+ if (selectedWord) {
+ if (selectedWord.startsWith('${(')) {
+ var replaceWord = selectedWord.substring(3, selectedWord.indexOf(')=('));
+ this.editor.session.replace(this.editor.session.selection.getRange(), replaceWord);
+ } else {
+ let mappingKey = this.getKeysForValues(selectedWord);
+ var replaceWord = '${(' + selectedWord + ')=()}';
+ this.editor.session.replace(this.editor.session.selection.getRange(), replaceWord);
+ }
+ }
+ this.refreshEditor();
+ }*/
+
+ public checkMethodCall(modal): void {
+//this.handleAnnotation(modal)
+ }
+
+ public refreshEditor(): void {
+ if (this.editor) {
+
+ // this.replaceNamesWithBlankValues();
+ var occurances = this.editor.findAll(this.KEY_EXPRESSION, {regExp: true});
+ //console.log("Occurances from save" + occurances)
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ this.refreshParams(ranges);
+ }
+
+ occurances = this.editor.findAll(this.KEY_EXPRESSION, {regExp: true});
+ ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ this.populateMissingKeys(ranges);
+ }
+ this.refreshMarker();
+ }
+ // console.log("Param data from refresh editor=="+this.paramData)
+
+ }
+
+ replaceNamesWithBlankValues() {
+ var occurances = this.editor.findAll(this.SYNC_T_KEY_EXPRESSION, {regExp: true});
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (occurances > 0) {
+ if (ranges) {
+ for (var r = 0; r < ranges.length; r++) {
+ let selectedRange: any = ranges[r];
+ // console.log("Selected range == " + selectedRange)
+ let selectedWord: string = this.editor.session.getTextRange(selectedRange);
+ let specialKeys = (selectedWord.substring(2, selectedWord.length - 1)).match(this.checkSpecialCharsReg);
+ // console.log("Selected word == " + selectedWord.length)
+ //if (!selectedWord.startsWith('<') || !selectedWord.startsWith('{')) {
+ if (selectedWord && this.checkAppliedForNamesOnly(selectedRange) && !specialKeys) {
+ let replaceWord: any = this.KEY_START + '' + this.KEY_MID + selectedWord.substring(2, selectedWord.length - 1) + this.KEY_END;
+ this.editor.session.replace(selectedRange, replaceWord);
+ }
+ // }
+ }
+ }
+ }
+ }
+
+ public refreshParams(ranges: any): void {
+ // console.log("This param content==="+ this.paramContent);
+ var paramData = [];
+ if (this.paramContent === undefined) this.paramContent = '{}';
+ if (this.editor && ranges) {
+ var paramJson: JSON = JSON.parse(this.paramContent);
+ this.hasErrorCode = false;
+ for (var r = 0; r < ranges.length; r++) {
+ let keyValue: string = this.editor.session.getTextRange(ranges[r]);
+ //console.log("keyValues==="+keyValue)
+ if (keyValue && keyValue.startsWith(this.KEY_START) && keyValue.endsWith(this.KEY_END) && keyValue.includes(this.KEY_MID)) {
+ let key: string = keyValue.substring(keyValue.indexOf(this.KEY_MID) + this.KEY_MID_LENGTH, keyValue.indexOf(this.KEY_END));
+ let value: string = keyValue.substring(this.KEY_START_LENGTH, keyValue.indexOf(this.KEY_MID));
+ let specialKeys = key.match(this.checkSpecialCharsReg);
+ //console.log("Special keys=="+specialKeys)
+ //console.log("Keys=="+key+",values=="+value);
+ if (specialKeys && specialKeys.length) {
+ // this.paramData = [];
+ // this.hasErrorCode = true;
+ // break;
+ } else {
+ if (this.fromScreen === 'TemplateScreen') {
+ if (key) {
+ paramJson[key] = value;
+ var obj: any = {'paramName': '', 'paramValue': ''};
+ obj.paramName = key;
+ obj.paramValue = value;
+ paramData.push(obj);
+ }
+
+ }
+ else if (this.fromScreen === 'MappingScreen') {
+ if (key) {
+ paramJson[key] = value;
+ var obj: any = {'paramName': '', 'paramValue': ''};
+ obj.paramName = key;
+ obj.paramValue = value;
+
+ paramData.push(obj);
+
+ }
+ }
+ }
+ }
+ }
+ // console.log("Param data=="+ JSON.stringify(paramData))
+ this.paramData = paramData;
+ this.paramContent = JSON.stringify(paramJson);
+
+ }
+ }
+
+ public populateMissingKeys(ranges: any): void {
+ if (this.editor && ranges) {
+ // Populate missing keys
+ for (var r = 0; r < ranges.length; r++) {
+ let keyValue: string = this.editor.session.getTextRange(ranges[r]);
+ if (keyValue && keyValue.startsWith(this.KEY_START) && keyValue.endsWith(this.KEY_END) && keyValue.includes(this.KEY_MID)) {
+ let key: string = keyValue.substring(keyValue.indexOf(this.KEY_MID) + this.KEY_MID_LENGTH, keyValue.indexOf(this.KEY_END));
+ let value: string = keyValue.substring(this.KEY_START_LENGTH, keyValue.indexOf(this.KEY_MID));
+ if (!key && value) {
+ let keyFromStore = '';
+ if (keyFromStore) {
+ let replaceWord: string = '${(' + value + ')=(' + keyFromStore + ')}';
+ this.editor.session.replace(ranges[r], replaceWord);
+ }
+ }
+ }
+ }
+
+ }
+ }
+
+ public refreshMarker(): void {
+ if (this.editor) {
+ this.hasErrorCode = false;
+ var occurances = this.editor.findAll(this.KEY_EXPRESSION, {regExp: true});
+ var ranges = this.editor.getSelection().getAllRanges();
+ var keysList = [];
+ // Populate missing keys
+ for (var r = 0; r < ranges.length; r++) {
+ let keyValue: string = this.editor.session.getTextRange(ranges[r]);
+ if (keyValue && keyValue.startsWith(this.KEY_START) && keyValue.endsWith(this.KEY_END) && keyValue.includes(this.KEY_MID)) {
+ let key: string = keyValue.substring(keyValue.indexOf(this.KEY_MID) + this.KEY_MID_LENGTH, keyValue.indexOf(this.KEY_END));
+ let value: string = keyValue.substring(this.KEY_START_LENGTH, keyValue.indexOf(this.KEY_MID));
+ let specialKeys = key.match(this.checkSpecialCharsReg);
+ if (specialKeys && specialKeys.length) {
+ this.hasErrorCode = true;
+ break;
+ }
+ if (!key && value) {
+ this.editor.session.addMarker(ranges[r], 'warningMarker', 'text');
+ } else {
+ if (keysList.indexOf(key) > -1) {
+ this.editor.session.addMarker(ranges[r], 'warningMarker', 'text');
+ } else {
+ this.editor.session.addMarker(ranges[r], 'keyedMarker', 'text');
+ }
+ keysList.push(key);
+ }
+ // Refresh Markers
+ }
+ }
+ this.editor.clearSelection();
+ this.editor.exitMultiSelectMode();
+ }
+ }
+
+ public getKeysForValues(value: string): string {
+ var key: string = undefined;
+ if (this.paramContent && value) {
+ var paramJson: JSON = JSON.parse(this.paramContent);
+ for (var prop in paramJson) {
+ if (value === paramJson[prop]) {
+ key = prop;
+ }
+ }
+ }
+ return key;
+ }
+
+ public getValueForKey(key: string): string {
+ var value: string = undefined;
+ if (key) {
+ var paramJson: JSON = JSON.parse(this.paramContent);
+ if (paramJson) {
+ value = paramJson[key];
+ }
+ }
+ return value;
+ }
+
+ public generateTemplate(templateEditor: any): void {
+ if (templateEditor) {
+ templateEditor.setValue(this.editor.getValue());
+ var occurances = templateEditor.findAll(this.KEY_EXPRESSION, {regExp: true});
+ var ranges = templateEditor.getSelection().getAllRanges();
+ if (ranges) {
+ for (var r = 0; r < ranges.length; r++) {
+ let keyValue: string = templateEditor.session.getTextRange(ranges[r]);
+ if (keyValue && keyValue.startsWith(this.KEY_START) && keyValue.endsWith(this.KEY_END) && keyValue.includes(this.KEY_MID)) {
+ let key: string = keyValue.substring(keyValue.indexOf(this.KEY_MID) + this.KEY_MID_LENGTH, keyValue.indexOf(this.KEY_END));
+ let value: string = keyValue.substring(this.KEY_START_LENGTH, keyValue.indexOf(this.KEY_MID));
+ if (key && value) {
+ let replaceWord: string = '${' + key + '}';
+ templateEditor.session.replace(ranges[r], replaceWord);
+ }
+ }
+ }
+ templateEditor.clearSelection();
+ templateEditor.exitMultiSelectMode();
+ templateEditor.session.$backMarkers = {};
+
+ }
+ }
+ }
+
+ public generateParams(paramsEditor: any, paramsKeyValueEditor: any): JSON {
+ if (paramsEditor && paramsKeyValueEditor) {
+ var occurances = this.editor.findAll(this.KEY_EXPRESSION, {regExp: true});
+ var ranges = this.editor.getSelection().getAllRanges();
+ if (ranges) {
+ let paramsJSON: JSON = JSON.parse('{}');
+ for (var r = 0; r < ranges.length; r++) {
+ let keyValue: string = this.editor.session.getTextRange(ranges[r]);
+ if (keyValue && keyValue.startsWith(this.KEY_START) && keyValue.endsWith(this.KEY_END) && keyValue.includes(this.KEY_MID)) {
+ let key: string = keyValue.substring(keyValue.indexOf(this.KEY_MID) + this.KEY_MID_LENGTH, keyValue.indexOf(this.KEY_END));
+ let value: string = keyValue.substring(this.KEY_START_LENGTH, keyValue.indexOf(this.KEY_MID));
+ if (key) {
+ paramsJSON[key] = value;
+ }
+ }
+ }
+
+ var propertyContent = [];
+ for (var prop in paramsJSON) {
+ propertyContent.push(prop + '=' + paramsJSON[prop]);
+ }
+ this.editor.clearSelection();
+ this.editor.exitMultiSelectMode();
+ return paramsJSON;
+ }
+ }
+ }
+
+ setTemplateDataForStore(templateData: any) {
+ this.storedTemplateData = templateData;
+ }
+
+ getTemplateDataFromStore() {
+ return this.storedTemplateData;
+ }
+
+ removeTheSelectedMarkers() {
+ var arr: any = [];
+ arr = this.markedarr;
+ this.editor.selection.session.$backMarkers = {};
+ }
+
+ getsaveMarkers() {
+ this.markedarr = [...this.editor.selection.session.$selectionMarkers];
+ }
+
+ getTemplateMappingDataFromStore() {
+ return this.storedTemplateMappingData;
+ }
+
+ setTemplateMappingDataFromStore(templateMappingData: any) {
+ this.storedTemplateMappingData = templateMappingData;
+ }
+
+ public setReferenceList(references) {
+ this.referenceList = references;
+ }
+
+ public getReferenceList() {
+ return this.referenceList;
+ }
+
+
+}
\ No newline at end of file
diff --git a/src/app/shared/services/notification.service.ts b/src/app/shared/services/notification.service.ts
new file mode 100644
index 0000000..428f9a2
--- /dev/null
+++ b/src/app/shared/services/notification.service.ts
@@ -0,0 +1,58 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {EventEmitter, Injectable} from '@angular/core';
+import {Notification} from '../models/Notification';
+
+@Injectable()
+export class NotificationService {
+
+ public notificationsEvent: EventEmitter<Notification>;
+
+ constructor() {
+ this.notificationsEvent = new EventEmitter<Notification>();
+ }
+
+ public add(_notification: Notification) {
+ this.notificationsEvent.emit(_notification);
+ }
+
+ public notifySuccessMessage(_message: string) {
+ this.add(new Notification('success', _message));
+ }
+
+ public notifyErrorMessage(_message: string) {
+ console.error(_message);
+ this.add(new Notification('error', _message));
+ }
+
+ public notifyInfoMessage(_message: string) {
+ this.add(new Notification('info', _message));
+ }
+
+ public notifyAlertMessage(_message: string) {
+ this.add(new Notification('alert', _message));
+ }
+
+}
diff --git a/src/app/shared/services/paramShare.service.ts b/src/app/shared/services/paramShare.service.ts
new file mode 100644
index 0000000..559b448
--- /dev/null
+++ b/src/app/shared/services/paramShare.service.ts
@@ -0,0 +1,85 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Injectable} from '@angular/core';
+
+@Injectable()
+export class ParamShareService {
+
+ public sharedData: { [index: string]: string; } = {};
+
+ //Stubbing Name-Value pairs for templateData->will come from Template Generation Component/Editor
+ public templateData: {};
+ public displayData: {};
+ public paramData = [];
+
+
+ setData(data) {
+ this.sharedData = data;
+ }
+
+ getData() {
+ return this.sharedData;
+ }
+
+ setTemplateData1() {
+ /* Stubbing **/
+ var paramData = [
+ {paramName: 'A-IP', paramValue: '234'},
+ {paramName: 'B-IP', paramValue: '10.168.15.15'},
+ {paramName: 'C-IP', paramValue: '100.168.150.15'},
+ {paramName: 'D-IP', paramValue: '900.168.150.15'},
+ {paramName: 'hostIP', paramValue: '200.168.150.15'},
+ {paramName: 'hostnameIP', paramValue: '300.168.150.15'},
+ {paramName: 'R-IP', paramValue: '400.168.150.15'},
+ {paramName: 'someIP', paramValue: '500.168.150.15'}
+
+ ];
+ this.templateData = paramData;
+ }
+
+ setTemplateData(data) {
+ this.templateData = data;
+ }
+
+ getTemplateData() {
+ return (this.templateData);
+ }
+
+ setDisplayData(data: any[]) {
+ this.displayData = data.slice(0);
+ }
+
+ getDisplayData() {
+ return this.displayData;
+ }
+
+ setSessionParamData(data) {
+ this.paramData = data;
+ }
+
+ getSessionParamData() {
+ return this.paramData;
+ }
+}
diff --git a/src/app/shared/services/utilityService/utility.service.spec.ts b/src/app/shared/services/utilityService/utility.service.spec.ts
new file mode 100644
index 0000000..c11927a
--- /dev/null
+++ b/src/app/shared/services/utilityService/utility.service.spec.ts
@@ -0,0 +1,64 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {inject, TestBed} from '@angular/core/testing';
+import {UtilityService} from './utility.service';
+import {NotificationsService} from 'angular2-notifications';
+
+describe('UtilityService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [UtilityService, NotificationsService]
+ });
+ });
+
+ it('should create a service...', inject([UtilityService], (service: UtilityService) => {
+ expect(service).toBeTruthy();
+ }));
+
+
+ it('should apply slashes for a string...', inject([UtilityService], (service: UtilityService) => {
+ let text = {'vnf-host-ip-address': '135.21.166.36'};
+
+ expect(service.appendSlashes(JSON.stringify(text))).toEqual('{\\"vnf-host-ip-address\\":\\"135.21.166.36\\"}');
+ }));
+
+
+ it('should check for status 401', inject([UtilityService], (service: UtilityService) => {
+ let data = {output: {status: {code: 401}}};
+
+ expect(service.checkResult(data)).toBeFalsy();
+ }));
+
+
+ it('should check for status 400', inject([UtilityService], (service: UtilityService) => {
+ let data = {output: {status: {code: 400}}};
+
+ expect(service.checkResult(data)).toBeTruthy();
+ }));
+
+
+});
diff --git a/src/app/shared/services/utilityService/utility.service.ts b/src/app/shared/services/utilityService/utility.service.ts
new file mode 100644
index 0000000..11fa888
--- /dev/null
+++ b/src/app/shared/services/utilityService/utility.service.ts
@@ -0,0 +1,62 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Injectable} from '@angular/core';
+import {NotificationsService} from 'angular2-notifications';
+
+@Injectable()
+export class UtilityService {
+
+ private successMessage = 'Retrieved artifact successfully';
+ private failureMessage = 'There is no artifact saved in APPC for the selected action!';
+
+ constructor(private notificationService: NotificationsService) {
+ }
+
+ randomId() {
+ let x = (new Date().getUTCMilliseconds()) * Math.random();
+ return (x + '').substr(4, 12);
+
+
+ }
+
+ appendSlashes(artifactData) {
+ return artifactData.replace(/"/g, '\\"');
+ }
+
+ checkResult(result: any) {
+
+ if (result.output.status.code == '401') {
+ this.notificationService.info('Information', this.failureMessage);
+ return false;
+ }
+ else if (result.output.status.code == '400') {
+ this.notificationService.success('Success', this.successMessage);
+ return true;
+ }
+
+ }
+
+
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
new file mode 100644
index 0000000..8959587
--- /dev/null
+++ b/src/app/shared/shared.module.ts
@@ -0,0 +1,73 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {ModuleWithProviders, NgModule} from '@angular/core';
+import {RouterModule} from '@angular/router';
+import {Collapse} from './directives/collapse.component';
+import {CommonModule} from '@angular/common';
+import {DropDownToggleDirective} from './directives/drop-down-toggle.directive';
+import {Dropdown} from './directives/dropdown';
+import {DropdownNotClosableZone} from './directives/dropdownnotclosablezone';
+import {DropdownOpen} from './directives/dropdownopen';
+import {EmitterService} from './services/emitter.service';
+import {HeaderComponent} from './components/header/header.component';
+import {HelpComponent} from './components/help/help/help.component';
+import {HttpModule} from '@angular/http';
+import {HttpUtilService} from './services/httpUtil/http-util.service';
+import {LogoutComponent} from './components/logout/logout.component';
+import {MappingEditorService} from './services/mapping-editor.service';
+import {NavigationComponent} from './components/navigation/navigation.component';
+import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
+import {NotificationService} from './services/notification.service';
+import {ParamShareService} from './services/paramShare.service';
+import {TidyTableModule} from './modules/tidy-table/tidy-table.module';
+import {UtilityService} from './services/utilityService/utility.service';
+import {VmFilteringPipe} from '../pipes/vm-filtering.pipe';
+import {SimpleNotificationsModule} from 'angular2-notifications';
+import { NgProgressModule } from 'ngx-progressbar';
+import {FormsModule} from '@angular/forms';
+
+@NgModule({
+ imports: [
+ FormsModule,
+ CommonModule, HttpModule, RouterModule, TidyTableModule, NgProgressModule, NgbModule, SimpleNotificationsModule.forRoot()],
+
+ declarations: [VmFilteringPipe,
+
+ HelpComponent,
+ HeaderComponent, NavigationComponent, LogoutComponent, Collapse, Dropdown, DropdownNotClosableZone, DropdownOpen, DropDownToggleDirective
+ ],
+ exports: [VmFilteringPipe, NgProgressModule, NgbModule, HelpComponent, DropDownToggleDirective, HeaderComponent, NavigationComponent, LogoutComponent, TidyTableModule, Collapse, Dropdown, DropdownNotClosableZone, DropdownOpen]
+})
+export class SharedModule {
+
+ static forRoot(): ModuleWithProviders {
+ return {
+ ngModule: SharedModule,
+ providers: [HttpUtilService, EmitterService, NotificationService,
+ UtilityService,
+ ParamShareService, MappingEditorService]
+ };
+ }
+}
\ No newline at end of file
diff --git a/src/app/test/test.component.css b/src/app/test/test.component.css
new file mode 100644
index 0000000..c1b1169
--- /dev/null
+++ b/src/app/test/test.component.css
@@ -0,0 +1,35 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.build-button {
+ padding: 11px;
+ font-size: 20px;
+ color: green;
+ border: 1PX SOLID GREEN;
+ MARGIN-BOTTOM: 40PX
+}
+
+table.table th,
+table.table td {
+ padding: 0rem;
+}
\ No newline at end of file
diff --git a/src/app/test/test.component.html b/src/app/test/test.component.html
new file mode 100644
index 0000000..ad6ff7f
--- /dev/null
+++ b/src/app/test/test.component.html
@@ -0,0 +1,205 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+ [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+
+<div class="card" style=" margin-bottom: 23px;">
+ <div class="card-block" style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="row">
+ <div class="col-lg-3 col-sm-6 col-md-4 col-xs-12">
+ <label>Action:</label>
+ <input class="form-control" type="text" disabled value="{{action}}" />
+ </div>
+
+ <!-- <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnf Type:</label>
+ <input class="form-control" type="text" disabled value="{{vnfType}}" />
+
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnfc Type:</label>
+ <input class="form-control" type="text" disabled value="{{vnfcType}}" />
+
+ </div>-->
+ <div class="col-lg-3 col-sm-6 col-md-4 col-xs-12">
+ <label>Vnf Id:</label>
+ <input class="form-control" type="text" [(ngModel)]="this.actionIdentifiers['vnf-id']" />
+
+ </div>
+
+ <div class="col-lg-3 col-sm-6 col-md-4 col-xs-12" *ngIf="this.actionIdentifiers['vserver-id']">
+ <label>Vserver-Id(optional):</label>
+ <input class="form-control" disabled type="text" [(ngModel)]="this.actionIdentifiers['vserver-id']" />
+
+ </div>
+
+ <!-- <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>VF-Module-Id(optional):</label>
+ <input class="form-control" disabled type="text" value="{{this.actionIdentifiers['vmodule-id']}}" />
+
+ </div>-->
+
+ <div class="col-12">
+ <div class="input-group">
+ <input id="excelInputFile" #myInput1 hidden class="file" type="file" (change)="upload($event)">
+ <input [(ngModel)]="uploadFileName" type="text" class="input-lg" disabled placeholder="Upload SpreadSheet" name="uploadFileName" style="width:80%">
+ <button (click)="excelBrowseOption($event)" [disabled]="!enableBrowse" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+ type="button">Upload SpreadSheet
+ </button>
+ </div>
+ </div>
+
+ </div>
+ </div>
+</div>
+<br>
+
+<div class="card">
+
+ <div class="card-block">
+
+ <div class="row">
+ <div class="col-md-6">
+ <span style="margin-left: 5%"><b>REQUEST:</b></span>
+ </div>
+ <div class="col-md-6">
+ <span style="margin-left: 5%"><b>RESPONSE:</b></span>
+ </div>
+
+ <div class="col-md-6">
+ <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
+
+ <div style="height:200px;width:100%;border:solid 2px grey;overflow:scroll;overflow-x:hidden;overflow-y:scroll;">
+ <p style="height:450px;" disabled class="text-center">
+ {{apiRequest}}
+ </p>
+ </div>
+ </div>
+
+ </div>
+
+ <div class="col-md-6">
+ <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
+
+ <div style="height:200px;width:100%;border:solid 2px grey;overflow:scroll;overflow-x:hidden;overflow-y:scroll;">
+ <p style="height:450px;" disabled class="text-center">
+ {{apiResponse}}
+ </p>
+ </div>
+ </div>
+
+ </div>
+
+ <div class="col-md-12">
+ <div class="row justify-content-center" style="padding-top:0.3cm">
+
+ <!-- <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" type="button" (click)="clearLog()">Abort Test</button> -->
+
+ <button style="margin-left:6%;" [disabled]="!enableTestButton" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" type="submit" (click)="testVnf()">Execute Test
+ </button>
+ <!-- <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" type="button" (click)="abortTest()">Abort Test</button> -->
+ <!--button class="btn btn-primary" type="submit"> Save Revised Name/Value Pair to APPC</button-->
+
+ </div>
+
+ </div>
+
+ </div>
+
+ </div>
+
+ <div style="padding-left:60%;padding-bottom:0.5cm">
+ <!-- <a href="javascript:void(0)" style="color:darkblue; text-decoration: double; font-size: 15px;" (click)="download()">Download Raw Request/Response.</a>-->
+ <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" type="button" (click)="download()">Download Raw Request/Response
+ </button>
+ <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" type="button" [disabled]="!enableAbort" (click)="abortTest()">Abort Test
+ </button>
+
+ </div>
+</div>
+<br>
+<div class="card">
+ <div class="card-block">
+
+ <div class="mdl-dialog__content" style="border:solid 1px grey;overflow:scroll;overflow-x:hidden;overflow-y:hidden;">
+
+ <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label" style="margin-left: 25%">
+ <input placeholder="Request Id" [(ngModel)]="requestId" class="mdl-textfield__input" id="requestId" required name="requestId">
+ </div>
+ <button type="submit" [disabled]="!enablePollButton" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)=pollTestStatus()>Poll Test Status
+ </button>
+
+ <div class="col-md-12">
+ <span style="margin-left: 18.5%"><b>POLL TEST STATUS RESPONSE</b></span>
+ </div>
+
+ <div style="margin-left: 18.5%;height:100px;width:60%;border:solid 2px grey;overflow:scroll;overflow-x:hidden;overflow-y:hidden;">
+
+ <div *ngIf="showStatusResponseDiv">
+ <div *ngIf="enableCounterDiv"><b>Poll test no {{pollCounter}}</b></div>
+ <table>
+ <thead></thead>
+ <tbody>
+ <tr>
+ <td>
+ <div class="android-title mdl-layout-title">TimeStamp :</div>
+ </td>
+ <td>
+ <div class="android-title mdl-layout-title">{{outputTimeStamp}}</div>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <div class="android-title mdl-layout-title">Status :</div>
+ </td>
+ <td>
+ <div class="android-title mdl-layout-title">{{status}}</div>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <div class="android-title mdl-layout-title">Status Reason:</div>
+ </td>
+ <td>
+ <div class="android-title mdl-layout-title">{{statusReason}}</div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <div *ngIf="!showStatusResponseDiv">
+ <div *ngIf="enableCounterDiv"><b>Poll test no {{pollCounter}}</b></div>
+ <span>{{statusResponse}}</span>
+ </div>
+
+ <div *ngIf="errorResponse">
+ <p style="height:450px;" disabled class="text-center">
+ {{errorResponse}}
+ </p>
+ </div>
+
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/test/test.component.spec.ts b/src/app/test/test.component.spec.ts
new file mode 100644
index 0000000..e869adb
--- /dev/null
+++ b/src/app/test/test.component.spec.ts
@@ -0,0 +1,158 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+
+// Modules
+import { async, ComponentFixture, TestBed,inject } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { RouterTestingModule } from '@angular/router/testing';
+import { SimpleNotificationsModule } from 'angular2-notifications';
+import { Http, Response, Headers, RequestOptions, HttpModule } from '@angular/http';
+
+// Component
+import { TestComponent } from './test.component';
+
+// Services
+import { NotificationService } from '../shared/services/notification.service';
+import { ParamShareService } from '.././shared/services/paramShare.service';
+import { MappingEditorService } from '../shared/services/mapping-editor.service';
+import { HttpUtilService } from '../shared/services/httpUtil/http-util.service';
+import { UtilityService } from '../shared/services/utilityService/utility.service';
+import { NgProgress } from 'ngx-progressbar';
+import {NgProgressModule} from 'ngx-progressbar';
+
+describe( 'TestComponent', () => {
+ let component: TestComponent;
+ let fixture: ComponentFixture<TestComponent>;
+
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [TestComponent],
+ imports: [
+ FormsModule,
+ RouterTestingModule,
+ SimpleNotificationsModule,
+ HttpModule,
+ NgProgressModule
+ ],
+ providers: [
+ NotificationService,
+ ParamShareService,
+ MappingEditorService,
+ HttpUtilService,
+ UtilityService,
+ NgProgress
+ ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TestComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it( 'should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ // it('test', () => {
+ // expect(2).toEqual(1)
+ // });
+
+
+ // it('test preparfilename', inject([MappingEditorService], (mappingEditorService: MappingEditorService) => {
+ // // fixture = TestBed.createComponent(TestComponent);
+ // // component = fixture.componentInstance;
+ // mappingEditorService.latestAction=undefined
+
+ // expect(component.prepareFileName()).toBe(undefined);
+ // }));
+
+
+ it('Should have download method', () => {
+ expect(component.download).toBeDefined();
+ });
+
+ // Test abortTest Method
+ it('Should have abortTest method', () => {
+ expect(component.abortTest).toBeDefined();
+ });
+
+ it('Test abortTest Method', () => {
+ const temp = component.abortTest();
+ expect(component.enableBrowse).toBeTruthy();
+ expect(component.enableTestButton).toBeTruthy();
+ });
+
+ it('Should have excelBrowseOption method', () => {
+ expect(component.excelBrowseOption).toBeDefined();
+ });
+
+ it('Should have upload method', () => {
+ expect(component.upload).toBeDefined();
+ });
+
+ it('Should have constructTestPayload method', () => {
+ expect(component.constructTestPayload).toBeDefined();
+ });
+
+ it('Should have constructRequest method', () => {
+ expect(component.constructRequest).toBeDefined();
+ });
+
+ it('Should have testVnf method', () => {
+ expect(component.testVnf).toBeDefined();
+ });
+
+ it('Should have pollTestStatus method', () => {
+ expect(component.pollTestStatus).toBeDefined();
+ });
+
+
+ // Test getUrlEndPoint Method
+ it('Should have getUrlEndPoint method', () => {
+ expect(component.getUrlEndPoint).toBeDefined();
+ });
+
+ it('getUrlEndPoint Should return value', () => {
+ expect(component.getUrlEndPoint('configmodify')).toEqual('config-modify');
+ expect(component.getUrlEndPoint('configbackup')).toEqual('config-backup');
+ expect(component.getUrlEndPoint('configrestore')).toEqual('config-restore');
+ expect(component.getUrlEndPoint('healthcheck')).toEqual('health-check');
+ expect(component.getUrlEndPoint('quiescetraffic')).toEqual('quiesce-traffic');
+ expect(component.getUrlEndPoint('resumetraffic')).toEqual('resume-traffic');
+ expect(component.getUrlEndPoint('startapplication')).toEqual('start-application');
+ expect(component.getUrlEndPoint('stopapplication')).toEqual('stop-application');
+ expect(component.getUrlEndPoint('upgradebackout')).toEqual('upgrade-backout');
+ expect(component.getUrlEndPoint('upgradepostcheck')).toEqual('upgrade-post-check');
+ expect(component.getUrlEndPoint('upgradeprecheck')).toEqual('upgrade-pre-check');
+ expect(component.getUrlEndPoint('upgradesoftware')).toEqual('upgrade-software');
+ expect(component.getUrlEndPoint('DeFaultCASE')).toEqual('defaultcase');
+ });
+})
\ No newline at end of file
diff --git a/src/app/test/test.component.ts b/src/app/test/test.component.ts
new file mode 100644
index 0000000..1874904
--- /dev/null
+++ b/src/app/test/test.component.ts
@@ -0,0 +1,533 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, OnInit } from '@angular/core';
+
+import { saveAs } from 'file-saver';
+import { Location } from '@angular/common';
+import { ActivatedRoute, Router } from '@angular/router';
+import { NotificationService } from '.././shared/services/notification.service';
+import { ParamShareService } from '.././shared/services/paramShare.service';
+import { MappingEditorService } from '.././shared/services/mapping-editor.service';
+import { NotificationsService } from 'angular2-notifications';
+import { HttpUtilService } from '.././shared/services/httpUtil/http-util.service';
+import 'rxjs/add/observable/interval';
+import { Observable } from 'rxjs/Observable';
+import { environment } from '../.././environments/environment';
+import { UtilityService } from '.././shared/services/utilityService/utility.service';
+import 'rxjs/add/operator/map';
+import * as XLSX from 'xlsx';
+import { NgProgress } from 'ngx-progressbar';
+
+
+let YAML = require('yamljs');
+
+type AOA = Array<Array<any>>;
+declare var $: any;
+
+@Component({ selector: 'test', templateUrl: './test.component.html', styleUrls: ['./test.component.css'] })
+export class TestComponent implements OnInit {
+ public displayParamObjects;
+ options = {
+ timeOut: 1000,
+ showProgressBar: true,
+ pauseOnHover: true,
+ clickToClose: true,
+ maxLength: 200
+ };
+ public action: any;
+ public vnfId: any;
+ public item: any = {};
+
+ public vnfType: any;
+ vnfcType: any;
+ protocol: any;
+ mode: any = 'NORMAL';
+ force: any = 'True';
+ ttl: any;
+ public formattedNameValuePairs = {};
+ public requestId = '';
+ public enableBrowse: boolean = true;
+ public enableSpinner: boolean = false;
+ host: any;
+ public refNameObj = {};
+
+ public artifactName;
+ public type;
+ public transactions = '';
+ public uploadFileName;
+
+ public payload = {};
+ public lastvmJson = {};
+ public vmPayload = [];
+ public subPayload = {};
+ public vmJson = {};
+ public vnfcJson = {};
+ public flag = 1;
+ public oldListName1 = '';
+ public actionIdentifiers = {};
+ public apiRequest = '';
+ public apiResponse = '';
+ public statusResponse;
+ public outputTimeStamp;
+ public status;
+ public statusReason;
+ public errorResponse;
+ public timer;
+ public subscribe;
+ public enableTestButton: boolean = false;
+ public enableAbort: boolean = false;
+ public showStatusResponseDiv: boolean = false;
+ public enablePollButton: boolean = true;
+ public pollCounter = 0;
+ public enableCounterDiv: boolean = false;
+
+ constructor(private location: Location, private activeRoutes: ActivatedRoute, private notificationService: NotificationService, private nService: NotificationsService, private router: Router, private paramShareService: ParamShareService, private mappingEditorService: MappingEditorService, private httpUtil: HttpUtilService,
+ private utiltiy: UtilityService, private ngProgress: NgProgress) {
+
+ }
+
+ ngOnInit() {
+
+
+ }
+
+ prepareFileName(): any {
+ let fileNameObject: any = this.mappingEditorService.latestAction;
+ return fileNameObject;
+ }
+
+ /*public download() {
+ let stringData: any;
+ stringData = JSON.stringify(this.paramShareService.getSessionParamData());
+ let paramsKeyValueFromEditor: JSON;
+ paramsKeyValueFromEditor = JSON.parse(stringData);
+ let fileName = 'param_' + this.action + '_' + this.type + '_' + "0.0.1" + 'V';
+ this.JSONToCSVConvertor([paramsKeyValueFromEditor], fileName, true);
+
+ }*/
+
+ public download() {
+ if (this.apiRequest) {
+ var fileName = 'test_' + this.action + '_' + this.actionIdentifiers['vnf-id'] + '_request';
+ var theJSON = this.apiRequest;
+ if (fileName != null || fileName != '') {
+ var blob = new Blob([theJSON], {
+ type: 'text/json'
+ });
+ saveAs(blob, fileName);
+ }
+ }
+ else {
+ this.nService.error('Error', 'Please upload spreadsheet to download the request and response');
+ }
+
+ if (this.apiResponse) {
+ var fileName = 'test_' + this.action + '_' + this.actionIdentifiers['vnf-id'] + '_response';
+ var theJSON = this.apiResponse;
+ if (fileName != null || fileName != '') {
+ var blob = new Blob([theJSON], {
+ type: 'text/json'
+ });
+ saveAs(blob, fileName);
+ }
+ }
+
+ }
+
+
+ public abortTest() {
+ //this.apiResponse = "";
+ this.enableBrowse = true;
+ this.enableTestButton = true;
+ this.enablePollButton = true;
+ this.subscribe.unsubscribe();
+
+ }
+
+
+ /*JSONToCSVConvertor(JSONData, fileName, ShowLabel) {
+ //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
+ var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
+
+ var CSV = '';
+
+ //This condition will generate the Label/Header
+ if (ShowLabel) {
+ var testRow = "";
+ for (var index in arrData[0]) {
+
+ CSV += arrData[0][index].name + '\t' + arrData[0][index].value + '\t' + arrData[0][index].source + '\r\n';
+ }
+ }
+
+ if (CSV == '') {
+ alert("Invalid data");
+ return;
+ }
+
+ //Initialize file format you want csv or xls
+ var uri = 'data:application/vnd.ms-excel,' + encodeURI(CSV);
+
+ var link = document.createElement("a");
+ link.href = uri;
+
+ link.download = fileName + ".xls";
+
+ //this part will append the anchor tag and remove it after automatic click
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ }*/
+
+ excelBrowseOption() {
+ $('#excelInputFile').trigger('click');
+ }
+
+
+ upload(evt: any) {
+ /* wire up file reader */
+ $('#filesparam').trigger('click');
+ const target: DataTransfer = <DataTransfer>(evt.target);
+
+ this.uploadFileName = evt.target.files[0].name;
+ var fileExtension = this.uploadFileName.substr(this.uploadFileName.lastIndexOf('.') + 1);
+
+ if (target.files.length != 1) {
+ throw new Error('Cannot upload multiple files on the entry');
+ }
+ if (fileExtension.toUpperCase() === 'XLS' || fileExtension.toUpperCase() === 'XLSX') {
+ const reader = new FileReader();
+ reader.onload = (e: any) => {
+ /* read workbook */
+ const bstr = e.target.result;
+ const wb = XLSX.read(bstr, { type: 'binary' });
+ /* grab first sheet */
+ const wsname = wb.SheetNames[0];
+ const ws = wb.Sheets[wsname];
+
+ /* save data */
+ this.requestId = ''
+ this.enableTestButton = true;
+ this.enableAbort = true;
+ this.enablePollButton = true;
+
+ if (this.subscribe && this.subscribe != undefined) {
+ this.enableCounterDiv = false;
+ this.subscribe.unsubscribe();
+ }
+ this.apiRequest = '';
+ this.apiResponse = '';
+ this.showStatusResponseDiv = false;
+ this.errorResponse = '';
+ this.statusResponse = '';
+
+ let arrData = (<AOA>(XLSX.utils.sheet_to_json(ws, { blankrows: false })));
+ this.nService.success('Success', 'SpreadSheet uploaded successfully');
+
+
+ console.log('Array data ==' + arrData[0]);
+ this.vmPayload = [];
+ this.subPayload = {};
+ this.vmJson = {};
+ this.flag = 1;
+ this.payload = {};
+ this.oldListName1 = '';
+ this.actionIdentifiers = {};
+ for (var i = 0; i < arrData.length; i++) {
+ var element = arrData[i];
+ if (element['TagName'] === 'action') {
+ this.action = element['Value'];
+ }
+ if (element['List Name'] === 'action-identifiers') {
+ this.vnfId = element['Value'];
+ var key = element['TagName'];
+ var value = element['Value'];
+ if (key && value) {
+ this.actionIdentifiers[key] = value;
+
+ }
+ }
+
+ if (element['List Name'] === 'payload') {
+ var listName1 = element['List Name_1'];
+ var listName2 = element['List Name_2'];
+ var listName3 = element['List Name_3'];
+ var key = element['TagName'];
+ var value = element['Value'];
+ if (listName1) {
+ if (this.oldListName1 == '' || (listName1 === this.oldListName1)) {
+ this.constructTestPayload(listName2, listName3, key, value);
+ this.payload[listName1] = this.subPayload;
+ }
+ else {
+ this.subPayload = {};
+ this.constructTestPayload(listName2, listName3, key, value);
+ this.payload[listName1] = this.subPayload;
+ }
+ this.oldListName1 = listName1;
+ }
+ else {
+ this.payload[key] = value;
+ }
+ }
+ }
+
+ //console.log("VM JSON===" + JSON.stringify(this.vmPayload))
+ // console.log('VM payload===' + JSON.stringify(this.payload));
+ };
+
+ reader.readAsBinaryString(target.files[0]);
+ }
+ else {
+ this.nService.error('Error', 'Incorrect spreadsheet uploaded');
+ this.flag = 1;
+ this.oldListName1 = '';
+ this.vmJson = {};
+ this.vnfcJson = {};
+ this.subPayload = {};
+ this.vmPayload = [];
+ this.payload = {};
+ this.action = '';
+ this.actionIdentifiers = {};
+ this.apiRequest = '';
+ this.apiResponse = '';
+ this.enableCounterDiv = false;
+ }
+ }
+
+ constructTestPayload(listName2, listName3, key, value) {
+ if (listName2 == undefined && listName3 == undefined) {
+ this.subPayload[key] = value;
+ }
+ if (listName2) {
+
+ if (!listName3) {
+
+ //vmPayload.push(vmJson)
+ this.vmJson = {};
+ this.vnfcJson = {};
+ this.vmJson[key] = value;
+ this.flag = 0;
+ }
+ else {
+ this.vnfcJson[key] = value;
+ this.vmJson['vnfc'] = this.vnfcJson;
+ this.flag = 1;
+ }
+ if (this.vmJson) this.lastvmJson = this.vmJson;
+ if (this.flag == 0) {
+ this.vmPayload.push(this.lastvmJson);
+ if (this.vmPayload) this.subPayload['vm'] = this.vmPayload;
+ }
+ }
+ }
+
+ constructRequest() {
+ console.log('payload==' + JSON.stringify(this.payload));
+ let timeStamp = new Date().toISOString();
+ console.log('timestamp==' + timeStamp);
+ let reqId;
+ this.requestId = reqId = new Date().getTime().toString();
+ let data = {
+ 'input': {
+ 'common-header': {
+ 'timestamp': timeStamp,
+ 'api-ver': '2.00',
+ 'originator-id': 'CDT',
+ 'request-id': this.requestId,
+ 'sub-request-id': this.requestId,
+ 'flags': {
+ 'mode': 'NORMAL',
+ 'force': 'TRUE',
+ 'ttl': 3600
+ }
+ },
+ 'action': this.action,
+ 'action-identifiers': this.actionIdentifiers,
+ 'payload': JSON.stringify(this.payload)
+ }
+ };
+
+ return data;
+ }
+
+ testVnf() {
+ //let payload = '{"request-parameters":{"vnf-host-ip-address":"' + this.host + '"},"configuration-parameters":"' + JSON.stringify(this.formattedNameValuePairs) + '"}"';
+ //let payload = '{"request-parameters":{"host-ip-address:"' + this.host + '",port-number:"'+port+'"}}';
+
+ this.enableBrowse = false;
+ this.enableTestButton = false;
+ this.enablePollButton = false;
+ this.timer = Observable.interval(10000);
+ this.subscribe = this.timer.subscribe((t) => this.pollTestStatus());
+ //console.log('full payload==' + JSON.stringify(this.apiRequest));
+ this.ngProgress.start();
+ this.apiRequest = JSON.stringify(this.constructRequest());
+ this.httpUtil.post(
+ {
+ url: environment.testVnf + this.getUrlEndPoint(this.action.toLowerCase()), data: this.apiRequest
+ })
+ .subscribe(resp => {
+ this.apiResponse = JSON.stringify(resp);
+ this.enableBrowse = true;
+ this.enableTestButton = true;
+ this.ngProgress.done();
+ },
+ error => {
+ this.nService.error('Error', 'Error in connecting to APPC Server');
+ this.enableBrowse = true;
+ this.enableTestButton = true;
+ this.enablePollButton = true;
+ this.enableCounterDiv = false;
+ this.subscribe.unsubscribe();
+
+ });
+
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+
+ pollTestStatus() {
+ if (this.requestId && this.actionIdentifiers['vnf-id']) {
+ // console.log("payload==" + JSON.stringify(this.payload))
+ let timeStamp = new Date().toISOString();
+ // console.log("timestamp==" + timeStamp)
+ let reqId = new Date().getTime().toString();
+ let data = {
+ 'input': {
+ 'common-header': {
+ 'timestamp': timeStamp,
+ 'api-ver': '2.00',
+ 'originator-id': 'CDT',
+ 'request-id': reqId,
+ 'sub-request-id': reqId,
+ 'flags': {
+ 'mode': 'NORMAL',
+ 'force': 'TRUE',
+ 'ttl': 3600
+ }
+ },
+ 'action': 'ActionStatus',
+ 'action-identifiers': this.actionIdentifiers,
+ 'payload': '{"request-id":' + this.requestId + '}'
+ }
+ };
+ //this.ngProgress.start();
+ this.httpUtil.post(
+ {
+ url: environment.checkTestStatus, data: data
+
+ })
+ .subscribe(resp => {
+ // console.log('Response==' + JSON.stringify(resp));
+ this.statusResponse = JSON.stringify(resp);
+ var status = ''
+ var statusReason = ''
+ this.enableCounterDiv = true;
+ this.pollCounter++;
+ //this.statusResponse=JSON.parse(this.statusResponse)
+ if (resp.output) var timeStamp = resp.output['common-header'].timestamp;
+ if (resp.output.payload) {
+ var payload = resp.output.payload.replace(/\\/g, "")
+ try {
+ payload = JSON.parse(payload)
+ status = payload['status'];
+ statusReason = payload['status-reason'];
+ }
+ catch (err) {
+ console.log("error" + err)
+ }
+ }
+ if (timeStamp && status && statusReason) {
+ this.showStatusResponseDiv = true;
+ this.outputTimeStamp = timeStamp;
+ this.status = status;
+ this.statusReason = statusReason;
+ if (status.toUpperCase() === 'SUCCESS') {
+ this.subscribe.unsubscribe();
+ this.enablePollButton = true;
+ }
+ if (status.toUpperCase() === 'FAILED') {
+ this.subscribe.unsubscribe();
+ this.enablePollButton = true;
+ }
+ }
+ else {
+ this.showStatusResponseDiv = false;
+ }
+
+ // this.ngProgress.done();
+ },
+ error => {
+ this.statusResponse = null;
+ this.showStatusResponseDiv = false;
+ this.errorResponse = 'Error Connecting to APPC server';
+ this.enableCounterDiv = false;
+ this.subscribe.unsubscribe();
+ });
+
+ }
+ else {
+ this.nService.error("Error", "Please enter vnf Id & request Id");
+ }
+ // setTimeout(() => {
+ // this.ngProgress.done();
+ // }, 3500);
+ }
+
+ getUrlEndPoint(action) {
+ switch (action) {
+ case 'configmodify':
+ return 'config-modify';
+ case 'configbackup':
+ return 'config-backup';
+ case 'configrestore':
+ return 'config-restore';
+ case 'healthcheck':
+ return 'health-check';
+ case 'quiescetraffic':
+ return 'quiesce-traffic';
+ case 'resumetraffic':
+ return 'resume-traffic';
+ case 'startapplication':
+ return 'start-application';
+ case 'stopapplication':
+ return 'stop-application';
+ case 'upgradebackout':
+ return 'upgrade-backout';
+ case 'upgradepostcheck':
+ return 'upgrade-post-check';
+ case 'upgradeprecheck':
+ return 'upgrade-pre-check';
+ case 'upgradesoftware':
+ return 'upgrade-software';
+ default:
+ return action.toLowerCase();
+ }
+
+ }
+
+}
diff --git a/src/app/vnfs/GCAuthGuard/gcauth-guard.service.ts b/src/app/vnfs/GCAuthGuard/gcauth-guard.service.ts
new file mode 100644
index 0000000..c6f0b80
--- /dev/null
+++ b/src/app/vnfs/GCAuthGuard/gcauth-guard.service.ts
@@ -0,0 +1,59 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Injectable} from '@angular/core';
+import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot} from '@angular/router';
+import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
+import {AuthGuardModalComponent} from '../auth-guard-modal/auth-guard-modal';
+import {MappingEditorService} from '../../shared/services/mapping-editor.service';
+
+@Injectable()
+export class GCAuthGuardService implements CanActivate {
+ constructor(private ngbModal: NgbModal, private mapService: MappingEditorService, private router: Router) {
+ }
+
+ canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> {
+ return new Promise(resolve => {
+
+ if (this.mapService.referenceNameObjects != null && this.mapService.referenceNameObjects != undefined) {
+ resolve(true);
+ } else {
+ let x = this.ngbModal.open(AuthGuardModalComponent).result;
+ x.then((result) => {
+ //.close method
+
+ resolve(true);
+ }, (reason) => {
+ //.dismiss method
+ this.router.navigate([this.router.url]);
+
+ resolve(false);
+ });
+ }
+
+ //return false;
+ });
+
+
+ }
+}
\ No newline at end of file
diff --git a/src/app/vnfs/LoginGuardService/Login-guard-service.ts b/src/app/vnfs/LoginGuardService/Login-guard-service.ts
new file mode 100644
index 0000000..2c834a8
--- /dev/null
+++ b/src/app/vnfs/LoginGuardService/Login-guard-service.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Injectable} from '@angular/core';
+import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot} from '@angular/router';
+
+
+import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
+
+import {MappingEditorService} from '../../shared/services/mapping-editor.service';
+
+@Injectable()
+export class LoginGuardService implements CanActivate {
+
+ constructor(private ngbModal: NgbModal, private mapService: MappingEditorService, private router: Router) {
+ }
+
+ canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+
+ let userId = localStorage['userId'];
+ if (userId != null && userId != undefined && userId != '') {
+ this.router.navigate(['/vnfs/list']);
+ return false;
+ } else {
+ return true;
+ }
+
+ }
+}
\ No newline at end of file
diff --git a/src/app/vnfs/auth-guard-modal/auth-guard-modal.css b/src/app/vnfs/auth-guard-modal/auth-guard-modal.css
new file mode 100644
index 0000000..9d63aa1
--- /dev/null
+++ b/src/app/vnfs/auth-guard-modal/auth-guard-modal.css
@@ -0,0 +1,21 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
\ No newline at end of file
diff --git a/src/app/vnfs/auth-guard-modal/auth-guard-modal.html b/src/app/vnfs/auth-guard-modal/auth-guard-modal.html
new file mode 100644
index 0000000..b4e3fef
--- /dev/null
+++ b/src/app/vnfs/auth-guard-modal/auth-guard-modal.html
@@ -0,0 +1,21 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ -->
\ No newline at end of file
diff --git a/src/app/vnfs/auth-guard-modal/auth-guard-modal.ts b/src/app/vnfs/auth-guard-modal/auth-guard-modal.ts
new file mode 100644
index 0000000..9fadbde
--- /dev/null
+++ b/src/app/vnfs/auth-guard-modal/auth-guard-modal.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+
+import {Component, OnInit} from '@angular/core';
+import {NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
+
+@Component({
+ selector: 'app-auth-guard-modal',
+ templateUrl: './auth-guard-modal.html',
+ styleUrls: ['./auth-guard-modal.css']
+})
+export class AuthGuardModalComponent implements OnInit {
+
+ constructor(public activeModal: NgbActiveModal) {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/vnfs/build-artifacts/build-artifacts.component.css b/src/app/vnfs/build-artifacts/build-artifacts.component.css
new file mode 100644
index 0000000..e7095bd
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/build-artifacts.component.css
@@ -0,0 +1,40 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.active-tab > a {
+ border-bottom: 5px solid #6ab344;
+}
+
+.custom-heade-nav {
+ border-bottom: none !important;
+}
+
+.nav-link {
+ font-size: 15PX;
+ color: black
+}
+
+a.disabled {
+ color: darkolivegreen;
+ pointer-events: none;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/build-artifacts.component.html b/src/app/vnfs/build-artifacts/build-artifacts.component.html
new file mode 100644
index 0000000..e0b2e05
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/build-artifacts.component.html
@@ -0,0 +1,36 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<div class="container">
+ <div class="row">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+ <ul class="nav nav-tabs custom-heade-nav" style=" margin-bottom: 12px;">
+ <li [ngClass]="{'active-tab':((router.url.indexOf('/'+item.url))>-1 || router.url.indexOf(item.url)>-1 )}"
+ *ngFor="let item of tabs">
+ <a [routerLink]="[item.url]" [type]="item.type" class="nav-link">{{item.name}}</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+</div>
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/build-artifacts.component.spec.ts b/src/app/vnfs/build-artifacts/build-artifacts.component.spec.ts
new file mode 100644
index 0000000..8545838
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/build-artifacts.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {BuildDesignComponent} from './build-artifacts.component';
+
+describe('BuildDesignComponent', () => {
+ let component: BuildDesignComponent;
+ let fixture: ComponentFixture<BuildDesignComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [BuildDesignComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BuildDesignComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/build-artifacts/build-artifacts.component.ts b/src/app/vnfs/build-artifacts/build-artifacts.component.ts
new file mode 100644
index 0000000..7641aa5
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/build-artifacts.component.ts
@@ -0,0 +1,82 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import * as _ from 'underscore';
+
+@Component({ selector: 'app-build-design', templateUrl: './build-artifacts.component.html', styleUrls: ['./build-artifacts.component.css'] })
+export class BuildDesignComponent implements OnInit {
+ tabs: Array<Object> = [];
+ private allowOtherUpdates: boolean = true;
+
+ constructor (private router: Router) {
+ }
+
+ ngOnInit() {
+ this.tabs = [
+ {
+ type: 'dropdown',
+ name: 'Reference Data',
+ url: 'references',
+ }, {
+ name: 'Template',
+ type: 'dropdown',
+ url: 'templates/myTemplates',
+ }, {
+ name: 'Parameter Definition',
+ type: 'dropdown',
+ url: 'parameterDefinitions/create'
+ } /*, {
+ name: "Test",
+ url: 'test',
+ }*/
+ ];
+ }
+
+ public setAllowOtherUpdates(allowOtherUpdates: boolean) {
+ this.allowOtherUpdates = allowOtherUpdates;
+ }
+
+ // Allow / block access to the update pages of GT and PD if no reference data present
+ public updateAccessUpdatePages(selectedAction, referenceList) {
+ // Disable/enable the menu items for update pages of GT and PD.
+ if (this.isReferenceFound(selectedAction, referenceList)) {
+ this.setAllowOtherUpdates(true);
+ } else {
+ //alert("false")
+ this.setAllowOtherUpdates(false);
+ }
+ }
+
+ public isReferenceFound(selectedAction, referenceList) {
+ let selectedActioneObject = _.find(referenceList, function (obj) {
+ return obj['action'] == selectedAction;
+ });
+ if (selectedActioneObject) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+}
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts
new file mode 100644
index 0000000..8a9c112
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts
@@ -0,0 +1,114 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {inject, TestBed} from '@angular/core/testing';
+import {ParameterDefinitionService} from './parameter-definition.service';
+import {NotificationsService} from 'angular2-notifications';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+
+
+class MockService {
+ doStuff() {
+ return this;
+ }
+}
+
+describe('ParameterDefinitionService', () => {
+ beforeEach(() => {
+ let httpUtilService = new MockService();
+ TestBed.configureTestingModule({
+ providers: [ParameterDefinitionService, NotificationsService, MappingEditorService, ParamShareService, HttpUtilService, UtilityService,
+ {provide: HttpUtilService, useValue: httpUtilService}]
+ });
+ });
+
+ it('should create a service...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ expect(service).toBeTruthy();
+ }));
+
+ it('should remove unwanted values from PD object...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ let obj = {
+ 'vnf-parameter-list': [{
+ 'ruleTypeValues': 'ruleTypeValues',
+ 'showFilterFields': 'showFilterFields',
+ 'enableFilterByValue': 'enableFilterByValue'
+ }]
+ };
+
+ expect(service.removeUnwantedvalues(obj)).toEqual({'vnf-parameter-list': [{}]});
+ }));
+
+
+ it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ let obj = [{'source': 'A&AI', 'ruleType': 'vm-name-list'}];
+
+ expect(service.populateDataUponSource(obj));
+ }));
+
+ it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ let obj = [{'source': 'Manual', 'ruleType': 'vm-name-list'}];
+
+ expect(service.populateDataUponSource(obj));
+ }));
+
+ it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ let obj = [{'source': 'Something', 'ruleType': 'vm-name-list'}];
+
+ expect(service.populateDataUponSource(obj));
+ }));
+
+
+ it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+ let obj = [{'source': 'Something', 'ruleType': 'vm-name-list'}];
+
+ expect(service.populatePD(obj));
+ }));
+
+ it('processPDfile...', inject([ParameterDefinitionService], (service: ParameterDefinitionService)=> {
+ let yaml = "---\nkind: Property Definition\nversion: V1\nvnf-parameter-list:\n- name: LICENSE_KEY\n type: null\n description: null\n required: null\n default: null\n source: Manual\n rule-type: null\n request-keys: null\n response-keys: null";
+ let expectedPD = [{"name":"LICENSE_KEY","type":null,"description":null,"required":null,"default":null,"source":"Manual","rule-type":null,
+ "request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null
+ ,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}];
+
+ expect(service.processPDfile("testfile.yaml", yaml)).toEqual(expectedPD);
+
+ }));
+
+ // it('processKeyFile...', inject([ParameterDefinitionService, ParamShareService], (service: ParameterDefinitionService, paramShareService: ParamShareService)=> {
+ // let keyFile = "PARAMVALUE|SOURCE|RULETYPE|KEY1|VALUE1|KEY2|VALUE2|KEY3|VALUE3\nvalue1|INSTAR|interface_ip_address|UniqueKeyName1|addressfqdn123|UniqueKeyValue|m001ssc001p1n001v001|FieldKeyName|ipaddress_v4\nvalue2|INSTAR|interface_ip_address|UniqueKeyName2|addressfqdnAsgar1|UniqueKeyValue|m001ssc001p1n001v002|FieldKeyName|ipaddress_v4";
+ // let expectedPD = [{"name":"name1","type":null,"description":null,"required":null,"default":null,"source":"Manual","rule-type":null,
+ // "request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null
+ // ,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}];
+ // localStorage['paramsContent'] = "{ \"name1\":\"value1\",\"name2\":\"value2\"}";
+ // paramShareService.setSessionParamData(expectedPD)
+ // expect(service.processKeyFile("testfile.txt", keyFile)).toEqual(expectedPD);
+
+ // }));
+
+});
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts
new file mode 100644
index 0000000..89eeec2
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts
@@ -0,0 +1,509 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Injectable, ViewChild} from '@angular/core';
+import {saveAs} from 'file-saver';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {ModalComponent} from '../../../shared/modal/modal.component';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+import {NotificationsService} from 'angular2-notifications';
+import 'rxjs/add/operator/map';
+
+let YAML = require('yamljs');
+
+declare var $: any;
+
+@Injectable()
+export class ParameterDefinitionService {
+
+ public vnfcTypeData: string = '';
+ public selectedUploadType: string;
+ @ViewChild(ModalComponent) modalComponent: ModalComponent;
+ public title: string;
+ public parameterDefinitionMap: { [index: string]: string; } = {};
+ public parameterNameValues = {};
+ public displayParamObjects;
+ public modelParamDefinitionObjects;
+ public vnfType: any;
+ vnfcType: any;
+ protocol: any;
+ public refNameObj = {};
+ public action;
+ public artifactName;
+ public type;
+ public appDataObject: any;
+ public downloadDataObject: any;
+ public artifact_fileName;
+ identifier: any;
+ public myKeyFileName = null;
+ public myPdFileName = null;
+ private selectedActionReference: any;
+ private apiToken = localStorage['apiToken'];
+ private userId = localStorage['userId'];
+
+ constructor(private mappingEditorService: MappingEditorService,
+ private paramShareService: ParamShareService,
+ private nService: NotificationsService,
+ private httpService: HttpUtilService,
+ private utilService: UtilityService) {
+
+ }
+
+ public initialize() {
+
+ }
+
+ public setValues(vnfType, vnfcType, protocol, action, artifactName) {
+ this.vnfType = vnfType;
+ this.vnfcType = vnfcType;
+ this.protocol = protocol;
+ this.action = action;
+ this.artifact_fileName = artifactName;
+ }
+
+ public afterInit(artifactName, displayParamObjects) {
+
+ }
+
+ //========================== End of saveChanges() Method============================================
+ /* Saves pd to appc */
+ public sendPD(yamlString: String) {
+ let result: any;
+ let payload = '{"userID": "' + this.userId + '","vnf-type" : "' + this.vnfType + '","action" : "' + this.action + '","artifact-name" : "' + this.artifact_fileName + '","artifact-type" : "APPC-CONFIG","artifact-version" : "0.0.1","artifact-contents" : ' + yamlString + '}';
+ let input = {
+ 'input': {
+ 'design-request': {
+ 'request-id': this.apiToken,
+ 'action': 'uploadArtifact',
+ 'payload': payload
+ }
+ }
+ };
+ this.appDataObject.pd = input;
+ }
+
+
+ //========================== End of filetrByFieldChanged() Method============================================
+ removeUnwantedvalues(obj) {
+ let result = Object.assign({}, obj);
+ result['vnf-parameter-list'].forEach(obj => {
+ delete obj['ruleTypeValues'];
+ delete obj['showFilterFields'];
+ delete obj['enableFilterByValue'];
+ });
+ return result;
+ }
+
+ //========================== End of removeUnwantedvalues() Method============================================
+ populateDataUponSource(displayParamObjects) {
+ displayParamObjects.forEach(parameter => {
+ if (parameter.source == 'A&AI') {
+ parameter.ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+ if (parameter['rule-type'] == 'vm-name-list' || parameter['rule-type'] == 'vnfc-name-list' || parameter['rule-type'] == 'vnfc-oam-ipv4-address-list') {
+ parameter.showFilterFields = true;
+ parameter.enableFilterByValue = false;
+ } else {
+ parameter.showFilterFields = false;
+ }
+
+ } else if (parameter.source == 'Manual') {
+ parameter.ruleTypeValues = [null];
+ }
+ else {
+ parameter.ruleTypeValues = [parameter['rule-type']];
+ }
+ });
+
+ }
+
+ //========================== End of getPD() Method============================================
+ populatePD(result: any) {
+ let fileContent = JSON.stringify(result);
+ //Added code to deserialize, serialize and format the response keys for display purposes ??May be unneessary?? To Do: - Check
+ let fileObj = JSON.parse(fileContent);
+ this.displayParamObjects = this.formatFileContentForDisplay(fileObj);
+ this.populateDataUponSource(this.displayParamObjects);
+ this.formatResponseForKey(this.displayParamObjects);
+ if (undefined !== this.displayParamObjects)
+ this.modelParamDefinitionObjects = this.displayParamObjects;
+ if (this.displayParamObjects !== undefined && this.displayParamObjects.length > 0) {
+ this.paramShareService.setSessionParamData(this.displayParamObjects);
+ }
+ return this.displayParamObjects;
+ }
+
+ //========================== End of populatePD() Method============================================
+ /* Formats each object read from YAML file as per page expectations */
+ formatResponseForKey(param: any[]) {
+ for (var i = 0; i < param.length; i++) {
+ this.formatKeys(param[i]);
+ }
+ }
+
+ //========================== End of formatResponseForKey() Method============================================
+ /* Formats for responsekeys of each object */
+ formatKeys(parameterDefinitionObject: any) {
+ if (null == parameterDefinitionObject || undefined === parameterDefinitionObject)
+ return;
+ if (null == parameterDefinitionObject['response-keys'])
+ parameterDefinitionObject['response-keys'] = [{}];
+ for (var j = 0; j < 5; j++) {
+ var keysObj = {
+ 'key-name': null,
+ 'key-value': null
+ };
+ if (undefined == parameterDefinitionObject['response-keys'][j] || null == parameterDefinitionObject['response-keys'][j]) {
+ parameterDefinitionObject['response-keys'].push(keysObj);
+ }
+ if (undefined == parameterDefinitionObject['response-keys'][j]['key-name']) {
+ parameterDefinitionObject['response-keys'][j]['key-name'] = null;
+ }
+ if (undefined == parameterDefinitionObject['response-keys'][j]['key-value']) {
+ parameterDefinitionObject['response-keys'][j]['key-value'] = null;
+ }
+ }
+ if (null == parameterDefinitionObject['request-keys'])
+ parameterDefinitionObject['request-keys'] = [{}];
+ for (var k = 0; k < 3; k++) {
+ var keysObj = {
+ 'key-name': null,
+ 'key-value': null
+ };
+ if (undefined == parameterDefinitionObject['request-keys'][k] || null == parameterDefinitionObject['request-keys'][k]) {
+ parameterDefinitionObject['request-keys'].push(keysObj);
+ }
+ if (undefined == parameterDefinitionObject['request-keys'][k]['key-name']) {
+ parameterDefinitionObject['request-keys'][k]['key-name'] = null;
+ }
+ if (undefined == parameterDefinitionObject['request-keys'][k]['key-value']) {
+ parameterDefinitionObject['request-keys'][k]['key-value'] = null;
+ }
+ }
+ }
+
+ //========================== End of formatKeys() Method============================================
+ //Send null if there are no keys present - Check with key names being absent
+ formatKeysForFileGeneration() {
+ for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+ if (this.modelParamDefinitionObjects[i]['response-keys'][0]['key-name'] == null && this.modelParamDefinitionObjects[i]['response-keys'][1]['key-name'] == null && this.modelParamDefinitionObjects[i]['response-keys'][2]['key-name'] == null)
+ this.modelParamDefinitionObjects[i]['response-keys'] = null;
+ if (this.modelParamDefinitionObjects[i]['request-keys'][0]['key-name'] == null && this.modelParamDefinitionObjects[i]['request-keys'][1]['key-name'] == null && this.modelParamDefinitionObjects[i]['request-keys'][2]['key-name'] == null)
+ this.modelParamDefinitionObjects[i]['request-keys'] = null;
+ }
+ }
+
+ //========================== End of formatKeysForFileGeneration() Method============================================
+ /* Fn to restore response keys in desired format per backend consumption*/
+ processResponseKeys(saveModel: any[]) {
+ for (var i = 0; i < saveModel.length; i++) {
+ if (saveModel[i]['response-keys'] != null) {
+ saveModel[i]['response-keys-new'] = [{}];
+ saveModel[i]['response-keys-new'][0] = {};//An array of objects ?? so accessing first element
+ if (undefined != saveModel[i]['response-keys'][0]['key-name'] && undefined != saveModel[i]['response-keys'][0]['key-value']) {
+ let keyName1 = saveModel[i]['response-keys'][0]['key-name'];
+ saveModel[i]['response-keys-new'][0][keyName1] = saveModel[i]['response-keys'][0]['key-value'];
+ }
+ if (undefined != saveModel[i]['response-keys'][1]['key-name'] && undefined != saveModel[i]['response-keys'][1]['key-value']) {
+ let keyName2 = saveModel[i]['response-keys'][1]['key-name'];
+ saveModel[i]['response-keys-new'][0][keyName2] = saveModel[i]['response-keys'][1]['key-value'];
+ }
+ if (undefined != saveModel[i]['response-keys'][2]['key-name'] && undefined != saveModel[i]['response-keys'][2]['key-value']) {
+ let keyName3 = saveModel[i]['response-keys'][2]['key-name'];
+ saveModel[i]['response-keys-new'][0][keyName3] = saveModel[i]['response-keys'][2]['key-value'];
+ }
+ if (saveModel[i]['response-keys'][3]['key-value'] != undefined && saveModel[i]['response-keys'][3]['key-value'] != null) {
+ let keyName4 = saveModel[i]['response-keys'][3]['key-name'];
+ saveModel[i]['response-keys-new'][0]['filter-by-key'] = saveModel[i]['response-keys'][3]['key-value'];
+ }
+ if (saveModel[i]['response-keys'][4]['key-value'] != undefined && saveModel[i]['response-keys'][4]['key-value'] != null) {
+ let keyName4 = saveModel[i]['response-keys'][4]['key-name'];
+ saveModel[i]['response-keys-new'][0]['filter-by-value'] = saveModel[i]['response-keys'][4]['key-value'];
+ }
+ }
+ else {
+ saveModel[i]['response-keys-new'] = null;
+ }
+ delete saveModel[i]['response-keys'];
+ saveModel[i]['response-keys'] = saveModel[i]['response-keys-new'];
+ delete saveModel[i]['response-keys-new'];
+ }
+ return saveModel;
+ }
+
+ //========================== End of processResponseKeys() Method============================================
+ /*Fn to format response keys for front end display */
+ formatFileContentForDisplay(fileModel: any[]) {
+ for (var i = 0; i < fileModel.length; i++) {
+ if (undefined != fileModel[i]['response-keys']) {
+ let testObj = fileModel[i]['response-keys'];
+ let keyNum = 0;
+ fileModel[i]['response-keys-new'] = [{}];
+ for (var prop in testObj[0]) {
+ if (testObj[0].hasOwnProperty(prop)) {
+ let key = prop;
+ fileModel[i]['response-keys-new'][keyNum] = {};
+ fileModel[i]['response-keys-new'][keyNum]['key-name'] = key;
+ fileModel[i]['response-keys-new'][keyNum]['key-value'] = testObj[0][key];
+ }
+ keyNum++;
+ }
+ delete fileModel[i]['response-keys'];
+ fileModel[i]['response-keys'] = fileModel[i]['response-keys-new'];
+ delete fileModel[i]['response-keys=new'];
+ }
+ }
+ return fileModel;
+ }
+
+ //========================== End of openModal() Method============================================
+ getCorrectParameterDefinitionObject(paramName: string) {
+ var result = {
+ 'obj': {},
+ 'present': false
+ };
+ for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+ var paramObj = this.modelParamDefinitionObjects[i];
+ if (paramObj.name === paramName) {
+ result.obj = this.modelParamDefinitionObjects[i];
+ result.present = true;
+ return result;
+ }
+ }
+ var parameterDefinitionObject = {
+ 'name': paramName,
+ 'type': null,
+ 'description': null,
+ 'required': null,
+ 'default': null,
+ 'source': null,
+ 'rule-type': null,
+ 'response-keys': [{}],
+ 'request-keys': [{}]
+ };
+ result.obj = parameterDefinitionObject;
+ result.present = false;
+ return result;
+ }
+
+ //========================== End of clearSessionStorageForParam() Method============================================
+ isValidateSourceAndResponseKeys(objs: any[]) {
+ let isValid = true;
+ if (undefined != objs || null != objs) {
+ for (var i = 0; i < objs.length; i++) {
+ if (objs[i].source == 'INSTAR' && (null == objs[i]['response-keys'] || undefined == objs[i]['response-keys'])) {
+ isValid = false;
+ return isValid;
+ }
+ }
+ }
+ return isValid;
+ }
+
+
+ public prepareFileName(): any {
+ let fileNameObject: any = this.mappingEditorService.latestAction;
+ this.appDataObject = this.mappingEditorService.appDataObject;
+ this.downloadDataObject = this.mappingEditorService.downloadDataObject;
+ return fileNameObject;
+ }
+
+ public destroy(displayParamObjects) {
+ this.displayParamObjects = displayParamObjects;
+ if (this.mappingEditorService.referenceNameObjects) {
+ this.saveChanges('send');
+ this.saveChanges('download');
+ this.mappingEditorService.changeNavAppData(this.appDataObject);
+ this.mappingEditorService.changeNavDownloadData(this.downloadDataObject);
+ }
+ }
+
+ //========================== End of fileChangeEvent() Method============================================
+ /* Saves pd file in YAML format */
+ public saveChanges(downLoadOrSend: String) {
+ if (undefined != this.displayParamObjects && null != this.displayParamObjects && this.displayParamObjects.length > 0) {
+ this.paramShareService.setSessionParamData(this.displayParamObjects);
+
+ //Generate File Name per given rules - if not, return without saving
+ this.modelParamDefinitionObjects = this.displayParamObjects.slice(0);
+ this.paramShareService.setDisplayData(this.displayParamObjects);
+ this.formatKeysForFileGeneration();
+ //Added code to serialize, deserialize and then make changes needed to save response keys as needed in pd file
+ let jsonString = JSON.stringify(this.modelParamDefinitionObjects, null, '\t');
+ jsonString = jsonString.replace(/"null"/g, 'null');
+ let saveModel = JSON.parse(jsonString);
+ let pdFileObject = this.processResponseKeys(saveModel);
+ //Validate for Source =INSTAR and responsekeys present
+ if (this.isValidateSourceAndResponseKeys(pdFileObject)) {
+ let yamlObject = {
+ 'kind': 'Property Definition',
+ 'version': 'V1',
+ 'vnf-parameter-list': []
+ };
+ yamlObject['vnf-parameter-list'] = pdFileObject;
+ yamlObject = this.removeUnwantedvalues(yamlObject);
+ let yamlStringTemp = YAML.stringify(yamlObject, 6, 1);
+ var re = /\'/gi;
+ var newYamlStringTemp = yamlStringTemp.replace(re, '"');
+ var re2 = / -\n +/gi;
+ var newYamlStringTemp2 = newYamlStringTemp.replace(re2, '- ');
+ let yamlString = '---\n' + newYamlStringTemp2;
+ if (downLoadOrSend === 'download') {
+ var blob = new Blob([yamlString], {
+ type: 'text/plain'
+ });
+ //let fileName = "pd_" + this.action + "_" + this.type + "_0.0.1V.yaml"
+ this.downloadDataObject.pd.pdData = yamlString;
+ this.downloadDataObject.pd.pdFileName = this.artifact_fileName;
+ }
+ else {
+ this.sendPD(JSON.stringify(yamlString));
+ }
+ }
+ else {
+ for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+ this.formatKeys(this.modelParamDefinitionObjects[i]);
+ }
+ this.nService.error('Error', 'Response Keys cannot be empty if source is INSTAR');
+ return;
+ }
+ //Restore Keys for display
+ for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+ this.formatKeys(this.modelParamDefinitionObjects[i]);
+ }
+ }
+
+ }
+
+
+ //This method will create parameter definitions as an array of objects from template name-value pairs and associative array for value from external key file if present
+ createOrUpdateParameterDefinitionData(usecase) {
+ this.parameterNameValues = JSON.parse(localStorage['paramsContent']);
+ this.parameterDefinitionMap = this.paramShareService.getData();
+ //Return if there are no name-value pairs or send some alert notification
+ if (undefined != this.modelParamDefinitionObjects && this.modelParamDefinitionObjects.length > 0 && usecase == 'create') {
+ //Do not recreate if object is already created
+ return;
+ }
+ else {
+ }
+ this.parameterDefinitionMap = this.paramShareService.getData();
+ //To Do:: Add Check for empty parameterDefinitionmap
+ var nameValueObj = {}, pName, pValue;
+ for (var key in this.parameterNameValues) {
+ if (this.parameterNameValues.hasOwnProperty(key)) {
+ pName = key;
+ pValue = this.parameterNameValues[key];
+ }
+
+ if (this.parameterDefinitionMap !== undefined)
+ //Check if parameter exists - if so, just update the keys, else create new object
+ var result = this.getCorrectParameterDefinitionObject(pName);
+ var parameterDefinitionObject = result.obj;
+ if (parameterDefinitionObject['source'] != 'A&AI' && (undefined !== this.parameterDefinitionMap) && (undefined !== this.parameterDefinitionMap[pValue.toUpperCase()])) {
+ var fields = this.parameterDefinitionMap[pValue.toUpperCase()].split('|');
+ //Starts with 2, first vallue is source, second is rule-type
+ let respInd = 0;
+ for (var i = 2; i < fields.length; i += 2) {
+ parameterDefinitionObject['response-keys'][respInd] = {};
+ parameterDefinitionObject['response-keys'][respInd]['key-name'] = fields[i];
+ if ((i + 1) < fields.length) {
+ parameterDefinitionObject['response-keys'][respInd]['key-value'] = fields[i + 1];
+ }
+ respInd++;
+ }
+ parameterDefinitionObject['source'] = fields[0];
+ parameterDefinitionObject['rule-type'] = fields[1];
+ } else {
+ if (parameterDefinitionObject['source'] === 'INSTAR') {
+ parameterDefinitionObject['source'] = 'Manual';
+ parameterDefinitionObject['ruleTypeValues'] = [null];
+ parameterDefinitionObject['rule-type'] = null;
+ parameterDefinitionObject['showFilterFields'] = false;
+ for (let x = 0; x < 5; x++) {
+ parameterDefinitionObject['response-keys'][x]['key-name'] = null;
+ parameterDefinitionObject['response-keys'][x]['key-value'] = null;
+ }
+ }
+ }
+ this.formatKeys(parameterDefinitionObject); //Ensure there are 3 elements for response-keys, request-keys for display purposes
+ if (!result.present) { //only push if not present
+ this.modelParamDefinitionObjects.push(parameterDefinitionObject);
+ }
+ }
+ for (var indx in this.modelParamDefinitionObjects) {
+ if (this.modelParamDefinitionObjects[indx] != undefined && (this.modelParamDefinitionObjects[indx].source == undefined || this.modelParamDefinitionObjects[indx].source == null || this.modelParamDefinitionObjects[indx].source == '')) {
+ this.modelParamDefinitionObjects[indx].source = 'Manual';
+ }
+ }
+ this.displayParamObjects = this.modelParamDefinitionObjects.slice(0);
+ this.paramShareService.setDisplayData(this.displayParamObjects);
+ }
+
+ public processKeyFile(fileName, result) {
+ this.myKeyFileName = fileName;
+ if (!this.myKeyFileName.endsWith('.txt')) {
+ this.nService.error('Error', 'Uploaded file is not a TXT file');
+ }
+ this.parameterDefinitionMap = {};
+ var rows = result.split(/\r\n|\r|\n/g);
+ for (var i = 1; i < rows.length; i++) { //Omit headings, so start from 1
+ let ind = rows[i].indexOf('|');
+ let key = rows[i].slice(0, ind);
+ let value = rows[i].slice(ind + 1);
+ this.parameterDefinitionMap[key.toUpperCase()] = value;
+ }
+ this.paramShareService.setData(this.parameterDefinitionMap);
+ //this.notificationService.notifySuccessMessage('External Key file successfully uploaded..');
+ let sessionVar = [{}];
+ sessionVar = this.paramShareService.getSessionParamData();
+ if (sessionVar !== undefined && sessionVar != null && sessionVar.length > 0) {
+ if (undefined == this.displayParamObjects)
+ this.displayParamObjects = this.modelParamDefinitionObjects = [];
+ this.displayParamObjects = sessionVar;
+ this.modelParamDefinitionObjects = this.displayParamObjects;
+ if (localStorage['paramsContent'] && (undefined !== this.displayParamObjects) && (this.displayParamObjects.length > 0)) {
+ this.createOrUpdateParameterDefinitionData('update');
+ //update the session variable with the updated data
+ this.paramShareService.setSessionParamData(this.displayParamObjects);
+ }
+ } else {
+ this.displayParamObjects = this.modelParamDefinitionObjects = [];
+ }
+ this.populateDataUponSource(this.displayParamObjects);
+ return this.displayParamObjects;
+ }
+
+ public processPDfile(fileName, result) {
+ this.myPdFileName = fileName;
+ if (!this.myPdFileName.endsWith('.yaml')) {
+ this.nService.error('Error', 'Uploaded file is not a YAML file');
+ }
+ var pdObject = YAML.parse(result);
+ let fileModel = pdObject['vnf-parameter-list'];
+ this.populatePD(fileModel);
+ return this.displayParamObjects;
+ }
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css
new file mode 100644
index 0000000..be35e44
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html
new file mode 100644
index 0000000..ed0fbd3
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html
@@ -0,0 +1,219 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+-->
+
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+ [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+<div class="card" style=" margin-bottom: 23px;">
+ <img class="card-img-top" data-src="holder.js/100%x180/" alt="">
+ <div class="card-block" style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="row" style="padding: 15px 25px">
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Action</label>
+ <input class="form-control" type="text" disabled value="{{action}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" />
+ </div>
+ <div *ngIf="(action === 'ConfigScaleOut')" class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>templateIdentifier</label><input class="form-control" type="text" disabled value="{{identifier}}" />
+ </div>
+ </div>
+ </div>
+</div>
+<div class="row create-wrapper">
+ <div class="col-md-12">
+ <div class="row" style="padding: 5px 5px">
+ <div class="col-12 mb-3">
+ <div class="input-group">
+ <input id="inputFile1" class="file" hidden #myInput1 type='file' (change)="fileChange(myInput1, 'pdfile')">
+ <input [(ngModel)]="myPdFileName" type="text" class="input-lg" disabled placeholder="Upload parameters from PC" style="width:85%;">
+ <button [disabled]="(undefined == mappingEditorService.latestAction)" (click)="browsePdFile($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+ type="button"> UPLOAD PD FILE
+ </button>
+ </div>
+ </div>
+ <div class="col-12">
+ <div class="input-group">
+ <input id="inputFile2" class="file" hidden #myInput2 type='file' (change)="fileChange(myInput2, 'keyfile')">
+ <input [(ngModel)]="myKeyFileName" type="text" class="input-lg" disabled placeholder="Upload key file from PC. You can upload a key file only if you have some parameters."
+ style="width:85%;">
+ <button [disabled]="(!(undefined !== displayParamObjects && displayParamObjects.length>0))" (click)="browseKeyFile($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+ type="button">UPLOAD KEY FILE
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <br>
+ <hr>
+ <!--h4>testing{{initialData}}</h4-->
+ <div *ngIf="((undefined !== displayParamObjects && displayParamObjects.length>0) ) " class="col-md-12 ">
+ <form *ngIf="undefined !== displayParamObjects" class="form-inline" novalidate #paramForm="ngForm" (ngSubmit)="saveChanges('download', paramForm.valid)">
+
+ <div style="height: 210px; overflow: auto;">
+ <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp">
+ <thead>
+ <tr>
+ <th class="mdl-data-table__cell--non-numeric">NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">DESCRIPTION</th>
+ <th class="mdl-data-table__cell--non-numeric">TYPE</th>
+ <th class="mdl-data-table__cell--non-numeric">REQUIRED</th>
+ <th class="mdl-data-table__cell--non-numeric">DEFAULT</th>
+ <th class="mdl-data-table__cell--non-numeric">SOURCE</th>
+ <th class="mdl-data-table__cell--non-numeric">RULETYPE</th>
+ <th class="mdl-data-table__cell--non-numeric">FILTER BY FIELD</th>
+ <th class="mdl-data-table__cell--non-numeric">FILTER BY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+ <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let obj of displayParamObjects; let i = index">
+ <td class="mdl-data-table__cell--non-numeric">
+ <input required id="id1" [(ngModel)]="obj.name" #objName="ngModel" name="objName{{i}}" style="width:300px">
+ <span class="error-message" [hidden]="objName.valid || (objName.pristine && !paramForm.submitted)">Required Field</span>
+ </td>
+ <td class="mdl-data-table__cell--non-numeric"><input [(ngModel)]="obj.description" #objDesc="ngModel" name="objDesc{{i}}">
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">
+ <select id="id3" [(ngModel)]="obj.type" name="{{'objType'+i}}">
+ <option *ngFor="let typ of typeValues"
+ [value]="typ"
+ [selected]="obj.type === typ"
+ >
+ {{typ}}
+ </option>
+ </select>
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">
+ <select [(ngModel)]="obj.required" #objRequired="ngModel" name="{{'objRequired'+i}}">
+ <option *ngFor="let req of requiredValues"
+ [value]="req"
+ [selected]="req === obj.required"
+ >
+ {{req}}
+ </option>
+ </select>
+ </td>
+ <td class="mdl-data-table__cell--non-numeric"><input id="id1" [(ngModel)]="obj.default" #objDefault="ngModel" name="objDefault{{i}}"></td>
+ <td class="mdl-data-table__cell--non-numeric">
+ <select class="form-control" required id="id3" [(ngModel)]="obj.source" #objSource="ngModel" (ngModelChange)="sourceChanged($event,obj)" name="{{'objSource'+i}}">
+ <option *ngFor="let src of sourceValues"
+ [value]="src"
+ [selected]="src === obj.source"
+ [disabled]="src === 'INSTAR'">
+ {{src}}
+ </option>
+
+ </select>
+ <span class="error-message" [hidden]="objSource.valid || (objSource.pristine && !paramForm.submitted)">Required Field</span>
+ </td>
+
+ <td class="mdl-data-table__cell--non-numeric">
+ <select (ngModelChange)="ruleTypeChanged($event,obj)" class="form-control" id="id4" [(ngModel)]="obj['rule-type']" #objRuleType="ngModel" name="objRuleType{{i}}"
+ list="ruleTypes">
+ <option *ngFor="let rTyp of obj.ruleTypeValues;" [value]="rTyp"
+ [selected]="rTyp === obj.rule-type">
+ {{rTyp}}
+ </option>
+ </select>
+ </td>
+
+ <td>
+ <select *ngIf="obj.showFilterFields" (ngModelChange)="filetrByFieldChanged($event,obj)" class="form-control" id="id4" [(ngModel)]="obj['response-keys'][3]['key-value']"
+ #objfilterByField="ngModel" name="filterByField{{i}}" list="ruleTypes">
+ <option *ngFor="let fTyp of filterByFieldvalues;" [value]="fTyp"
+ [selected]="fTyp === obj['response-keys'][3]['key-value']">
+ {{fTyp}}
+ </option>
+ </select>
+ </td>
+ <td>
+ <input *ngIf="obj.showFilterFields" [disabled]="!(obj.enableFilterByValue)" type="text" [value]="obj['response-keys'][4]['key-value']" class="form-control"
+ id="id4" [(ngModel)]="obj['response-keys'][4]['key-value']" #objfilterByValue="ngModel" name="objfilterByValue{{i}}" list="ruleTypes">
+ </td>
+
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][0]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][0]['key-value']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][1]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][1]['key-value']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][2]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][2]['key-value']}}
+
+ </td>
+
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][0]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][0]['key-value']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][1]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][1]['key-value']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][2]['key-name']}}
+
+ </td>
+ <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][2]['key-value']}}
+
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ `
+ </div>
+
+ </form>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
new file mode 100644
index 0000000..2668f2b
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
@@ -0,0 +1,197 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed, inject} from '@angular/core/testing';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {FormsModule} from '@angular/forms';
+import {NotificationService} from '../../../shared/services/notification.service';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {ModalComponent} from '../../../shared/modal/modal.component';
+import {DialogService} from 'ng2-bootstrap-modal';
+import {ConfirmComponent} from '../../../shared/confirmModal/confirm.component';
+import {RouterTestingModule} from '@angular/router/testing';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+
+import {BuildDesignComponent} from '../build-artifacts.component';
+import {NotificationsService} from 'angular2-notifications';
+import {HomeComponent} from '../../../home/home/home.component';
+import {LogoutComponent} from '../../../shared/components/logout/logout.component';
+import {HelpComponent} from '../../../shared/components/help/help/help.component';
+import {AboutUsComponent} from '../../../about-us/aboutus.component';
+import {TestComponent} from '../../../test/test.component';
+import {ParameterComponent} from './parameter.component';
+import {HttpModule} from '@angular/http';
+import { NgProgress } from 'ngx-progressbar';
+
+
+
+describe('ParameterComponent', () => {
+ let component: ParameterComponent;
+ let fixture: ComponentFixture<ParameterComponent>;
+ const routes = [
+ {
+ path: 'home',
+ component: HomeComponent
+ }, {
+ path: 'vnfs',
+ loadChildren: './vnfs/vnfs.module#VnfsModule'
+ }, {
+ path: 'test',
+ component: TestComponent
+ },
+ {
+ path: 'help',
+ component: HelpComponent
+ }, {
+ path: 'aboutUs',
+ component: AboutUsComponent
+ }, {
+ path: 'logout',
+ component: LogoutComponent
+ }, {
+ path: '',
+ redirectTo: '/home',
+ pathMatch: 'full'
+ }
+ ];
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ParameterComponent, HomeComponent, TestComponent, HelpComponent, AboutUsComponent, LogoutComponent],
+ schemas: [NO_ERRORS_SCHEMA],
+ imports: [HttpModule, FormsModule, RouterTestingModule.withRoutes(routes)],
+ providers: [UtilityService, NgProgress, BuildDesignComponent, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService, NotificationsService]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ParameterComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+
+ it('should retrieve PD from APPC...', () => {
+ expect(component.getPD());
+ });
+
+ it('should infer some information from reference object...', inject([MappingEditorService], (mappingEditorService: MappingEditorService) => {
+ mappingEditorService.latestAction = {"action":"Configure","action-level":"vnf","scope":{"vnf-type":"ticktack","vnfc-type":""},"template":"Y","vm":[],"device-protocol":"CHEF","user-name":"","port-number":"","artifact-list":[{"artifact-name":"template_Configure_ticktack_0.0.1V.json","artifact-type":"config_template"},{"artifact-name":"pd_Configure_ticktack_0.0.1V.yaml","artifact-type":"parameter_definitions"}],"scopeType":"vnf-type"};
+ expect(component.ngOnInit());
+ expect(component.vnfType).toEqual('ticktack');
+ expect(component.vnfcType).toEqual('');
+ expect(component.protocol).toEqual('CHEF');
+ expect(component.action).toEqual('Configure');
+ expect(component.artifact_fileName).toEqual('pd_Configure_ticktack_0.0.1V.yaml');
+ }));
+
+
+ it('should retrieve the PD from cache...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ mappingEditorService.latestAction = {"action":"Configure","action-level":"vnf","scope":{"vnf-type":"ticktack","vnfc-type":""},"template":"Y","vm":[],"device-protocol":"CHEF","user-name":"","port-number":"","artifact-list":[{"artifact-name":"template_Configure_ticktack_0.0.1V.json","artifact-type":"config_template"},{"artifact-name":"pd_Configure_ticktack_0.0.1V.yaml","artifact-type":"parameter_definitions"}],"scopeType":"vnf-type"};
+ paramShareService.setSessionParamData("TEST PD INFORMATION")
+ expect(component.ngAfterViewInit()).toEqual("TEST PD INFORMATION");
+ }));
+
+/*
+ it('should read file key file content...', () => {
+ let input = {"__zone_symbol__changefalse":[{"type":"eventTask","state":"running","source":"HTMLInputElement.addEventListener:change","zone":"angular","runCount":2}]};
+ expect(component.fileChange(input, 'keyfile'));
+ });
+
+let content = new Blob(["PARAMVALUE|SOURCE|RULETYPE|KEY1|VALUE1|KEY2|VALUE2|KEY3|VALUE3\nvalue1|INSTAR|interface_ip_address|UniqueKeyName1|addressfqdn123|UniqueKeyValue|m001ssc001p1n001v001|FieldKeyName|ipaddress_v4\nvalue2|INSTAR|interface_ip_address|UniqueKeyName2|addressfqdnAsgar1|UniqueKeyValue|m001ssc001p1n001v002|FieldKeyName|ipaddress_v4"]
+{includes:()});
+let file = new File(content, "test.txt");
+ it('should read file PD file content...', () => {
+ let input = {"__zone_symbol__changefalse":[{"type":"eventTask","state":"running","source":"HTMLInputElement.addEventListener:change","zone":"angular","runCount":2}]};
+
+ expect(component.fileChange(input, 'pdfile'));
+ });
+ */
+
+ it('should set the ruletypes for source A&AI...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = "A&AI";
+ expect(component.sourceChanged(data, obj));
+ expect(obj.ruleTypeValues).toEqual([null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list']);
+ }));
+
+ it('should set the ruletypes for source Manual...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = "Manual";
+ expect(component.sourceChanged(data, obj));
+ expect(obj.ruleTypeValues).toEqual([null]);
+ expect(obj['rule-type']).toBeNull();
+ }));
+
+ it('should set the ruletypes for source INSTAR...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = "INSTAR";
+ expect(component.sourceChanged(data, obj));
+ expect(obj.ruleTypeValues).toEqual([null]);
+ }));
+
+ it('should set the ruletypes for ruletype null...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = null
+ expect(component.ruleTypeChanged(data, obj));
+ expect(obj['showFilterFields']).toBeFalsy();
+ expect(obj['rule-type']).toBeNull();
+ }));
+
+ it('should set the ruletypes for ruletype vm-name-list...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = 'vm-name-list';
+ let sourceObject = component.ruleTypeConfiguaration[data];
+
+ expect(component.ruleTypeChanged(data, obj));
+ expect(obj['showFilterFields']).toBeTruthy();
+ expect(obj['rule-type']).toBeNull();
+
+ for (let x = 0; x < sourceObject.length; x++) {
+ expect(obj['response-keys'][x]['key-name']).toEqual(sourceObject[x]['key-name']);
+ expect(obj['response-keys'][x]['key-value']).toEqual(sourceObject[x]['key-value']);
+ }
+ }));
+
+
+ it('should set the ruletypes for ruletype vnf-name...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+ let data = "vnf-name";
+ expect(component.ruleTypeChanged(data, obj));
+ expect(obj['showFilterFields']).toBeFalsy();
+ expect(obj['response-keys'][3]['key-name']).toBeNull;
+ expect(obj['response-keys'][3]['key-value']).toBeNull;
+ expect(obj['response-keys'][4]['key-name']).toBeNull;
+ expect(obj['response-keys'][4]['key-value']).toBeNull;
+ }));
+
+
+
+});
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts
new file mode 100644
index 0000000..2732473
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts
@@ -0,0 +1,430 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { saveAs } from 'file-saver';
+import { ParamShareService } from '../../../shared/services/paramShare.service';
+import { MappingEditorService } from '../../../shared/services/mapping-editor.service';
+import { ModalComponent } from '../../../shared/modal/modal.component';
+import { HttpUtilService } from '../../../shared/services/httpUtil/http-util.service';
+import { UtilityService } from '../../../shared/services/utilityService/utility.service';
+import { environment } from '../../../../environments/environment';
+import { NotificationsService } from 'angular2-notifications';
+import { ParameterDefinitionService } from './parameter-definition.service';
+import 'rxjs/add/operator/map';
+import { NgProgress } from 'ngx-progressbar';
+
+
+let YAML = require('yamljs');
+
+declare var $: any;
+
+@Component({
+ selector: 'parameter-form',
+ templateUrl: './parameter.component.html',
+ styleUrls: ['../reference-dataform/reference-dataform.component.css'],
+ providers: [ParameterDefinitionService]
+})
+export class ParameterComponent implements OnInit {
+ public paramForm: any;
+ public actionType: any;
+ public showFilterFields: boolean;
+ public filterByFieldvalues = [null, 'vm-number', 'vnfc-function-code'];
+ public ruleTypeConfiguaration = {
+ 'vnf-name': [
+ {
+ 'key-name': 'unique-key-name',
+ 'key-value': 'parent-name'
+ },
+ {
+ 'key-name': 'unique-key-value',
+ 'key-value': 'vnf'
+ },
+ {
+ 'key-name': 'field-key-name',
+ 'key-value': 'vnf-name'
+ }
+ ],
+ 'vm-name-list': [
+ {
+ 'key-name': 'unique-key-name',
+ 'key-value': 'parent-name'
+ },
+ {
+ 'key-name': 'unique-key-value',
+ 'key-value': 'vserver'
+ },
+ {
+ 'key-name': 'field-key-name',
+ 'key-value': 'vserver-name'
+ }
+ ],
+ 'vnfc-name-list': [
+ {
+ 'key-name': 'unique-key-name',
+ 'key-value': 'parent-name'
+ },
+ {
+ 'key-name': 'unique-key-value',
+ 'key-value': 'vnfc'
+ },
+ {
+ 'key-name': 'field-key-name',
+ 'key-value': 'vnfc-name'
+ }
+ ],
+ 'vnf-oam-ipv4-address': [
+ {
+ 'key-name': 'unique-key-name',
+ 'key-value': 'parent-name'
+ },
+ {
+ 'key-name': 'unique-key-value',
+ 'key-value': 'vnf'
+ },
+ {
+ 'key-name': 'field-key-name',
+ 'key-value': 'ipv4-oam-ipaddress'
+ }
+ ],
+ 'vnfc-oam-ipv4-address-list': [
+ {
+ 'key-name': 'unique-key-name',
+ 'key-value': 'parent-name'
+ },
+ {
+ 'key-name': 'unique-key-value',
+ 'key-value': 'vnfc'
+ },
+ {
+ 'key-name': 'field-key-name',
+ 'key-value': 'ipaddress-v4-oam-vip'
+ }
+ ]
+ };
+ public requiredValues: boolean[] = [null, true, false];
+ public sourceValues = ['Manual', 'INSTAR', 'A&AI'];
+ public ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+ public typeValues = [null, 'ipv4-address', 'ipv6-address', 'ipv4-prefix', 'ipv6-prefix'];
+ public responseKeyNameValues = ['', 'unique-key-name', 'unique-key-value', 'field-key-name'];
+ public responseKeyValues = ['(none)', 'addressfqdn', 'ipaddress-v4', 'ipaddress-v6'];
+ public requestKeyNameValues = [''];
+ public requestKeyValues = ['', '(none)'];
+ public myKeyFileName = null;
+ public myPdFileName = null;
+ public disposable: any;
+ public confirmation: boolean;
+ public showConfirmation: boolean;
+ public test: boolean;
+ apiToken = localStorage['apiToken'];
+ userId = localStorage['userId'];
+ public initialData: any;
+ public intialData: any;
+ public initialAction: any;
+ public item: any = {};
+ public subscription: any;
+ public Actions = [
+ { action: 'ConfigBackup', value: 'ConfigBackup' },
+ { action: 'ConfigModify', value: 'ConfigModify' },
+ { action: 'ConfigRestore', value: 'ConfigRestore' },
+ { action: 'Configure', value: 'Configure' },
+ { action: 'GetRunningConfig', value: 'GetRunningConfig' },
+ { action: 'HealthCheck', value: 'HealthCheck' },
+ { action: 'StartApplication', value: 'StartApplication' },
+ { action: 'StopApplication', value: 'StopApplication' }
+ ];
+ public uploadTypes = [{
+ value: 'External Key File',
+ display: 'KeyFile'
+ },
+ {
+ value: 'Pd File',
+ display: 'Pd File'
+ }
+ ];
+
+ options = {
+ timeOut: 1000,
+ showProgressBar: true,
+ pauseOnHover: true,
+ clickToClose: true,
+ maxLength: 200
+ };
+ public vnfcTypeData: string = '';
+ public selectedUploadType: string;
+ @ViewChild(ModalComponent) modalComponent: ModalComponent;
+ public title: string;
+ public parameterDefinitionMap: { [index: string]: string; } = {};
+ public parameterNameValues = {};
+ public displayParamObjects;
+ public modelParamDefinitionObjects;
+ public vnfType: any;
+ vnfcType: any;
+ protocol: any;
+ public refNameObj = {};
+ public action;
+ public artifactName;
+ public appDataObject: any;
+ public downloadDataObject: any;
+ public artifact_fileName;
+ identifier: any;
+ private selectedActionReference: any;
+
+ //this.mappingeditorservice.referenceNameObjects = object;PLEASE USE THIS OBJECT TO GET TEMPALLDATA
+
+ constructor (private httpService: HttpUtilService,
+ private parameterDefinitionService: ParameterDefinitionService,
+ private paramShareService: ParamShareService,
+ private mappingEditorService: MappingEditorService,
+ private httpUtil: HttpUtilService,
+ private utilService: UtilityService,
+ private nService: NotificationsService,
+ private ngProgress: NgProgress) {
+ }
+
+ ngOnInit() {
+ this.selectedActionReference = this.parameterDefinitionService.prepareFileName();
+ if (this.selectedActionReference && this.selectedActionReference != undefined) {
+
+ this.vnfType = this.selectedActionReference.scope['vnf-type'];
+ this.vnfcType = this.selectedActionReference.scope['vnfc-type'];
+ this.protocol = this.selectedActionReference['device-protocol'];
+ this.action = this.selectedActionReference.action;
+
+ for (let i = 0; i < this.selectedActionReference['artifact-list'].length; i++) {
+ let artifactList = this.selectedActionReference['artifact-list'];
+ if (artifactList[i]['artifact-type'] === 'parameter_definitions') {
+ this.artifact_fileName = artifactList[i]['artifact-name'];
+ }
+ }
+ this.parameterDefinitionService.setValues(this.vnfType, this.vnfcType, this.protocol, this.action, this.artifact_fileName);
+ }
+ else {
+ this.selectedActionReference = {
+ 'action': '',
+ 'scope': { 'vnf-type': '', 'vnfc-type': '' },
+ 'vm': [],
+ 'protocol': '',
+ 'download-dg-reference': '',
+ 'user-name': '',
+ 'port-number': '',
+ 'artifact-list': [],
+ 'deviceTemplate': '',
+ 'scopeType': ''
+ };
+ }
+
+ //let path = this.location.path
+ /* this.activeRoutes.url.subscribe(UrlSegment => {
+ this.actionType = UrlSegment[0].path
+ })
+ */
+ this.identifier = this.mappingEditorService.identifier;
+ }
+
+ ngAfterViewInit() {
+ if (this.mappingEditorService.latestAction) {
+ this.displayParamObjects = [];
+ this.modelParamDefinitionObjects = [];
+ if (this.paramShareService.getSessionParamData() != undefined && this.paramShareService.getSessionParamData().length > 0) {
+ this.displayParamObjects = this.paramShareService.getSessionParamData();
+ } else {
+ this.getPD();
+ }
+ } else {
+ this.nService.error('Error', 'Please enter Action and VNF type in Reference Data screen');
+ }
+ return this.displayParamObjects;
+ }
+
+
+ public getPD() {
+ let result: any;
+ let input = {
+ 'input': {
+ 'design-request': {
+ 'request-id': this.apiToken,
+ 'action': 'getArtifact',
+ 'payload': '{"userID": "' + this.userId + '", "vnf-type" : "' + this.vnfType + '", "artifact-type":"APPC-CONFIG", "artifact-name":"' + this.artifact_fileName + '"}'
+ }
+ }
+ };
+ let artifactContent: any;
+ this.ngProgress.start();
+ return this.httpService.post({
+ url: environment.getDesigns,
+ data: input
+ }).subscribe(data => {
+ if (this.utilService.checkResult(data)) {
+ let result: any = JSON.parse(data.output.data.block).artifactInfo[0];
+ var pdObject = YAML.parse(result['artifact-content']);
+ let fileModel = pdObject['vnf-parameter-list'];
+ this.displayParamObjects = this.parameterDefinitionService.populatePD(fileModel);
+ }
+ else {
+
+ }
+ this.ngProgress.done();
+ },
+
+ error => this.nService.error('Error', 'Error in connecting APPC Server'));
+
+ }
+
+ //========================== End of NGInit() Method============================================
+ selectedNavItem(item: any) {
+ this.item = item;
+ }
+
+ //========================== End of selectedNavItem() Method============================================
+ browsePdFile() {
+ $('#inputFile1').trigger('click');
+ }
+
+ //========================== End of browsePdFile() Method============================================
+ browseKeyFile() {
+ $('#inputFile2').trigger('click');
+
+ }
+
+ //========================== End of browseKeyFile() Method============================================
+
+
+ //========================== End of appendSlashes() Method============================================
+
+
+ //========================== End of prepareFileName() Method============================================
+ ngOnDestroy() {
+ this.parameterDefinitionService.destroy(this.displayParamObjects);
+ }
+
+ //========================== End of ngOnDestroy() Method============================================
+
+ //========================== End of createOrUpdateParameterDefinitionData() Method============================================
+ public showUpload() {
+ this.selectedUploadType = this.uploadTypes[0].value;
+ };
+
+ //========================== End of showUpload() Method============================================
+ //This is called when the user selects new files from the upload button
+ public fileChange(input, uploadType) {
+ if (input.files && input.files[0]) {
+ // Create the file reader
+ let reader = new FileReader();
+ this.readFile(input.files[0], reader, (result) => {
+ if ('keyfile' === uploadType) {
+ this.myKeyFileName = input.files[0].name;
+ this.displayParamObjects = this.parameterDefinitionService.processKeyFile(this.myKeyFileName, result);
+ }
+ if ('pdfile' === uploadType) {
+ this.myPdFileName = input.files[0].name;
+ this.displayParamObjects = this.parameterDefinitionService.processPDfile(this.myPdFileName, result);
+ }
+ });
+ } else {
+ //this.notificationService.notifyErrorMessage('Failed to read file!Please try again.');
+ }
+ }
+
+ //========================== End of fileChange() Method============================================
+ public readFile(file, reader, callback) {
+ // Set a callback funtion to fire after the file is fully loaded
+ reader.onload = () => {
+ // callback with the results
+ callback(reader.result);
+ };
+ //this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
+ // Read the file
+ reader.readAsText(file, 'UTF-8');
+ }
+
+ //========================== End of readFile() Method============================================
+ fileChangeEvent(fileInput: any) {
+ let obj: any = fileInput.target.files;
+ }
+
+
+ sourceChanged(data, obj) {
+ if (data == 'A&AI') {
+ obj.ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+ for (let x = 0; x < 5; x++) {
+ obj['response-keys'][x]['key-name'] = null;
+ obj['response-keys'][x]['key-value'] = null;
+ }
+ } else if (data == 'Manual') {
+ obj.ruleTypeValues = [null];
+ obj['rule-type'] = null;
+ obj.showFilterFields = false;
+ for (let x = 0; x < 5; x++) {
+ obj['response-keys'][x]['key-name'] = null;
+ obj['response-keys'][x]['key-value'] = null;
+ }
+ }
+ else {
+ obj.ruleTypeValues = [null];
+ }
+ }
+
+ //========================== End of sourceChanged() Method============================================
+ ruleTypeChanged(data, obj) {
+ if (data == null || data == undefined || data == 'null') {
+ obj.showFilterFields = false;
+ obj['rule-type'] = null;
+ for (let x = 0; x < 5; x++) {
+ obj['response-keys'][x]['key-name'] = null;
+ obj['response-keys'][x]['key-value'] = null;
+ }
+ } else {
+ let sourceObject = this.ruleTypeConfiguaration[data];
+ if (data == 'vm-name-list' || data == 'vnfc-name-list' || data == 'vnfc-oam-ipv4-address-list') {
+ this.showFilterFields = false;
+ obj.showFilterFields = true;
+ this.filetrByFieldChanged(obj['response-keys'][3]['key-value'], obj);
+ } else {
+ obj.showFilterFields = false;
+ obj['response-keys'][3]['key-name'] = null;
+ obj['response-keys'][3]['key-value'] = null;
+ obj['response-keys'][4]['key-name'] = null;
+ obj['response-keys'][4]['key-value'] = null;
+ }
+ for (let x = 0; x < sourceObject.length; x++) {
+ obj['response-keys'][x]['key-name'] = sourceObject[x]['key-name'];
+ obj['response-keys'][x]['key-value'] = sourceObject[x]['key-value'];
+ }
+ }
+
+ }
+
+ //========================== End of ruleTypeChanged() Method============================================
+ filetrByFieldChanged(data, obj) {
+ if (data == null || data == undefined || data == 'null') {
+ obj.enableFilterByValue = false;
+ obj['response-keys'][4]['key-value'] = null;
+ } else {
+ obj.enableFilterByValue = true;
+ }
+
+ }
+
+
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.css b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.css
new file mode 100644
index 0000000..7c075eb
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.html b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.html
new file mode 100644
index 0000000..6668ed1
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.html
@@ -0,0 +1,24 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.spec.ts b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.spec.ts
new file mode 100644
index 0000000..2ab9fd8
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.spec.ts
@@ -0,0 +1,49 @@
+/**
+ ============LICENSE_START==========================================
+ ===================================================================
+ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+ ===================================================================
+
+ Unless otherwise specified, all software contained herein is licensed
+ under the Apache License, Version 2.0 (the License);
+ you may not use this software except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+ ECOMP is a trademark and service mark of AT&T Intellectual Property.
+ ============LICENSE_END============================================
+ */
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {ParameterHolderComponent} from './parameter-holder.component';
+
+describe('ParameterHolderComponent', () => {
+ let component: ParameterHolderComponent;
+ let fixture: ComponentFixture<ParameterHolderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ParameterHolderComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ParameterHolderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.ts b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.ts
new file mode 100644
index 0000000..73c9aa1
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-holder/parameter-holder.component.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-parameter-holder',
+ templateUrl: './parameter-holder.component.html',
+ styleUrls: ['./parameter-holder.component.css']
+})
+export class ParameterHolderComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.css b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.css
new file mode 100644
index 0000000..9d63aa1
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.css
@@ -0,0 +1,21 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.html b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.html
new file mode 100644
index 0000000..2dc338f
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.html
@@ -0,0 +1,22 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ -->
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.spec.ts b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.spec.ts
new file mode 100644
index 0000000..ffada5d
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.spec.ts
@@ -0,0 +1,48 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {ReferenceDataHolderComponent} from './reference-data-holder.component';
+
+describe('ReferenceDataHolderComponent', () => {
+ let component: ReferenceDataHolderComponent;
+ let fixture: ComponentFixture<ReferenceDataHolderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ReferenceDataHolderComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ReferenceDataHolderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.ts b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.ts
new file mode 100644
index 0000000..878b4dd
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-data-holder/reference-data-holder.component.ts
@@ -0,0 +1,37 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-reference-data-holder',
+ templateUrl: './reference-data-holder.component.html',
+ styleUrls: ['./reference-data-holder.component.css']
+})
+export class ReferenceDataHolderComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.css b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.css
new file mode 100644
index 0000000..1b4c470
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.css
@@ -0,0 +1,137 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.form-group {
+ padding: 5px
+}
+
+.panel {
+ margin-top: 20px;
+}
+
+.form-control {
+ width: 100%;
+}
+
+.panel-header {
+ padding: 20px 0px;
+}
+
+.container {
+ border-radius: 0.375rem;
+ transition: all 0.3s ease;
+ padding: 40px;
+}
+
+.container2 {
+ box-shadow: -4px 14px 20px 0px rgba(46, 61, 73, 0.15);
+ border-radius: 0.375rem;
+ transition: all 0.3s ease;
+ padding: 10px;
+ margin-top: 57px;
+}
+
+.error-message {
+ color: red;
+}
+
+.create-wrapper {
+ text-align: left;
+}
+
+.removevnfcClass {
+ text-align: right;
+}
+
+.form-custom-group {
+ margin-bottom: 0;
+ vertical-align: middle;
+}
+
+.side-by-side {
+ position: relative;
+}
+
+.sidebtn {
+ position: absolute;
+ left: 26.5em;
+ top: 0em;
+}
+
+.clear-control {
+ margin: 40px 20px;
+ display: inherit;
+}
+
+.short-column {
+ width: 100px;
+}
+
+.long-column {
+ width: 200px;
+}
+
+th,
+td {
+ min-width: 150px;
+}
+
+.headlinesInBold {
+ font-weight: bold;
+}
+
+.titleCustom {
+ padding-left: 25px;
+ overflow: visible;
+}
+
+.anchorHover {
+ cursor: pointer;
+}
+
+.custom-btn {
+ margin-top: 20px;
+ margin-bottom: 10px;
+}
+
+.clear-btn {
+ margin-top: 23px;
+}
+
+.col-md-button {
+ margin: auto;
+ margin-right: 20px;
+ text-align: center;
+ margin-bottom: 15px;
+}
+
+.selectedAction {
+ /* change here */
+ font-weight: bold;
+ color: #1A86E4
+}
+
+.file {
+ visibility: hidden;
+ position: absolute;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html
new file mode 100644
index 0000000..d38620a
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.html
@@ -0,0 +1,354 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+ [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+<form class="" novalidate #userForm="ngForm" (ngSubmit)="save(userForm.value,userForm.valid)">
+ <div class="card">
+
+ <div class="card-block" style=" border-top: 5px solid #6ab344; border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="row" style="padding: 15px 25px">
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Action*</label>
+ <select class="form-control" required id="cmbAction" [(ngModel)]="referenceDataObject.action" (ngModelChange)="updateSessionValues($event,'action');actionChange($event,content,userForm);"
+ #action="ngModel" name="action">
+ <option [value]="actionType"
+ [ngClass]="{'selectedAction':selectedActions.indexOf(actionType)>-1}"
+ [selected]="referenceDataObject.action===actionType"
+ *ngFor="let actionType of actions ">{{actionType}}
+ </option>
+ </select>
+
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>VNF Type* </label>
+ <input type="text" [readonly]="updateParams !='undefined' || vnfParams?.vnfType " class="form-control" id="txtVnfType" required [(ngModel)]="referenceDataObject['scope']['vnf-type']"
+ (ngModelChange)="updateSessionValues($event,'vnfType')" #vnftype="ngModel" name="vnftype">
+ <span class="error-message" [hidden]="vnfParams?.vnfType || vnftype.valid || (vnftype.pristine && !userForm.submitted)">Required Field</span>
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>VNFC Type</label>
+ <input type="text" class="form-control" [disabled]="nonConfigureAction || updateParams !='undefined' || vnfParams?.vnfType" id="txtVnfcType" [(ngModel)]="referenceDataObject.scope['vnfc-type']"
+ (blur)="setVnfcType($event.target.value)" (ngModelChange)="updateSessionValues($event,'vnfcType')" #vnfcType="ngModel" name="vnfcType"
+ disabled="disabled">
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Device Protocol*</label>
+ <select class="form-control" required id="txtDeviceProtocol" [(ngModel)]="referenceDataObject['device-protocol']" #deviceProtocol="ngModel" name="deviceProtocol">
+ <option [value]="device" [selected]="referenceDataObject.deviceProtocol===device"
+ *ngFor="let device of deviceProtocols">{{device}}
+ </option>
+ </select>
+
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="referenceDataObject['action']== 'ConfigScaleOut'">
+ <label>Template Identifier</label>
+ <select class="form-control" required id="tempIdentifier" (ngModelChange)="dataModified()" [(ngModel)]="templateIdentifier" #deviceProtocol="ngModel" name="templateIdentifier">
+ <option [value]="val" *ngFor="let val of referenceDataObject['template-id-list']">{{val}}
+ </option>
+ </select>
+ <span class="error-message" [hidden]="deviceProtocol.valid || (deviceProtocol.pristine && !userForm.submitted)">Required Field</span>
+ </div>
+
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12" *ngIf="referenceDataObject['action']== 'ConfigScaleOut'" style="margin-top: 30px">
+ <span *ngIf="referenceDataObject.action === 'ConfigScaleOut'"> <a style=" color: blue;"
+ href="javascript:void(0)"
+ (click)="showIdentifier()">Assign New Template Identifier</a></span>
+
+ </div>
+ </div>
+ <div class="col-12" *ngIf="!(referenceDataObject.action === 'OpenStack Actions')">
+ <div class="input-group">
+ <input id="inputFile" class="file" #myInput type='file' (change)="fileChange($event)">
+ <input [(ngModel)]="fileName" type="text" class="input-lg" disabled placeholder="Upload Reference File from PC" name="browse" style="width:80%">
+ <button (click)="browseOption($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg" type="button">Upload Reference File
+ </button>
+ </div>
+ </div>
+ <div class="col-12" *ngIf="referenceDataObject.action === 'OpenStack Actions'">
+ <div class="input-group">
+ <input id="excelInputFile" #myInput1 class="file" type="file" (change)="upload($event)">
+ <input [(ngModel)]="uploadFileName" type="text" class="input-lg" disabled placeholder="Upload VM Capabilities File" name="uploadFileName" style="width:80%">
+ <button (click)="excelBrowseOption($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+ type="button">Upload VM Capabilities File
+ </button>
+ </div>
+ </div>
+ </div>
+ <div class="card-block" style="padding: 10px">
+ <div>
+ <div class="create-wrapper" style="padding: 0px 25px">
+ <div class="row" style="margin-bottom: 30px">
+ <div class=" col-6">
+
+ </div>
+ <div class="text-right col-6">
+ <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" type="submit">Download All To PC
+ </button>  
+ <button id="saveToAppc" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" type="button" (click)="saveToAppc(userForm.valid, userForm)">Save All to APPC
+ </button>  
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-12">
+ <div class="row" *ngIf="!(referenceDataObject.action === 'OpenStack Actions')">
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label>Template</label>
+ <select class="form-control" id="txtDeviceProtocol" [(ngModel)]="referenceDataObject['template']" #template="ngModel" name="template">
+ <option [value]="template" *ngFor="let template of deviceTemplates">
+ {{template}}
+ </option>
+ </select>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label>User Name</label>
+ <input type="text" class="form-control" id="txtIpaddress" [(ngModel)]="referenceDataObject['user-name']" name="loginUserName">
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label>Port Number</label>
+ <input type="text" class="form-control" id="txtIpaddress" [(ngModel)]="referenceDataObject['port-number']" name="portNumber">
+ </div>
+ <div *ngIf="actionHealthCheck && referenceDataObject['device-protocol'] =='REST' " class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Context Url</label>
+ <input type="text" class="form-control" id="txtIpaddress" [(ngModel)]="referenceDataObject['context-url']" name="portNumber">
+ </div>
+ </div>
+ <div class="card-block" *ngIf="(referenceDataObject.action =='ConfigScaleOut' || referenceDataObject.action =='Configure'|| referenceDataObject.action =='' || referenceDataObject.action ==undefined)"
+ style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="col-12">
+ <h5 style="margin-top: 0.5rem;font-family: Roboto"> VNFC Information
+ <span class="pull-right">
+ <i (click)="isCollapsedContent = !isCollapsedContent"
+ [ngClass]="{'fa-minus-circle':isCollapsedContent,'fa-plus-circle':!isCollapsedContent}"
+ class="fa" aria-hidden="true"></i>
+ </span>
+ </h5>
+ </div>
+ </div>
+ <div class="row" *ngIf="(( referenceDataObject.action =='ConfigScaleOut' ||referenceDataObject.action =='Configure'|| referenceDataObject.action =='' || referenceDataObject.action ==undefined ) && isCollapsedContent) ">
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">VNFC Type*</label>
+ <input type="text" class="form-control" id="txtVnfcTypeInColl" [(ngModel)]="Sample['vnfc-type']" #vnfcType="ngModel" name="samplevnfcType">
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px">VNFC Function Code*</label>
+ <input type="text" class="form-control" id="txtVnfcFunctionCode" [(ngModel)]="Sample['vnfc-function-code']" #vnfcFunctionCode="ngModel" name="samplevnfcFunctionCode">
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">IPAddress V4 OAM VIP</label>
+ <select class="form-control" id="cmbIpAddedBoo" [(ngModel)]="Sample['ipaddress-v4-oam-vip']" name="sampleIpaddress">
+ <option [value]="hasIp" *ngFor="let hasIp of ipAddressBoolean">{{hasIp}}
+ </option>
+ </select>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">Group Notation Type</label>
+ <select class="form-control" id="cmbGroupType" [(ngModel)]="Sample['group-notation-type']" name="sampleGroupNotation">
+ <option [value]="type" *ngFor="let type of groupAnotationType">{{type}}</option>
+ </select>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">Group Notation Value</label>
+ <input type="text" class="form-control" id="txtGroupValue" [(ngModel)]="Sample['group-notation-value']" name="sampleGroupValue">
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent clear-btn" (click)="clearVnfcData()">Clear VNFC Info
+ </button>
+ </div>
+ </div>
+ <hr>
+ <div *ngIf="(referenceDataObject.action =='ConfigScaleOut' || referenceDataObject.action =='Configure'|| referenceDataObject.action =='' )" class="row">
+ <div class="col-lg-2 col-md-2 hdden-sm-down">
+ <label style="margin-top: 17px;" class="headlinesInBold"> Number Of VM(s): </label>
+ </div>
+ <div class="col-lg-5 col-md-5 col-sm-6 col-xs-6">
+ <div class="form-group">
+ <input type="text" placeholder="Number of VM(s)" class="form-control" id="txtVmnumber22" [(ngModel)]="refernceScopeObj.from" (ngModelChange)="numberValidation($event)"
+ name="txtNumber23">
+ </div>
+ </div>
+ <div class="col-lg-5 col-md-5 col-sm-6 col-xs-6 text-right">
+ <div class="form-group">
+ <button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" type="button" [disabled]="!refernceScopeObj.from || !numberOfVmTest"
+ (click)="addVms()">Add VM Information
+ </button>
+ </div>
+ </div>
+ </div>
+ <div *ngIf="referenceDataObject.vm?.length>0">
+ <div class="row" *ngFor="let noOfvm of referenceDataObject.vm | vmFiltering:referenceDataObject?.action:templateIdentifier; let j=index">
+ <div *ngIf="((referenceDataObject.action =='ConfigScaleOut' || referenceDataObject.action =='Configure'|| referenceDataObject.action =='' || referenceDataObject.action ==undefined ))"
+ class="col-12">
+ <div class="row" *ngFor="let item of noOfvm.vnfc; let i=index">
+ <div class="col-md-12" *ngIf="i==0">
+ <h5 class="headlinesInBold">VM Number: {{j+1}}</h5>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">VNFC Instance No.</label>
+ <input type="text" class="form-control" id="txtVmnumber" disabled='true' [(ngModel)]="item['vnfc-instance']" name="vmNumber{{j}}">
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">VNFC Type*</label>
+ <input type="text" class="form-control" id="txtVnfcTypeInColl" required [(ngModel)]="item['vnfc-type']" #vnfcType="ngModel" name="vnfcType{{j}}">
+ <span class="error-message" [hidden]="vnfcType.valid || (vnfcType.pristine && !userForm.submitted)">Required Field</span>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">VNFC Function Code*</label>
+ <input type="text" class="form-control" id="txtVnfcFunctionCode" required [(ngModel)]="item['vnfc-function-code']" #vnfcFunctionCode="ngModel" name="vnfcFunctionCode{{j}}">
+ <span class="error-message" [hidden]="vnfcFunctionCode.valid || (vnfcFunctionCode.pristine && !userForm.submitted)">Required Field</span>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">IPAddress V4 OAM VIP</label>
+ <select class="form-control" id="cmbIpAddress" [(ngModel)]="item['ipaddress-v4-oam-vip']" name="ipaddress{{j}}">
+ <option [value]="hasIP" [selected]="item.ipAddressBoolean===hasIP"
+ *ngFor="let hasIP of ipAddressBoolean">{{hasIP}}
+ </option>
+ </select>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">Group Notation Type</label>
+ <select class="form-control" id="cmbGroupType" [(ngModel)]="item['group-notation-type']" name="selectedGroupType{{j}}">
+ <option [value]="type" [selected]="item.groupNotationType===type"
+ *ngFor="let type of groupAnotationType">{{type}}
+ </option>
+ </select>
+ </div>
+ <div class="col-lg-2 col-sm-6 col-md-2 col-xs-12">
+ <label style="font-size:12px;">Group Notation Value</label>
+ <input type="text" class="form-control" id="txtGroupValue" [(ngModel)]="item['group-notation-value']" name="selectedGroupValue{{j}}">
+ </div>
+ <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
+ <div class="removevnfcClass" *ngIf="refernceScopeObj.sourceType !='vnfcType'">
+ <a role="button" style="color: white" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="removeFeature(j,i)">Remove Vm</a>
+ </div>
+ <div>
+ <a *ngIf="(referenceDataObject.vm[j].vnfc.length-1) == i " [hidden]="true" role="button" (click)="addVnfcData(j)">Add VNFC
+ Information</a>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="row" *ngIf="(referenceDataObject.action === 'OpenStack Actions')">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+ <div class="table-responsive" style="height:auto; overflow: auto;">
+ <table>
+ <thead>
+ <tr>
+ <td *ngFor="let item of firstArrayElement">
+ <div>
+ <h1 style="font-size: 110%"> {{item}} </h1>
+ </div>
+ </td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let item of remUploadedDataArray; let i=index">
+ <td *ngFor="let subItem of item; let j=index">
+ {{subItem}}
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</form>
+<!-- Modal -->
+<div id="messageModal" class="modal fade" role="dialog">
+ <div class="modal-dialog">
+ <!-- Modal content-->
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="android-more-button mdl-button mdl-js-button mdl-button--accent" data-dismiss="modal">×
+ </button>
+ <h4 class="modal-title">Warning</h4>
+ </div>
+ <div class="modal-body">
+ <div *ngIf="allowAction==false" class="alert alert-danger">
+ <b> Configure </b> action not yet saved
+ </div>
+ <div *ngIf="actionExist" class="alert alert-danger">
+ <b> {{referenceDataObject.action}}</b> already exists. Please continue...
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="close" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" data-dismiss="modal">Close
+ </button>
+ </div>
+ </div>
+ </div>
+</div>
+<div id="identifierModal" class="modal fade" role="dialog">
+ <div class="modal-dialog">
+ <!-- Modal content-->
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="android-more-button mdl-button mdl-js-button mdl-button--accent" data-dismiss="modal">×
+ </button>
+ <h4 class="modal-title">Enter New Template Identifier</h4>
+ </div>
+ <div class="modal-body">
+ <div>
+ <div>
+ <input name="test" type="text" class="" [(ngModel)]="templateId" placeholder="identifier">
+ </div>
+ <div>
+ <button style="padding: 10px" class="btn btn-primary" data-dismiss="modal" (click)="addToIdentDrp()">submit
+ </button>
+ <button style="padding: 10px" class="btn btn-primary" (click)="templateId=''" data-dismiss="modal">cancel
+ </button>
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+
+ </div>
+ </div>
+ </div>
+</div>
+<ng-template #content let-c="close" let-d="dismiss">
+ <div class="modal-header">
+ <h6 class="modal-title">Save all changes for current action to APPC database.</h6>
+ <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+ <div class="modal-body">
+ <p>Do you want to save the changes?</p>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="c('no')">No
+ </button>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="c('yes')">Yes
+ </button>
+ </div>
+</ng-template>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.spec.ts b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.spec.ts
new file mode 100644
index 0000000..67ba8f5
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.spec.ts
@@ -0,0 +1,67 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {ReferenceDataformComponent} from './reference-dataform.component';
+import {FormsModule} from '@angular/forms';
+import { NotificationService } from '../../../shared/services/notification.service';
+import { ParamShareService } from '../../..//shared/services/paramShare.service';
+import { MappingEditorService } from '../../..//shared/services/mapping-editor.service';
+import {DialogService} from 'ng2-bootstrap-modal';
+import {RouterTestingModule} from '@angular/router/testing';
+import { HttpUtilService } from '../../../shared/services/httpUtil/http-util.service';
+import { NgModule } from '@angular/core';
+import { NgProgress } from 'ngx-progressbar';
+import { HttpModule } from '@angular/http';
+import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import { SharedModule } from '../../../shared/shared.module';
+
+
+describe('ReferenceDataformComponent', () => {
+ let component: ReferenceDataformComponent;
+ let fixture: ComponentFixture<ReferenceDataformComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ReferenceDataformComponent],
+ schemas: [NO_ERRORS_SCHEMA],
+ imports: [FormsModule, RouterTestingModule,HttpModule,NgbModule.forRoot()],
+ providers: [NgProgress, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService]
+
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+
+ fixture = TestBed.createComponent(ReferenceDataformComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create reference component', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts
new file mode 100644
index 0000000..c66a003
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/reference-dataform/reference-dataform.component.ts
@@ -0,0 +1,1242 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+import * as XLSX from 'xlsx';
+import * as _ from 'underscore';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { BuildDesignComponent } from '../build-artifacts.component';
+import { HttpUtilService } from '../../../shared/services/httpUtil/http-util.service';
+import { Location } from '@angular/common';
+import { MappingEditorService } from '../../..//shared/services/mapping-editor.service';
+import { ModalComponent } from '../../../shared/modal/modal.component';
+import { NotificationService } from '../../../shared/services/notification.service';
+import { NotificationsService } from 'angular2-notifications';
+import { ParamShareService } from '../../..//shared/services/paramShare.service';
+import { environment } from '../../../../environments/environment';
+import { saveAs } from 'file-saver';
+import { NgProgress } from 'ngx-progressbar';
+
+
+declare var $: any;
+type AOA = Array<Array<any>>;
+
+@Component({
+ selector: 'reference-dataform',
+ templateUrl: './reference-dataform.component.html',
+ styleUrls: ['./reference-dataform.component.css']
+})
+export class ReferenceDataformComponent implements OnInit {
+ @ViewChild(ModalComponent) modalComponent: ModalComponent;
+ public showUploadStatus: boolean = false;
+ public fileUploaded: boolean = false;
+ public uploadedData: any;
+ public statusMsg: string;
+ public uploadStatus: boolean = false;
+ public isCollapsedContent: boolean = true;
+ public vnfcCollLength: number = 0;
+ public vfncCollection = [];
+ public userForm: any;
+ public actionType: any;
+ numberTest: RegExp = /^[^.a-z]+$/;
+ public numberOfVmTest: boolean = true;
+ public tempAllData = [];
+ public noRefData = false;
+ public disableRetrieve = false;
+ public getRefStatus = false;
+ public uploadStatusError: boolean;
+ public showUploadErrorStatus: boolean;
+ public noData: string;
+ selectedActions = [];
+ public appData = { reference: {}, template: { templateData: {}, nameValueData: {} }, pd: {} };
+ public downloadData = {
+ reference: {},
+ template: { templateData: {}, nameValueData: {}, templateFileName: '', nameValueFileName: '' },
+ pd: { pdData: '', pdFileName: '' }
+ };
+ fileName: any;
+ public uploadFileName: any;
+ public addVmClickedFlag: boolean = false;
+ public getExcelUploadStatus: boolean = false;
+ public uploadedDataArray: any;
+ public actionFlag = false;
+ currentAction: any;
+ oldAction: any;
+ nonConfigureAction: any;
+ templateId;
+ templateIdentifier;
+ public actionLevels = [
+ 'vnfc', 'vnf'
+ ];
+
+ identifierDrp: any;
+ identifierDrpValues: any = [];
+ //settings for the notifications.
+ options = {
+ timeOut: 1000,
+ showProgressBar: true,
+ pauseOnHover: true,
+ clickToClose: true,
+ maxLength: 200
+ };
+ //initializing this object to contain all the parameters to be captured
+ public referenceDataObject = {
+ action: '',
+ 'action-level': 'vnf',
+ scope: { 'vnf-type': '', 'vnfc-type': '' },
+ 'template': 'Y',
+ vm: [],
+ 'device-protocol': '',
+ 'user-name': '',
+ 'port-number': '',
+ 'artifact-list': []
+ };
+ public refernceScopeObj = { sourceType: '', from: '', to: '' };
+ public actions = ['', 'Configure', 'ConfigModify', 'ConfigBackup', 'ConfigRestore', 'GetRunningConfig', 'HealthCheck', 'StartApplication', 'StopApplication', 'QuiesceTraffic', 'ResumeTraffic', 'UpgradeBackout', 'UpgradeBackup', 'UpgradePostCheck', 'UpgradePreCheck', 'UpgradeSoftware', 'OpenStack Actions', 'ConfigScaleOut'];
+ public groupAnotationValue = ['', 'Pair'];
+ public groupAnotationType = ['', 'first-vnfc-name', 'fixed-value', 'relative-value'];
+ public deviceProtocols = ['', 'ANSIBLE', 'CHEF', 'NETCONF-XML', 'REST', 'CLI', 'RESTCONF'];
+ public deviceTemplates = ['', 'Y', 'N'];
+ public sourceTypeColl = ['', 'vnfType', 'vnfcType'];
+ public ipAddressBoolean = ['', 'Y', 'N'];
+ public Sample: any = {
+ 'vnfc-instance': '1',
+ 'vnfc-function-code': '',
+ 'ipaddress-v4-oam-vip': '',
+ 'group-notation-type': '',
+ 'group-notation-value': ''
+ };
+ hideModal: boolean = false;
+ public self: any;
+ public uploadTypes = [{
+ value: 'Reference Data',
+ display: 'Sample Json Param File'
+ },
+ {
+ value: 'Mapping Data',
+ display: 'Sample Json Param File'
+ }
+ ];
+ public selectedUploadType: string = this.uploadTypes[0].value;
+ public vnfcTypeData: string = '';
+ public title: string;
+ public allowAction: boolean = true;
+ public actionExist: boolean = false;
+ public disableVnftype: boolean = false;
+ public otherActions: boolean = false;
+ public actionHealthCheck: boolean = false;
+ public actionChanged: boolean = false;
+ public initialAction: string = '';
+ public noCacheData: boolean;
+ public updateParams: any;
+ public vnfParams: any;
+ public firstArrayElement = [];
+ public remUploadedDataArray = [];
+
+ constructor (private buildDesignComponent: BuildDesignComponent, private httpUtils: HttpUtilService, private route: Router, private location: Location, private activeRoutes: ActivatedRoute, private notificationService: NotificationService,
+ private paramShareService: ParamShareService, private mappingEditorService: MappingEditorService, private modalService: NgbModal, private nService: NotificationsService, private ngProgress: NgProgress) {
+ }
+
+ ngOnInit() {
+ this.self = this;
+ let path = this.location.path;
+ this.title = 'Reference Data';
+ this.referenceDataObject = {
+ action: '',
+ 'action-level': 'vnf',
+ scope: { 'vnf-type': '', 'vnfc-type': '' },
+ 'template': 'Y',
+ vm: [],
+ 'device-protocol': '',
+ 'user-name': '',
+ 'port-number': '',
+ 'artifact-list': []
+ };
+ this.updateParams = sessionStorage.getItem('updateParams');
+ let cacheData = this.mappingEditorService.referenceNameObjects;
+ if (cacheData != undefined && cacheData != null && cacheData.length > 0) {
+ this.tempAllData = cacheData;
+ if (this.mappingEditorService.latestAction != undefined) {
+ this.referenceDataObject = this.mappingEditorService.latestAction;
+ //this.referenceDataObject['template-id-list'] = this.mappingEditorService.identifier
+ //use these commented objects to be used in template and pd pages
+ //this.templateIdentifier = this.mappingEditorService.identifier
+ this.refernceScopeObj.sourceType = this.referenceDataObject['scopeType'];
+ this.oldAction = this.referenceDataObject.action;
+ this.populateExistinAction(this.referenceDataObject.action);
+ }
+ } else if (this.updateParams != 'undefined') {
+ this.getArtifact();
+ }
+ var appData = this.mappingEditorService.appDataObject;
+ if (appData != null || appData != undefined) this.appData = appData;
+ var downloadData = this.mappingEditorService.downloadDataObject;
+ if (downloadData != null || downloadData != undefined) this.downloadData = downloadData;
+ this.vnfParams = JSON.parse(sessionStorage.getItem('vnfParams'));
+ if (this.vnfParams && this.vnfParams.vnfType) {
+ this.referenceDataObject['scope']['vnf-type'] = this.vnfParams.vnfType;
+ }
+ if (this.vnfParams && this.vnfParams.vnfcType) {
+ this.referenceDataObject['scope']['vnfc-type'] = this.vnfParams.vnfcType;
+ }
+ this.uploadedDataArray = [];
+ this.remUploadedDataArray = [];
+ this.firstArrayElement = [];
+ this.uploadFileName = '';
+ this.templateIdentifier = this.mappingEditorService.identifier
+ //this.tempAllData = [];
+ }
+
+ //to retrive the data from appc and assign it to the vaiables, if no data display the message reterived from the API
+ getArtifact() {
+ try {
+ let payload = JSON.parse(sessionStorage.getItem('updateParams'));
+ payload['userID'] = localStorage['userId'];
+ payload = JSON.stringify(payload);
+ let data = {
+ 'input': {
+ 'design-request': {
+ 'request-id': localStorage['apiToken'],
+ 'action': 'getArtifact',
+ 'payload': payload
+ }
+ }
+ };
+ this.ngProgress.start();
+ this.httpUtils.post({
+ url: environment.getDesigns,
+ data: data
+ }).subscribe(resp => {
+ if (resp.output.data.block != undefined) {
+ this.nService.success('Status', 'data fetched ');
+ let artifactInfo = JSON.parse(resp.output.data.block).artifactInfo[0];
+ let reference_data = JSON.parse(artifactInfo['artifact-content'])['reference_data'][0];
+ this.referenceDataObject = reference_data;
+ console.log('reference data obj==' + JSON.stringify(this.referenceDataObject));
+ this.refernceScopeObj.sourceType = this.referenceDataObject['scopeType'];
+ this.mappingEditorService.getReferenceList().push(JSON.parse(artifactInfo['artifact-content']));
+ this.tempAllData = JSON.parse(artifactInfo['artifact-content'])['reference_data'];
+ this.oldAction = this.referenceDataObject.action;
+ if (this.referenceDataObject.action === 'OpenStack Actions') {
+ this.deviceProtocols = ['', 'OpenStack'];
+ this.buildDesignComponent.tabs = [
+ {
+
+ name: 'Reference Data',
+ url: 'references',
+ }];
+ }
+ else {
+ this.buildDesignComponent.tabs = [
+ {
+ name: 'Reference Data',
+ url: 'references',
+ }, {
+ name: 'Template',
+ url: 'templates/myTemplates',
+ }, {
+ name: 'Parameter Definition',
+ url: 'parameterDefinitions/create'
+ }/*, {
+ name: "Test",
+ url: 'test',
+ }*/
+ ];
+ }
+ console.log('tempalldata===' + JSON.stringify(this.tempAllData));
+ } else {
+ this.nService.success('Status', 'Sorry !!! I dont have any artifact Named : ' + (JSON.parse(payload))['artifact-name']);
+ }
+ this.ngProgress.done();
+ });
+ }
+ catch (e) {
+ this.nService.warn('status', 'error while reteriving artifact');
+ }
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+ //reinitializing the required values
+ ngOnDestroy() {
+ let referenceObject = this.prepareReferenceObject();
+ this.mappingEditorService.changeNavAppData(this.appData);
+ this.mappingEditorService.changeNavDownloadData(this.downloadData);
+ this.uploadedDataArray = [];
+ this.remUploadedDataArray = [];
+ this.firstArrayElement = [];
+ this.uploadFileName = '';
+ // this.tempAllData = [];
+ console.log('temp all data===' + JSON.stringify(this.tempAllData));
+ }
+
+ numberValidation(event: any) {
+ // console.log(this.numberTest.test(event));
+ if (this.numberTest.test(event) && event != 0) {
+ this.numberOfVmTest = true;
+ }
+ else {
+ this.numberOfVmTest = false;
+ }
+ }
+
+ updateSessionValues(event: any, type: string) {
+ if (type === 'action') {
+ sessionStorage.setItem('action', event);
+ }
+ if (type === 'vnfType') {
+ sessionStorage.setItem('vnfType', event);
+ }
+ }
+
+ checkConfigure(data) {
+ if (data == null) {
+ return;
+ }
+ if (this.fileUploaded && this.actionType == 'update') {
+ let refObject = this.uploadedData.find(obj => {
+ return obj.action == data;
+ });
+ this.referenceDataObject = JSON.parse(JSON.stringify(refObject));
+ if (data == 'HealthCheck') {
+ //show additional fileds user name port number and others
+ this.actionHealthCheck = true;
+ } else {
+ this.actionHealthCheck = false;
+ if (data == 'StartApplication' || data == 'StopApplication') {
+ this.disableVnftype = true;
+ } else {
+
+ this.otherActions = true;
+ }
+ }
+ return;
+ }
+ this.buildDesignComponent.updateAccessUpdatePages(data, this.mappingEditorService.getReferenceList());
+ let configureObject = _.find(this.tempAllData, function (obj) {
+ return obj['action'] == 'Configure';
+ });
+ if (data != 'Configure') {
+ if (!configureObject) {
+ this.allowAction = false;
+ $('#messageModal').modal();
+ } else {
+ this.allowAction = true;
+ }
+ if (this.referenceDataObject.action == 'Configure') {
+ this.allowAction = true;
+ }
+ }
+ //dont allow any action second time
+ let y = _.find(this.tempAllData, function (obj) {
+ return obj['action'] == data;
+ });
+ if (y) {
+ this.actionExist = true;
+ $('#messageModal').modal();
+ } else {
+ this.actionExist = false;
+ }
+ //populate configure values for other actions
+ if (data != 'Configure' && configureObject != undefined) {
+ if (data == 'HealthCheck') {
+ //show additional fileds user name port number and others
+ this.actionHealthCheck = true;
+ } else {
+ this.actionHealthCheck = false;
+ if (data == 'StartApplication' || data == 'StopApplication') {
+ this.disableVnftype = true;
+ } else {
+ this.otherActions = true;
+ }
+ }
+ this.referenceDataObject.scope['vnf-type'] = configureObject['scope']['vnf-type'];
+ this.referenceDataObject.scope['vnfc-type'] = configureObject['scope']['vnfc-type'];
+ this.referenceDataObject['device-protocol'] = configureObject['device-protocol'];
+ this.refernceScopeObj['sourceType'] = configureObject['scopeType'];
+ } else {
+ this.actionHealthCheck = false;
+ this.otherActions = false;
+ this.disableVnftype = false;
+ }
+ //set default values for further actions
+ }
+
+ addVnfcData(vmNumber: number) {
+ var newObj = {
+ 'vnfc-instance': this.referenceDataObject.vm[vmNumber].vnfc.length + 1,
+ 'vnfc-type': this.vnfcTypeData,
+ 'vnfc-function-code': '',
+ 'ipaddress-v4-oam-vip': '',
+ 'group-notation-type': '',
+ 'group-notation-value': ''
+ };
+ this.referenceDataObject.vm[vmNumber].vnfc.push(newObj);
+ }
+
+ //to remove the VM's created by the user
+ removeFeature(vmNumber: any, index: any) {
+ this.referenceDataObject.vm.splice(vmNumber, 1);
+ }
+
+ //add new VM's to the configure
+ addVms() {
+ let arr = [];
+ var vnfcObj = JSON.parse(JSON.stringify(this.Sample));
+ let mberOFVm = Number(this.refernceScopeObj.from);
+ let arrlength = this.referenceDataObject.vm.length;
+ mberOFVm = arrlength + mberOFVm;
+ for (var i = (arrlength); i < mberOFVm; i++) {
+ if (this.referenceDataObject.action == 'ConfigScaleOut') {
+ arr.push({ 'template-id': this.templateIdentifier, 'vm-instance': (i + 1), vnfc: [Object.assign({}, this.Sample)] });
+ } else {
+ arr.push({ 'vm-instance': (i + 1), vnfc: [Object.assign({}, this.Sample)] });
+ }
+
+ }
+ //this.referenceDataObject.vm.splice(arrlength, 0, ...arr);
+ this.referenceDataObject.vm = this.referenceDataObject.vm.concat(arr); //splice(arrlength, 0, ...arr);
+ }
+
+ //Reference object to create reference data
+ prepareReferenceObject() {
+ // console.log("this temp all data before=="+ JSON.stringify(this.tempAllData))
+
+ this.referenceDataObject['artifact-list'] = [];
+ let scopeName = '';
+ //if only vnf is there
+ if (this.referenceDataObject.scope['vnfc-type'] == '' || this.referenceDataObject.scope['vnfc-type'] == null || this.referenceDataObject.scope['vnfc-type'] == 'null') {
+ scopeName = this.referenceDataObject.scope['vnf-type'];
+ this.referenceDataObject.scope['vnfc-type'] = '';
+ this.referenceDataObject['action-level'] = 'vnf';
+ this.referenceDataObject['scopeType'] = 'vnf-type';
+ }
+ //if VNFC is entered set action level & Scope type to VNFC for configure and configure modify, and default the values to vnf and vnf type for all other actions
+ else {
+ scopeName = this.referenceDataObject.scope['vnfc-type'];
+ if (this.referenceDataObject.action == 'Configure' || this.referenceDataObject.action == 'ConfigModify') {
+ this.referenceDataObject['action-level'] = 'vnfc';
+ this.referenceDataObject['scopeType'] = 'vnfc-type';
+ } else {
+ this.referenceDataObject['action-level'] = 'vnf';
+ this.referenceDataObject['scopeType'] = 'vnf-type';
+ }
+ }
+ //replacing / with _ and removing spaces in the scopeName
+ if (scopeName) {
+ scopeName = scopeName.replace(/ /g, '').replace(new RegExp('/', 'g'), '_').replace(/ /g, '');
+ }
+ //marking the extension based on the device-protocol selected by the user
+ let extension = 'json';
+ if (this.referenceDataObject['device-protocol'] == 'ANSIBLE' || this.referenceDataObject['device-protocol'] == 'CHEF' || this.referenceDataObject['device-protocol'] == 'CLI') {
+ extension = 'json';
+ } else if (this.referenceDataObject['device-protocol'] == 'NETCONF-XML' || this.referenceDataObject['device-protocol'] == 'REST') {
+ extension = 'xml';
+ }
+ //preparing the artifact list array file names along with extension
+ let config_template_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V.' + extension;
+ let pd_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V.yaml';
+ let reference_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V.json';
+
+ let configTemplate = {
+ 'artifact-name': 'template_' + config_template_fileName,
+ 'artifact-type': 'config_template'
+ };
+
+ let pdTemplate = {
+ 'artifact-name': 'pd_' + pd_fileName,
+ 'artifact-type': 'parameter_definitions'
+ };
+ if (this.referenceDataObject.action != 'ConfigScaleOut') {
+
+ this.referenceDataObject['artifact-list'].push(configTemplate,
+ pdTemplate
+ );
+
+ } else {
+ let identifiers = this.referenceDataObject['template-id-list'];
+ if (identifiers) {
+
+
+ for (var x = 0; x < identifiers.length; x++) {
+ pd_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V_' + identifiers[x] + '.yaml';
+ config_template_fileName = this.referenceDataObject.action + '_' + scopeName + '_' + '0.0.1V_' + identifiers[x] + '.' + extension;
+
+ configTemplate = {
+ 'artifact-name': 'template_' + config_template_fileName,
+ 'artifact-type': 'config_template'
+ };
+ pdTemplate = {
+ 'artifact-name': 'pd_' + pd_fileName,
+ 'artifact-type': 'parameter_definitions'
+ };
+ this.referenceDataObject['artifact-list'].push(configTemplate,
+ pdTemplate
+ );
+ }
+ }
+
+ }
+
+ if (this.referenceDataObject.scope['vnfc-type'] === '') {
+ this.referenceDataObject.scope['vnfc-type'] = '';
+ }
+ if (this.referenceDataObject.action === 'OpenStack Actions') {
+ this.referenceDataObject['template'] = 'N';
+ this.referenceDataObject['artifact-list'] = [];
+ }
+ let newObj = $.extend(true, {}, this.referenceDataObject);
+ let action = this.referenceDataObject.action;
+ let configureObject = (newObj.action == 'Configure');
+ let ConfigScaleOut = (newObj.action == 'ConfigScaleOut');
+ //delete VM's if selected action is configure.
+ if (!ConfigScaleOut && !configureObject && this.tempAllData.length != 0) {
+ // delete newObj.vm
+ newObj.vm = [];
+ //this.tempAllData.push(newObj);
+ } else {
+ if (ConfigScaleOut) {
+
+
+ // //add template identifier
+ // for(let x=0;x<newObj.vm.length;x++){
+ // let vmObj= newObj.vm[x]
+ // vmObj['template-id'] = this.templateIdentifier
+ // }
+ } else {
+ delete newObj['template-id-list'];
+ }
+ }
+ //remove artifact list if template is N
+ if (this.referenceDataObject.template == 'N') {
+ }
+ let actionObjIndex = this.tempAllData.findIndex(obj => {
+ return obj['action'] == action;
+ });
+ if (newObj.action != 'HealthCheck') {
+ delete newObj['context-url'];
+ }
+ if (actionObjIndex > -1) {
+ this.tempAllData[actionObjIndex] = newObj;
+ this.mappingEditorService.saveLatestAction(this.tempAllData[actionObjIndex]);
+ this.mappingEditorService.saveLatestIdentifier(this.templateIdentifier);
+ } else {
+ if (newObj.action != '') {
+ this.tempAllData.push(newObj);
+ this.mappingEditorService.saveLatestAction(newObj);
+ this.mappingEditorService.saveLatestIdentifier(this.templateIdentifier);
+ }
+ }
+ //Creating all action block to allow mulitple actions at once
+ let allAction = {
+ action: 'AllAction',
+ 'action-level': 'vnf',
+ scope: newObj.scope,
+ 'artifact-list': [{
+ 'artifact-name': 'reference_AllAction' + '_' + scopeName + '_' + '0.0.1V.json',
+ 'artifact-type': 'reference_template'
+ }]
+ };
+ let allActionIndex = this.tempAllData.findIndex(obj => {
+ return obj['action'] == 'AllAction';
+ });
+ if (allActionIndex > -1) {
+ this.tempAllData[allActionIndex] = allAction;
+ } else {
+ this.tempAllData.push(allAction);
+ }
+ console.log('This uploaded array===' + JSON.stringify(this.uploadedDataArray));
+ if (this.uploadedDataArray && this.uploadedDataArray != undefined && this.uploadedDataArray.length != 0) {
+ /*for (var i = 0; i < this.uploadedDataArray.length; i++) {
+ var actionData = this.uploadedDataArray[i][0];
+ // console.log("Action data=="+ actionData);
+ for (var j = 0; j < this.tempAllData.length; j++) {
+ //console.log("Actions from temp all data=="+ this.tempAllData[j].action)
+ //console.log("Matched=="+ (actionData === this.tempAllData[j].action))
+ if (actionData === this.tempAllData[j].action) {
+ this.tempAllData.splice(j,1);
+
+ }
+ }
+ }*/
+ if (this.tempAllData && this.tempAllData != undefined) {
+ for (var i = 0; i < this.tempAllData.length; i++) {
+ // alert(this.checkIfelementExistsInArray(this.tempAllData[i].action,this.actions))
+ var result = false;
+
+ if (this.tempAllData[i].action === 'AllAction') {
+ result = true;
+ }
+ else {
+ result = this.checkIfelementExistsInArray(this.tempAllData[i].action, this.actions);
+ }
+ if (!result) {
+ console.log('Removing VM action==' + this.tempAllData[i].action);
+ this.tempAllData.splice(i, 1);
+ i = i - 1;
+ }
+
+ }
+ }
+ this.addVmCapabilitiesData();
+ }
+ // console.log("this temp all data after=="+ JSON.stringify(this.tempAllData))
+ //console.log("temp all data from save to appc=="+JSON.stringify(this.tempAllData))
+ this.mappingEditorService.getReferenceList().push(JSON.parse(JSON.stringify(this.referenceDataObject)));
+ this.buildDesignComponent.updateAccessUpdatePages(this.referenceDataObject.action, this.mappingEditorService.getReferenceList());
+ this.mappingEditorService.changeNav(this.tempAllData);
+ return { totlaRefDtaa: this.tempAllData, scopeName: scopeName };
+ }
+
+ public checkIfelementExistsInArray(element, array) {
+ //console.log("Element==" + element)
+ var result: boolean = false;
+
+ array.forEach(function (item) {
+ // console.log("Item==" + item)
+ if (element === item) {
+ console.log('Element==' + element + 'Item==' + item);
+ result = true;
+ }
+ }
+ );
+ return result;
+ }
+
+ upload(evt: any) {
+ /* console.log("This uploaded array==" + JSON.stringify(this.uploadedDataArray))
+ // console.log("This template data before==" + JSON.stringify(this.tempAllData))
+ if (this.uploadedDataArray && this.uploadedDataArray != undefined && this.uploadedDataArray.length!=0) {
+ /* for (var i = 0; i < this.uploadedDataArray.length; i++) {
+ var action = this.uploadedDataArray[i][0];
+ for (var j = 0; j < this.tempAllData.length; j++) {
+ if (action === this.tempAllData[j].action) {
+ this.tempAllData.splice(j);
+ console.log("This template data===" + this.tempAllData[j]);
+ }
+ }
+ }
+ if (this.tempAllData && this.tempAllData != undefined) {
+ for (var i = 0; i < this.tempAllData.length; i++) {
+ // alert(this.checkIfelementExistsInArray(this.tempAllData[i].action,this.actions))
+ var result = this.checkIfelementExistsInArray(this.tempAllData[i].action, this.actions);
+ if (this.tempAllData[i].action === "AllAction") result = true;
+ if (!result) {
+ console.log("Removing VM action==" + this.tempAllData[i].action)
+ this.tempAllData.splice(i, 1);
+ }
+
+ }
+ }
+ }
+ // console.log("This template data after==" + JSON.stringify(this.tempAllData))
+ /* wire up file reader */
+ const target: DataTransfer = <DataTransfer>(evt.target);
+
+ //console.log("filename========" + evt.target.files[0].name)
+ this.uploadFileName = evt.target.files[0].name;
+ var fileExtension = this.uploadFileName.substr(this.uploadFileName.lastIndexOf('.') + 1);
+ if (target.files.length != 1) {
+ throw new Error('Cannot upload multiple files on the entry');
+ }
+ if (fileExtension.toUpperCase() === 'XLS' || fileExtension.toUpperCase() === 'XLSX') {
+ const reader = new FileReader();
+ reader.onload = (e: any) => {
+ /* read workbook */
+ const bstr = e.target.result;
+ // console.log("print 1---" + bstr);
+ const wb = XLSX.read(bstr, { type: 'binary' });
+ // console.log("print 2---" + JSON.stringify(wb));
+ /* grab first sheet */
+ const wsname = wb.SheetNames[0];
+ // console.log("Name:---" + wsname);
+ const ws = wb.Sheets[wsname];
+
+ /* save data */
+
+ let arrData = (<AOA>(XLSX.utils.sheet_to_json(ws, { header: 1 })));
+ //console.log("row======" + (XLSX.utils.sheet_to_json(ws, { header: 1 })).toString())
+ // console.log("Array data---" + JSON.stringify(arrData));
+ this.uploadedDataArray = arrData;
+ this.firstArrayElement = arrData[0];
+ var remUploadedDataArray = arrData;
+ remUploadedDataArray.shift();
+ this.remUploadedDataArray = remUploadedDataArray;
+ if (arrData != null) {
+ this.getExcelUploadStatus = true;
+ this.nService.success('Success', 'Vm capabilities data uploaded successfully');
+
+ }
+ else {
+ this.nService.success('Error', 'Empty Vm capabilities file uploaded');
+ }
+ };
+ reader.readAsBinaryString(target.files[0]);
+ console.log('TARGET files---' + JSON.stringify(evt.target));
+ }
+ else {
+ this.nService.error('Error', 'Incorrect VM capabilities file uploaded');
+ }
+
+ }
+
+ addVmCapabilitiesData() {
+ for (var i = 0; i < this.uploadedDataArray.length; i++) {
+ var vnfcFuncCodeArray = [];
+ var data = this.uploadedDataArray[i];
+ // console.log("Data is "+ JSON.stringify(data))
+ //console.log("Data length: "+ data.length)
+ for (var j = 1; j < data.length; j++) {
+ // console.log("Data " +j +" is "+ JSON.stringify(data[j]))
+ if (data[j] != undefined) {
+ if (data[j].toUpperCase() === 'Y') {
+ vnfcFuncCodeArray.push(this.firstArrayElement[j]);
+ //vnfcFuncCodeArray.push({name:this.firstArrayElement[j]});
+ }
+ }
+ }
+ var action = this.uploadedDataArray[i][0];
+ if (action && action != undefined) {
+ var json = {
+ 'action': action,
+ 'action-level': 'vm',
+ 'scope': {
+ 'vnf-type': this.referenceDataObject['scope']['vnf-type'], //need to confirm what should be this value
+ 'vnfc-type': null
+ },
+ 'vnfc-function-code-list': vnfcFuncCodeArray,
+ 'template': 'N',
+ 'device-protocol': 'OS'
+ };
+
+ this.tempAllData.push(json);
+ }
+
+ }
+ }
+
+ //download template
+ save(form: any, isValid: boolean) {
+ if (this.referenceDataObject.action === '') {
+ this.nService.error('Error', 'Select a valid Action');
+ return;
+ }
+ if (this.referenceDataObject['device-protocol'] === '') {
+ this.nService.error('Error', 'Select a valid Device protocol');
+ return;
+ }
+
+ if (isValid) {
+ let referenceObject = this.prepareReferenceObject();
+ let theJSON = JSON.stringify({ 'reference_data': this.tempAllData }, null, '\t');
+ let uri = 'data:application/json;charset=UTF-8,' + encodeURIComponent(theJSON);
+ this.downloadData.reference = theJSON;
+ this.validateTempAllData();
+ var blob = new Blob([theJSON], {
+ type: 'text/plain'
+ });
+ let fileName = 'reference_AllAction_' + referenceObject.scopeName + '_' + '0.0.1V.json';
+ saveAs(blob, fileName);
+ var templateData = JSON.stringify(this.downloadData.template.templateData);
+ var nameValueData = JSON.stringify(this.downloadData.template.nameValueData);
+ var pdData = this.downloadData.pd.pdData;
+ if (templateData != '{}' && templateData != null && templateData != undefined) this.downloadTemplate();
+ if (nameValueData != '{}' && nameValueData != null && nameValueData != undefined) this.downloadNameValue();
+ if (pdData != '' && pdData != null && pdData != undefined) this.downloadPd();
+ }
+ }
+
+ downloadTemplate() {
+ var fileName = this.downloadData.template.templateFileName;
+ var theJSON = this.downloadData.template.templateData;
+ if (fileName != null || fileName != '') {
+ var fileExtensionArr = fileName.split('.');
+ var blob = new Blob([theJSON], {
+ type: 'text/' + fileExtensionArr[1]
+ });
+ saveAs(blob, fileName);
+ }
+ }
+
+ downloadNameValue() {
+ var fileName = this.downloadData.template.nameValueFileName;
+ var theJSON = this.downloadData.template.nameValueData;
+ var blob = new Blob([theJSON], {
+ type: 'text/json'
+ });
+
+ saveAs(blob, fileName);
+ }
+
+ downloadPd() {
+ let fileName = this.downloadData.pd.pdFileName;
+ let theJSON = this.downloadData.pd.pdData;
+ var blob = new Blob([theJSON], {
+ type: 'text/plain'
+ });
+
+ saveAs(blob, fileName);
+ }
+
+ saveToAppc(valid, form) {
+ if (this.referenceDataObject.action === '') {
+ this.nService.error('Error', 'Select a valid Action');
+ return;
+ }
+ if (this.referenceDataObject['device-protocol'] === '') {
+ this.nService.error('Error', 'Select a valid Device protocol');
+ return;
+ }
+
+ try {
+ form._submitted = true;
+ if (valid) {
+
+ let referenceObject = this.prepareReferenceObject();
+ console.log('##########');
+
+ console.log(referenceObject);
+ this.validateTempAllData();
+ let theJSON = JSON.stringify(this.tempAllData, null, '\t');
+ let fileName = 'reference_AllAction_' + referenceObject.scopeName + '_' + '0.0.1V.json';
+ this.uploadArtifact(JSON.stringify({ reference_data: this.tempAllData }), this.tempAllData[this.tempAllData.length - 1], fileName);
+ var templateData = JSON.stringify(this.appData.template.templateData);
+ var nameValueData = JSON.stringify(this.appData.template.nameValueData);
+ var pdData = JSON.stringify(this.appData.pd);
+ if (templateData != '{}' && templateData != null && templateData != undefined) this.saveTemp();
+ if (nameValueData != '{}' && nameValueData != null && nameValueData != undefined) this.saveNameValue();
+ if (pdData != '{}' && pdData != null && pdData != undefined) this.savePd();
+ if (this.actionChanged) {
+ this.referenceDataObject.action = this.currentAction;
+ this.populateExistinAction(this.referenceDataObject.action);
+ this.actionChanged = false;
+ }
+ }
+ }
+ catch (e) {
+ this.nService.warn('status', 'unable to save the artifact');
+ }
+ }
+
+ validateTempAllData() {
+ if (this.tempAllData) {
+ var updatedData = [];
+ this.tempAllData.forEach(data => {
+ if (data.action) {
+ updatedData.push(data);
+ }
+ });
+ this.tempAllData = updatedData;
+ }
+ }
+
+ appendSlashes(artifactData) {
+ return artifactData.replace(/"/g, '\\"');
+ }
+
+ uploadArtifact(artifactData, dataJson, fileName) {
+ let data = [];
+ let slashedPayload = this.appendSlashes(artifactData);
+ let newPyaload = '{"userID": "' + localStorage['userId'] + '","vnf-type" : "' + dataJson['scope']['vnf-type'] + '","action" : "AllAction","artifact-name" : "' + fileName + '","artifact-type" : "APPC-CONFIG","artifact-version" : "0.1","artifact-contents" :" ' + slashedPayload + '"}';
+ let payload = {
+ 'input': {
+ 'design-request': {
+ 'request-id': localStorage['apiToken'],
+ 'action': 'uploadArtifact',
+ 'payload': newPyaload,
+ }
+ }
+ };
+ this.ngProgress.start();
+ this.httpUtils.post({
+ url: environment.getDesigns,
+ data: payload
+ }).subscribe((resp) => {
+ if (resp != null && resp.output.status.code == '400') {
+ window.scrollTo(0, 0);
+ this.nService.success('Status', 'successfully uploaded the Reference Data');
+ } else {
+ this.nService.warn('Status', 'Error while saving Reference Data');
+ }
+ this.uploadStatusError = false;
+ this.getRefStatus = false;
+ this.ngProgress.done();
+ }, (err) => {
+ this.nService.error('Status', 'Error Connecting to the APPC Network');
+ window.scrollTo(0, 0);
+ });
+ this.appData.reference = payload;
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+ retriveFromAppc() {
+ if (sessionStorage.getItem('updateParams') != 'undefined') {
+ this.getArtifact();
+ this.noCacheData = false;
+ } else {
+ this.noCacheData = true;
+ }
+ }
+
+ cloneMessage(servermessage) {
+ var clone = {};
+ for (var key in servermessage) {
+ if (servermessage.hasOwnProperty(key)) //ensure not adding inherited props
+ clone[key] = servermessage[key];
+ }
+ return clone;
+ }
+
+ public showUpload() {
+ this.selectedUploadType = this.uploadTypes[0].value;
+ };
+
+ public fileChange(input) {
+ this.fileName = input.target.files[0].name.replace(/C:\\fakepath\\/i, '');
+ this.fileUploaded = true;
+ this.disableRetrieve = true;
+ if (input.target.files && input.target.files[0]) {
+ // Create the file reader
+ let reader = new FileReader();
+ this.readFile(input.target.files[0], reader, (result) => {
+ // After the callback fires do:
+ if ('Reference Data' === this.selectedUploadType) {
+ try {
+ let obj: any;
+ let jsonObject = (JSON.parse(result))['reference_data'];
+ this.uploadedData = JSON.parse(JSON.stringify(jsonObject));
+ this.tempAllData = JSON.parse(JSON.stringify(jsonObject));
+ this.notificationService.notifySuccessMessage('Reference Data file successfully uploaded..');
+ if (jsonObject instanceof Array) {
+ this.referenceDataObject = jsonObject[0];
+ jsonObject.forEach(obj => {
+ this.selectedActions.push(obj.action);
+ });
+ } else {
+ this.referenceDataObject = jsonObject;
+ this.selectedActions.push(jsonObject.action);
+ }
+ if (this.referenceDataObject.action === 'OpenStack Actions') {
+ this.deviceProtocols = ['', 'OpenStack'];
+ this.buildDesignComponent.tabs = [
+ {
+ type: 'dropdown',
+ name: 'Reference Data',
+ url: 'references',
+ }];
+ }
+ else {
+ this.buildDesignComponent.tabs = [
+ {
+ name: 'Reference Data',
+ url: 'references',
+ }, {
+ name: 'Template',
+ url: 'templates/myTemplates',
+ }, {
+ name: 'Parameter Definition',
+ url: 'parameterDefinitions/create'
+ } /*, {
+ name: "Test",
+ url: 'test',
+ }*/
+ ];
+ }
+ if (this.referenceDataObject.template == null) {
+ this.referenceDataObject.template = 'Y';
+ }
+ if (this.referenceDataObject['action-level'] == null) {
+ this.referenceDataObject['action-level'] = 'VNF';
+ }
+ } catch (e) {
+ this.nService.error('Error', 'Incorrect file format');
+ }
+ }
+ this.hideModal = true;
+ });
+ } else {
+ this.notificationService.notifyErrorMessage('Failed to read file..');
+ }
+
+ }
+
+ public readFile(file, reader, callback) {
+ // Set a callback funtion to fire after the file is fully loaded
+ reader.onload = () => {
+ // callback with the results
+ callback(reader.result);
+ };
+ this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
+ // Read the file
+ reader.readAsText(file, 'UTF-8');
+ }
+
+ fileChangeEvent(fileInput: any) {
+ let obj: any = fileInput.target.files;
+ }
+
+ clearVnfcData() {
+ this.Sample = {
+ 'vnfc-instance': '1',
+ 'vnfc-function-code': '',
+ 'ipaddress-v4-oam-vip': '',
+ 'group-notation-type': '',
+ 'group-notation-value': ''
+ };
+ }
+
+ setVmInstance(index) {
+ this.referenceDataObject.vm[index]['vm-instance'] = index + 1;
+ }
+
+ setVnfcType(str: String) {
+ this.Sample['vnfc-type'] = str;
+ }
+
+ getChange(value: String) {
+ if (value === 'vnfType') {
+ this.referenceDataObject.scope['vnfc-type'] = '';
+ }
+ }
+
+ resetForm() {
+ this.referenceDataObject['action-level'] = 'vnf';
+ this.referenceDataObject.template = 'Y';
+ this.referenceDataObject['device-protocol'] = '';
+ this.referenceDataObject['user-name'] = '';
+ this.referenceDataObject['port-number'] = '';
+ this.refernceScopeObj.sourceType = '';
+ this.Sample['vnfc-type'] = '';
+ }
+
+ populateExistinAction(data) {
+ let existAction = this.tempAllData.findIndex(obj => {
+ return obj.action == data;
+ });
+ if (existAction > -1) {
+ let obj = $.extend(true, {}, this.tempAllData[existAction]);
+ this.referenceDataObject = obj;
+ this.referenceDataObject.scope['vnf-type'] = obj['scope']['vnf-type'];
+ this.referenceDataObject.scope['vnfc-type'] = obj['scope']['vnfc-type'];
+ this.referenceDataObject['device-protocol'] = obj['device-protocol'];
+ this.refernceScopeObj['sourceType'] = obj['scopeType'];
+ } else {
+ this.resetForm();
+ this.referenceDataObject.action = data;
+ }
+ //# iof healthCeck change deviceprotocol drp vaues
+ if (data == 'HealthCheck') {
+ this.deviceProtocols = ['', 'ANSIBLE', 'CHEF', 'REST'];
+ this.actionHealthCheck = true;
+ } else if (data == 'UpgradeBackout' || data == 'ResumeTraffic' || data == 'QuiesceTraffic' || data == 'UpgradeBackup' || data == 'UpgradePostCheck' || data == 'UpgradePreCheck' || data == 'UpgradeSoftware' || data == 'ConfigBackup' || data == 'ConfigRestore' || data == 'StartApplication' || data == 'StopApplication') {
+ this.deviceProtocols = ['', 'CHEF', 'ANSIBLE'];
+ } else if (data == 'OpenStack Actions') {
+ this.deviceProtocols = ['', 'OpenStack'];
+ } else if (data == 'ConfigScaleOut' || data == 'Configure' || data == 'ConfigModify') {
+ this.deviceProtocols = ['', 'CHEF', 'ANSIBLE', 'NETCONF'];
+ } else if (data == 'GetRunningConfig') {
+ this.deviceProtocols = ['', 'NETCONF'];
+ } else {
+ this.deviceProtocols = ['', 'ANSIBLE', 'CHEF', 'NETCONF-XML', 'REST', 'RESTCONF', 'CLI'];
+ this.actionHealthCheck = false;
+ }
+ }
+
+ //Modal pop up for action change with values entered.
+ actionChange(data, content, userForm) {
+ // this.actionChanged = true;
+ if (data == null) {
+ return;
+ }
+ if ((userForm.valid) && this.oldAction != '' && this.oldAction != undefined) {
+ this.actionChanged = true;
+ this.modalService.open(content).result.then(res => {
+ if (res == 'yes') {
+ this.currentAction = this.referenceDataObject.action;
+ this.referenceDataObject.action = this.oldAction;
+ $('#saveToAppc').click();//make sure the save all is done before the tempall obj is saved form the API
+ this.oldAction = this.referenceDataObject.action + '';
+ if (this.oldAction === 'OpenStack Actions') {
+
+ this.uploadedDataArray = [];
+ this.remUploadedDataArray = [];
+ this.firstArrayElement = [];
+ this.uploadFileName = '';
+ //this.tempAllData = [];
+ }
+ this.clearCache();
+ } else {
+ this.populateExistinAction(data);
+ this.oldAction = this.referenceDataObject.action + '';
+ this.clearCache();
+ }
+ });
+ } else {
+ this.oldAction = this.referenceDataObject.action + '';
+ this.populateExistinAction(data);
+ }
+
+
+ if (data == 'OpenStack Actions') {
+ this.buildDesignComponent.tabs = [
+ {
+ type: 'dropdown',
+ name: 'Reference Data',
+ url: 'references',
+ }];
+ }
+ else {
+ this.buildDesignComponent.tabs = [
+ {
+ name: 'Reference Data',
+ url: 'references',
+ }, {
+ name: 'Template',
+ url: 'templates/myTemplates',
+ }, {
+ name: 'Parameter Definition',
+ url: 'parameterDefinitions/create'
+ }/*, {
+ name: "Test",
+ url: 'test',
+ }*/
+ ];
+ }
+ if (data == 'Configure' || data == 'ConfigModify') {
+ this.nonConfigureAction = false;
+ } else {
+ this.nonConfigureAction = true;
+ }
+ }
+
+ clearCache() {
+ // get the value and save the userid and persist it.
+ this.mappingEditorService.setTemplateMappingDataFromStore(undefined);
+ localStorage['paramsContent'] = '{}';
+ this.mappingEditorService.setParamContent(undefined);
+ this.paramShareService.setSessionParamData(undefined);
+ this.appData = { reference: {}, template: { templateData: {}, nameValueData: {} }, pd: {} };
+ this.downloadData = {
+ reference: {},
+ template: { templateData: {}, nameValueData: {}, templateFileName: '', nameValueFileName: '' },
+ pd: { pdData: '', pdFileName: '' }
+ };
+ }
+
+ saveTemp() {
+ this
+ .httpUtils
+ .post(
+ { url: environment.getDesigns, data: this.appData.template.templateData })
+ .subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === 'success') {
+ this.nService.success('Status', 'Successfully uploaded the Template Data');
+ }
+ if (resp.output.status.code === '401') {
+ this.nService.warn('Status', 'Error in saving the Template to Appc');
+
+ }
+ },
+ (err) => this.nService.error('Status', 'Error Connecting to the APPC Network'));
+ }
+
+ saveNameValue() {
+ this
+ .httpUtils
+ .post(
+ {
+ url: environment.getDesigns, data: this.appData.template.nameValueData
+ })
+ .subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === 'success') {
+ this.nService.success('Status', 'Successfully uploaded the Name Value Pairs');
+ }
+ if (resp.output.status.code === '401') {
+ this.nService.warn('Status', 'Error in saving the Name value pairs to Appc');
+ }
+ },
+ error => {
+ this.nService.error('Status', 'Error Connecting to the APPC Network');
+ return false;
+ });
+ }
+
+ savePd() {
+ this
+ .httpUtils
+ .post(
+ {
+ url: environment.getDesigns, data: this.appData.pd
+ })
+ .subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === 'success') {
+ this.nService.success('Status', 'Successfully uploaded PD file');
+ }
+ if (resp.output.status.code === '401') {
+ this.nService.warn('Status', 'Error in saving the PD to Appc');
+ }
+ },
+ error => {
+ this.nService.error('Status', 'Error Connecting to the APPC Network');
+ return false;
+ });
+ }
+
+ openModel(toShow: any, message: any, title: any) {
+ this.modalComponent.isShow = toShow;
+ this.modalComponent.message = message;
+ this.modalComponent.title = title;
+ }
+
+ browseOption() {
+ $('#inputFile').trigger('click');
+ }
+
+ excelBrowseOption() {
+ $('#excelInputFile').trigger('click');
+ }
+
+ showIdentifier() {
+ $('#identifierModal').modal();
+ }
+
+ addToIdentDrp() {
+ if (!(this.referenceDataObject['template-id-list'])) {
+ this.referenceDataObject['template-id-list'] = [];
+ }
+ this.referenceDataObject['template-id-list'].push(this.templateId);
+ // this.referenceDataObject['template-id-list'] = this.identifierDrpValues
+ //this.identifierDrp = ""
+ }
+
+ resetVms() {
+ this.referenceDataObject.vm = [];
+ }
+
+ dataModified() {
+ this.referenceDataObject.vm = this.referenceDataObject.vm;
+ }
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.css b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.css
new file mode 100644
index 0000000..94ef767
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.css
@@ -0,0 +1,35 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.file {
+ visibility: hidden;
+ position: absolute;
+}
+
+.mt-30 {
+ margin-top: 30px;
+}
+
+.active-tab > a {
+ border-bottom: 5px solid #4B515D;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html
new file mode 100644
index 0000000..150d5ad
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.html
@@ -0,0 +1,119 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+ [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+
+<tabs>
+ <tab [tabTitle]="'Template Configuration'">
+ <div>
+ <app-golden-configuration [(configMappingEditorContent)]="configMappingEditorContent" [isMappingComp]="true" #mappingComponent>
+ </app-golden-configuration>
+ </div>
+ </tab>
+ <tab [tabTitle]="'Param Values'">
+ <div class="form-group">
+ <div [hidden]="true">
+ <button type="button" id="modalButton" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="modal.open()">Open me!
+ </button>
+ </div>
+ <div>
+ <modal #modal>
+ <modal-header [show-close]="true">
+ <h4 class="modal-title">{{title}}</h4>
+ </modal-header>
+ <modal-body>
+ {{message}}
+ </modal-body>
+ <modal-footer>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" data-dismiss="modal">Close
+ </button>
+ </modal-footer>
+ </modal>
+ </div>
+ <div class="card" style=" margin-bottom: 23px;">
+ <img class="card-img-top" data-src="holder.js/100%x180/" alt="">
+ <div class="card-block" style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="row" style="padding: 15px 25px">
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Action</label>
+ <input class="form-control" type="text" disabled value="{{action}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" />
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-12">
+ <div class="input-group">
+ <input id="inputFile2" class="file" #myInput type='file' (change)='fileChange(myInput)'>
+ <input type="text" class="input-lg" [(ngModel)]="myfileName" disabled placeholder="Upload Param file from PC" style="width:80%">
+ <button (click)="browseOption($event)" [disabled]="!enableMappingBrowse" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg">
+ Upload Param file
+ </button>
+ </div>
+ </div>
+
+ <input type="file" id="filesparam" style="visibility:hidden;" class="form-control-file" (change)="fileParamChange(myInputParam)" #myInputParam placeholder="Upload file..."
+ />
+ <div class="row" style="margin-bottom: 20px;">
+ <div class="col-md-12 text-right">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="retrieveNameValueFromAppc()">Retrieve Name/Value from APPC
+ </button>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="syncParam()">Synchronize with name values
+ </button>
+ </div>
+ </div>
+ </div>
+ <hr>
+ <!--Commenting out 1712 changes here-->
+ <!--<div class="col-md-12" [hidden]="!showMappingDownloadDiv"><label>Download Name/Value pair as : </label>
+ <select class="form-control col-md-3" [(ngModel)]="mapppingDownloadType" (ngModelChange)="onDownloadParameter()">
+ <option value="">Select</option>
+ <option value="Json">JSON</option>
+ <option value="Xls">XLS</option>
+ </select>
+</div>-->
+
+ <div class="col-md-12"></div>
+ <div><label for="textAreaGeneratedTemplate">
+ <div class="mdl-card__title-text">Param Name Value List</div>
+ <div><font size="1">(Please click anywhere on the editor to see the synced name value pairs)</font></div>
+ </label>
+ <!-- <ace-editor [(text)]="this.artifactRequest.paramsContent" [theme]="'chrome'" [mode]="'velocity'" (textChanged)="onParamChanges($event)" [options]="{maxLines: 'Infinity', fontSize: '13pt'}"
+ style="min-height: 500px; width: fit-content;"></ace-editor> -->
+ <ace-editor [(text)]="this.artifactRequest.paramsContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" (textChanged)="onParamChanges($event)"
+ [options]="{maxLines: 'Infinity', fontSize: '13pt' }" style="min-height: 500px; width: 100%"></ace-editor>
+ </div>
+
+ </tab>
+</tabs>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts
new file mode 100644
index 0000000..9ea95ec
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/param-name-value.component.ts
@@ -0,0 +1,711 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, ContentChildren, OnInit, QueryList, ViewChild } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { MappingEditorService } from '../../../../shared/services/mapping-editor.service';
+import { HttpUtilService } from '../../../../shared/services/httpUtil/http-util.service';
+import { GoldenConfigurationComponent } from '../template-configuration/template-configuration.component';
+import { ArtifactRequest } from '../../../../shared/models/index';
+import { NotificationService } from '../../../../shared/services/notification.service';
+import { ModalComponent } from '../../../../shared/modal/modal.component';
+import { saveAs } from 'file-saver';
+import { DialogService } from 'ng2-bootstrap-modal';
+import { ConfirmComponent } from '../../../../shared/confirmModal/confirm.component';
+import { BuildDesignComponent } from '../../build-artifacts.component';
+import { ParamShareService } from '../../../../shared/services/paramShare.service';
+import { NotificationsService } from 'angular2-notifications';
+import { Tab } from './tab';
+import { environment } from '../../../../../environments/environment';
+import { NgProgress } from 'ngx-progressbar';
+import * as XLSX from 'xlsx';
+
+type AOA = Array<Array<any>>;
+
+function s2ab(s: string): ArrayBuffer {
+ const buf = new ArrayBuffer(s.length);
+ const view = new Uint8Array(buf);
+ for (let i = 0; i !== s.length; ++i) {
+ view[i] = s.charCodeAt(i) & 0xFF;
+ }
+ return buf;
+}
+
+declare var $: any;
+
+@Component({
+ selector: 'app-golden-configuration-mapping',
+ templateUrl: './param-name-value.component.html',
+ styleUrls: ['./param-name-value.component.css']
+})
+export class GoldenConfigurationMappingComponent implements OnInit {
+ enableMappingSave: boolean = false;
+ aceText: string = '';
+ fileName: string = '';
+ actionType: any;
+ modal: any;
+ configMappingEditorContent: any;
+ fileType: any = '';
+ myfileName: any;
+ initialData: any;
+ scopeName: any;
+ downloadedFileName: any;
+ enableSaveToAppc: boolean = false;
+ versionNo: any = '0.0.1';
+ showVersionDiv: boolean = false;
+ initialAction: any;
+ title: any;
+ message: any;
+ enableMappingBrowse: boolean = true;
+ enableDownload: boolean = false;
+ showMappingDownloadDiv: boolean = false;
+ mapppingDownloadType: any;
+ action: any;
+ artifactName: any;
+ enableMerge: boolean = false;
+ apiToken = localStorage['apiToken'];
+ userId = localStorage['userId'];
+ public uploadTypes = [
+ {
+ value: 'Mapping Data',
+ display: 'Sample Json Param File'
+ }
+ ];
+ selectedUploadType: string = this.uploadTypes[0].value;
+ options = {
+ timeOut: 1000,
+ showProgressBar: true,
+ pauseOnHover: true,
+ clickToClose: true,
+ maxLength: 200
+ };
+ artifactRequest: ArtifactRequest = new ArtifactRequest();
+ @ViewChild(GoldenConfigurationComponent) mappingComponent: GoldenConfigurationComponent;
+ @ViewChild('templateeditor') templateeditor;
+ @ViewChild('myInputParam') myInputParam: any;
+ @ViewChild(ModalComponent) modalComponent: ModalComponent;
+ @ContentChildren(Tab) tabs: QueryList<Tab>;
+ public subscription: any;
+ public item: any = {};
+
+ public Actions = [
+ { action: 'ConfigBackup', value: 'ConfigBackup' },
+ { action: 'ConfigModify', value: 'ConfigModify' },
+ { action: 'ConfigRestore', value: 'ConfigRestore' },
+ { action: 'Configure', value: 'Configure' },
+ { action: 'GetRunningConfig', value: 'GetRunningConfig' },
+ { action: 'HealthCheck', value: 'HealthCheck' },
+ { action: 'StartApplication', value: 'StartApplication' },
+ { action: 'StopApplication', value: 'StopApplication' }
+ ];
+ vnfType: any;
+ vnfcType: any;
+ protocol: any;
+ refObj: any;
+ public paramsContent = localStorage['paramsContent'];
+
+ constructor (private buildDesignComponent: BuildDesignComponent, private paramShareService: ParamShareService, private router: Router, private httpUtil: HttpUtilService, private dialogService: DialogService, private activeRoutes: ActivatedRoute, private mappingEditorService: MappingEditorService, private notificationService: NotificationService, private nService: NotificationsService, private ngProgress: NgProgress) {
+ this.artifactRequest.action = '';
+ this.artifactRequest.version = '';
+ this.artifactRequest.paramKeysContent = '';
+ }
+
+ ngOnInit() {
+ var refObj = this.refObj = this.prepareFileName();
+ if (refObj && refObj != undefined) {
+ if (this.paramsContent && this.paramsContent != undefined && this.paramsContent !== '{}') {
+ this.artifactRequest.paramsContent = this.formatNameValuePairs(this.paramsContent);
+ // this.artifactRequest.paramsContent = this.paramsContent;
+
+ }
+ else {
+ this.artifactRequest.paramsContent = '{}';
+ }
+
+ // refObj = refObj[refObj.length - 1];
+ this.item = refObj;
+ this.vnfType = this.item.scope['vnf-type'];
+ this.vnfcType = this.item.scope['vnfc-type'];
+ this.protocol = this.item['device-protocol'];
+ this.action = this.item.action;
+ var artifactList = this.item['artifact-list'];
+ for (var i = 0; i < artifactList.length; i++) {
+ var artifactName = artifactList[i]['artifact-name'];
+ var array = artifactName.split('_');
+ if (array[0].toUpperCase() === 'TEMPLATE') {
+ this.artifactName = artifactName;
+ }
+ }
+ }
+ else {
+ this.item = {
+ 'action': '',
+ 'scope': { 'vnf-type': '', 'vnfc-type': '' },
+ 'vm': [],
+ 'protocol': '',
+ 'download-dg-reference': '',
+ 'user-name': '',
+ 'port-number': '',
+ 'artifact-list': [],
+ 'deviceTemplate': '',
+ 'scopeType': ''
+ };
+ }
+ this.initialAction = this.item.action;
+ this.activeRoutes.url.subscribe(UrlSegment => {
+ this.actionType = UrlSegment[0].path;
+ });
+ if (this.actionType === 'configureTemplate') {
+ this.mappingEditorService.fromScreen = 'TemplateScreen';
+ }
+ if (this.actionType === 'myTemplates') {
+ this.mappingEditorService.fromScreen = 'MappingScreen';
+ }
+ this.mappingEditorService.paramData = [];
+
+
+ }
+
+ //========================== End of ngOnInit() Method============================================
+ browseOption() {
+ $('#filesparam').trigger('click');
+ }
+
+ //========================== End of browseOption() Method============================================
+ selectedNavItem(item: any) {
+ this.item = item;
+ }
+
+ //========================== End of selectedNavItem() Method============================================
+ ngOnDestroy() {
+ this.prepareFileName();
+ }
+
+ //========================== End of ngOnDestroy() Method============================================
+ ngAfterViewInit() {
+ if (this.mappingEditorService.fromScreen === 'MappingScreen') {
+ this.configMappingEditorContent = this.mappingEditorService.getTemplateMappingDataFromStore();
+ this.fileType = sessionStorage.getItem('fileType');
+ if (this.configMappingEditorContent)
+ this.mappingEditorService.initialise(this.mappingComponent.templateeditor.getEditor(), this.configMappingEditorContent, this.modal);
+ }
+ if (this.refObj) {
+
+ this.artifactRequest.action = this.item.action;
+ this.artifactRequest.vnfType = this.vnfType;
+ if (this.vnfcType && this.vnfcType.length != 0) {
+ this.scopeName = this.vnfcType;
+ }
+ else {
+ this.scopeName = this.vnfType;
+ }
+ }
+ else {
+ this.Actions = [];
+ this.enableMappingBrowse = false;
+ }
+ }
+
+ //========================== End of ngAfterViewInit() Method============================================
+ upload(evt: any) {
+ /* wire up file reader */
+ if (evt.target.files[0]) {
+ const target: DataTransfer = <DataTransfer>(evt.target);
+ this.myfileName = evt.target.files[0].name;
+ var fileExtension = this.myfileName.substr(this.myfileName.lastIndexOf('.') + 1);
+ if (fileExtension.toUpperCase() === 'xls'.toUpperCase()) {
+ if (target.files.length != 1) {
+ throw new Error('Cannot upload multiple files on the entry');
+ }
+ const reader = new FileReader();
+ reader.onload = (e: any) => {
+ /* read workbook */
+ const bstr = e.target.result;
+ const wb = XLSX.read(bstr, { type: 'binary' });
+ /* grab first sheet */
+ const wsname = wb.SheetNames[0];
+ const ws = wb.Sheets[wsname];
+ /* save data */
+ let arrData = (<AOA>(XLSX.utils.sheet_to_json(ws, { header: 1 })));
+ var jsonStr = arrData.toString();
+ var JsonArr = jsonStr.split(',');
+ var finalStr = '{\r\n';
+ for (var i = 0; i < JsonArr.length; i = i + 2) {
+ var key = JsonArr[i];
+ var value = JsonArr[i + 1];
+ finalStr = finalStr + key + ':' + value + ',\r\n';
+ }
+ finalStr = finalStr.substring(0, finalStr.length - 3) + '\r\n}';
+ this.artifactRequest.paramsContent = finalStr;
+ this.initialData = finalStr;
+ this.enableMappingSave = true;
+ };
+ reader.readAsBinaryString(target.files[0]);
+ if ('Mapping Data' === this.selectedUploadType) {
+ this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
+ this.mappingEditorService.setParamContent(this.artifactRequest.paramsContent);
+ }
+ }
+ else {
+ let reader = new FileReader();
+ this.readFile(evt.target.files[0], reader, (result) => {
+ if ('Mapping Data' === this.selectedUploadType) {
+ var jsonObject = JSON.parse(result);
+ this.artifactRequest.paramsContent = JSON.stringify(jsonObject, null, 1);
+ this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
+ this.mappingEditorService.setParamContent(this.artifactRequest.paramsContent);
+ }
+ this.initialData = result;
+ this.enableMappingSave = true;
+ });
+ }
+ }
+ else {
+ this.notificationService.notifyErrorMessage('Failed to reading file..');
+ }
+ this.myInputParam.nativeElement.value = '';
+ }
+
+ //========================== End of upload() Method============================================
+ //uncommenting for 1710
+ public fileParamChange(input) {
+ if (input.files && input.files[0]) {
+ this.enableMappingSave = true;
+ this.myfileName = input.files[0].name;
+ var fileExtension = this.myfileName.substr(this.myfileName.lastIndexOf('.') + 1);
+ if (this.validateUploadedFile(fileExtension)) {
+ // Create the file reader
+ let reader = new FileReader();
+ this.readFile(input.files[0], reader, (result) => {
+ if ('Mapping Data' === this.selectedUploadType) {
+ var jsonObject = JSON.parse(result);
+ this.artifactRequest.paramsContent = JSON.stringify(jsonObject, null, 1);
+ this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
+ this.mappingEditorService.setParamContent(this.artifactRequest.paramsContent);
+ localStorage['paramsContent'] = this.artifactRequest.paramsContent;
+ }
+ this.enableMerge = true;
+ this.initialData = result;
+ });
+ }
+ else {
+ this.nService.error("Error", "Incorrect File Format")
+ this.artifactRequest.paramsContent = ''
+ }
+ }
+ else {
+ this.nService.error("Error", "Failed to read file");
+ }
+ this.myInputParam.nativeElement.value = '';
+ }
+
+ //========================== End of fileParamChange() Method============================================
+ validateUploadedFile(fileExtension) {
+
+ if (fileExtension.toUpperCase() === 'json'.toUpperCase()) {
+ return true;
+ }
+ else {
+ return false;
+ }
+
+ }
+ //========================== End of validateUploadedFile() Method============================================
+ public readFile(file, reader, callback) {
+ // Set a callback funtion to fire after the file is fully loaded
+ reader.onload = () => {
+ // callback with the results
+ callback(reader.result);
+ };
+ this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
+ // Read the file
+ reader.readAsText(file, 'UTF-8');
+ }
+
+ //========================== End of readFile() Method============================================
+ public onParamChanges(data) {
+ this.artifactRequest.paramsContent = data;
+ localStorage['paramsContent'] = this.artifactRequest.paramsContent;
+ }
+
+ //========================== End of onParamChanges() Method============================================
+ onDownloadParameter() {
+ let refObj = this.refObj;
+ if (refObj) {
+ // refObj = refObj[refObj.length - 1];
+ let paramsKeyValueFromEditor: JSON;
+ this.initialData = this.artifactRequest.paramsContent;
+ paramsKeyValueFromEditor = JSON.parse(this.artifactRequest.paramsContent);
+ let theJSON = JSON.stringify(paramsKeyValueFromEditor, null, '\t');
+ var blob = new Blob([theJSON], {
+ type: 'text/json'
+ });
+ this.showVersionDiv = true;
+ let fileName: any;
+ fileName = this.updateFileName(refObj.action, this.scopeName, this.versionNo);
+ saveAs(blob, fileName);
+ }
+ else {
+ this.nService.error('Error', 'Please enter Action and VNF type in Reference Data screen');
+
+ }
+ }
+
+ //========================== End of onDownloadParameter() Method============================================
+ JSONToCSVConvertor(JSONData, fileName, ShowLabel) {
+ //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
+ var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
+ var CSV = '';
+ //This condition will generate the Label/Header
+ if (ShowLabel) {
+ var testRow = '';
+ for (var index in arrData[0]) {
+ CSV += index + '\t' + arrData[0][index] + '\r\n';
+ }
+ }
+ if (CSV == '') {
+ return;
+ }
+ //Initialize file format you want csv or xls
+ var uri = 'data:application/vnd.ms-excel,' + encodeURI(CSV);
+ var link = document.createElement('a');
+ link.href = uri;
+ link.download = fileName + '.xls';
+ //this part will append the anchor tag and remove it after automatic click
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ }
+
+ //========================== End of JSONToCSVConvertor() Method============================================
+ updateFileNameForXls(action: any, scopeName: any, versionNo: any) {
+ let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V';
+ return fileName;
+ }
+
+ //========================== End of updateFileNameForXls() Method============================================
+ appendSlashes(artifactData) {
+ let x = artifactData.replace(new RegExp(',"', 'g'), ',\"');
+ let y = x.replace(new RegExp('":', 'g'), '\":');
+ let z = y.replace(new RegExp('{"', 'g'), '{\"');
+ let t = z.replace(new RegExp(':"', 'g'), ':\"');
+ let m = t.replace(new RegExp('",', 'g'), '\",');
+ let n = y.replace(new RegExp('"}', 'g'), '\"}');
+ let nw = n.replace(new RegExp('{"', 'g'), '{\"');
+ let nw1 = nw.replace(new RegExp(':"', 'g'), ':\"');
+ let nw2 = nw1.replace(new RegExp('",', 'g'), '\",');
+ return nw2;
+ }
+
+ //========================== End of appendSlashes() Method============================================
+ updateFileName(action: any, scopeName: any, versionNo: any) {
+ let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V.json';
+ this.downloadedFileName = fileName;
+ return fileName;
+ }
+
+ //========================== End of updateFileName() Method============================================
+ prepareFileName(): any {
+ let fileNameObject: any = this.mappingEditorService.latestAction;
+ return fileNameObject;
+ }
+
+ //========================== End of prepareFileName() Method============================================
+ openModel(toShow: any, message: any, title: any) {
+ this.message = message;
+ this.title = title;
+ $('#modalButton').trigger('click');
+ }
+
+ //========================== End of openModel() Method============================================
+ checkSave(selectedAction): void {
+ if (this.actionType === 'updateTemplate') {
+ if (!this.buildDesignComponent.isReferenceFound(selectedAction, this.mappingEditorService.getReferenceList())) {
+ this.nService.error('Error', 'Reference Data not found. Please add Reference Data for Action:' + selectedAction);
+ }
+ }
+ if (this.initialData != this.artifactRequest.paramsContent) {
+ this.showConfirm(this.initialData);
+ }
+ else {
+ this.initialAction = this.item.action;
+ }
+ }
+
+ //========================== End of checkSave() Method============================================
+ showConfirm(initialData) {
+ let disposable = this.dialogService.addDialog(ConfirmComponent, {
+ title: 'Confirm title',
+ message: 'Confirm message'
+ })
+ .subscribe((isConfirmed) => {
+ //We get dialog result
+ if (isConfirmed) {
+ this.artifactRequest.paramsContent = initialData;
+ this.initialAction = this.item.action;
+ }
+ else {
+ this.item.action = this.initialAction;
+ }
+ });
+ }
+
+ //========================== End of showConfirm() Method============================================
+ retrieveNameValueFromAppc() {
+ let refObj = this.refObj;
+ if (refObj && refObj != undefined) {
+ // console.log("REF OBJECT IN RETRIVE"+JSON.stringify(refObj));
+ this.enableMerge = true;
+ var scopeName = this.scopeName.replace(/ /g, '').replace(new RegExp('/', "g"), '_').replace(/ /g, '');
+ let fileName = this.updateFileName(this.item.action, scopeName, this.versionNo);
+ let payload = '{"userID": "' + this.userId + '", "action": "' + this.item.action + '", "vnf-type" : "' + this.vnfType + '", "artifact-type":"APPC-CONFIG", "artifact-name":"' + fileName + '"}';
+ // console.log("payload OBJECT IN RETRIVE"+JSON.stringify(payload));
+ let input = {
+ 'input': {
+ 'design-request': {
+ 'request-id': this.apiToken,
+ 'action': 'getArtifact',
+ 'payload': payload
+ }
+ }
+ };
+
+ console.log('Retrieve name value from appc payload===>>' + payload);
+ let artifactContent: any;
+ this.ngProgress.start();
+ this.httpUtil.post({
+ url: environment.getDesigns,
+ data: input
+ }).subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === 'success') {
+ this.nService.success('Success', 'Name/value pairs retrieved successfully from APPC');
+ this.enableMerge = true;
+ let result = JSON.parse(resp.output.data.block).artifactInfo[0];
+ result = result['artifact-content'];
+ var string = result.substring(2, result.length - 2);
+ var stringArr = string.split(',');
+ var newStringArr = [];
+ var resultStr = '{\r\n';
+ for (var index in stringArr) {
+ newStringArr[index] = stringArr[index] + ',\r\n';
+ }
+ for (var index in newStringArr) {
+ resultStr = resultStr + newStringArr[index];
+ }
+ resultStr = resultStr.substring(0, resultStr.length - 3) + '\r\n}';
+ this.artifactRequest.paramsContent = resultStr;
+ this.mappingEditorService.setParamContent(resultStr);
+ localStorage['paramsContent'] = resultStr;
+ this.enableMappingSave = true;
+ }
+ else {
+ this.nService.info('Information', 'There are no name value pairs saved in APPC for the selected action!');
+ }
+ this.ngProgress.done();
+ },
+ error => this.nService.error('Error', 'Error in connecting to APPC Server'));
+ }
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+ //========================== End of retrieveNameValueFromAppc() Method============================================
+ saveNameValueToAppc() {
+ let refObj = this.refObj;
+ if (refObj && refObj != undefined) {
+ // refObj = refObj[refObj.length - 1];
+ let paramsKeyValueFromEditor = JSON.parse(this.artifactRequest.paramsContent);
+ let action = this.item.action;
+ let fileName = this.updateFileName(refObj.action, this.scopeName, this.versionNo);
+ let vnfType = this.vnfType;
+ let Json = [paramsKeyValueFromEditor];
+ let slashedPayload = this.appendSlashes(JSON.stringify(Json));
+ let newPayload =
+ {
+ 'userID': this.userId,
+ 'vnf-type': this.vnfType,
+ 'action': action,
+ 'artifact-name': fileName,
+ 'artifact-type': 'APPC-CONFIG',
+ 'artifact-version': this.versionNo,
+ 'artifact-contents': slashedPayload
+ };
+ let data =
+ {
+ 'input': {
+ 'design-request': {
+ 'request-id': this.apiToken,
+ 'action': 'uploadArtifact',
+ 'payload': JSON.stringify(newPayload)
+ }
+ }
+ };
+ this
+ .httpUtil
+ .post(
+ { url: environment.getDesigns, data: data })
+ .subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === 'success') {
+ this.nService.success('Success', 'Name/value pairs saved successfully to APPC');
+ }
+ if (resp.output.status.code === '401') {
+ this.nService.error('Error', resp.output.status.message);
+ }
+ },
+ error => this.nService.error('Error', 'Could not save name value pairs. Error in connecting APPC Server'));
+ }
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+ //========================== End of saveNameValueToAppc() Method============================================
+ formatNameValuePairs(namevaluePairs: string) {
+ //var string = namevaluePairs.substring(2, namevaluePairs.length - 2);
+ /* var stringArr = string.split(",");
+ var newStringArr = [];
+ var resultStr = "{\r\n\"";
+ for (var index in stringArr) {
+ newStringArr[index] = stringArr[index] + ",\r\n";
+ }
+ for (var index in newStringArr) {
+ resultStr = resultStr + newStringArr[index];
+ }
+ resultStr = resultStr.substring(0, resultStr.length - 3) + "\"\r\n}"
+ return resultStr;*/
+
+ var string = namevaluePairs.substring(1, namevaluePairs.length - 1);
+ var stringArr = string.split(',');
+ var newStringArr = [];
+ var resultStr = '{\r\n';
+ for (var index in stringArr) {
+ newStringArr[index] = stringArr[index] + ',\r\n';
+ }
+ for (var index in newStringArr) {
+ resultStr = resultStr + newStringArr[index];
+ }
+ resultStr = resultStr.substring(0, resultStr.length - 3) + '\r\n}';
+ return resultStr;
+ }
+
+ //========================== End of formatNameValuePairs() Method============================================
+
+ public syncParam() {
+ var paramNameValuesStr = localStorage['paramsContent'];
+ var pdData = this.paramShareService.getSessionParamData();
+ var paramNameValues = [];
+ var pdDataArrayForParamShare = [];
+ var pdDataArrayForSession = [];
+ try {
+ paramNameValues = JSON.parse(paramNameValuesStr);
+ console.log('Param Name values array==' + JSON.stringify(paramNameValues));
+ if (paramNameValues && paramNameValues != undefined) {
+ for (var index in paramNameValues) {
+ var json = {
+ 'paramName': index,
+ 'paramValue': paramNameValues[index]
+ };
+ pdDataArrayForParamShare.push(json);
+
+ pdDataArrayForSession.push({
+ 'name': index,
+ 'type': null,
+ 'description': null,
+ 'required': null,
+ 'default': null,
+ 'source': 'Manual',
+ 'rule-type': null,
+ 'request-keys': [{
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }],
+ 'response-keys': [{
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }, {
+ 'key-name': null,
+ 'key-value': null
+ }],
+ 'ruleTypeValues': [null]
+
+ });
+
+ }
+ this.paramShareService.setTemplateData(pdDataArrayForParamShare);
+
+ if (pdData && pdData != undefined) {
+ for (var i = 0; i < pdDataArrayForSession.length; i++) {
+
+ pdData.forEach(function (arr2item) {
+ if (pdDataArrayForSession[i].name === arr2item.name) {
+
+ var json = {
+ 'name': arr2item.name,
+ 'type': arr2item.type,
+ 'description': arr2item.description,
+ 'required': arr2item.required,
+ 'default': arr2item.default,
+ 'source': arr2item.source,
+ 'rule-type': arr2item['rule-type'],
+ 'request-keys': arr2item['request-keys'],
+ 'response-keys': arr2item['response-keys'],
+ 'ruleTypeValues': arr2item.ruleTypeValues
+ };
+ pdDataArrayForSession.splice(i, 1, json);
+ // console.log("Result array index ==" + JSON.stringify(resultArr[i]))
+ }
+
+ });
+
+ }
+ }
+
+ this.paramShareService.setSessionParamData(pdDataArrayForSession);
+
+ this.router.navigate(['../../../vnfs/design/parameterDefinitions/create']);
+
+ }
+ }
+ catch (error) {
+ console.log('Error occured in syncing param names' + JSON.stringify(error));
+ this.nService.error('Error', 'Error synchronising with name values. Please check the format of json uploaded/ retrieved');
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/tab.ts b/src/app/vnfs/build-artifacts/template-holder/param-name-value/tab.ts
new file mode 100644
index 0000000..5e4fa6c
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/tab.ts
@@ -0,0 +1,43 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, Input} from '@angular/core';
+
+@Component({
+ selector: 'tab',
+ styles: [`
+ .pane {
+ padding: 1em;
+ }
+ `],
+ template: `
+ <div [hidden]="!isactive" class="pane">
+ <ng-content></ng-content>
+ </div>
+ `
+})
+export class Tab {
+ @Input('tabTitle') title: string;
+ @Input() isactive = false;
+ @Input() isParamTab = false;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/param-name-value/tabs.ts b/src/app/vnfs/build-artifacts/template-holder/param-name-value/tabs.ts
new file mode 100644
index 0000000..92f489e
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/param-name-value/tabs.ts
@@ -0,0 +1,63 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {AfterContentInit, Component, ContentChildren, QueryList} from '@angular/core';
+import {Tab} from './tab';
+
+@Component({
+ selector: 'tabs',
+ template: `
+ <ul class="nav nav-tabs">
+ <li [ngClass]="{'active-tab':(tab.isactive==true)}" class="nav-item" *ngFor="let tab of tabs" (click)="selectTab(tab)"
+ [class.active]="tab.isactive">
+ <a class="nav-link" ng-href=''>{{tab.title}}</a>
+ </li>
+ </ul>
+ <ng-content></ng-content>
+ `, styleUrls: ['./param-name-value.component.css']
+})
+export class Tabs implements AfterContentInit {
+
+ @ContentChildren(Tab) tabs: QueryList<Tab>;
+
+
+ // contentChildren are set
+ ngAfterContentInit() {
+ // get all active tabs
+ let activeTabs = this.tabs.filter((tab) => tab.isactive);
+
+ // if there is no active tab set, activate the first
+ if (activeTabs.length === 0) {
+ this.selectTab(this.tabs.first);
+ }
+ }
+
+ public selectTab(tab: Tab) {
+ // deactivate all tabs
+ this.tabs.toArray().forEach(tab => tab.isactive = false);
+
+ // activate the tab the user has clicked on.
+ tab.isactive = true;
+ }
+
+}
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.css b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.css
new file mode 100644
index 0000000..c8100e3
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.css
@@ -0,0 +1,35 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.file {
+ visibility: hidden;
+ position: absolute;
+}
+
+.mt-30 {
+ margin-top: 30px;
+}
+
+.options-menu {
+ padding: 3px 20px;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html
new file mode 100644
index 0000000..c1fb030
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.html
@@ -0,0 +1,100 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+ [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+<div>
+ <div>
+ <div class="card" style="margin-bottom: 23px;">
+ <img class="card-img-top" data-src="holder.js/100%x180/" alt="">
+ <div class="card-block" style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+ <div class="row" style="padding: 15px 25px">
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Action</label>
+ <input class="form-control" type="text" disabled value="{{action}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" />
+ </div>
+ <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" />
+ </div>
+ <div *ngIf="(action === 'ConfigScaleOut')" class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+ <label>templateIdentifier</label><input class="form-control" type="text" disabled value="{{identifier}}" />
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="col-12">
+ <div class="input-group">
+ <input id="inputFile" class="file" #myInput type='file' (change)='fileChange(myInput)'>
+ <input [(ngModel)]="fileName" type="text" class="input-lg" disabled placeholder="Upload template from PC" style="width:80%">
+ <button (click)="browseOption($event)" [disabled]="!enableBrowse" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+ type="button">Upload Template File
+ </button>
+ </div>
+ </div>
+
+ <br>
+ <div class="row" style="margin-bottom: 20px;">
+ <div class="col-md-12 text-right">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="syncTemplate()">Synchronize Template Parameters
+ </button>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="mergeParams()"> Merge from Param
+ </button>
+ </div>
+ </div>
+ </div>
+ <hr>
+ <div><label for="textAreaGeneratedTemplate">
+ <div class="mdl-card__title-text">File Editor</div>
+ </label>
+ <!-- <ace-editor [(text)]="configMappingEditorContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" [options]="{maxLines: 'Infinity', fontSize: '13pt'}"
+ style="min-height: 500px; width: fit-content;scroll-snap-coordinate: 3%"></ace-editor> -->
+ <ace-editor [(text)]="configMappingEditorContent" #templateeditor [theme]="'chrome'" [mode]="'velocity'" [options]="{maxLines: 'Infinity', fontSize: '13pt' }"
+ style="min-height: 500px; width: 100%"></ace-editor>
+ </div>
+ <app-modal [title]="'Confirmation'" [isShow]="false" [message]="'Template is saved and ready for creating parameter definition'" #modalComponent>
+ </app-modal>
+ <modal #myModal>
+ <modal-header [show-close]="true">
+ <h4 class="modal-title">Enter Name for {{selectedWord}}</h4>
+ </modal-header>
+ <modal-body>
+ <div class="form-group row">
+ <label for="example-text-input" class="col-12 col-form-label">Name</label>
+ <div class="col-12">
+ <input class="form-control" [(ngModel)]="tempName" name="templateName" type="text" id="tempName">
+ <span class="error-message" [hidden]="checkNameEntered" style="color: red;">Required Field</span>
+ </div>
+ </div>
+ </modal-body>
+ <modal-footer [show-default-buttons]="false">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="submitNameValues()">Submit
+ </button>
+ </modal-footer>
+ </modal>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.spec.ts b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.spec.ts
new file mode 100644
index 0000000..f26e5fd
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.spec.ts
@@ -0,0 +1,199 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
+import { By, BrowserModule } from '@angular/platform-browser';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { Component, OnInit, ViewChild, Input } from '@angular/core';
+//import { ModalComponent } from '../../modal/modal.component';
+import { HttpUtilService } from '../../../../shared/services/httpUtil/http-util.service';
+import { MappingEditorService } from '../../../../shared/services/mapping-editor.service';
+import { ArtifactRequest } from '../../../../shared/models/index';
+import { ActivatedRoute, Router } from "@angular/router";
+import { saveAs } from "file-saver";
+import { NotificationService } from '../../../../shared/services/notification.service';
+import { NotificationsService } from "angular2-notifications"
+import { ParamShareService } from '../../../../shared/services/paramShare.service';
+import { DialogService } from "ng2-bootstrap-modal";
+import {ConfirmComponent} from '../../../../shared/confirmModal/confirm.component';
+import {BuildDesignComponent} from '../../build-artifacts.component';
+import { environment } from '../../../../../environments/environment';
+import { ModalComponent } from 'ng2-bs3-modal/ng2-bs3-modal'
+import { FormsModule } from '@angular/forms';
+import { RouterTestingModule } from '@angular/router/testing';
+import { HomeComponent } from '../../../../home/home/home.component';
+import { LogoutComponent } from '../../../../shared/components/logout/logout.component';
+import { HelpComponent } from '../../../../shared/components/help/help/help.component';
+import { AboutUsComponent } from '../../../../about-us/aboutus.component';
+import { TestComponent } from '../../../../test/test.component';
+import { HttpModule } from '@angular/http';
+import { AceEditorComponent } from 'ng2-ace-editor';
+import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';
+import { SimpleNotificationsModule } from 'angular2-notifications';
+import { GoldenConfigurationComponent } from './template-configuration.component';
+import { NgProgress } from 'ngx-progressbar';
+
+describe('GoldenConfigurationComponent', () => {
+ let component: GoldenConfigurationComponent;
+ let fixture: ComponentFixture<GoldenConfigurationComponent>;
+ let buildDesignComponent: BuildDesignComponent;
+ let paramShareService: ParamShareService;
+ let dialogService: DialogService;
+ let notificationService: NotificationService;
+ let httpUtil: HttpUtilService;
+ let mappingEditorService: MappingEditorService;
+ let activeRoutes: ActivatedRoute;
+ let router: Router;
+ let nService: NotificationsService
+ const routes = [
+ {
+ path: 'home',
+ component: HomeComponent
+ }, {
+ path: 'vnfs',
+ loadChildren: '../../../../vnfs/vnfs.module#VnfsModule'
+ }, {
+ path: 'test',
+ component: TestComponent
+ },
+ {
+ path: 'help',
+ component: HelpComponent
+ }, {
+ path: 'aboutUs',
+ component: AboutUsComponent
+ }, {
+ path: 'logout',
+ component: LogoutComponent
+ }, {
+ path: '',
+ redirectTo: '/home',
+ pathMatch: 'full'
+ }
+ ];
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ imports: [FormsModule, BrowserModule, RouterTestingModule.withRoutes(routes), HttpModule, Ng2Bs3ModalModule, SimpleNotificationsModule.forRoot()],
+ declarations: [GoldenConfigurationComponent, HomeComponent, TestComponent, HelpComponent, AboutUsComponent, LogoutComponent, AceEditorComponent],
+ providers: [BuildDesignComponent, NgProgress, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService, NotificationsService],
+ schemas: [NO_ERRORS_SCHEMA],
+ })
+
+ });
+
+ beforeEach(async(() => {
+ TestBed.compileComponents()
+
+ }));
+
+
+ it('validate if uploaded file should be xml or json', () => {
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ expect(component.validateUploadedFile('xls')).toBe(false);
+ expect(component.validateUploadedFile('json')).toBe(true);
+ expect(component.validateUploadedFile('xml')).toBe(true);
+ });
+
+
+ it('validate initialisation of variables in ngOnit() function', inject([MappingEditorService], (mappingEditorService: MappingEditorService) => {
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ mappingEditorService.latestAction = { "action": "Configure", "action-level": "vnf", "scope": { "vnf-type": "testVnf", "vnfc-type": "" }, "template": "Y", "vm": [], "device-protocol": "CHEF", "user-name": "", "port-number": "", "artifact-list": [{ "artifact-name": "template_Configure_test_0.0.1V.json", "artifact-type": "config_template" }, { "artifact-name": "pd_Configure_test_0.0.1V.yaml", "artifact-type": "parameter_definitions" }], "scopeType": "vnf-type" }
+
+ expect(component.ngOnInit());
+ expect(component.ngAfterViewInit());
+ expect(component.action).toEqual('Configure');
+ expect(component.vnfType).toEqual('testVnf');
+ expect(component.vnfcType).toEqual('');
+ expect(component.protocol).toEqual('CHEF');
+
+ expect(component.artifactName).toEqual('template_Configure_test_0.0.1V.json');
+
+ mappingEditorService.latestAction = { "action": "Configure", "action-level": "vnf", "scope": { "vnf-type": "testVnf", "vnfc-type": "testVnfc" }, "template": "Y", "vm": [], "device-protocol": "CHEF", "user-name": "", "port-number": "", "artifact-list": [{ "artifact-name": "template_Configure_test_0.0.1V.json", "artifact-type": "config_template" }, { "artifact-name": "pd_Configure_test_0.0.1V.yaml", "artifact-type": "parameter_definitions" }], "scopeType": "vnf-type" }
+ expect(component.ngOnInit());
+ expect(component.vnfcType).toEqual('testVnfc');
+
+
+ }));
+
+ it('check if variables are empty when reference data object is empty', inject([MappingEditorService], (mappingEditorService: MappingEditorService) => {
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ mappingEditorService.latestAction = { "action": "", "scope": { "vnf-type": "", "vnfc-type": "" }, "vm": [], "protocol": "", "download-dg-reference": "", "user-name": "", "port-number": "", "artifact-list": [], "deviceTemplate": "", "scopeType": "" };
+
+ expect(component.ngAfterViewInit());
+ expect(component.action).toEqual('');
+ expect(component.vnfType).toEqual('');
+ expect(component.vnfcType).toEqual('');
+ expect(component.protocol).toEqual('');
+ expect(component.artifactName).toEqual('');
+
+ }));
+
+ it('check if correct notification is fired while initialising if reference data object is undefined',()=>{
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ expect(component.ngAfterViewInit());
+ expect(component.Actions.length).toBe(0)
+ expect(component.enableBrowse).toBe(false)
+ });
+
+ it('test sync template when template data, param data and pd data are available', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ mappingEditorService.fromScreen === 'MappingScreen'
+ component.configMappingEditorContent="<configuration xmlns=\"http://xml.juniper.net/xnm/1.1/xnm\" \n xmlns:a=\"http://xml.juniper.net/junos/15.1X49/junos\" >\n <version>15.1X49-D50.3</version>\n <groups>\n <name>node0</name>\n <system>\n <tacplus-server>\n <name>${sync_auto-pop_name1}</name>\n <source-address>${sync_auto-pop_address1}</source-address>\n </tacplus-server>\n <tacplus-server>\n <name>${node0_tacplus_server_name2}</name>\n <source-address>${sync_auto-pop_address1}</source-address>\n </tacplus-server>\n </system> \n </groups>\n </configuration>"
+ mappingEditorService.initialise(component.templateeditor.getEditor(), component.configMappingEditorContent, component.modal);
+
+ var pdData=[{"name":"sync_auto-pop_name1","type":null,"description":null,"required":null,"default":null,"source":"A&AI","rule-type":"vnfc-oam-ipv4-address-list","request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":"unique-key-name","key-value":"parent-name"},{"key-name":"unique-key-value","key-value":"vnfc"},{"key-name":"field-key-name","key-value":"ipaddress-v4-oam-vip"},{"key-name":null,"key-value":"vm-number"},{"key-name":null,"key-value":"test"}],"ruleTypeValues":[null,"vnf-name","vm-name-list","vnfc-name-list","vnf-oam-ipv4-address","vnfc-oam-ipv4-address-list"],"showFilterFields":true,"enableFilterByValue":true},{"name":"sync_auto-pop_address1","type":null,"description":null,"required":null,"default":null,"source":"A&AI","rule-type":"vm-name-list","request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":"unique-key-name","key-value":"parent-name"},{"key-name":"unique-key-value","key-value":"vserver"},{"key-name":"field-key-name","key-value":"vserver-name"},{"key-name":null,"key-value":"vnfc-function-code"},{"key-name":null,"key-value":null}],"ruleTypeValues":[null,"vnf-name","vm-name-list","vnfc-name-list","vnf-oam-ipv4-address","vnfc-oam-ipv4-address-list"],"showFilterFields":true,"enableFilterByValue":true},{"name":"node0_tacplus_server_name2","type":null,"description":null,"required":null,"default":null,"source":"Manual","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}];
+ paramShareService.setSessionParamData([pdData]);
+ localStorage["paramsContent"]={
+ "sync_auto-pop_name1":"10.0.1.34",
+ "sync_auto-pop_address1":"",
+ "node0_tacplus_server_name2":"192.34.45.5"
+ };
+ expect(component.syncTemplate());
+
+
+ }));
+
+ it('test sync template when template data, param data and pd data are not available', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+ fixture = TestBed.createComponent(GoldenConfigurationComponent);
+ component = fixture.componentInstance;
+ mappingEditorService.fromScreen === 'MappingScreen'
+ component.configMappingEditorContent="<configuration xmlns=\"http://xml.juniper.net/xnm/1.1/xnm\" \n xmlns:a=\"http://xml.juniper.net/junos/15.1X49/junos\" >\n <version>15.1X49-D50.3</version>\n <groups>\n <name>node0</name>\n <system>\n <tacplus-server>\n <name>${sync_auto-pop_name1}</name>\n <source-address>${sync_auto-pop_address1}</source-address>\n </tacplus-server>\n <tacplus-server>\n <name>${node0_tacplus_server_name2}</name>\n <source-address>${sync_auto-pop_address1}</source-address>\n </tacplus-server>\n </system> \n </groups>\n </configuration>"
+ mappingEditorService.initialise(component.templateeditor.getEditor(), component.configMappingEditorContent, component.modal);
+
+ var pdData=[];
+ paramShareService.setSessionParamData([pdData]);
+ localStorage["paramsContent"]={};
+ expect(component.syncTemplate());
+
+
+ }));
+
+
+});
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts
new file mode 100644
index 0000000..8514e24
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-configuration/template-configuration.component.ts
@@ -0,0 +1,977 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, Input, OnInit, ViewChild } from '@angular/core';
+//import { ModalComponent } from '../../modal/modal.component';
+import { HttpUtilService } from '../../../../shared/services/httpUtil/http-util.service';
+import { MappingEditorService } from '../../../../shared/services/mapping-editor.service';
+import { ArtifactRequest } from '../../../../shared/models/index';
+import { ActivatedRoute, Router } from '@angular/router';
+import { saveAs } from 'file-saver';
+import { NotificationService } from '../../../../shared/services/notification.service';
+import { NotificationsService } from 'angular2-notifications';
+import { ParamShareService } from '../../../../shared/services/paramShare.service';
+import { DialogService } from 'ng2-bootstrap-modal';
+import { ConfirmComponent } from '../../../../shared/confirmModal/confirm.component';
+import { BuildDesignComponent } from '../../build-artifacts.component';
+import { environment } from '../../../../../environments/environment';
+import { ModalComponent } from 'ng2-bs3-modal/ng2-bs3-modal';
+import { NgProgress } from 'ngx-progressbar';
+declare var $: any
+
+@Component({ selector: 'app-golden-configuration', templateUrl: './template-configuration.component.html', styleUrls: ['./template-configuration.component.css'] })
+export class GoldenConfigurationComponent implements OnInit {
+ @ViewChild('templateeditor') templateeditor;
+ @Input() configMappingEditorContent: string;
+ @Input() isMappingComp: boolean;
+ @ViewChild('myInput') myInputVariable: any;
+ // @ViewChild(ModalComponent) modalComponent: ModalComponent;
+ @ViewChild('myModal') modal: ModalComponent;
+ aceText: string = ""
+ fileName: string = ""
+ showTemplateVersionDiv: any;
+ downloadedTemplateFileName: any;
+ downloadedParamFileName: any;
+ templateVersionNo: any = '0.0.1';
+ saveToGuiCacheFlag = 'false';
+ initialAction: any;
+ public referenceData: Array<Object> = [];
+ public scopeName: any;
+ public subscription: any;
+ public item: any = {};
+ public goldenActions: Array<string> = [];
+ public refNameObj = {};
+ public action = '';
+ public artifactName = '';
+ public type;
+ public showError: boolean = false;
+ public tempretrieveFlag: boolean = false;
+ public fileNameForTempSave;
+ initialData: any;
+ showDownloadDiv: boolean = false;
+ downloadType: any;
+ enableBrowse: boolean = true;
+ enableMerge: boolean = false;
+ uploadValidationSuccess: boolean = false;
+ fileExtension: any = "xml";
+ apiToken = localStorage['apiToken'];
+ public appDataObject: any;
+ public downloadDataObject: any;
+ public checkNameEntered: boolean = true;
+ public selectedWord: any = this.mappingEditorService.getSelectedWord();
+ public Actions = [
+ { action: "ConfigBackup", value: "ConfigBackup" },
+ { action: "ConfigModify", value: "ConfigModify" },
+ { action: "ConfigRestore", value: "ConfigRestore" },
+ { action: "Configure", value: "Configure" },
+ { action: "GetRunningConfig", value: "GetRunningConfig" },
+ { action: "HealthCheck", value: "HealthCheck" },
+ { action: "StartApplication", value: "StartApplication" },
+ { action: "StopApplication", value: "StopApplication" }
+ ];
+ options = {
+ timeOut: 1000,
+ showProgressBar: true,
+ pauseOnHover: true,
+ clickToClose: true,
+ maxLength: 200
+ }
+ public enableDownloadButtons: boolean = false;
+ constructor(private buildDesignComponent: BuildDesignComponent, private paramShareService: ParamShareService, private dialogService: DialogService, private notificationService: NotificationService, private httpUtil: HttpUtilService, private mappingEditorService: MappingEditorService, private activeRoutes: ActivatedRoute, private router: Router, private nService: NotificationsService, private ngProgress: NgProgress) {
+ this.artifactRequest.action = '';
+ this.artifactRequest.version = '';
+ this.artifactRequest.paramsContent = '{}';
+ this.artifactRequest.paramKeysContent = '';
+ }
+ public templateEditor: any;
+ public fileType: any = '';
+ public actionType: any;
+ public myfileName: any;
+ userId = localStorage['userId'];
+ public artifactRequest: ArtifactRequest = new ArtifactRequest();
+ public showUploadStatus: boolean = false;
+ public uploadStatus: boolean = false;
+ public uploadTypes = [
+ {
+ value: 'Generated Template',
+ display: 'Sample Json Param File'
+ },
+ {
+ value: 'Mapping Data',
+ display: 'Sample Json Param File'
+ }
+ ];
+ vnfType: any = '';
+ vnfcType: any = '';
+ protocol: any = '';
+ refObj: any;
+ editor: any;
+ editorContent: any;
+ tempName: any;
+ enableValidateTemplate: boolean = false;;
+ public selectedUploadType: string = this.uploadTypes[0].value;
+ identifier: any;
+ //this.mappingeditorservice.referenceNameObjects = object;PLEASE USE THIS OBJECT TO GET TEMPALLDATA
+ //====================================================
+ ngOnInit() {
+ var refObj = this.refObj = this.prepareFileName();
+ // console.log("Ref object: " + JSON.stringify(refObj))
+ if (refObj && refObj != undefined) {
+ // refObj = refObj[refObj.length - 1];
+ this.item = refObj;
+
+ this.vnfType = this.item.scope["vnf-type"];
+ this.vnfcType = this.item.scope["vnfc-type"];
+ this.protocol = this.item['device-protocol'];
+ this.action = this.item.action;
+ this.artifactRequest.action = this.item.action;
+ this.artifactRequest.vnfType = this.vnfType;
+ if (this.vnfcType != undefined && this.vnfcType.length != 0) {
+ this.scopeName = this.vnfcType;
+ }
+ else {
+ this.scopeName = this.vnfType;
+ }
+ }
+ else {
+ this.item = { "action": "", "scope": { "vnf-type": "", "vnfc-type": "" }, "vm": [], "protocol": "", "download-dg-reference": "", "user-name": "", "port-number": "", "artifact-list": [], "deviceTemplate": "", "scopeType": "" };
+ }
+ this.initialAction = this.item.action;
+ this.activeRoutes.url.subscribe(UrlSegment => {
+ this.actionType = UrlSegment[0].path
+ })
+ /*if (this.actionType === 'createTemplate') {
+ this.mappingEditorService.fromScreen = 'TemplateScreen';
+ }
+ if (this.actionType === 'updateTemplate') {*/
+ this.mappingEditorService.fromScreen = 'MappingScreen';
+ // }
+ this.identifier = this.mappingEditorService.identifier;
+ }
+ //========================== End of ngOnInit() Method============================================
+ ngOnDestroy() {
+ //console.log("Reference object =="+ JSON.stringify(this.refObj));
+ if (this.refObj && this.refObj != undefined) {
+ if (this.configMappingEditorContent && this.configMappingEditorContent != undefined) {
+ this.saveTemplate();
+ this.prepareAppData();
+ this.prepareDownloadData();
+ this.mappingEditorService.changeNavAppData(this.appDataObject);
+ this.mappingEditorService.changeNavDownloadData(this.downloadDataObject);
+ }
+ }
+ }
+ //========================== End of ngOnDestroy() Method============================================
+ ngAfterViewInit() {
+ if (this.mappingEditorService.latestAction) {
+ this.refNameObj = this.mappingEditorService.latestAction;
+ if (this.vnfcType !== 'null') {
+ this.type = this.vnfcType;
+ }
+ else {
+ this.type = this.vnfType;
+ }
+ for (let i = 0; i < this.refNameObj['artifact-list'].length; i++) {
+ let artifactList = this.refNameObj['artifact-list'];
+ if (artifactList[i]['artifact-type'] === 'config_template') {
+ this.artifactName = artifactList[i]['artifact-name'];
+ }
+ }
+ }
+ let self = this;
+ this.templateEditor = self.templateeditor.getEditor();
+ /* this.templateeditor.getEditor().commands.addCommand({
+ name: 'annotateCommand',
+ bindKey: { win: 'Ctrl-4', mac: 'Command-4' },
+ exec: function (editor) {
+ self.mappingEditorService.checkMethodCall(this.modal);
+ }
+ });*/
+ this.templateeditor.getEditor().commands.addCommand({
+ name: 'annotateCommand',
+ bindKey: { win: 'ENTER', mac: 'ENTER' },
+ exec: (editor: any) => {
+ this.handleAnnotation(this.modal);
+ }
+ });
+ if (this.mappingEditorService.fromScreen === 'MappingScreen') {
+ this.configMappingEditorContent = this.mappingEditorService.getTemplateMappingDataFromStore();
+ this.fileType = sessionStorage.getItem('fileType');
+ }
+ /* else if (this.mappingEditorService.fromScreen === 'TemplateScreen') {
+ this.configMappingEditorContent = this.mappingEditorService.getTemplateDataFromStore();
+ this.fileType = sessionStorage.getItem('fileType');
+ }*/
+ if (this.configMappingEditorContent) {
+ this.artifactRequest.templateContent = this.configMappingEditorContent;
+ this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
+ }
+ if (this.refObj) {
+ if (this.mappingEditorService.getTemplateMappingDataFromStore() && this.mappingEditorService.getTemplateMappingDataFromStore() != undefined) {
+ this.configMappingEditorContent = this.mappingEditorService.getTemplateMappingDataFromStore();
+ }
+ else {
+ if (this.artifactName) this.retrieveTemplateFromAppc();
+ }
+ }
+ else {
+ this.Actions = [];
+ this.enableBrowse = false;
+ this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
+ }
+ }
+
+ //========================== End of ngAfterViewInit() Method============================================
+ browseOption() {
+ $("#inputFile").trigger('click');
+ }
+ //========================== End of browseOption() Method============================================
+ /* openFile(event) {
+ let input = event.target;
+ this.fileName = event.currentTarget.value.replace(/C:\\fakepath\\/i, '');
+ for (let index = 0; index < input.files.length; index++) {
+ let reader = new FileReader();
+ reader.onload = () => {
+ this.configMappingEditorContent = reader.result;
+ }
+ reader.readAsText(input.files[index]);
+ };
+ }
+ //========================== End of openFile() Method============================================*/
+ //save to GUI
+ public saveTemplate() {
+ this.saveToGuiCacheFlag = 'true';
+ this.mappingEditorService.paramData = [];
+ if (this.configMappingEditorContent) {
+ this.initialData = this.configMappingEditorContent;
+ this.mappingEditorService.refreshEditor();
+ let paramArr: any = []
+ if (this.mappingEditorService.paramData && this.mappingEditorService.paramData != undefined) {
+ if (this.mappingEditorService.paramData.length === 0 && this.mappingEditorService.hasErrorCode === true) {
+ this.nService.error("Error", 'Special characters error', 'Error')
+ return;
+ }
+ else {
+ this.showError = false;
+ }
+ }
+ this.showTemplateVersionDiv = true;
+
+ if (this.mappingEditorService.fromScreen === 'MappingScreen') {
+ this.mappingEditorService.setTemplateMappingDataFromStore(this.configMappingEditorContent);
+ }
+ if (this.fileType === 'text/xml') {
+ sessionStorage.setItem('fileType', 'text/xml');
+ }
+ if (this.fileType === '') {
+ sessionStorage.setItem('fileType', '');
+ }
+ // paramArr = this.mappingEditorService.paramData;
+ // this.paramShareService.setTemplateData(paramArr)
+ }
+ }
+ //========================== End of saveTemplate() Method============================================
+ /* clearHighlight() {
+ this.mappingEditorService.removeTheSelectedMarkers();
+ }
+ //========================== End of clearHighlight() Method============================================*/
+ /*validateTemplate() {
+ var fileExtensionArr = this.fileType.split("/");
+ let data = {
+ "input": {
+ "design-request": {
+ "request-id": this.apiToken,
+ "action": "validateTemplate",
+ "data-type": fileExtensionArr[1].toUpperCase(),
+ "payload": this.configMappingEditorContent
+ }
+ }
+ };
+ let url = environment.validateTemplate;
+ this
+ .httpUtil
+ .post(
+ { url: url, data: data })
+ .subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === "success") {
+ this.uploadValidationSuccess = true;
+ this.nService.success("Success", "Template Validated succesfully");
+ return true;
+ }
+ else if (resp.output.status.code === '401') {
+ this.nService.error("Error", resp.output.status.message);
+ return false;
+ }
+ },
+ error => this.nService.error("Error", "Unable to validate the uploaded template. Error in connecting APPC Server"));
+ }
+ //========================== End of validateTemplate() Method============================================*/
+ retrieveTemplateFromAppc() {
+ let refObj = this.refObj;
+ if (refObj && refObj != undefined) {
+
+ let fileName = this.artifactName;
+ let payload = '{"userID": "' + this.userId + '","action": "' + this.item.action + '", "vnf-type" : "' + this.vnfType + '", "artifact-type":"APPC-CONFIG", "artifact-name":"' + fileName + '"}';
+ let input = {
+ "input": {
+ "design-request": {
+ "request-id": this.apiToken,
+ "action": "getArtifact",
+ "payload": payload
+ }
+ }
+ };
+ // console.log("Retrieve artifact payload=="+ payload);
+ let artifactContent: any;
+ this.ngProgress.start();
+ this.httpUtil.post({
+ url: environment.getDesigns,
+ data: input
+ }).subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === "success") {
+ this.nService.success("Success", "Template retrieved successfully from APPC");
+ let result = JSON.parse(resp.output.data.block).artifactInfo[0];
+ result = result['artifact-content'];
+ if ('Generated Template' === this.selectedUploadType) {
+ this.configMappingEditorContent = result
+ this.artifactRequest.templateContent = this.configMappingEditorContent;
+ this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
+ if (this.artifactRequest.templateContent) {
+ this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
+ }
+ }
+ this.tempretrieveFlag = true;
+ this.fileNameForTempSave = fileName;
+ this.enableDownloadButtons = true;
+ this.initialData = result;
+ this.saveTemplate();
+ }
+ else {
+ this.nService.info("Information", "There is no template saved in APPC for the selected action!");
+ }
+ this.ngProgress.done();
+ },
+ /* (error) => {
+ // this.showUploadErrorStatus = true;
+ // this.nService.error('Status','Error Connecting to the APPC Network')
+ //this.notificationService.notifyErrorMessage('Configuration Template file successfully uploaded..')
+ //this.uploadStatusError = true;
+ //window.scrollTo(0, 0)
+ // this. nService.error('Status','Error Connecting to the APPC Network')
+ this.openModel(true, "Could not retrieve latest template for given action""Error in connecting to APPC database")
+ });*/
+ error => this.nService.error("Error", "Error in connecting to APPC Server"));
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+ }
+ //========================== End of retrieveTemplateFromAppc() Method============================================
+ prepareAppData() {
+ let refObj = this.refObj;
+ //console.log("Reference object =="+ JSON.stringify(refObj));
+ if (refObj && refObj != undefined) {
+ // refObj = refObj[refObj.length - 1];
+ let paramsKeyValueFromEditor: JSON;
+ /* if (this.fileExtension.toUpperCase() === "XML")
+ paramsKeyValueFromEditor = this.mappingEditorService.generateParams(this.templateeditor.getEditor(), this.artifactRequest.templateContent);
+ else*/
+ // paramsKeyValueFromEditor = this.mappingEditorService.generateParams(this.templateeditor.getEditor(), this.artifactRequest.templateContent);
+ try {
+ paramsKeyValueFromEditor = JSON.parse(localStorage["paramsContent"]);
+ }
+ catch (error) {
+ console.log("Could not parse name value pairs==" + error);
+ }
+ if (paramsKeyValueFromEditor) {
+ this.showTemplateVersionDiv = true;
+ let action = this.item.action;
+ var scopeName = this.scopeName.replace(/ /g, '').replace(new RegExp('/', "g"), '_').replace(/ /g, '');
+ let fileName = this.updateParamFileName(refObj.action, scopeName, this.templateVersionNo);
+ let vnfType = this.vnfType;
+ let Json = [paramsKeyValueFromEditor];
+ let slashedPayload = this.appendSlashes(JSON.stringify(Json));
+ let newPayload =
+ {
+ "userID": this.userId,
+ "vnf-type": this.vnfType,
+ "action": action,
+ "artifact-name": fileName,
+ "artifact-type": "APPC-CONFIG",
+ "artifact-version": this.templateVersionNo,
+ "artifact-contents": slashedPayload
+ }
+ let data =
+ {
+ "input": {
+ "design-request": {
+ "request-id": this.apiToken,
+ "action": "uploadArtifact",
+ "payload": JSON.stringify(newPayload)
+
+ }
+ }
+ }
+ this.appDataObject.template.nameValueData = data;
+ }
+ if (this.configMappingEditorContent) {
+ let actualContent = this.configMappingEditorContent;
+ this.mappingEditorService.generateTemplate(this.templateEditor);
+ this.showTemplateVersionDiv = true;
+ let action = this.item.action;
+ let versionandFileType: any;
+ if (this.fileType === "text/xml") {
+
+ versionandFileType = this.templateVersionNo + 'V.xml'
+ } else {
+
+ versionandFileType = this.templateVersionNo + 'V.json'
+ }
+ let fileName: any;
+ if (this.tempretrieveFlag) {
+ fileName = this.fileNameForTempSave;
+ }
+ else {
+ // fileName = this.updateDownloadTemplateFileName(refObj.action, this.scopeName, versionandFileType);
+ fileName = this.artifactName;
+ }
+ let vnfType = this.vnfType;
+ let newPayload =
+ {
+ "userID": this.userId,
+ "vnf-type": this.vnfType,
+ "action": action,
+ "artifact-name": fileName,
+ "artifact-type": "APPC-CONFIG",
+ "artifact-version": this.templateVersionNo,
+ //"artifact-contents": this.configMappingEditorContent
+ "artifact-contents": this.configMappingEditorContent.replace(/\(([^()]|(R))*\)=\(/g, '').replace(/\)}/g, '}')
+
+ }
+ let data =
+ {
+ "input": {
+ "design-request": {
+ "request-id": this.apiToken,
+ "action": "uploadArtifact",
+ "payload": JSON.stringify(newPayload)
+
+ }
+ }
+ }
+ this.appDataObject.template.templateData = data;
+ this.mappingEditorService.initialise(this.templateeditor.getEditor(), actualContent, this.modal);
+ }
+ }
+ }
+ //========================== End of prepareAppData() Method============================================
+ /*retrieveNameValueFromAppc() {
+ let refObj: any = this.prepareFileName();
+ if (refObj && refObj != undefined) {
+ let fileName = this.updateParamFileName(this.item.action, this.scopeName, this.templateVersionNo);
+ let payload = '{"userID": "' + this.userId + '","action": "' + this.item.action + '", "vnf-type" : "' + this.vnfType + '", "artifact-type":"APPC-CONFIG", "artifact-name":"' + fileName + '"}';
+ let input = {
+ "input": {
+ "design-request": {
+ "request-id": this.apiToken,
+ "action": "getArtifact",
+ "payload": payload
+ }
+ }
+ };
+
+ let artifactContent: any;
+ this.httpUtil.post({
+ // url:"https://mtanjv9apdb51.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+ url: environment.getDesigns,
+ data: input
+ }).subscribe(resp => {
+ if (resp.output.status.code === '400' && resp.output.status.message === "success") {
+ this.openModel(true, 'Name/value pairs retrieved successfully from APPC', 'Success');
+ let result = JSON.parse(resp.output.data.block).artifactInfo[0];
+ result = JSON.parse(result['artifact-content']);
+ var jsonString = JSON.stringify(result[0]);
+ var string = jsonString.substring(1, jsonString.length - 1);
+ var stringArr = string.split(",");
+ var newStringArr = [];
+ var resultStr = "{\r\n"
+ for (var index in stringArr) {
+ newStringArr[index] = stringArr[index] + ",\r\n";
+ }
+ for (var index in newStringArr) {
+ resultStr = resultStr + newStringArr[index];
+ }
+ resultStr = resultStr.substring(0, resultStr.length - 3) + "\r\n}"
+ this.configMappingEditorContent = resultStr;
+
+ }
+ },
+ error => this.openModel(true, "Could not retrieve the name value pairs. Error in connecting to APPC Server", "ERROR"));
+ }
+ }*/
+ //========================== End of retrieveNameValueFromAppc() Method============================================
+ prepareFileName(): any {
+ let fileNameObject: any = this.mappingEditorService.latestAction;
+ this.appDataObject = this.mappingEditorService.appDataObject;
+ this.downloadDataObject = this.mappingEditorService.downloadDataObject;
+ this.referenceData = fileNameObject;
+ return fileNameObject;
+ }
+ //========================== End of prepareFileName() Method============================================
+ onDownloadParameter() {
+ let refObj = this.refObj;
+ if (refObj) {
+ // refObj = refObj[refObj.length - 1];
+ let paramsKeyValueFromEditor: JSON;
+ if (this.fileExtension.toUpperCase() === "XML")
+ paramsKeyValueFromEditor = this.mappingEditorService.generateParams(this.templateeditor.getEditor(), this.artifactRequest.templateContent);
+ else
+ paramsKeyValueFromEditor = this.mappingEditorService.generateParams(this.templateeditor.getEditor(), this.artifactRequest.templateContent);
+
+ try {
+ paramsKeyValueFromEditor = JSON.parse(localStorage["paramsContent"]);
+ }
+ catch (error) {
+ console.log("Could not parse name value pairs==" + error);
+ }
+ let theJSON = JSON.stringify(paramsKeyValueFromEditor, null, "\t")
+ var blob = new Blob([theJSON], {
+ type: "text/json"
+ });
+ this.showTemplateVersionDiv = true;
+ let fileName: any;
+ var scopeName = this.scopeName.replace(/ /g, '').replace(new RegExp('/', "g"), '_').replace(/ /g, '');
+ fileName = this.updateParamFileName(refObj.action, scopeName, this.templateVersionNo);
+ this.downloadDataObject.template.nameValueData = theJSON;
+ this.downloadDataObject.template.nameValueFileName = fileName;
+ }
+ else {
+ this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
+ }
+
+ }
+ //========================== End of onDownloadParameter() Method============================================
+ /* JSONToCSVConvertor(JSONData, fileName, ShowLabel) {
+ //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
+ var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
+ var CSV = '';
+ //This condition will generate the Label/Header
+ if (ShowLabel) {
+ var testRow = "";
+ for (var index in arrData[0]) {
+ CSV += index + '\t' + arrData[0][index] + '\r\n';
+ }
+ }
+ if (CSV == '') {
+ return;
+ }
+ //Initialize file format you want csv or xls
+ var uri = 'data:application/vnd.ms-excel,' + encodeURI(CSV);
+ var link = document.createElement("a");
+ link.href = uri;
+ link.download = fileName + ".xls";
+ //this part will append the anchor tag and remove it after automatic click
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ }
+ //========================== End of JSONToCSVConvertor() Method============================================
+ updateParamFileNameForXls(action: any, scopeName: any, versionNo: any) {
+ let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V';
+ this.downloadedParamFileName = fileName;
+ return fileName;
+ }
+ //========================== End of updateParamFileNameForXls() Method============================================*/
+ updateParamFileName(action: any, scopeName: any, versionNo: any) {
+ let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V.json';
+ this.downloadedParamFileName = fileName;
+ return fileName;
+ }
+ //========================== End of updateParamFileName() Method============================================
+ public onDownloadTemplate(artifact: string) {
+ let actualContent = this.configMappingEditorContent;
+ var textToSaveAsBlob: any;
+ var config_template_fileName: any
+ let refObj = this.refObj;
+ let versionandFileType: string;
+ this.mappingEditorService.generateTemplate(this.templateEditor);
+ if (artifact == 'Template' && this.artifactRequest && this.configMappingEditorContent && refObj) {
+ // refObj = refObj[refObj.length - 1];
+ this.showTemplateVersionDiv = true;
+ if (this.fileType === "text/xml") {
+ textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
+ type: "text/xml"
+ });
+ versionandFileType = this.templateVersionNo + 'V.xml'
+ }
+ if (this.fileType === "text/plain") {
+ textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
+ type: "text/plain"
+ });
+ versionandFileType = this.templateVersionNo + 'V.txt'
+ }
+ if (this.fileType === "text/json") {
+ textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
+ type: "text/json"
+ });
+ versionandFileType = this.templateVersionNo + 'V.json'
+ }
+ if (this.tempretrieveFlag) {
+ config_template_fileName = this.fileNameForTempSave;
+ var filextension = config_template_fileName.substring(config_template_fileName.indexOf("V") + 2, config_template_fileName.length);
+
+ textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
+ type: "text/" + filextension
+ });
+ }
+ else {
+ // config_template_fileName = this.updateDownloadTemplateFileName(refObj.action, this.scopeName, versionandFileType);
+ config_template_fileName = this.artifactName;
+ }
+ // saveAs(textToSaveAsBlob, config_template_fileName);
+ this.mappingEditorService.initialise(this.templateeditor.getEditor(), actualContent, this.modal);
+ //this.downloadDataObject.template.templateData = this.configMappingEditorContent;
+ this.downloadDataObject.template.templateData = this.configMappingEditorContent.replace(/\(([^()]|(R))*\)=\(/g, '').replace(/\)}/g, '}');
+ this.downloadDataObject.template.templateFileName = config_template_fileName;
+ }
+
+ }
+ //========================== End of onDownloadTemplate() Method============================================
+ updateDownloadTemplateFileName(action: any, scopeName: any, versionandFileType: any) {
+ let fileName = 'template_' + action + '_' + scopeName + '_' + versionandFileType;
+ this.downloadedTemplateFileName = fileName;
+ return fileName;
+ }
+ //========================== End of updateDownloadTemplateFileName() Method============================================
+ /* openModel(toShow: any, message: any, title: any) {
+ //this.modalComponent.isShow = toShow;
+ //this.modalComponent.message = message;
+ //this.modalComponent.title = title;
+ }
+ //========================== End of openModel() Method============================================*/
+ fileChange(input) {
+
+ let self = this;
+ let refObj = this.refObj;
+ this.enableValidateTemplate = true;
+
+ if (refObj && refObj != undefined) {
+ // refObj = refObj[refObj.length - 1];
+ if (input.files && input.files[0]) {
+ console.log("input files0" + JSON.stringify(input.files[0]))
+ this.myfileName = input.files[0].name;
+ this.fileName = input.files[0].name;
+ this.fileType = input.files[0].type;
+ // var fileExtension = this.myfileName.substr(this.myfileName.lastIndexOf('.') + 1);
+
+ let reader = new FileReader();
+ // if(this.validateUploadedFile(fileExtension))
+ //{
+ this.readFile(input.files[0], reader, (result) => {
+ if (this.fileType === 'text/xml') {
+ sessionStorage.setItem('fileType', 'text/xml');
+ }
+ if (this.fileName.endsWith(".json")) {
+ this.fileType = "text/json";
+ sessionStorage.setItem('fileType', 'text/json');
+ }
+ if (this.fileType === '') {
+ sessionStorage.setItem('fileType', '');
+ }
+
+
+ if ('Generated Template' === this.selectedUploadType) {
+ this.configMappingEditorContent = result
+ this.artifactRequest.templateContent = this.configMappingEditorContent;
+ console.log("editor content==" + JSON.stringify(this.configMappingEditorContent))
+ this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
+ if (this.artifactRequest.templateContent) {
+ this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
+ }
+ }
+ this.enableDownloadButtons = true;
+ this.initialData = result;
+ this.saveTemplate();
+
+ });
+ // }
+ // else{
+ // this.nService.error("Error", "Incorrect File Format")
+ //this.configMappingEditorContent=''
+ //}
+ }
+ else {
+ this.nService.error("Error", "Failed to read file");
+ }
+ this.myInputVariable.nativeElement.value = "";
+ }
+ else {
+ this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
+ return false;
+ }
+ }
+ //========================== End of fileChange() Method============================================
+ public readFile(file, reader, callback) {
+ // Set a callback funtion to fire after the file is fully loaded
+ reader.onload = () => {
+ // callback with the results
+ callback(reader.result);
+ }
+ this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
+ // Read the file
+ reader.readAsText(file, "UTF-8");
+ }
+ //========================== End of readFile() Method============================================
+ validateUploadedFile(fileExtension) {
+
+ if (fileExtension.toUpperCase() === 'json'.toUpperCase() || fileExtension.toUpperCase() === 'xml'.toUpperCase()) {
+ return true;
+ }
+ else {
+ return false;
+ }
+
+ }
+ //========================== End of validateUploadedFile() Method============================================
+ appendSlashes(artifactData) {
+ let x = artifactData.replace(new RegExp(',"', "g"), ',\"');
+ let y = x.replace(new RegExp('":', 'g'), '\":');
+ let z = y.replace(new RegExp('{"', 'g'), '{\"')
+ let t = z.replace(new RegExp(':"', 'g'), ':\"')
+ let m = t.replace(new RegExp('",', 'g'), '\",');
+ let n = y.replace(new RegExp('"}', 'g'), '\"}')
+ let nw = n.replace(new RegExp('{"', 'g'), '{\"');
+ let nw1 = nw.replace(new RegExp(':"', 'g'), ':\"');
+ let nw2 = nw1.replace(new RegExp('",', 'g'), '\",');
+ return nw2;
+ }
+ //========================== End of appendSlashes() Method============================================
+ prepareDownloadData() {
+ this.onDownloadParameter();
+ this.onDownloadTemplate('Template');
+ }
+ //========================== End of prepareDownloadData() Method============================================
+ syncTemplate() {
+ this.mappingEditorService.replaceNamesWithBlankValues();
+ this.saveTemplate();
+
+ var templateData = this.mappingEditorService.paramData; //template data array
+ // this.paramShareService.setTemplateData(templateData);
+
+ //console.log("Template Name value pairs ===" + JSON.stringify(templateData))
+ var pdData = this.paramShareService.getSessionParamData(); //PD data array
+ console.log("PD name value pairs===" + JSON.stringify(pdData))
+
+
+ var paramsContent = localStorage["paramsContent"];
+ console.log("Param content before==" + paramsContent);
+
+ if (paramsContent && paramsContent != undefined) {
+ try {
+ var paramTabData = JSON.parse(paramsContent);
+ //console.log("Param content after==" + paramsContent);
+ //console.log("Param tab data after==" + JSON.stringify(paramTabData))
+ }
+ catch (error) {
+ console.log("error is : " + error)
+ }
+ }
+ var resultArr = [];
+ var json = {};
+ var resultParamObj = {};
+ let checkNamesOnlyCondition: boolean = true;
+
+ if (templateData && templateData != undefined) {
+ templateData.forEach(function (item) {
+ if (item.paramValue !== "" && item.paramValue != undefined && item.paramValue != null) {
+ checkNamesOnlyCondition = false;
+ }
+
+ });
+
+ templateData.forEach(function (item) {
+ resultParamObj[item.paramName] = item.paramValue;
+ });
+ // console.log("pARAM Result array before is " + JSON.stringify(resultParamObj))
+ if (paramTabData && paramTabData != undefined) {
+ templateData.forEach(function (item) {
+ for (var index in paramTabData) {
+ if (item.paramName === index) {
+ if (checkNamesOnlyCondition) {
+ resultParamObj[index] = paramTabData[index];
+ }
+ else {
+ if (item.paramValue === "") {
+ resultParamObj[index] = paramTabData[index];
+ }
+ else {
+ resultParamObj[index] = item.paramValue;
+ }
+ }
+ }
+
+ }
+
+ });
+
+ }
+ localStorage["paramsContent"] = JSON.stringify(resultParamObj);
+ //console.log("param content after==" +JSON.stringify(resultParamObj));
+
+ //removing duplicate elements from the array
+ templateData = Array.from(new Set(templateData.map((itemInArray) => itemInArray.paramName)))
+
+ //reformatting arr1 to match with PD
+ templateData.forEach(function (item) {
+
+ resultArr.push({
+ "name": item,
+ "type": null,
+ "description": null,
+ "required": null,
+ "default": null,
+ "source": "Manual",
+ "rule-type": null,
+ "request-keys": [{
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }],
+ "response-keys": [{
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }, {
+ "key-name": null,
+ "key-value": null
+ }],
+ "ruleTypeValues": [null]
+
+ })
+ });
+ }
+ //console.log("Result array before is " + JSON.stringify(resultArr))
+ // console.log("Length before is: " + resultArr.length)
+
+ if (pdData && pdData != undefined) {
+ for (var i = 0; i < resultArr.length; i++) {
+
+ pdData.forEach(function (arr2item) {
+ if (resultArr[i].name === arr2item.name) {
+
+ var json = {
+ "name": arr2item.name,
+ "type": arr2item.type,
+ "description": arr2item.description,
+ "required": arr2item.required,
+ "default": arr2item.default,
+ "source": arr2item.source,
+ "rule-type": arr2item["rule-type"],
+ "request-keys": arr2item["request-keys"],
+ "response-keys": arr2item["response-keys"],
+ "ruleTypeValues": arr2item.ruleTypeValues
+ };
+ resultArr.splice(i, 1, json)
+ // console.log("Result array index ==" + JSON.stringify(resultArr[i]))
+ }
+
+ });
+
+ };
+
+ }
+ this.paramShareService.setSessionParamData(resultArr);
+ //console.log("Result array after is " + JSON.stringify(resultArr))
+ //console.log("Length after is: " + resultArr.length)
+ this.mappingEditorService.paramData = [];
+ //navigate to PD page after sync
+ this
+ .router
+ .navigate(['../../../vnfs/design/parameterDefinitions/create']);
+ }
+
+ //========================== End of syncTemplate() Method============================================
+ mergeParams() {
+ var mergeStatus: boolean = this.mappingEditorService.autoAnnotateDataForParams(this.fileType);
+ if (mergeStatus) {
+ this.nService.success("Success", "Merge Successful");
+ }
+ else {
+ this.nService.error("Error", "Merge Unsuccessful");
+ }
+ this.saveTemplate();
+ }
+ //========================== End of mergeParams() Method============================================
+ public handleAnnotation(modal) {
+
+ let selectedWord: string = this.templateeditor.getEditor().session.getTextRange(this.templateeditor.getEditor().selectionRange);
+ this.selectedWord = selectedWord;
+ modal.open();
+ }
+ //========================== End of handleAnnotations() Method============================================
+ public submitNameValues() {
+ /*var editor = this.templateeditor.getEditor()
+ this.editor = editor;
+ this.editor.session = editor.session;
+ this.editor.selection.session.$backMarkers = {};
+ this.editorContent = this.artifactRequest.templateContent;
+ this.editor.$blockScrolling = Infinity;
+ this.editor.$blockSelectEnabled = false;*/
+ if (this.tempName) {
+ this.checkNameEntered = true;
+
+ if (this.selectedWord) {
+ if (this.selectedWord.startsWith('${(')) {
+ var replaceWord: any = this.selectedWord.substring(3, this.selectedWord.indexOf(')=(')) + this.tempName;
+ this.templateeditor.getEditor().session.replace(this.templateeditor.getEditor().session.selection.getRange(), replaceWord);
+ } else {
+ let mappingKey = this.mappingEditorService.getKeysForValues(this.selectedWord);
+ var replaceWord: any = '${(' + this.selectedWord + ')=(' + this.tempName + ')}';
+ this.templateeditor.getEditor().session.replace(this.templateeditor.getEditor().session.selection.getRange(), replaceWord);
+ }
+ }
+ this.mappingEditorService.refreshEditor();
+ this.tempName = '';
+ this.modal.close();
+
+ }
+ else {
+ this.checkNameEntered = false;
+ }
+
+ }
+ //========================== End of submitNameValues() Method============================================
+}
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-holder.component.css b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.css
new file mode 100644
index 0000000..7c075eb
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-holder.component.html b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.html
new file mode 100644
index 0000000..6668ed1
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.html
@@ -0,0 +1,24 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-holder.component.spec.ts b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.spec.ts
new file mode 100644
index 0000000..22c71d1
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {GoldenConfigurationHolderComponent} from './template-holder.component';
+
+describe('GoldenConfigurationHolderComponent', () => {
+ let component: GoldenConfigurationHolderComponent;
+ let fixture: ComponentFixture<GoldenConfigurationHolderComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [GoldenConfigurationHolderComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(GoldenConfigurationHolderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/build-artifacts/template-holder/template-holder.component.ts b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.ts
new file mode 100644
index 0000000..33bed31
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/template-holder/template-holder.component.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-golden-configuration-holder',
+ templateUrl: './template-holder.component.html',
+ styleUrls: ['./template-holder.component.css']
+})
+export class GoldenConfigurationHolderComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/vnfs/myvnfs/myvnfs.component.css b/src/app/vnfs/myvnfs/myvnfs.component.css
new file mode 100644
index 0000000..c1b1169
--- /dev/null
+++ b/src/app/vnfs/myvnfs/myvnfs.component.css
@@ -0,0 +1,35 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+.build-button {
+ padding: 11px;
+ font-size: 20px;
+ color: green;
+ border: 1PX SOLID GREEN;
+ MARGIN-BOTTOM: 40PX
+}
+
+table.table th,
+table.table td {
+ padding: 0rem;
+}
\ No newline at end of file
diff --git a/src/app/vnfs/myvnfs/myvnfs.component.html b/src/app/vnfs/myvnfs/myvnfs.component.html
new file mode 100644
index 0000000..c214a2c
--- /dev/null
+++ b/src/app/vnfs/myvnfs/myvnfs.component.html
@@ -0,0 +1,132 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'" [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+<div class="container">
+ <div *ngIf="noData != true">
+ <div class="row">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+
+ </div>
+ <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
+ <input placeholder="filter table" class="form-control" type="text" [(ngModel)]="filterQuery" />
+ </div>
+ </div>
+ <div class="row">
+ <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
+ <div class="table-responsive" style="height:auto; overflow: auto;">
+ <table class="table">
+ <thead>
+ <tr>
+ <th>VNF TYPE <i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='vnf-type'" aria-hidden="true"></i></th>
+ <th>VNFC TYPE<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='vnfc-type'" aria-hidden="true"></i></th>
+ <!-- <th>INCART<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='subscriber'" aria-hidden="true"></i></th> -->
+ <!-- <th>PROTOCOL<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='protocol'" aria-hidden="true"></i></th>
+ <th>ACTION<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='action'" aria-hidden="true"></i></th> -->
+ <th>ARTIFACT NAME<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='artifact-name'" aria-hidden="true"></i></th>
+ <!-- <th>ARTIFACT TYPE<i class="fa fa-sort" (click)="sortOrder= !sortOrder; sortBy='artifact-type'"
+ aria-hidden="true"></i></th> -->
+ <th></th>
+ </tr>
+ </thead>
+
+ <tbody style="padding: 15px 25px">
+ <tr *ngFor="let item of vnfData | orderBy:sortBy:sortOrder | tableFilter:filterQuery:filter">
+ <td>{{item['vnf-type']}}</td>
+ <td>{{item['vnfc-type']}}</td>
+ <!-- <td>{{item.incart}}</td> -->
+ <!-- <td>{{item.protocol}}</td>
+ <td>{{item.action}}</td> -->
+ <td>{{item['artifact-name']}}</td>
+ <!-- <td>{{item['artifact-type']}}</td> -->
+ <td>
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="navigateToReference(item)"><i class="fa fa-edit"
+ aria-hidden="true"></i> View/Edit
+ </button>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div *ngIf="noData == true" class="text-center">
+ <div class="card">
+ <div class="mdl-dialog__content">
+ <div class="mdl-card__title">
+ <h2 class="mdl-card__title-text">You don't have any Artifacts</h2>
+ </div>
+ <div class="mdl-card__supporting-text">
+ {{noDataMsg}}
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="col-lg-12-ln2">
+ <button type="button" (click)="buildNewDesign(content)" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">Create New
+ VNF Type or VNFC Type
+ </button>
+ </div>
+</div>
+
+<ng-template #content let-c="close" let-d="dismiss">
+ <form ngNativeValidate (ngSubmit)="c('yes')">
+ <div class="modal-header">
+ <h4 class="modal-title">Enter VNF type and VNFC to proceed</h4>
+ <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+ <div class="modal-body">
+
+ <div class="form-group row">
+ <label for="example-text-input" class="col-12 col-form-label">Enter Vnf Type</label>
+ <div class="col-12">
+ <input required name="vnfType" class="form-control" [(ngModel)]="vnfType" type="text" id="vnfType">
+ </div>
+ </div>
+ <div class="form-check">
+ <label class="form-check-label">
+ <input name="vnfcRequired" class="form-check-input" [(ngModel)]="vnfcRequired" type="checkbox"
+ id="vnfcRequired">
+ Enter vnfc info
+ </label>
+ </div>
+ <div class="form-group row" *ngIf="vnfcRequired">
+ <label for="example-search-input" class="col-12 col-form-label">Enter Vnfc Type</label>
+ <div class="col-12">
+ <input required name="vnfcType" class="form-control" [(ngModel)]="vnfcType" type="text" id="vnfcType">
+ </div>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent
+
+ " (click)="c('yes')">Proceed anyway
+ </button>
+ <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">Next
+ </button>
+
+ </div>
+ </form>
+</ng-template>
\ No newline at end of file
diff --git a/src/app/vnfs/myvnfs/myvnfs.component.spec.ts b/src/app/vnfs/myvnfs/myvnfs.component.spec.ts
new file mode 100644
index 0000000..5e0c51f
--- /dev/null
+++ b/src/app/vnfs/myvnfs/myvnfs.component.spec.ts
@@ -0,0 +1,168 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
+import { NO_ERRORS_SCHEMA, Output } from '@angular/core';
+import { MyvnfsComponent } from './myvnfs.component';
+import { FormsModule } from '@angular/forms';
+import { NotificationService } from './../../shared/services/notification.service';
+import { ParamShareService } from './../../shared/services/paramShare.service';
+import { MappingEditorService } from './../../shared/services/mapping-editor.service';
+import { DialogService } from 'ng2-bootstrap-modal';
+import { RouterTestingModule } from '@angular/router/testing';
+import { HttpUtilService } from '.././../shared/services/httpUtil/http-util.service';
+import { UtilityService } from '.././../shared/services/utilityService/utility.service';
+// import{TableFilterPipe} from '.././../shared/modules/tidy-table/table-filter.pipe';
+import { TidyTableModule } from '../../shared/modules/tidy-table/tidy-table.module';
+import { NgModule } from '@angular/core';
+import { NgProgress } from 'ngx-progressbar';
+
+import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+ HttpModule,
+ Http,
+ Response,
+ ResponseOptions,
+ XHRBackend
+} from '@angular/http';
+
+import { MockBackend } from '@angular/http/testing';
+describe('MyvnfsComponent', () => {
+ let component: MyvnfsComponent;
+ let fixture: ComponentFixture<MyvnfsComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [MyvnfsComponent],
+ schemas: [NO_ERRORS_SCHEMA],
+ imports: [FormsModule, RouterTestingModule, TidyTableModule, HttpModule, NgbModule.forRoot()],
+ providers: [
+
+ { provide: XHRBackend, useClass: MockBackend },
+ NgProgress, UtilityService, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService]
+
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+
+ fixture = TestBed.createComponent(MyvnfsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create myvnfscomponent', () => {
+ expect(component).toBeTruthy();
+ });
+ it('Post call to get artifact', inject([HttpUtilService, XHRBackend], (httpUtilService, mockBackend) => {
+
+ const mockResponse = {
+ "output": {
+ "data": {
+ "block": "{\"userID\":\"ug0221\",\"designInfo\":[{\"vnf-type\":\"demo123\",\"vnfc-type\":\"null\",\"protocol\":\"\",\"incart\":\"N\",\"action\":\"AllAction\",\"artifact-name\":\"reference_AllAction_demo123_0.0.1V.json\",\"artifact-type\":\"APPC-CONFIG\"}],\"statusInfo\":null,\"artifactInfo\":null}",
+ "status":{
+ "code": "400",
+ "message": "success"
+ }
+ }
+ }
+ }
+
+ //"{'userID':'ug0221','designInfo':[{'vnf-type':'demo123','vnfc-type':'null','protocol':'','incart':'N','action':'AllAction','artifact-name':'reference_AllAction_demo123_0.0.1V.json','artifact-type':'APPC-CONFIG'}]}"
+ const data = {
+ 'input': {
+ 'design-request': {
+ 'request-id': "apiToken",
+ 'action': 'getDesigns',
+ 'payload': '{"userID": "","filter":"reference"}'
+ }
+ }
+ };
+
+
+ mockBackend.connections.subscribe((connection) => {
+ connection.mockRespond(new Response(new ResponseOptions({
+ body: JSON.stringify(mockResponse)
+ })));
+ });
+ component.getArtifacts(data)
+ httpUtilService.post({
+ url: "test url",
+ data: data
+ }).subscribe((resp) => {
+ console.log("resp")
+ console.log(resp)
+ let block = JSON.parse(resp.output.data.block)
+ expect(block.userID).toBe("ug0221");
+
+
+
+
+ });
+
+
+ }))
+ it('Checking for the successfull post call', inject([HttpUtilService, XHRBackend], (httpUtilService, mockBackend) => {
+
+ const mockResponse = {
+ "output": {
+ "data": {
+ "block": "{\"userID\":\"ug0221\",\"designInfo\":[{\"vnf-type\":\"demo123\",\"vnfc-type\":\"null\",\"protocol\":\"\",\"incart\":\"N\",\"action\":\"AllAction\",\"artifact-name\":\"reference_AllAction_demo123_0.0.1V.json\",\"artifact-type\":\"APPC-CONFIG\"}],\"statusInfo\":null,\"artifactInfo\":null}",
+ "status":{
+ "code": "400",
+ "message": "success"
+ }
+ }
+ }
+ }
+ const data = {
+ 'input': {
+ 'design-request': {
+ 'request-id': "apiToken",
+ 'action': 'getDesigns',
+ 'payload': '{"userID": "","filter":"reference"}'
+ }
+ }
+ };
+
+
+ mockBackend.connections.subscribe((connection) => {
+ connection.mockRespond(new Response(new ResponseOptions({
+ body: JSON.stringify(mockResponse)
+ })));
+ });
+ component.getArtifacts(data)
+ httpUtilService.post({
+ url: "test url",
+ data: data
+ }).subscribe((resp) => {
+ console.log("resp")
+ console.log(resp)
+ let block = JSON.parse(resp.output.data.status.code)
+ console.log("code",block)
+ expect(block).toBe(400);
+ });
+ }))
+});
diff --git a/src/app/vnfs/myvnfs/myvnfs.component.ts b/src/app/vnfs/myvnfs/myvnfs.component.ts
new file mode 100644
index 0000000..37ebe96
--- /dev/null
+++ b/src/app/vnfs/myvnfs/myvnfs.component.ts
@@ -0,0 +1,163 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { HttpUtilService } from '../../shared/services/httpUtil/http-util.service';
+import { MappingEditorService } from '../../shared/services/mapping-editor.service';
+import { ParamShareService } from '../../shared/services/paramShare.service';
+import { environment } from '../../../environments/environment';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { NgProgress } from 'ngx-progressbar';
+
+
+@Component({ selector: 'app-myvnfs', templateUrl: './myvnfs.component.html', styleUrls: ['./myvnfs.component.css'] })
+export class MyvnfsComponent implements OnInit {
+ vnfData: Array<Object> = [];
+ sortOrder = false;
+ noData = true;
+ sortBy: string;
+ filter: Object = {};
+ noDataMsg: string;
+ vnfType: any;
+ vnfcType: any;
+
+ constructor (private paramShareService: ParamShareService, private ngProgress: NgProgress, private httpUtil: HttpUtilService, private router: Router, private activeROute: ActivatedRoute,
+ private mappingEditorService: MappingEditorService, private modalService: NgbModal) {
+ }
+
+ ngOnInit() {
+
+ sessionStorage.setItem('updateParams', undefined);
+ this.mappingEditorService.latestAction = undefined;
+ const apiToken = localStorage['apiToken'];
+
+ const data = {
+ 'input': {
+ 'design-request': {
+ 'request-id': apiToken,
+ 'action': 'getDesigns',
+ 'payload': '{"userID": "","filter":"reference"}'
+ }
+ }
+ };
+ const x = JSON.parse(data.input['design-request']['payload']);
+ x.userID = localStorage['userId'];
+ data.input['design-request']['payload'] = JSON.stringify(x);
+ // console.log("input to payload====", JSON.stringify(data));
+ this.getArtifacts(data);
+ this.clearCache();
+ }
+
+ getArtifacts(data) {
+ this.ngProgress.start();
+ this.httpUtil.post({
+ url: environment.getDesigns,
+ data: data
+ })
+ .subscribe(resp => {
+ console.log("resp:",resp);
+ const tempObj = JSON.parse(resp.output.data.block);
+ this.vnfData = tempObj.designInfo;
+ if (this.vnfData == undefined || this.vnfData == null || this.vnfData.length == 0) {
+ this.noData = true;
+
+ this.noDataMsg = resp.output.data.status.message;
+ } else {
+ this.noData = false;
+ }
+ console.log(this.noData);
+ this.ngProgress.done();
+ });
+
+ this.filter = ['vnf-type', 'vnfc-type', 'artifact-name'];
+ setTimeout(() => {
+ this.ngProgress.done();
+ }, 3500);
+ }
+
+
+
+ getData() {
+ }
+
+ buildNewDesign(content) {
+
+ this.modalService.open(content).result.then(res => {
+ this.mappingEditorService.referenceNameObjects = undefined;
+ sessionStorage.setItem('vnfParams', JSON.stringify({ vnfType: this.vnfType, vnfcType: this.vnfcType }));
+ this
+ .router
+ .navigate([
+ 'vnfs', 'design', 'references'
+ ]);
+ });
+
+
+ }
+
+ navigateToReference(item) {
+ sessionStorage.setItem('updateParams', JSON.stringify(item));
+ this.mappingEditorService.referenceNameObjects = undefined;
+
+ this
+ .router
+ .navigate(['../design/references'], {
+ relativeTo: this.activeROute,
+ queryParams: {
+ id: item.id
+ }
+ });
+ }
+
+ navigateToRefrenceUpdate() {
+
+ this
+ .router
+ .navigate(['../design/references/update'], {
+ relativeTo: this.activeROute,
+ queryParams: {
+ id: '10'
+ }
+ });
+ }
+
+ clearCache() {
+ // get the value and save the userid and persist it.
+
+ this.mappingEditorService.setTemplateMappingDataFromStore(undefined);
+ localStorage['paramsContent'] = '{}';
+ this.mappingEditorService.setParamContent(undefined);
+ this.paramShareService.setSessionParamData(undefined);
+ const appData = { reference: {}, template: { templateData: {}, nameValueData: {} }, pd: {} };
+ const downloadData = {
+ reference: {},
+ template: { templateData: {}, nameValueData: {}, templateFileName: '', nameValueFileName: '' },
+ pd: { pdData: '', pdFileName: '' }
+ };
+ this.mappingEditorService.changeNavAppData(appData);
+ this.mappingEditorService.changeNavDownloadData(downloadData);
+ }
+
+
+}
\ No newline at end of file
diff --git a/src/app/vnfs/userlogin-form/userlogin-form.component.css b/src/app/vnfs/userlogin-form/userlogin-form.component.css
new file mode 100644
index 0000000..4df88b5
--- /dev/null
+++ b/src/app/vnfs/userlogin-form/userlogin-form.component.css
@@ -0,0 +1,27 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* .error-msg{
+
+ color: red
+} */
\ No newline at end of file
diff --git a/src/app/vnfs/userlogin-form/userlogin-form.component.html b/src/app/vnfs/userlogin-form/userlogin-form.component.html
new file mode 100644
index 0000000..af58842
--- /dev/null
+++ b/src/app/vnfs/userlogin-form/userlogin-form.component.html
@@ -0,0 +1,45 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<div class="container">
+ <div class="row">
+ <div class="col-lg-4 col-md-4 hidden-sm-down">
+ </div>
+ <div class="card">
+ <div class="mdl-dialog__content">
+ <form #userForm="ngForm" (ngSubmit)="getData()">
+ <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
+ <input placeholder="Enter user Id" class="mdl-textfield__input" id="userId" required
+ [(ngModel)]="userId" name="userId" value="" #user="ngModel">
+ </div>
+ <div class="form-group text-right">
+ <button type="submit" [disabled]="!userForm.form.valid"
+ class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary">
+ Submit
+ </button>
+ </div>
+ </form>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/vnfs/userlogin-form/userlogin-form.component.spec.ts b/src/app/vnfs/userlogin-form/userlogin-form.component.spec.ts
new file mode 100644
index 0000000..d253cb7
--- /dev/null
+++ b/src/app/vnfs/userlogin-form/userlogin-form.component.spec.ts
@@ -0,0 +1,96 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, inject, TestBed } from '@angular/core/testing';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { userloginFormComponent } from './userlogin-form.component';
+import { FormsModule } from '@angular/forms';
+import { NotificationService } from './../../shared/services/notification.service';
+import { ParamShareService } from './../../shared/services/paramShare.service';
+import { MappingEditorService } from './../../shared/services/mapping-editor.service';
+import { DialogService } from 'ng2-bootstrap-modal';
+import { RouterTestingModule } from '@angular/router/testing';
+import { HttpUtilService } from '.././../shared/services/httpUtil/http-util.service';
+import { UtilityService } from '.././../shared/services/utilityService/utility.service';
+import { Router } from '@angular/router';
+import {NotificationsService} from 'angular2-notifications';
+
+describe('userloginFormComponent', () => {
+ let component: userloginFormComponent;
+ let fixture: ComponentFixture<userloginFormComponent>;
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [userloginFormComponent],
+ schemas: [NO_ERRORS_SCHEMA],
+ imports: [FormsModule, RouterTestingModule,],
+ providers: [UtilityService, ParamShareService, DialogService, NotificationService,NotificationsService, HttpUtilService, MappingEditorService, {
+ provide: Router,
+ useClass: MockRouter
+ }, { provide: Router, useClass: MockRouter }]
+ })
+ .compileComponents();
+ }));
+ beforeEach(() => {
+ fixture = TestBed.createComponent(userloginFormComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ // localStorage['userId'] = "testUser"
+ component.userId = 'test Usr';
+ });
+
+ class MockRouter {
+ navigateByUrl(url: string) {
+ return url;
+ }
+
+ navigate(url: string) {
+ return url;
+ }
+ }
+ class MockUtility {
+ randomId() {
+ return 123;
+ }
+ }
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+ it('get the user Id', () => {
+ component.getData();
+ expect(localStorage.userId).toEqual('test Usr');
+ });
+
+ it('should route to myvnfform', inject([Router], (router: Router) => {
+ const spy = spyOn(router, 'navigate');
+ component.getData();
+ const url = spy.calls.first().args[0];
+
+
+ expect(url.length).toBe(2);
+ expect(url[0]).toEqual('vnfs');
+
+ expect(url[1]).toEqual('list');
+ }));
+
+});
diff --git a/src/app/vnfs/userlogin-form/userlogin-form.component.ts b/src/app/vnfs/userlogin-form/userlogin-form.component.ts
new file mode 100644
index 0000000..dfb665e
--- /dev/null
+++ b/src/app/vnfs/userlogin-form/userlogin-form.component.ts
@@ -0,0 +1,51 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, OnInit} from '@angular/core';
+import {Router} from '@angular/router';
+import {EmitterService} from '../../shared/services/emitter.service';
+import {UtilityService} from '../../shared/services/utilityService/utility.service';
+
+@Component({selector: 'app-mvnfs-form', templateUrl: './userlogin-form.component.html', styleUrls: ['./userlogin-form.component.css']})
+export class userloginFormComponent implements OnInit {
+
+ userId: string = '';
+
+ constructor(private router: Router, private utiltiy: UtilityService) {
+ }
+
+ ngOnInit() {
+ }
+
+ getData() {
+ localStorage['userId'] = this.userId;
+ localStorage['apiToken'] = this.utiltiy.randomId();
+ EmitterService
+ .get('userLogin')
+ .emit(this.userId);
+ this
+ .router
+ .navigate(['vnfs', 'list']);
+ }
+
+}
diff --git a/src/app/vnfs/vnf.routing.ts b/src/app/vnfs/vnf.routing.ts
new file mode 100644
index 0000000..b12530d
--- /dev/null
+++ b/src/app/vnfs/vnf.routing.ts
@@ -0,0 +1,132 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { GoldenConfigurationHolderComponent, } from './build-artifacts/template-holder/template-holder.component';
+import { MyvnfsComponent } from './myvnfs/myvnfs.component';
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { ReferenceDataformComponent } from './build-artifacts/reference-dataform/reference-dataform.component';
+import { GoldenConfigurationComponent } from './build-artifacts/template-holder/template-configuration/template-configuration.component';
+import { GoldenConfigurationMappingComponent } from './build-artifacts/template-holder/param-name-value/param-name-value.component';
+import { ParameterComponent } from './build-artifacts/parameter-definitions/parameter.component';
+import { ParameterHolderComponent } from './build-artifacts/parameter-holder/parameter-holder.component';
+import { VnfsComponent } from './vnfs/vnfs.component';
+import { BuildDesignComponent } from './build-artifacts/build-artifacts.component';
+import { userloginFormComponent } from './userlogin-form/userlogin-form.component';
+import { LoginGuardService } from './LoginGuardService/Login-guard-service';
+import { ReferenceDataHolderComponent } from './build-artifacts/reference-data-holder/reference-data-holder.component';
+
+
+const routes: Routes = [
+ {
+ path: '',
+ component: VnfsComponent,
+ children: [
+ {
+ path: '',
+ component: userloginFormComponent,
+ canActivate: [LoginGuardService],
+
+ }, {
+ path: 'list',
+ component: MyvnfsComponent
+
+ },
+
+ {
+ path: 'design',
+ component: BuildDesignComponent,
+ children: [
+ {
+ path: 'references',
+ component: ReferenceDataHolderComponent,
+ children: [
+ {
+ path: '',
+ component: ReferenceDataformComponent
+ }
+ ]
+ }, {
+ path: 'templates',
+ component: GoldenConfigurationHolderComponent,
+ // canActivate:[GCAuthGuardService],
+ children: [
+ {
+ path: 'configureTemplate',
+ component: GoldenConfigurationComponent
+ },
+ {
+ path: 'myTemplates',
+ component: GoldenConfigurationMappingComponent
+ }
+ , {
+ path: '',
+ redirectTo: 'myTemplates',
+ pathMatch: 'full'
+ }
+ ]
+ }, {
+ path: 'parameterDefinitions',
+ component: ParameterHolderComponent,
+ children: [
+ {
+ path: 'create',
+ component: ParameterComponent
+ },
+ {
+ path: 'update',
+ component: ParameterComponent
+ },
+ {
+ path: 'session',
+ component: ParameterComponent
+ },
+ {
+ path: 'key',
+ component: ParameterComponent
+ },
+ {
+ path: 'clearparams',
+ component: ParameterComponent
+ },
+ {
+ path: '',
+ redirectTo: 'create',
+ pathMatch: 'full'
+ }
+
+
+ ]
+ },
+ ]
+ }
+ ]
+ }
+];
+
+@NgModule({
+ imports: [RouterModule.forChild(routes)],
+ exports: [RouterModule]
+})
+export class VnfRoutingModule {
+}
\ No newline at end of file
diff --git a/src/app/vnfs/vnfs.module.ts b/src/app/vnfs/vnfs.module.ts
new file mode 100644
index 0000000..c63d24a
--- /dev/null
+++ b/src/app/vnfs/vnfs.module.ts
@@ -0,0 +1,93 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {NgModule} from '@angular/core';
+import {FormsModule} from '@angular/forms';
+import {CommonModule} from '@angular/common';
+// modules
+import {VnfRoutingModule} from './vnf.routing';
+import {SharedModule} from '../shared/shared.module';
+
+import {AceEditorComponent} from 'ng2-ace-editor';
+// components
+import {MyvnfsComponent} from './myvnfs/myvnfs.component';
+import {ReferenceDataformComponent} from './build-artifacts/reference-dataform/reference-dataform.component';
+import {GoldenConfigurationComponent} from './build-artifacts/template-holder/template-configuration/template-configuration.component';
+import {ParameterComponent} from './build-artifacts/parameter-definitions/parameter.component';
+import {ParameterHolderComponent} from './build-artifacts/parameter-holder/parameter-holder.component';
+import {BootstrapModalModule} from 'ng2-bootstrap-modal';
+import {BuildDesignComponent} from './build-artifacts/build-artifacts.component';
+import {userloginFormComponent} from './userlogin-form/userlogin-form.component';
+import {ReferenceDataHolderComponent} from './build-artifacts/reference-data-holder/reference-data-holder.component';
+import {ModalComponent} from '../shared/modal/modal.component';
+import {VnfsComponent} from './vnfs/vnfs.component';
+import {ConfirmComponent} from '../shared/confirmModal/confirm.component';
+import {GoldenConfigurationHolderComponent} from './build-artifacts/template-holder/template-holder.component';
+import {GoldenConfigurationMappingComponent} from './build-artifacts/template-holder/param-name-value/param-name-value.component';
+import {Tab} from './build-artifacts/template-holder/param-name-value/tab';
+import {Tabs} from './build-artifacts/template-holder/param-name-value/tabs';
+import {Ng2Bs3ModalModule} from 'ng2-bs3-modal/ng2-bs3-modal';
+import {AuthGuardModalComponent} from './auth-guard-modal/auth-guard-modal';
+import {GCAuthGuardService} from './GCAuthGuard/gcauth-guard.service';
+import {LoginGuardService} from './LoginGuardService/Login-guard-service';
+import {SimpleNotificationsModule} from 'angular2-notifications';
+
+
+export const components = [
+ BuildDesignComponent,
+ GoldenConfigurationComponent,
+ GoldenConfigurationMappingComponent,
+ ParameterComponent,
+ ParameterHolderComponent,
+ MyvnfsComponent,
+ userloginFormComponent,
+ VnfsComponent,
+ ReferenceDataformComponent,
+ ReferenceDataHolderComponent,
+ ModalComponent,
+ GoldenConfigurationHolderComponent,
+ AceEditorComponent,
+ Tab,
+ Tabs,
+ ConfirmComponent,
+ AuthGuardModalComponent,
+
+
+];
+
+export const modules = [
+ CommonModule, VnfRoutingModule, SharedModule.forRoot(),
+ FormsModule, BootstrapModalModule, Ng2Bs3ModalModule, SimpleNotificationsModule.forRoot()
+
+];
+
+@NgModule({
+ imports: [...modules],
+ declarations: [...components],
+ providers: [GCAuthGuardService, LoginGuardService],
+
+
+ entryComponents: [ConfirmComponent, AuthGuardModalComponent]
+})
+export class VnfsModule {
+}
\ No newline at end of file
diff --git a/src/app/vnfs/vnfs/vnfs.component.css b/src/app/vnfs/vnfs/vnfs.component.css
new file mode 100644
index 0000000..7c075eb
--- /dev/null
+++ b/src/app/vnfs/vnfs/vnfs.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
\ No newline at end of file
diff --git a/src/app/vnfs/vnfs/vnfs.component.html b/src/app/vnfs/vnfs/vnfs.component.html
new file mode 100644
index 0000000..6668ed1
--- /dev/null
+++ b/src/app/vnfs/vnfs/vnfs.component.html
@@ -0,0 +1,24 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<router-outlet></router-outlet>
\ No newline at end of file
diff --git a/src/app/vnfs/vnfs/vnfs.component.spec.ts b/src/app/vnfs/vnfs/vnfs.component.spec.ts
new file mode 100644
index 0000000..bb19213
--- /dev/null
+++ b/src/app/vnfs/vnfs/vnfs.component.spec.ts
@@ -0,0 +1,49 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+
+import {VnfsComponent} from './vnfs.component';
+
+describe('VnfsComponent', () => {
+ let component: VnfsComponent;
+ let fixture: ComponentFixture<VnfsComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [VnfsComponent]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(VnfsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/vnfs/vnfs/vnfs.component.ts b/src/app/vnfs/vnfs/vnfs.component.ts
new file mode 100644
index 0000000..0add612
--- /dev/null
+++ b/src/app/vnfs/vnfs/vnfs.component.ts
@@ -0,0 +1,39 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {Component, OnInit} from '@angular/core';
+
+@Component({
+ selector: 'app-vnfs',
+ templateUrl: './vnfs.component.html',
+ styleUrls: ['./vnfs.component.css']
+})
+export class VnfsComponent implements OnInit {
+
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/assets/.gitkeep b/src/assets/.gitkeep
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/assets/.gitkeep
diff --git a/src/assets/images/ic_play.png b/src/assets/images/ic_play.png
new file mode 100644
index 0000000..54b628d
--- /dev/null
+++ b/src/assets/images/ic_play.png
Binary files differ
diff --git a/src/assets/images/ic_play1.png b/src/assets/images/ic_play1.png
new file mode 100644
index 0000000..8609e0d
--- /dev/null
+++ b/src/assets/images/ic_play1.png
Binary files differ
diff --git a/src/assets/images/menu_icon.png b/src/assets/images/menu_icon.png
new file mode 100644
index 0000000..b7ffb92
--- /dev/null
+++ b/src/assets/images/menu_icon.png
Binary files differ
diff --git a/src/assets/images/menuicon.png b/src/assets/images/menuicon.png
new file mode 100644
index 0000000..b7ffb92
--- /dev/null
+++ b/src/assets/images/menuicon.png
Binary files differ
diff --git a/src/environments/environment.dev3.ts b/src/environments/environment.dev3.ts
new file mode 100644
index 0000000..38deafd
--- /dev/null
+++ b/src/environments/environment.dev3.ts
@@ -0,0 +1,37 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+export const environment = {
+ production: false,
+ getDesigns: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:dbservice',
+ //getDesigns: "http://localhost:9090/" + "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+
+ //getDesigns:"http://localhost:8443/restconf/operations/design-services:dbservice",
+ // validateTemplate:"https://"+window.location.hostname+":8443/restconf/operations/design-services:validator"
+ validateTemplate: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:validator',
+ testConfigure: 'https://' + window.location.hostname + ':8443/restconf/operations/appc-provider-lcm:configure'
+};
diff --git a/src/environments/environment.dev4.ts b/src/environments/environment.dev4.ts
new file mode 100644
index 0000000..38deafd
--- /dev/null
+++ b/src/environments/environment.dev4.ts
@@ -0,0 +1,37 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+export const environment = {
+ production: false,
+ getDesigns: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:dbservice',
+ //getDesigns: "http://localhost:9090/" + "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+
+ //getDesigns:"http://localhost:8443/restconf/operations/design-services:dbservice",
+ // validateTemplate:"https://"+window.location.hostname+":8443/restconf/operations/design-services:validator"
+ validateTemplate: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:validator',
+ testConfigure: 'https://' + window.location.hostname + ':8443/restconf/operations/appc-provider-lcm:configure'
+};
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
new file mode 100644
index 0000000..d0c6462
--- /dev/null
+++ b/src/environments/environment.prod.ts
@@ -0,0 +1,37 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+export const environment = {
+ production: true,
+ getDesigns: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:dbservice',
+ //getDesigns: "http://localhost:9090/" + "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+
+ //getDesigns:"http://localhost:8443/restconf/operations/design-services:dbservice",
+ // validateTemplate:"https://"+window.location.hostname+":8443/restconf/operations/design-services:validator"
+ validateTemplate: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:validator',
+ testConfigure: 'https://' + window.location.hostname + ':8443/restconf/operations/appc-provider-lcm:configure'
+};
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
new file mode 100644
index 0000000..37d7598
--- /dev/null
+++ b/src/environments/environment.ts
@@ -0,0 +1,60 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+export const environment = {
+ production: false,
+ //Environment for PROD
+
+ // getDesigns: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:dbservice',
+ // validateTemplate: 'https://' + window.location.hostname + ':8443/restconf/operations/design-services:validator',
+ // testVnf: 'https://' + window.location.hostname + ':8443/restconf/operations/appc-provider-lcm:',
+ // checkTestStatus: 'https://' + window.location.hostname + ':8443/restconf/operations/appc-provider-lcm:action-status'
+
+ // Evn for Dev3 should always be commented
+ //
+ // getDesigns: "https://mtanjv9apbc53.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+ // validateTemplate: "https://mtanjv9apbc53.aic.cip.att.com:8443/restconf/operations/design-services:validator",
+ // testVnf: "https://mtanjv9apbc53.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:",
+ // checkTestStatus: "https://mtanjv9apbc53.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:action-status"
+
+
+ // Evn for Dev1 should always be commented
+
+ getDesigns: "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+ validateTemplate: "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/design-services:validator",
+ testVnf: "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:",
+ checkTestStatus: "https://mtanjv9apbc51.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:action-status"
+
+ // Evn for Dev6 should always be commented
+
+ // getDesigns: "https://mtanjv9apdb53.aic.cip.att.com:8443/restconf/operations/design-services:dbservice",
+ // validateTemplate: "https://mtanjv9apdb53.aic.cip.att.com:8443/restconf/operations/design-services:validator",
+ // testVnf: "https://mtanjv9apdb53.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:",
+ // checkTestStatus: "https://mtanjv9apdb53.aic.cip.att.com:8443/restconf/operations/appc-provider-lcm:action-status"
+
+};
diff --git a/src/favicon.ico b/src/favicon.ico
new file mode 100644
index 0000000..68bee8a
--- /dev/null
+++ b/src/favicon.ico
Binary files differ
diff --git a/src/index.html b/src/index.html
new file mode 100644
index 0000000..0bdd78c
--- /dev/null
+++ b/src/index.html
@@ -0,0 +1,39 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>APPC Self Service Design Tool</title>
+ <base href="./index.html">
+
+
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="icon" type="image/x-icon" href="favicon.ico">
+
+</head>
+<body>
+<app-root></app-root>
+</body>
+</html>
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..76bd61f
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,35 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import {enableProdMode} from '@angular/core';
+import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
+
+import {AppModule} from './app/app.module';
+import {environment} from './environments/environment';
+
+if (environment.production) {
+ enableProdMode();
+}
+
+
+platformBrowserDynamic().bootstrapModule(AppModule);
diff --git a/src/main/assembly/assembly.xml b/src/main/assembly/assembly.xml
new file mode 100644
index 0000000..9fc9018
--- /dev/null
+++ b/src/main/assembly/assembly.xml
@@ -0,0 +1,38 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+-->
+<assembly
+ xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+ xmlns="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.2"
+ xsi:schemaLocation="http://maven.apache.org/plugins/maven-assembly-plugin/assembly/1.1.2 http://maven.apache.org/xsd/assembly-1.1.2.xsd">
+ <id>zip</id>
+ <formats>
+ <format>zip</format>
+ </formats>
+ <includeBaseDirectory>false</includeBaseDirectory>
+ <fileSets>
+ <fileSet>
+ <directory>dist/</directory>
+ <outputDirectory>config-design-tool/</outputDirectory>
+ </fileSet>
+ </fileSets>
+</assembly>
\ No newline at end of file
diff --git a/src/material.css b/src/material.css
new file mode 100644
index 0000000..7891482
--- /dev/null
+++ b/src/material.css
@@ -0,0 +1,13487 @@
+/**
+ * material-design-lite - Material Design Components in CSS, JS and HTML
+ * @version v1.3.0
+ * @license Apache-2.0
+ * @copyright 2015 Google, Inc.
+ * @link https://github.com/google/material-design-lite
+ */
+@charset "UTF-8";
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Material Design Lite */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/*
+ * What follows is the result of much research on cross-browser styling.
+ * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
+ * Kroc Camen, and the H5BP dev community and team.
+ */
+/* ==========================================================================
+ Base styles: opinionated defaults
+ ========================================================================== */
+html {
+ color: rgba(0, 0, 0, 0.87);
+ font-size: 1em;
+ line-height: 1.4;
+}
+
+/*
+ * Remove text-shadow in selection highlight:
+ * https://twitter.com/miketaylr/status/12228805301
+ *
+ * These selection rule sets have to be separate.
+ * Customize the background color to match your design.
+ */
+::-moz-selection {
+ background: #b3d4fc;
+ text-shadow: none;
+}
+
+::selection {
+ background: #b3d4fc;
+ text-shadow: none;
+}
+
+/*
+ * A better looking default horizontal rule
+ */
+hr {
+ display: block;
+ height: 1px;
+ border: 0;
+ border-top: 1px solid #ccc;
+ margin: 1em 0;
+ padding: 0;
+}
+
+/*
+ * Remove the gap between audio, canvas, iframes,
+ * images, videos and the bottom of their containers:
+ * https://github.com/h5bp/html5-boilerplate/issues/440
+ */
+audio,
+canvas,
+iframe,
+img,
+svg,
+video {
+ vertical-align: middle;
+}
+
+/*
+ * Remove default fieldset styles.
+ */
+fieldset {
+ border: 0;
+ margin: 0;
+ padding: 0;
+}
+
+/*
+ * Allow only vertical resizing of textareas.
+ */
+textarea {
+ resize: vertical;
+}
+
+/* ==========================================================================
+ Browser Upgrade Prompt
+ ========================================================================== */
+.browserupgrade {
+ margin: 0.2em 0;
+ background: #ccc;
+ color: #000;
+ padding: 0.2em 0;
+}
+
+/* ==========================================================================
+ Author's custom styles
+ ========================================================================== */
+/* ==========================================================================
+ Helper classes
+ ========================================================================== */
+/*
+ * Hide visually and from screen readers:
+ */
+.hidden {
+ display: none !important;
+}
+
+/*
+ * Hide only visually, but have it available for screen readers:
+ * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+ */
+.visuallyhidden {
+ border: 0;
+ clip: rect(0 0 0 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+}
+
+/*
+ * Extends the .visuallyhidden class to allow the element
+ * to be focusable when navigated to via the keyboard:
+ * https://www.drupal.org/node/897638
+ */
+.visuallyhidden.focusable:active,
+.visuallyhidden.focusable:focus {
+ clip: auto;
+ height: auto;
+ margin: 0;
+ overflow: visible;
+ position: static;
+ width: auto;
+}
+
+/*
+ * Hide visually and from screen readers, but maintain layout
+ */
+.invisible {
+ visibility: hidden;
+}
+
+/*
+ * Clearfix: contain floats
+ *
+ * For modern browsers
+ * 1. The space content is one way to avoid an Opera bug when the
+ * `contenteditable` attribute is included anywhere else in the document.
+ * Otherwise it causes space to appear at the top and bottom of elements
+ * that receive the `clearfix` class.
+ * 2. The use of `table` rather than `block` is only necessary if using
+ * `:before` to contain the top-margins of child elements.
+ */
+.clearfix:before,
+.clearfix:after {
+ content: " ";
+ /* 1 */
+ display: table;
+ /* 2 */
+}
+
+.clearfix:after {
+ clear: both;
+}
+
+/* ==========================================================================
+ EXAMPLE Media Queries for Responsive Design.
+ These examples override the primary ('mobile first') styles.
+ Modify as content requires.
+ ========================================================================== */
+@media only screen and (min-width: 35em) {
+ /* Style adjustments for viewports that meet the condition */
+}
+
+@media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) {
+ /* Style adjustments for high resolution devices */
+}
+
+/* ==========================================================================
+ Print styles.
+ Inlined to avoid the additional HTTP request:
+ http://www.phpied.com/delay-loading-your-print-css/
+ ========================================================================== */
+@media print {
+ *,
+ *:before,
+ *:after,
+ *:first-letter {
+ background: transparent !important;
+ color: #000 !important;
+ /* Black prints faster: http://www.sanbeiji.com/archives/953 */
+ box-shadow: none !important;
+ }
+
+ a,
+ a:visited {
+ text-decoration: underline;
+ }
+
+ a[href]:after {
+ content: " (" attr(href) ")";
+ }
+
+ abbr[title]:after {
+ content: " (" attr(title) ")";
+ }
+
+ /*
+ * Don't show links that are fragment identifiers,
+ * or use the `javascript:` pseudo protocol
+ */
+ a[href^="#"]:after,
+ a[href^="javascript:"]:after {
+ content: "";
+ }
+
+ pre,
+ blockquote {
+ border: 1px solid #999;
+ page-break-inside: avoid;
+ }
+
+ /*
+ * Printing Tables:
+ * http://css-discuss.incutio.com/wiki/Printing_Tables
+ */
+ thead {
+ display: table-header-group;
+ }
+
+ tr,
+ img {
+ page-break-inside: avoid;
+ }
+
+ img {
+ max-width: 100% !important;
+ }
+
+ p,
+ h2,
+ h3 {
+ orphans: 3;
+ widows: 3;
+ }
+
+ h2,
+ h3 {
+ page-break-after: avoid;
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Remove the unwanted box around FAB buttons */
+/* More info: http://goo.gl/IPwKi */
+a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
+.mdl-icon-toggle, .mdl-item, .mdl-radio, .mdl-slider, .mdl-switch, .mdl-tabs__tab {
+ -webkit-tap-highlight-color: transparent;
+ -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
+}
+
+/*
+ * Make html take up the entire screen
+ * Then set touch-action to avoid touch delay on mobile IE
+ */
+html {
+ width: 100%;
+ height: 100%;
+ -ms-touch-action: manipulation;
+ touch-action: manipulation;
+}
+
+/*
+* Make body take up the entire screen
+* Remove body margin so layout containers don't cause extra overflow.
+*/
+body {
+ width: 100%;
+ min-height: 100%;
+ margin: 0;
+}
+
+/*
+ * Main display reset for IE support.
+ * Source: http://weblog.west-wind.com/posts/2015/Jan/12/main-HTML5-Tag-not-working-in-Internet-Explorer-91011
+ */
+main {
+ display: block;
+}
+
+/*
+* Apply no display to elements with the hidden attribute.
+* IE 9 and 10 support.
+*/
+*[hidden] {
+ display: none !important;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+html, body {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 20px;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+ margin: 0;
+ padding: 0;
+}
+
+/**
+ * Styles for HTML elements
+ */
+h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
+ font-family: "Roboto";
+ font-size: 56px;
+ font-weight: 400;
+ line-height: 1.35;
+ letter-spacing: -0.02em;
+ opacity: 0.54;
+ font-size: 0.6em;
+}
+
+h1 {
+ font-family: "Roboto";
+ font-size: 56px;
+ font-weight: 400;
+ line-height: 1.35;
+ letter-spacing: -0.02em;
+ margin-top: 24px;
+ margin-bottom: 24px;
+}
+
+h2 {
+ font-family: "Roboto";
+ font-size: 45px;
+ font-weight: 400;
+ line-height: 48px;
+ margin-top: 24px;
+ margin-bottom: 24px;
+}
+
+h3 {
+ font-family: "Roboto";
+ font-size: 34px;
+ font-weight: 400;
+ line-height: 40px;
+ margin-top: 24px;
+ margin-bottom: 24px;
+}
+
+h4 {
+ font-family: "Roboto";
+ font-size: 24px;
+ font-weight: 400;
+ line-height: 32px;
+ -moz-osx-font-smoothing: grayscale;
+ margin-top: 24px;
+ margin-bottom: 16px;
+}
+
+h5 {
+ font-family: "Roboto";
+ font-size: 20px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0.02em;
+ margin-top: 24px;
+ margin-bottom: 16px;
+}
+
+h6 {
+ font-family: "Roboto";
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0.04em;
+ margin-top: 24px;
+ margin-bottom: 16px;
+}
+
+p {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ margin-bottom: 16px;
+}
+
+a {
+ color: rgb(255, 64, 129);
+ font-weight: 500;
+}
+
+blockquote {
+ font-family: "Roboto";
+ position: relative;
+ font-size: 24px;
+ font-weight: 300;
+ font-style: italic;
+ line-height: 1.35;
+ letter-spacing: 0.08em;
+}
+
+blockquote:before {
+ position: absolute;
+ left: -0.5em;
+ content: '“';
+}
+
+blockquote:after {
+ content: '”';
+ margin-left: -0.05em;
+}
+
+mark {
+ background-color: #f4ff81;
+}
+
+dt {
+ font-weight: 700;
+}
+
+address {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+ font-style: normal;
+}
+
+ul, ol {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+}
+
+/**
+ * Class Name Styles
+ */
+.mdl-typography--display-4 {
+ font-family: "Roboto";
+ font-size: 112px;
+ font-weight: 300;
+ line-height: 1;
+ letter-spacing: -0.04em;
+}
+
+.mdl-typography--display-4-color-contrast {
+ font-family: "Roboto";
+ font-size: 112px;
+ font-weight: 300;
+ line-height: 1;
+ letter-spacing: -0.04em;
+ opacity: 0.54;
+}
+
+.mdl-typography--display-3 {
+ font-family: "Roboto";
+ font-size: 56px;
+ font-weight: 400;
+ line-height: 1.35;
+ letter-spacing: -0.02em;
+}
+
+.mdl-typography--display-3-color-contrast {
+ font-family: "Roboto";
+ font-size: 56px;
+ font-weight: 400;
+ line-height: 1.35;
+ letter-spacing: -0.02em;
+ opacity: 0.54;
+}
+
+.mdl-typography--display-2 {
+ font-family: "Roboto";
+ font-size: 45px;
+ font-weight: 400;
+ line-height: 48px;
+}
+
+.mdl-typography--display-2-color-contrast {
+ font-family: "Roboto";
+ font-size: 45px;
+ font-weight: 400;
+ line-height: 48px;
+ opacity: 0.54;
+}
+
+.mdl-typography--display-1 {
+ font-family: "Roboto";
+ font-size: 34px;
+ font-weight: 400;
+ line-height: 40px;
+}
+
+.mdl-typography--display-1-color-contrast {
+ font-family: "Roboto";
+ font-size: 34px;
+ font-weight: 400;
+ line-height: 40px;
+ opacity: 0.54;
+}
+
+.mdl-typography--headline {
+ font-family: "Roboto";
+ font-size: 24px;
+ font-weight: 400;
+ line-height: 32px;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+.mdl-typography--headline-color-contrast {
+ font-family: "Roboto";
+ font-size: 24px;
+ font-weight: 400;
+ line-height: 32px;
+ -moz-osx-font-smoothing: grayscale;
+ opacity: 0.87;
+}
+
+.mdl-typography--title {
+ font-family: "Roboto";
+ font-size: 20px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0.02em;
+}
+
+.mdl-typography--title-color-contrast {
+ font-family: "Roboto";
+ font-size: 20px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0.02em;
+ opacity: 0.87;
+}
+
+.mdl-typography--subhead {
+ font-family: "Roboto";
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0.04em;
+}
+
+.mdl-typography--subhead-color-contrast {
+ font-family: "Roboto";
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0.04em;
+ opacity: 0.87;
+}
+
+.mdl-typography--body-2 {
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 24px;
+ letter-spacing: 0;
+}
+
+.mdl-typography--body-2-color-contrast {
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 24px;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--body-1 {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+}
+
+.mdl-typography--body-1-color-contrast {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--body-2-force-preferred-font {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 24px;
+ letter-spacing: 0;
+}
+
+.mdl-typography--body-2-force-preferred-font-color-contrast {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 24px;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--body-1-force-preferred-font {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+}
+
+.mdl-typography--body-1-force-preferred-font-color-contrast {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--caption {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+}
+
+.mdl-typography--caption-force-preferred-font {
+ font-family: "Roboto";
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+}
+
+.mdl-typography--caption-color-contrast {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+ opacity: 0.54;
+}
+
+.mdl-typography--caption-force-preferred-font-color-contrast {
+ font-family: "Roboto";
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+ opacity: 0.54;
+}
+
+.mdl-typography--menu {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0;
+}
+
+.mdl-typography--menu-color-contrast {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--button {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ text-transform: uppercase;
+ line-height: 1;
+ letter-spacing: 0;
+}
+
+.mdl-typography--button-color-contrast {
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ text-transform: uppercase;
+ line-height: 1;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-typography--text-left {
+ text-align: left;
+}
+
+.mdl-typography--text-right {
+ text-align: right;
+}
+
+.mdl-typography--text-center {
+ text-align: center;
+}
+
+.mdl-typography--text-justify {
+ text-align: justify;
+}
+
+.mdl-typography--text-nowrap {
+ white-space: nowrap;
+}
+
+.mdl-typography--text-lowercase {
+ text-transform: lowercase;
+}
+
+.mdl-typography--text-uppercase {
+ text-transform: uppercase;
+}
+
+.mdl-typography--text-capitalize {
+ text-transform: capitalize;
+}
+
+.mdl-typography--font-thin {
+ font-weight: 200 !important;
+}
+
+.mdl-typography--font-light {
+ font-weight: 300 !important;
+}
+
+.mdl-typography--font-regular {
+ font-weight: 400 !important;
+}
+
+.mdl-typography--font-medium {
+ font-weight: 500 !important;
+}
+
+.mdl-typography--font-bold {
+ font-weight: 700 !important;
+}
+
+.mdl-typography--font-black {
+ font-weight: 900 !important;
+}
+
+.material-icons {
+ font-family: 'Material Icons';
+ font-weight: normal;
+ font-style: normal;
+ font-size: 24px;
+ line-height: 1;
+ letter-spacing: normal;
+ text-transform: none;
+ display: inline-block;
+ word-wrap: normal;
+ -moz-font-feature-settings: 'liga';
+ font-feature-settings: 'liga';
+ -webkit-font-feature-settings: 'liga';
+ -webkit-font-smoothing: antialiased;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-color-text--red {
+ color: rgb(244, 67, 54) !important;
+}
+
+.mdl-color--red {
+ background-color: rgb(244, 67, 54) !important;
+}
+
+.mdl-color-text--red-50 {
+ color: rgb(255, 235, 238) !important;
+}
+
+.mdl-color--red-50 {
+ background-color: rgb(255, 235, 238) !important;
+}
+
+.mdl-color-text--red-100 {
+ color: rgb(255, 205, 210) !important;
+}
+
+.mdl-color--red-100 {
+ background-color: rgb(255, 205, 210) !important;
+}
+
+.mdl-color-text--red-200 {
+ color: rgb(239, 154, 154) !important;
+}
+
+.mdl-color--red-200 {
+ background-color: rgb(239, 154, 154) !important;
+}
+
+.mdl-color-text--red-300 {
+ color: rgb(229, 115, 115) !important;
+}
+
+.mdl-color--red-300 {
+ background-color: rgb(229, 115, 115) !important;
+}
+
+.mdl-color-text--red-400 {
+ color: rgb(239, 83, 80) !important;
+}
+
+.mdl-color--red-400 {
+ background-color: rgb(239, 83, 80) !important;
+}
+
+.mdl-color-text--red-500 {
+ color: rgb(244, 67, 54) !important;
+}
+
+.mdl-color--red-500 {
+ background-color: rgb(244, 67, 54) !important;
+}
+
+.mdl-color-text--red-600 {
+ color: rgb(229, 57, 53) !important;
+}
+
+.mdl-color--red-600 {
+ background-color: rgb(229, 57, 53) !important;
+}
+
+.mdl-color-text--red-700 {
+ color: rgb(211, 47, 47) !important;
+}
+
+.mdl-color--red-700 {
+ background-color: rgb(211, 47, 47) !important;
+}
+
+.mdl-color-text--red-800 {
+ color: rgb(198, 40, 40) !important;
+}
+
+.mdl-color--red-800 {
+ background-color: rgb(198, 40, 40) !important;
+}
+
+.mdl-color-text--red-900 {
+ color: rgb(183, 28, 28) !important;
+}
+
+.mdl-color--red-900 {
+ background-color: rgb(183, 28, 28) !important;
+}
+
+.mdl-color-text--red-A100 {
+ color: rgb(255, 138, 128) !important;
+}
+
+.mdl-color--red-A100 {
+ background-color: rgb(255, 138, 128) !important;
+}
+
+.mdl-color-text--red-A200 {
+ color: rgb(255, 82, 82) !important;
+}
+
+.mdl-color--red-A200 {
+ background-color: rgb(255, 82, 82) !important;
+}
+
+.mdl-color-text--red-A400 {
+ color: rgb(255, 23, 68) !important;
+}
+
+.mdl-color--red-A400 {
+ background-color: rgb(255, 23, 68) !important;
+}
+
+.mdl-color-text--red-A700 {
+ color: rgb(213, 0, 0) !important;
+}
+
+.mdl-color--red-A700 {
+ background-color: rgb(213, 0, 0) !important;
+}
+
+.mdl-color-text--pink {
+ color: rgb(233, 30, 99) !important;
+}
+
+.mdl-color--pink {
+ background-color: rgb(233, 30, 99) !important;
+}
+
+.mdl-color-text--pink-50 {
+ color: rgb(252, 228, 236) !important;
+}
+
+.mdl-color--pink-50 {
+ background-color: rgb(252, 228, 236) !important;
+}
+
+.mdl-color-text--pink-100 {
+ color: rgb(248, 187, 208) !important;
+}
+
+.mdl-color--pink-100 {
+ background-color: rgb(248, 187, 208) !important;
+}
+
+.mdl-color-text--pink-200 {
+ color: rgb(244, 143, 177) !important;
+}
+
+.mdl-color--pink-200 {
+ background-color: rgb(244, 143, 177) !important;
+}
+
+.mdl-color-text--pink-300 {
+ color: rgb(240, 98, 146) !important;
+}
+
+.mdl-color--pink-300 {
+ background-color: rgb(240, 98, 146) !important;
+}
+
+.mdl-color-text--pink-400 {
+ color: rgb(236, 64, 122) !important;
+}
+
+.mdl-color--pink-400 {
+ background-color: rgb(236, 64, 122) !important;
+}
+
+.mdl-color-text--pink-500 {
+ color: rgb(233, 30, 99) !important;
+}
+
+.mdl-color--pink-500 {
+ background-color: rgb(233, 30, 99) !important;
+}
+
+.mdl-color-text--pink-600 {
+ color: rgb(216, 27, 96) !important;
+}
+
+.mdl-color--pink-600 {
+ background-color: rgb(216, 27, 96) !important;
+}
+
+.mdl-color-text--pink-700 {
+ color: rgb(194, 24, 91) !important;
+}
+
+.mdl-color--pink-700 {
+ background-color: rgb(194, 24, 91) !important;
+}
+
+.mdl-color-text--pink-800 {
+ color: rgb(173, 20, 87) !important;
+}
+
+.mdl-color--pink-800 {
+ background-color: rgb(173, 20, 87) !important;
+}
+
+.mdl-color-text--pink-900 {
+ color: rgb(136, 14, 79) !important;
+}
+
+.mdl-color--pink-900 {
+ background-color: rgb(136, 14, 79) !important;
+}
+
+.mdl-color-text--pink-A100 {
+ color: rgb(255, 128, 171) !important;
+}
+
+.mdl-color--pink-A100 {
+ background-color: rgb(255, 128, 171) !important;
+}
+
+.mdl-color-text--pink-A200 {
+ color: rgb(255, 64, 129) !important;
+}
+
+.mdl-color--pink-A200 {
+ background-color: rgb(255, 64, 129) !important;
+}
+
+.mdl-color-text--pink-A400 {
+ color: rgb(245, 0, 87) !important;
+}
+
+.mdl-color--pink-A400 {
+ background-color: rgb(245, 0, 87) !important;
+}
+
+.mdl-color-text--pink-A700 {
+ color: rgb(197, 17, 98) !important;
+}
+
+.mdl-color--pink-A700 {
+ background-color: rgb(197, 17, 98) !important;
+}
+
+.mdl-color-text--purple {
+ color: rgb(156, 39, 176) !important;
+}
+
+.mdl-color--purple {
+ background-color: rgb(156, 39, 176) !important;
+}
+
+.mdl-color-text--purple-50 {
+ color: rgb(243, 229, 245) !important;
+}
+
+.mdl-color--purple-50 {
+ background-color: rgb(243, 229, 245) !important;
+}
+
+.mdl-color-text--purple-100 {
+ color: rgb(225, 190, 231) !important;
+}
+
+.mdl-color--purple-100 {
+ background-color: rgb(225, 190, 231) !important;
+}
+
+.mdl-color-text--purple-200 {
+ color: rgb(206, 147, 216) !important;
+}
+
+.mdl-color--purple-200 {
+ background-color: rgb(206, 147, 216) !important;
+}
+
+.mdl-color-text--purple-300 {
+ color: rgb(186, 104, 200) !important;
+}
+
+.mdl-color--purple-300 {
+ background-color: rgb(186, 104, 200) !important;
+}
+
+.mdl-color-text--purple-400 {
+ color: rgb(171, 71, 188) !important;
+}
+
+.mdl-color--purple-400 {
+ background-color: rgb(171, 71, 188) !important;
+}
+
+.mdl-color-text--purple-500 {
+ color: rgb(156, 39, 176) !important;
+}
+
+.mdl-color--purple-500 {
+ background-color: rgb(156, 39, 176) !important;
+}
+
+.mdl-color-text--purple-600 {
+ color: rgb(142, 36, 170) !important;
+}
+
+.mdl-color--purple-600 {
+ background-color: rgb(142, 36, 170) !important;
+}
+
+.mdl-color-text--purple-700 {
+ color: rgb(123, 31, 162) !important;
+}
+
+.mdl-color--purple-700 {
+ background-color: rgb(123, 31, 162) !important;
+}
+
+.mdl-color-text--purple-800 {
+ color: rgb(106, 27, 154) !important;
+}
+
+.mdl-color--purple-800 {
+ background-color: rgb(106, 27, 154) !important;
+}
+
+.mdl-color-text--purple-900 {
+ color: rgb(74, 20, 140) !important;
+}
+
+.mdl-color--purple-900 {
+ background-color: rgb(74, 20, 140) !important;
+}
+
+.mdl-color-text--purple-A100 {
+ color: rgb(234, 128, 252) !important;
+}
+
+.mdl-color--purple-A100 {
+ background-color: rgb(234, 128, 252) !important;
+}
+
+.mdl-color-text--purple-A200 {
+ color: rgb(224, 64, 251) !important;
+}
+
+.mdl-color--purple-A200 {
+ background-color: rgb(224, 64, 251) !important;
+}
+
+.mdl-color-text--purple-A400 {
+ color: rgb(213, 0, 249) !important;
+}
+
+.mdl-color--purple-A400 {
+ background-color: rgb(213, 0, 249) !important;
+}
+
+.mdl-color-text--purple-A700 {
+ color: rgb(170, 0, 255) !important;
+}
+
+.mdl-color--purple-A700 {
+ background-color: rgb(170, 0, 255) !important;
+}
+
+.mdl-color-text--deep-purple {
+ color: rgb(103, 58, 183) !important;
+}
+
+.mdl-color--deep-purple {
+ background-color: rgb(103, 58, 183) !important;
+}
+
+.mdl-color-text--deep-purple-50 {
+ color: rgb(237, 231, 246) !important;
+}
+
+.mdl-color--deep-purple-50 {
+ background-color: rgb(237, 231, 246) !important;
+}
+
+.mdl-color-text--deep-purple-100 {
+ color: rgb(209, 196, 233) !important;
+}
+
+.mdl-color--deep-purple-100 {
+ background-color: rgb(209, 196, 233) !important;
+}
+
+.mdl-color-text--deep-purple-200 {
+ color: rgb(179, 157, 219) !important;
+}
+
+.mdl-color--deep-purple-200 {
+ background-color: rgb(179, 157, 219) !important;
+}
+
+.mdl-color-text--deep-purple-300 {
+ color: rgb(149, 117, 205) !important;
+}
+
+.mdl-color--deep-purple-300 {
+ background-color: rgb(149, 117, 205) !important;
+}
+
+.mdl-color-text--deep-purple-400 {
+ color: rgb(126, 87, 194) !important;
+}
+
+.mdl-color--deep-purple-400 {
+ background-color: rgb(126, 87, 194) !important;
+}
+
+.mdl-color-text--deep-purple-500 {
+ color: rgb(103, 58, 183) !important;
+}
+
+.mdl-color--deep-purple-500 {
+ background-color: rgb(103, 58, 183) !important;
+}
+
+.mdl-color-text--deep-purple-600 {
+ color: rgb(94, 53, 177) !important;
+}
+
+.mdl-color--deep-purple-600 {
+ background-color: rgb(94, 53, 177) !important;
+}
+
+.mdl-color-text--deep-purple-700 {
+ color: rgb(81, 45, 168) !important;
+}
+
+.mdl-color--deep-purple-700 {
+ background-color: rgb(81, 45, 168) !important;
+}
+
+.mdl-color-text--deep-purple-800 {
+ color: rgb(69, 39, 160) !important;
+}
+
+.mdl-color--deep-purple-800 {
+ background-color: rgb(69, 39, 160) !important;
+}
+
+.mdl-color-text--deep-purple-900 {
+ color: rgb(49, 27, 146) !important;
+}
+
+.mdl-color--deep-purple-900 {
+ background-color: rgb(49, 27, 146) !important;
+}
+
+.mdl-color-text--deep-purple-A100 {
+ color: rgb(179, 136, 255) !important;
+}
+
+.mdl-color--deep-purple-A100 {
+ background-color: rgb(179, 136, 255) !important;
+}
+
+.mdl-color-text--deep-purple-A200 {
+ color: rgb(124, 77, 255) !important;
+}
+
+.mdl-color--deep-purple-A200 {
+ background-color: rgb(124, 77, 255) !important;
+}
+
+.mdl-color-text--deep-purple-A400 {
+ color: rgb(101, 31, 255) !important;
+}
+
+.mdl-color--deep-purple-A400 {
+ background-color: rgb(101, 31, 255) !important;
+}
+
+.mdl-color-text--deep-purple-A700 {
+ color: rgb(98, 0, 234) !important;
+}
+
+.mdl-color--deep-purple-A700 {
+ background-color: rgb(98, 0, 234) !important;
+}
+
+.mdl-color-text--indigo {
+ color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color--indigo {
+ background-color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color-text--indigo-50 {
+ color: rgb(232, 234, 246) !important;
+}
+
+.mdl-color--indigo-50 {
+ background-color: rgb(232, 234, 246) !important;
+}
+
+.mdl-color-text--indigo-100 {
+ color: rgb(197, 202, 233) !important;
+}
+
+.mdl-color--indigo-100 {
+ background-color: rgb(197, 202, 233) !important;
+}
+
+.mdl-color-text--indigo-200 {
+ color: rgb(159, 168, 218) !important;
+}
+
+.mdl-color--indigo-200 {
+ background-color: rgb(159, 168, 218) !important;
+}
+
+.mdl-color-text--indigo-300 {
+ color: rgb(121, 134, 203) !important;
+}
+
+.mdl-color--indigo-300 {
+ background-color: rgb(121, 134, 203) !important;
+}
+
+.mdl-color-text--indigo-400 {
+ color: rgb(92, 107, 192) !important;
+}
+
+.mdl-color--indigo-400 {
+ background-color: rgb(92, 107, 192) !important;
+}
+
+.mdl-color-text--indigo-500 {
+ color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color--indigo-500 {
+ background-color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color-text--indigo-600 {
+ color: rgb(57, 73, 171) !important;
+}
+
+.mdl-color--indigo-600 {
+ background-color: rgb(57, 73, 171) !important;
+}
+
+.mdl-color-text--indigo-700 {
+ color: rgb(48, 63, 159) !important;
+}
+
+.mdl-color--indigo-700 {
+ background-color: rgb(48, 63, 159) !important;
+}
+
+.mdl-color-text--indigo-800 {
+ color: rgb(40, 53, 147) !important;
+}
+
+.mdl-color--indigo-800 {
+ background-color: rgb(40, 53, 147) !important;
+}
+
+.mdl-color-text--indigo-900 {
+ color: rgb(26, 35, 126) !important;
+}
+
+.mdl-color--indigo-900 {
+ background-color: rgb(26, 35, 126) !important;
+}
+
+.mdl-color-text--indigo-A100 {
+ color: rgb(140, 158, 255) !important;
+}
+
+.mdl-color--indigo-A100 {
+ background-color: rgb(140, 158, 255) !important;
+}
+
+.mdl-color-text--indigo-A200 {
+ color: rgb(83, 109, 254) !important;
+}
+
+.mdl-color--indigo-A200 {
+ background-color: rgb(83, 109, 254) !important;
+}
+
+.mdl-color-text--indigo-A400 {
+ color: rgb(61, 90, 254) !important;
+}
+
+.mdl-color--indigo-A400 {
+ background-color: rgb(61, 90, 254) !important;
+}
+
+.mdl-color-text--indigo-A700 {
+ color: rgb(48, 79, 254) !important;
+}
+
+.mdl-color--indigo-A700 {
+ background-color: rgb(48, 79, 254) !important;
+}
+
+.mdl-color-text--blue {
+ color: rgb(33, 150, 243) !important;
+}
+
+.mdl-color--blue {
+ background-color: rgb(33, 150, 243) !important;
+}
+
+.mdl-color-text--blue-50 {
+ color: rgb(227, 242, 253) !important;
+}
+
+.mdl-color--blue-50 {
+ background-color: rgb(227, 242, 253) !important;
+}
+
+.mdl-color-text--blue-100 {
+ color: rgb(187, 222, 251) !important;
+}
+
+.mdl-color--blue-100 {
+ background-color: rgb(187, 222, 251) !important;
+}
+
+.mdl-color-text--blue-200 {
+ color: rgb(144, 202, 249) !important;
+}
+
+.mdl-color--blue-200 {
+ background-color: rgb(144, 202, 249) !important;
+}
+
+.mdl-color-text--blue-300 {
+ color: rgb(100, 181, 246) !important;
+}
+
+.mdl-color--blue-300 {
+ background-color: rgb(100, 181, 246) !important;
+}
+
+.mdl-color-text--blue-400 {
+ color: rgb(66, 165, 245) !important;
+}
+
+.mdl-color--blue-400 {
+ background-color: rgb(66, 165, 245) !important;
+}
+
+.mdl-color-text--blue-500 {
+ color: rgb(33, 150, 243) !important;
+}
+
+.mdl-color--blue-500 {
+ background-color: rgb(33, 150, 243) !important;
+}
+
+.mdl-color-text--blue-600 {
+ color: rgb(30, 136, 229) !important;
+}
+
+.mdl-color--blue-600 {
+ background-color: rgb(30, 136, 229) !important;
+}
+
+.mdl-color-text--blue-700 {
+ color: rgb(25, 118, 210) !important;
+}
+
+.mdl-color--blue-700 {
+ background-color: rgb(25, 118, 210) !important;
+}
+
+.mdl-color-text--blue-800 {
+ color: rgb(21, 101, 192) !important;
+}
+
+.mdl-color--blue-800 {
+ background-color: rgb(21, 101, 192) !important;
+}
+
+.mdl-color-text--blue-900 {
+ color: rgb(13, 71, 161) !important;
+}
+
+.mdl-color--blue-900 {
+ background-color: rgb(13, 71, 161) !important;
+}
+
+.mdl-color-text--blue-A100 {
+ color: rgb(130, 177, 255) !important;
+}
+
+.mdl-color--blue-A100 {
+ background-color: rgb(130, 177, 255) !important;
+}
+
+.mdl-color-text--blue-A200 {
+ color: rgb(68, 138, 255) !important;
+}
+
+.mdl-color--blue-A200 {
+ background-color: rgb(68, 138, 255) !important;
+}
+
+.mdl-color-text--blue-A400 {
+ color: rgb(41, 121, 255) !important;
+}
+
+.mdl-color--blue-A400 {
+ background-color: rgb(41, 121, 255) !important;
+}
+
+.mdl-color-text--blue-A700 {
+ color: rgb(41, 98, 255) !important;
+}
+
+.mdl-color--blue-A700 {
+ background-color: rgb(41, 98, 255) !important;
+}
+
+.mdl-color-text--light-blue {
+ color: rgb(3, 169, 244) !important;
+}
+
+.mdl-color--light-blue {
+ background-color: rgb(3, 169, 244) !important;
+}
+
+.mdl-color-text--light-blue-50 {
+ color: rgb(225, 245, 254) !important;
+}
+
+.mdl-color--light-blue-50 {
+ background-color: rgb(225, 245, 254) !important;
+}
+
+.mdl-color-text--light-blue-100 {
+ color: rgb(179, 229, 252) !important;
+}
+
+.mdl-color--light-blue-100 {
+ background-color: rgb(179, 229, 252) !important;
+}
+
+.mdl-color-text--light-blue-200 {
+ color: rgb(129, 212, 250) !important;
+}
+
+.mdl-color--light-blue-200 {
+ background-color: rgb(129, 212, 250) !important;
+}
+
+.mdl-color-text--light-blue-300 {
+ color: rgb(79, 195, 247) !important;
+}
+
+.mdl-color--light-blue-300 {
+ background-color: rgb(79, 195, 247) !important;
+}
+
+.mdl-color-text--light-blue-400 {
+ color: rgb(41, 182, 246) !important;
+}
+
+.mdl-color--light-blue-400 {
+ background-color: rgb(41, 182, 246) !important;
+}
+
+.mdl-color-text--light-blue-500 {
+ color: rgb(3, 169, 244) !important;
+}
+
+.mdl-color--light-blue-500 {
+ background-color: rgb(3, 169, 244) !important;
+}
+
+.mdl-color-text--light-blue-600 {
+ color: rgb(3, 155, 229) !important;
+}
+
+.mdl-color--light-blue-600 {
+ background-color: rgb(3, 155, 229) !important;
+}
+
+.mdl-color-text--light-blue-700 {
+ color: rgb(2, 136, 209) !important;
+}
+
+.mdl-color--light-blue-700 {
+ background-color: rgb(2, 136, 209) !important;
+}
+
+.mdl-color-text--light-blue-800 {
+ color: rgb(2, 119, 189) !important;
+}
+
+.mdl-color--light-blue-800 {
+ background-color: rgb(2, 119, 189) !important;
+}
+
+.mdl-color-text--light-blue-900 {
+ color: rgb(1, 87, 155) !important;
+}
+
+.mdl-color--light-blue-900 {
+ background-color: rgb(1, 87, 155) !important;
+}
+
+.mdl-color-text--light-blue-A100 {
+ color: rgb(128, 216, 255) !important;
+}
+
+.mdl-color--light-blue-A100 {
+ background-color: rgb(128, 216, 255) !important;
+}
+
+.mdl-color-text--light-blue-A200 {
+ color: rgb(64, 196, 255) !important;
+}
+
+.mdl-color--light-blue-A200 {
+ background-color: rgb(64, 196, 255) !important;
+}
+
+.mdl-color-text--light-blue-A400 {
+ color: rgb(0, 176, 255) !important;
+}
+
+.mdl-color--light-blue-A400 {
+ background-color: rgb(0, 176, 255) !important;
+}
+
+.mdl-color-text--light-blue-A700 {
+ color: rgb(0, 145, 234) !important;
+}
+
+.mdl-color--light-blue-A700 {
+ background-color: rgb(0, 145, 234) !important;
+}
+
+.mdl-color-text--cyan {
+ color: rgb(0, 188, 212) !important;
+}
+
+.mdl-color--cyan {
+ background-color: rgb(0, 188, 212) !important;
+}
+
+.mdl-color-text--cyan-50 {
+ color: rgb(224, 247, 250) !important;
+}
+
+.mdl-color--cyan-50 {
+ background-color: rgb(224, 247, 250) !important;
+}
+
+.mdl-color-text--cyan-100 {
+ color: rgb(178, 235, 242) !important;
+}
+
+.mdl-color--cyan-100 {
+ background-color: rgb(178, 235, 242) !important;
+}
+
+.mdl-color-text--cyan-200 {
+ color: rgb(128, 222, 234) !important;
+}
+
+.mdl-color--cyan-200 {
+ background-color: rgb(128, 222, 234) !important;
+}
+
+.mdl-color-text--cyan-300 {
+ color: rgb(77, 208, 225) !important;
+}
+
+.mdl-color--cyan-300 {
+ background-color: rgb(77, 208, 225) !important;
+}
+
+.mdl-color-text--cyan-400 {
+ color: rgb(38, 198, 218) !important;
+}
+
+.mdl-color--cyan-400 {
+ background-color: rgb(38, 198, 218) !important;
+}
+
+.mdl-color-text--cyan-500 {
+ color: rgb(0, 188, 212) !important;
+}
+
+.mdl-color--cyan-500 {
+ background-color: rgb(0, 188, 212) !important;
+}
+
+.mdl-color-text--cyan-600 {
+ color: rgb(0, 172, 193) !important;
+}
+
+.mdl-color--cyan-600 {
+ background-color: rgb(0, 172, 193) !important;
+}
+
+.mdl-color-text--cyan-700 {
+ color: rgb(0, 151, 167) !important;
+}
+
+.mdl-color--cyan-700 {
+ background-color: rgb(0, 151, 167) !important;
+}
+
+.mdl-color-text--cyan-800 {
+ color: rgb(0, 131, 143) !important;
+}
+
+.mdl-color--cyan-800 {
+ background-color: rgb(0, 131, 143) !important;
+}
+
+.mdl-color-text--cyan-900 {
+ color: rgb(0, 96, 100) !important;
+}
+
+.mdl-color--cyan-900 {
+ background-color: rgb(0, 96, 100) !important;
+}
+
+.mdl-color-text--cyan-A100 {
+ color: rgb(132, 255, 255) !important;
+}
+
+.mdl-color--cyan-A100 {
+ background-color: rgb(132, 255, 255) !important;
+}
+
+.mdl-color-text--cyan-A200 {
+ color: rgb(24, 255, 255) !important;
+}
+
+.mdl-color--cyan-A200 {
+ background-color: rgb(24, 255, 255) !important;
+}
+
+.mdl-color-text--cyan-A400 {
+ color: rgb(0, 229, 255) !important;
+}
+
+.mdl-color--cyan-A400 {
+ background-color: rgb(0, 229, 255) !important;
+}
+
+.mdl-color-text--cyan-A700 {
+ color: rgb(0, 184, 212) !important;
+}
+
+.mdl-color--cyan-A700 {
+ background-color: rgb(0, 184, 212) !important;
+}
+
+.mdl-color-text--teal {
+ color: rgb(0, 150, 136) !important;
+}
+
+.mdl-color--teal {
+ background-color: rgb(0, 150, 136) !important;
+}
+
+.mdl-color-text--teal-50 {
+ color: rgb(224, 242, 241) !important;
+}
+
+.mdl-color--teal-50 {
+ background-color: rgb(224, 242, 241) !important;
+}
+
+.mdl-color-text--teal-100 {
+ color: rgb(178, 223, 219) !important;
+}
+
+.mdl-color--teal-100 {
+ background-color: rgb(178, 223, 219) !important;
+}
+
+.mdl-color-text--teal-200 {
+ color: rgb(128, 203, 196) !important;
+}
+
+.mdl-color--teal-200 {
+ background-color: rgb(128, 203, 196) !important;
+}
+
+.mdl-color-text--teal-300 {
+ color: rgb(77, 182, 172) !important;
+}
+
+.mdl-color--teal-300 {
+ background-color: rgb(77, 182, 172) !important;
+}
+
+.mdl-color-text--teal-400 {
+ color: rgb(38, 166, 154) !important;
+}
+
+.mdl-color--teal-400 {
+ background-color: rgb(38, 166, 154) !important;
+}
+
+.mdl-color-text--teal-500 {
+ color: rgb(0, 150, 136) !important;
+}
+
+.mdl-color--teal-500 {
+ background-color: rgb(0, 150, 136) !important;
+}
+
+.mdl-color-text--teal-600 {
+ color: rgb(0, 137, 123) !important;
+}
+
+.mdl-color--teal-600 {
+ background-color: rgb(0, 137, 123) !important;
+}
+
+.mdl-color-text--teal-700 {
+ color: rgb(0, 121, 107) !important;
+}
+
+.mdl-color--teal-700 {
+ background-color: rgb(0, 121, 107) !important;
+}
+
+.mdl-color-text--teal-800 {
+ color: rgb(0, 105, 92) !important;
+}
+
+.mdl-color--teal-800 {
+ background-color: rgb(0, 105, 92) !important;
+}
+
+.mdl-color-text--teal-900 {
+ color: rgb(0, 77, 64) !important;
+}
+
+.mdl-color--teal-900 {
+ background-color: rgb(0, 77, 64) !important;
+}
+
+.mdl-color-text--teal-A100 {
+ color: rgb(167, 255, 235) !important;
+}
+
+.mdl-color--teal-A100 {
+ background-color: rgb(167, 255, 235) !important;
+}
+
+.mdl-color-text--teal-A200 {
+ color: rgb(100, 255, 218) !important;
+}
+
+.mdl-color--teal-A200 {
+ background-color: rgb(100, 255, 218) !important;
+}
+
+.mdl-color-text--teal-A400 {
+ color: rgb(29, 233, 182) !important;
+}
+
+.mdl-color--teal-A400 {
+ background-color: rgb(29, 233, 182) !important;
+}
+
+.mdl-color-text--teal-A700 {
+ color: rgb(0, 191, 165) !important;
+}
+
+.mdl-color--teal-A700 {
+ background-color: rgb(0, 191, 165) !important;
+}
+
+.mdl-color-text--green {
+ color: rgb(76, 175, 80) !important;
+}
+
+.mdl-color--green {
+ background-color: rgb(76, 175, 80) !important;
+}
+
+.mdl-color-text--green-50 {
+ color: rgb(232, 245, 233) !important;
+}
+
+.mdl-color--green-50 {
+ background-color: rgb(232, 245, 233) !important;
+}
+
+.mdl-color-text--green-100 {
+ color: rgb(200, 230, 201) !important;
+}
+
+.mdl-color--green-100 {
+ background-color: rgb(200, 230, 201) !important;
+}
+
+.mdl-color-text--green-200 {
+ color: rgb(165, 214, 167) !important;
+}
+
+.mdl-color--green-200 {
+ background-color: rgb(165, 214, 167) !important;
+}
+
+.mdl-color-text--green-300 {
+ color: rgb(129, 199, 132) !important;
+}
+
+.mdl-color--green-300 {
+ background-color: rgb(129, 199, 132) !important;
+}
+
+.mdl-color-text--green-400 {
+ color: rgb(102, 187, 106) !important;
+}
+
+.mdl-color--green-400 {
+ background-color: rgb(102, 187, 106) !important;
+}
+
+.mdl-color-text--green-500 {
+ color: rgb(76, 175, 80) !important;
+}
+
+.mdl-color--green-500 {
+ background-color: rgb(76, 175, 80) !important;
+}
+
+.mdl-color-text--green-600 {
+ color: rgb(67, 160, 71) !important;
+}
+
+.mdl-color--green-600 {
+ background-color: rgb(67, 160, 71) !important;
+}
+
+.mdl-color-text--green-700 {
+ color: rgb(56, 142, 60) !important;
+}
+
+.mdl-color--green-700 {
+ background-color: rgb(56, 142, 60) !important;
+}
+
+.mdl-color-text--green-800 {
+ color: rgb(46, 125, 50) !important;
+}
+
+.mdl-color--green-800 {
+ background-color: rgb(46, 125, 50) !important;
+}
+
+.mdl-color-text--green-900 {
+ color: rgb(27, 94, 32) !important;
+}
+
+.mdl-color--green-900 {
+ background-color: rgb(27, 94, 32) !important;
+}
+
+.mdl-color-text--green-A100 {
+ color: rgb(185, 246, 202) !important;
+}
+
+.mdl-color--green-A100 {
+ background-color: rgb(185, 246, 202) !important;
+}
+
+.mdl-color-text--green-A200 {
+ color: rgb(105, 240, 174) !important;
+}
+
+.mdl-color--green-A200 {
+ background-color: rgb(105, 240, 174) !important;
+}
+
+.mdl-color-text--green-A400 {
+ color: rgb(0, 230, 118) !important;
+}
+
+.mdl-color--green-A400 {
+ background-color: rgb(0, 230, 118) !important;
+}
+
+.mdl-color-text--green-A700 {
+ color: rgb(0, 200, 83) !important;
+}
+
+.mdl-color--green-A700 {
+ background-color: rgb(0, 200, 83) !important;
+}
+
+.mdl-color-text--light-green {
+ color: rgb(139, 195, 74) !important;
+}
+
+.mdl-color--light-green {
+ background-color: rgb(139, 195, 74) !important;
+}
+
+.mdl-color-text--light-green-50 {
+ color: rgb(241, 248, 233) !important;
+}
+
+.mdl-color--light-green-50 {
+ background-color: rgb(241, 248, 233) !important;
+}
+
+.mdl-color-text--light-green-100 {
+ color: rgb(220, 237, 200) !important;
+}
+
+.mdl-color--light-green-100 {
+ background-color: rgb(220, 237, 200) !important;
+}
+
+.mdl-color-text--light-green-200 {
+ color: rgb(197, 225, 165) !important;
+}
+
+.mdl-color--light-green-200 {
+ background-color: rgb(197, 225, 165) !important;
+}
+
+.mdl-color-text--light-green-300 {
+ color: rgb(174, 213, 129) !important;
+}
+
+.mdl-color--light-green-300 {
+ background-color: rgb(174, 213, 129) !important;
+}
+
+.mdl-color-text--light-green-400 {
+ color: rgb(156, 204, 101) !important;
+}
+
+.mdl-color--light-green-400 {
+ background-color: rgb(156, 204, 101) !important;
+}
+
+.mdl-color-text--light-green-500 {
+ color: rgb(139, 195, 74) !important;
+}
+
+.mdl-color--light-green-500 {
+ background-color: rgb(139, 195, 74) !important;
+}
+
+.mdl-color-text--light-green-600 {
+ color: rgb(124, 179, 66) !important;
+}
+
+.mdl-color--light-green-600 {
+ background-color: rgb(124, 179, 66) !important;
+}
+
+.mdl-color-text--light-green-700 {
+ color: rgb(104, 159, 56) !important;
+}
+
+.mdl-color--light-green-700 {
+ background-color: rgb(104, 159, 56) !important;
+}
+
+.mdl-color-text--light-green-800 {
+ color: rgb(85, 139, 47) !important;
+}
+
+.mdl-color--light-green-800 {
+ background-color: rgb(85, 139, 47) !important;
+}
+
+.mdl-color-text--light-green-900 {
+ color: rgb(51, 105, 30) !important;
+}
+
+.mdl-color--light-green-900 {
+ background-color: rgb(51, 105, 30) !important;
+}
+
+.mdl-color-text--light-green-A100 {
+ color: rgb(204, 255, 144) !important;
+}
+
+.mdl-color--light-green-A100 {
+ background-color: rgb(204, 255, 144) !important;
+}
+
+.mdl-color-text--light-green-A200 {
+ color: rgb(178, 255, 89) !important;
+}
+
+.mdl-color--light-green-A200 {
+ background-color: rgb(178, 255, 89) !important;
+}
+
+.mdl-color-text--light-green-A400 {
+ color: rgb(118, 255, 3) !important;
+}
+
+.mdl-color--light-green-A400 {
+ background-color: rgb(118, 255, 3) !important;
+}
+
+.mdl-color-text--light-green-A700 {
+ color: rgb(100, 221, 23) !important;
+}
+
+.mdl-color--light-green-A700 {
+ background-color: rgb(100, 221, 23) !important;
+}
+
+.mdl-color-text--lime {
+ color: rgb(205, 220, 57) !important;
+}
+
+.mdl-color--lime {
+ background-color: rgb(205, 220, 57) !important;
+}
+
+.mdl-color-text--lime-50 {
+ color: rgb(249, 251, 231) !important;
+}
+
+.mdl-color--lime-50 {
+ background-color: rgb(249, 251, 231) !important;
+}
+
+.mdl-color-text--lime-100 {
+ color: rgb(240, 244, 195) !important;
+}
+
+.mdl-color--lime-100 {
+ background-color: rgb(240, 244, 195) !important;
+}
+
+.mdl-color-text--lime-200 {
+ color: rgb(230, 238, 156) !important;
+}
+
+.mdl-color--lime-200 {
+ background-color: rgb(230, 238, 156) !important;
+}
+
+.mdl-color-text--lime-300 {
+ color: rgb(220, 231, 117) !important;
+}
+
+.mdl-color--lime-300 {
+ background-color: rgb(220, 231, 117) !important;
+}
+
+.mdl-color-text--lime-400 {
+ color: rgb(212, 225, 87) !important;
+}
+
+.mdl-color--lime-400 {
+ background-color: rgb(212, 225, 87) !important;
+}
+
+.mdl-color-text--lime-500 {
+ color: rgb(205, 220, 57) !important;
+}
+
+.mdl-color--lime-500 {
+ background-color: rgb(205, 220, 57) !important;
+}
+
+.mdl-color-text--lime-600 {
+ color: rgb(192, 202, 51) !important;
+}
+
+.mdl-color--lime-600 {
+ background-color: rgb(192, 202, 51) !important;
+}
+
+.mdl-color-text--lime-700 {
+ color: rgb(175, 180, 43) !important;
+}
+
+.mdl-color--lime-700 {
+ background-color: rgb(175, 180, 43) !important;
+}
+
+.mdl-color-text--lime-800 {
+ color: rgb(158, 157, 36) !important;
+}
+
+.mdl-color--lime-800 {
+ background-color: rgb(158, 157, 36) !important;
+}
+
+.mdl-color-text--lime-900 {
+ color: rgb(130, 119, 23) !important;
+}
+
+.mdl-color--lime-900 {
+ background-color: rgb(130, 119, 23) !important;
+}
+
+.mdl-color-text--lime-A100 {
+ color: rgb(244, 255, 129) !important;
+}
+
+.mdl-color--lime-A100 {
+ background-color: rgb(244, 255, 129) !important;
+}
+
+.mdl-color-text--lime-A200 {
+ color: rgb(238, 255, 65) !important;
+}
+
+.mdl-color--lime-A200 {
+ background-color: rgb(238, 255, 65) !important;
+}
+
+.mdl-color-text--lime-A400 {
+ color: rgb(198, 255, 0) !important;
+}
+
+.mdl-color--lime-A400 {
+ background-color: rgb(198, 255, 0) !important;
+}
+
+.mdl-color-text--lime-A700 {
+ color: rgb(174, 234, 0) !important;
+}
+
+.mdl-color--lime-A700 {
+ background-color: rgb(174, 234, 0) !important;
+}
+
+.mdl-color-text--yellow {
+ color: rgb(255, 235, 59) !important;
+}
+
+.mdl-color--yellow {
+ background-color: rgb(255, 235, 59) !important;
+}
+
+.mdl-color-text--yellow-50 {
+ color: rgb(255, 253, 231) !important;
+}
+
+.mdl-color--yellow-50 {
+ background-color: rgb(255, 253, 231) !important;
+}
+
+.mdl-color-text--yellow-100 {
+ color: rgb(255, 249, 196) !important;
+}
+
+.mdl-color--yellow-100 {
+ background-color: rgb(255, 249, 196) !important;
+}
+
+.mdl-color-text--yellow-200 {
+ color: rgb(255, 245, 157) !important;
+}
+
+.mdl-color--yellow-200 {
+ background-color: rgb(255, 245, 157) !important;
+}
+
+.mdl-color-text--yellow-300 {
+ color: rgb(255, 241, 118) !important;
+}
+
+.mdl-color--yellow-300 {
+ background-color: rgb(255, 241, 118) !important;
+}
+
+.mdl-color-text--yellow-400 {
+ color: rgb(255, 238, 88) !important;
+}
+
+.mdl-color--yellow-400 {
+ background-color: rgb(255, 238, 88) !important;
+}
+
+.mdl-color-text--yellow-500 {
+ color: rgb(255, 235, 59) !important;
+}
+
+.mdl-color--yellow-500 {
+ background-color: rgb(255, 235, 59) !important;
+}
+
+.mdl-color-text--yellow-600 {
+ color: rgb(253, 216, 53) !important;
+}
+
+.mdl-color--yellow-600 {
+ background-color: rgb(253, 216, 53) !important;
+}
+
+.mdl-color-text--yellow-700 {
+ color: rgb(251, 192, 45) !important;
+}
+
+.mdl-color--yellow-700 {
+ background-color: rgb(251, 192, 45) !important;
+}
+
+.mdl-color-text--yellow-800 {
+ color: rgb(249, 168, 37) !important;
+}
+
+.mdl-color--yellow-800 {
+ background-color: rgb(249, 168, 37) !important;
+}
+
+.mdl-color-text--yellow-900 {
+ color: rgb(245, 127, 23) !important;
+}
+
+.mdl-color--yellow-900 {
+ background-color: rgb(245, 127, 23) !important;
+}
+
+.mdl-color-text--yellow-A100 {
+ color: rgb(255, 255, 141) !important;
+}
+
+.mdl-color--yellow-A100 {
+ background-color: rgb(255, 255, 141) !important;
+}
+
+.mdl-color-text--yellow-A200 {
+ color: rgb(255, 255, 0) !important;
+}
+
+.mdl-color--yellow-A200 {
+ background-color: rgb(255, 255, 0) !important;
+}
+
+.mdl-color-text--yellow-A400 {
+ color: rgb(255, 234, 0) !important;
+}
+
+.mdl-color--yellow-A400 {
+ background-color: rgb(255, 234, 0) !important;
+}
+
+.mdl-color-text--yellow-A700 {
+ color: rgb(255, 214, 0) !important;
+}
+
+.mdl-color--yellow-A700 {
+ background-color: rgb(255, 214, 0) !important;
+}
+
+.mdl-color-text--amber {
+ color: rgb(255, 193, 7) !important;
+}
+
+.mdl-color--amber {
+ background-color: rgb(255, 193, 7) !important;
+}
+
+.mdl-color-text--amber-50 {
+ color: rgb(255, 248, 225) !important;
+}
+
+.mdl-color--amber-50 {
+ background-color: rgb(255, 248, 225) !important;
+}
+
+.mdl-color-text--amber-100 {
+ color: rgb(255, 236, 179) !important;
+}
+
+.mdl-color--amber-100 {
+ background-color: rgb(255, 236, 179) !important;
+}
+
+.mdl-color-text--amber-200 {
+ color: rgb(255, 224, 130) !important;
+}
+
+.mdl-color--amber-200 {
+ background-color: rgb(255, 224, 130) !important;
+}
+
+.mdl-color-text--amber-300 {
+ color: rgb(255, 213, 79) !important;
+}
+
+.mdl-color--amber-300 {
+ background-color: rgb(255, 213, 79) !important;
+}
+
+.mdl-color-text--amber-400 {
+ color: rgb(255, 202, 40) !important;
+}
+
+.mdl-color--amber-400 {
+ background-color: rgb(255, 202, 40) !important;
+}
+
+.mdl-color-text--amber-500 {
+ color: rgb(255, 193, 7) !important;
+}
+
+.mdl-color--amber-500 {
+ background-color: rgb(255, 193, 7) !important;
+}
+
+.mdl-color-text--amber-600 {
+ color: rgb(255, 179, 0) !important;
+}
+
+.mdl-color--amber-600 {
+ background-color: rgb(255, 179, 0) !important;
+}
+
+.mdl-color-text--amber-700 {
+ color: rgb(255, 160, 0) !important;
+}
+
+.mdl-color--amber-700 {
+ background-color: rgb(255, 160, 0) !important;
+}
+
+.mdl-color-text--amber-800 {
+ color: rgb(255, 143, 0) !important;
+}
+
+.mdl-color--amber-800 {
+ background-color: rgb(255, 143, 0) !important;
+}
+
+.mdl-color-text--amber-900 {
+ color: rgb(255, 111, 0) !important;
+}
+
+.mdl-color--amber-900 {
+ background-color: rgb(255, 111, 0) !important;
+}
+
+.mdl-color-text--amber-A100 {
+ color: rgb(255, 229, 127) !important;
+}
+
+.mdl-color--amber-A100 {
+ background-color: rgb(255, 229, 127) !important;
+}
+
+.mdl-color-text--amber-A200 {
+ color: rgb(255, 215, 64) !important;
+}
+
+.mdl-color--amber-A200 {
+ background-color: rgb(255, 215, 64) !important;
+}
+
+.mdl-color-text--amber-A400 {
+ color: rgb(255, 196, 0) !important;
+}
+
+.mdl-color--amber-A400 {
+ background-color: rgb(255, 196, 0) !important;
+}
+
+.mdl-color-text--amber-A700 {
+ color: rgb(255, 171, 0) !important;
+}
+
+.mdl-color--amber-A700 {
+ background-color: rgb(255, 171, 0) !important;
+}
+
+.mdl-color-text--orange {
+ color: rgb(255, 152, 0) !important;
+}
+
+.mdl-color--orange {
+ background-color: rgb(255, 152, 0) !important;
+}
+
+.mdl-color-text--orange-50 {
+ color: rgb(255, 243, 224) !important;
+}
+
+.mdl-color--orange-50 {
+ background-color: rgb(255, 243, 224) !important;
+}
+
+.mdl-color-text--orange-100 {
+ color: rgb(255, 224, 178) !important;
+}
+
+.mdl-color--orange-100 {
+ background-color: rgb(255, 224, 178) !important;
+}
+
+.mdl-color-text--orange-200 {
+ color: rgb(255, 204, 128) !important;
+}
+
+.mdl-color--orange-200 {
+ background-color: rgb(255, 204, 128) !important;
+}
+
+.mdl-color-text--orange-300 {
+ color: rgb(255, 183, 77) !important;
+}
+
+.mdl-color--orange-300 {
+ background-color: rgb(255, 183, 77) !important;
+}
+
+.mdl-color-text--orange-400 {
+ color: rgb(255, 167, 38) !important;
+}
+
+.mdl-color--orange-400 {
+ background-color: rgb(255, 167, 38) !important;
+}
+
+.mdl-color-text--orange-500 {
+ color: rgb(255, 152, 0) !important;
+}
+
+.mdl-color--orange-500 {
+ background-color: rgb(255, 152, 0) !important;
+}
+
+.mdl-color-text--orange-600 {
+ color: rgb(251, 140, 0) !important;
+}
+
+.mdl-color--orange-600 {
+ background-color: rgb(251, 140, 0) !important;
+}
+
+.mdl-color-text--orange-700 {
+ color: rgb(245, 124, 0) !important;
+}
+
+.mdl-color--orange-700 {
+ background-color: rgb(245, 124, 0) !important;
+}
+
+.mdl-color-text--orange-800 {
+ color: rgb(239, 108, 0) !important;
+}
+
+.mdl-color--orange-800 {
+ background-color: rgb(239, 108, 0) !important;
+}
+
+.mdl-color-text--orange-900 {
+ color: rgb(230, 81, 0) !important;
+}
+
+.mdl-color--orange-900 {
+ background-color: rgb(230, 81, 0) !important;
+}
+
+.mdl-color-text--orange-A100 {
+ color: rgb(255, 209, 128) !important;
+}
+
+.mdl-color--orange-A100 {
+ background-color: rgb(255, 209, 128) !important;
+}
+
+.mdl-color-text--orange-A200 {
+ color: rgb(255, 171, 64) !important;
+}
+
+.mdl-color--orange-A200 {
+ background-color: rgb(255, 171, 64) !important;
+}
+
+.mdl-color-text--orange-A400 {
+ color: rgb(255, 145, 0) !important;
+}
+
+.mdl-color--orange-A400 {
+ background-color: rgb(255, 145, 0) !important;
+}
+
+.mdl-color-text--orange-A700 {
+ color: rgb(255, 109, 0) !important;
+}
+
+.mdl-color--orange-A700 {
+ background-color: rgb(255, 109, 0) !important;
+}
+
+.mdl-color-text--deep-orange {
+ color: rgb(255, 87, 34) !important;
+}
+
+.mdl-color--deep-orange {
+ background-color: rgb(255, 87, 34) !important;
+}
+
+.mdl-color-text--deep-orange-50 {
+ color: rgb(251, 233, 231) !important;
+}
+
+.mdl-color--deep-orange-50 {
+ background-color: rgb(251, 233, 231) !important;
+}
+
+.mdl-color-text--deep-orange-100 {
+ color: rgb(255, 204, 188) !important;
+}
+
+.mdl-color--deep-orange-100 {
+ background-color: rgb(255, 204, 188) !important;
+}
+
+.mdl-color-text--deep-orange-200 {
+ color: rgb(255, 171, 145) !important;
+}
+
+.mdl-color--deep-orange-200 {
+ background-color: rgb(255, 171, 145) !important;
+}
+
+.mdl-color-text--deep-orange-300 {
+ color: rgb(255, 138, 101) !important;
+}
+
+.mdl-color--deep-orange-300 {
+ background-color: rgb(255, 138, 101) !important;
+}
+
+.mdl-color-text--deep-orange-400 {
+ color: rgb(255, 112, 67) !important;
+}
+
+.mdl-color--deep-orange-400 {
+ background-color: rgb(255, 112, 67) !important;
+}
+
+.mdl-color-text--deep-orange-500 {
+ color: rgb(255, 87, 34) !important;
+}
+
+.mdl-color--deep-orange-500 {
+ background-color: rgb(255, 87, 34) !important;
+}
+
+.mdl-color-text--deep-orange-600 {
+ color: rgb(244, 81, 30) !important;
+}
+
+.mdl-color--deep-orange-600 {
+ background-color: rgb(244, 81, 30) !important;
+}
+
+.mdl-color-text--deep-orange-700 {
+ color: rgb(230, 74, 25) !important;
+}
+
+.mdl-color--deep-orange-700 {
+ background-color: rgb(230, 74, 25) !important;
+}
+
+.mdl-color-text--deep-orange-800 {
+ color: rgb(216, 67, 21) !important;
+}
+
+.mdl-color--deep-orange-800 {
+ background-color: rgb(216, 67, 21) !important;
+}
+
+.mdl-color-text--deep-orange-900 {
+ color: rgb(191, 54, 12) !important;
+}
+
+.mdl-color--deep-orange-900 {
+ background-color: rgb(191, 54, 12) !important;
+}
+
+.mdl-color-text--deep-orange-A100 {
+ color: rgb(255, 158, 128) !important;
+}
+
+.mdl-color--deep-orange-A100 {
+ background-color: rgb(255, 158, 128) !important;
+}
+
+.mdl-color-text--deep-orange-A200 {
+ color: rgb(255, 110, 64) !important;
+}
+
+.mdl-color--deep-orange-A200 {
+ background-color: rgb(255, 110, 64) !important;
+}
+
+.mdl-color-text--deep-orange-A400 {
+ color: rgb(255, 61, 0) !important;
+}
+
+.mdl-color--deep-orange-A400 {
+ background-color: rgb(255, 61, 0) !important;
+}
+
+.mdl-color-text--deep-orange-A700 {
+ color: rgb(221, 44, 0) !important;
+}
+
+.mdl-color--deep-orange-A700 {
+ background-color: rgb(221, 44, 0) !important;
+}
+
+.mdl-color-text--brown {
+ color: rgb(121, 85, 72) !important;
+}
+
+.mdl-color--brown {
+ background-color: rgb(121, 85, 72) !important;
+}
+
+.mdl-color-text--brown-50 {
+ color: rgb(239, 235, 233) !important;
+}
+
+.mdl-color--brown-50 {
+ background-color: rgb(239, 235, 233) !important;
+}
+
+.mdl-color-text--brown-100 {
+ color: rgb(215, 204, 200) !important;
+}
+
+.mdl-color--brown-100 {
+ background-color: rgb(215, 204, 200) !important;
+}
+
+.mdl-color-text--brown-200 {
+ color: rgb(188, 170, 164) !important;
+}
+
+.mdl-color--brown-200 {
+ background-color: rgb(188, 170, 164) !important;
+}
+
+.mdl-color-text--brown-300 {
+ color: rgb(161, 136, 127) !important;
+}
+
+.mdl-color--brown-300 {
+ background-color: rgb(161, 136, 127) !important;
+}
+
+.mdl-color-text--brown-400 {
+ color: rgb(141, 110, 99) !important;
+}
+
+.mdl-color--brown-400 {
+ background-color: rgb(141, 110, 99) !important;
+}
+
+.mdl-color-text--brown-500 {
+ color: rgb(121, 85, 72) !important;
+}
+
+.mdl-color--brown-500 {
+ background-color: rgb(121, 85, 72) !important;
+}
+
+.mdl-color-text--brown-600 {
+ color: rgb(109, 76, 65) !important;
+}
+
+.mdl-color--brown-600 {
+ background-color: rgb(109, 76, 65) !important;
+}
+
+.mdl-color-text--brown-700 {
+ color: rgb(93, 64, 55) !important;
+}
+
+.mdl-color--brown-700 {
+ background-color: rgb(93, 64, 55) !important;
+}
+
+.mdl-color-text--brown-800 {
+ color: rgb(78, 52, 46) !important;
+}
+
+.mdl-color--brown-800 {
+ background-color: rgb(78, 52, 46) !important;
+}
+
+.mdl-color-text--brown-900 {
+ color: rgb(62, 39, 35) !important;
+}
+
+.mdl-color--brown-900 {
+ background-color: rgb(62, 39, 35) !important;
+}
+
+.mdl-color-text--grey {
+ color: rgb(158, 158, 158) !important;
+}
+
+.mdl-color--grey {
+ background-color: rgb(158, 158, 158) !important;
+}
+
+.mdl-color-text--grey-50 {
+ color: rgb(250, 250, 250) !important;
+}
+
+.mdl-color--grey-50 {
+ background-color: rgb(250, 250, 250) !important;
+}
+
+.mdl-color-text--grey-100 {
+ color: rgb(245, 245, 245) !important;
+}
+
+.mdl-color--grey-100 {
+ background-color: rgb(245, 245, 245) !important;
+}
+
+.mdl-color-text--grey-200 {
+ color: rgb(238, 238, 238) !important;
+}
+
+.mdl-color--grey-200 {
+ background-color: rgb(238, 238, 238) !important;
+}
+
+.mdl-color-text--grey-300 {
+ color: rgb(224, 224, 224) !important;
+}
+
+.mdl-color--grey-300 {
+ background-color: rgb(224, 224, 224) !important;
+}
+
+.mdl-color-text--grey-400 {
+ color: rgb(189, 189, 189) !important;
+}
+
+.mdl-color--grey-400 {
+ background-color: rgb(189, 189, 189) !important;
+}
+
+.mdl-color-text--grey-500 {
+ color: rgb(158, 158, 158) !important;
+}
+
+.mdl-color--grey-500 {
+ background-color: rgb(158, 158, 158) !important;
+}
+
+.mdl-color-text--grey-600 {
+ color: rgb(117, 117, 117) !important;
+}
+
+.mdl-color--grey-600 {
+ background-color: rgb(117, 117, 117) !important;
+}
+
+.mdl-color-text--grey-700 {
+ color: rgb(97, 97, 97) !important;
+}
+
+.mdl-color--grey-700 {
+ background-color: rgb(97, 97, 97) !important;
+}
+
+.mdl-color-text--grey-800 {
+ color: rgb(66, 66, 66) !important;
+}
+
+.mdl-color--grey-800 {
+ background-color: rgb(66, 66, 66) !important;
+}
+
+.mdl-color-text--grey-900 {
+ color: rgb(33, 33, 33) !important;
+}
+
+.mdl-color--grey-900 {
+ background-color: rgb(33, 33, 33) !important;
+}
+
+.mdl-color-text--blue-grey {
+ color: rgb(96, 125, 139) !important;
+}
+
+.mdl-color--blue-grey {
+ background-color: rgb(96, 125, 139) !important;
+}
+
+.mdl-color-text--blue-grey-50 {
+ color: rgb(236, 239, 241) !important;
+}
+
+.mdl-color--blue-grey-50 {
+ background-color: rgb(236, 239, 241) !important;
+}
+
+.mdl-color-text--blue-grey-100 {
+ color: rgb(207, 216, 220) !important;
+}
+
+.mdl-color--blue-grey-100 {
+ background-color: rgb(207, 216, 220) !important;
+}
+
+.mdl-color-text--blue-grey-200 {
+ color: rgb(176, 190, 197) !important;
+}
+
+.mdl-color--blue-grey-200 {
+ background-color: rgb(176, 190, 197) !important;
+}
+
+.mdl-color-text--blue-grey-300 {
+ color: rgb(144, 164, 174) !important;
+}
+
+.mdl-color--blue-grey-300 {
+ background-color: rgb(144, 164, 174) !important;
+}
+
+.mdl-color-text--blue-grey-400 {
+ color: rgb(120, 144, 156) !important;
+}
+
+.mdl-color--blue-grey-400 {
+ background-color: rgb(120, 144, 156) !important;
+}
+
+.mdl-color-text--blue-grey-500 {
+ color: rgb(96, 125, 139) !important;
+}
+
+.mdl-color--blue-grey-500 {
+ background-color: rgb(96, 125, 139) !important;
+}
+
+.mdl-color-text--blue-grey-600 {
+ color: rgb(84, 110, 122) !important;
+}
+
+.mdl-color--blue-grey-600 {
+ background-color: rgb(84, 110, 122) !important;
+}
+
+.mdl-color-text--blue-grey-700 {
+ color: rgb(69, 90, 100) !important;
+}
+
+.mdl-color--blue-grey-700 {
+ background-color: rgb(69, 90, 100) !important;
+}
+
+.mdl-color-text--blue-grey-800 {
+ color: rgb(55, 71, 79) !important;
+}
+
+.mdl-color--blue-grey-800 {
+ background-color: rgb(55, 71, 79) !important;
+}
+
+.mdl-color-text--blue-grey-900 {
+ color: rgb(38, 50, 56) !important;
+}
+
+.mdl-color--blue-grey-900 {
+ background-color: rgb(38, 50, 56) !important;
+}
+
+.mdl-color--black {
+ background-color: rgb(0, 0, 0) !important;
+}
+
+.mdl-color-text--black {
+ color: rgb(0, 0, 0) !important;
+}
+
+.mdl-color--white {
+ background-color: rgb(255, 255, 255) !important;
+}
+
+.mdl-color-text--white {
+ color: rgb(255, 255, 255) !important;
+}
+
+.mdl-color--primary {
+ background-color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color--primary-contrast {
+ background-color: rgb(255, 255, 255) !important;
+}
+
+.mdl-color--primary-dark {
+ background-color: rgb(48, 63, 159) !important;
+}
+
+.mdl-color--accent {
+ background-color: rgb(255, 64, 129) !important;
+}
+
+.mdl-color--accent-contrast {
+ background-color: rgb(255, 255, 255) !important;
+}
+
+.mdl-color-text--primary {
+ color: rgb(63, 81, 181) !important;
+}
+
+.mdl-color-text--primary-contrast {
+ color: rgb(255, 255, 255) !important;
+}
+
+.mdl-color-text--primary-dark {
+ color: rgb(48, 63, 159) !important;
+}
+
+.mdl-color-text--accent {
+ color: rgb(255, 64, 129) !important;
+}
+
+.mdl-color-text--accent-contrast {
+ color: rgb(255, 255, 255) !important;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-ripple {
+ background: rgb(0, 0, 0);
+ border-radius: 50%;
+ height: 50px;
+ left: 0;
+ opacity: 0;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ -webkit-transform: translate(-50%, -50%);
+ transform: translate(-50%, -50%);
+ width: 50px;
+ overflow: hidden;
+}
+
+.mdl-ripple.is-animating {
+ transition: width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0, 0, 0.2, 1);
+ transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1);
+ transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0, 0, 0.2, 1);
+}
+
+.mdl-ripple.is-visible {
+ opacity: 0.3;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-animation--default {
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-animation--fast-out-slow-in {
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-animation--linear-out-slow-in {
+ transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+
+.mdl-animation--fast-out-linear-in {
+ transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-badge {
+ position: relative;
+ white-space: nowrap;
+ margin-right: 24px;
+}
+
+.mdl-badge:not([data-badge]) {
+ margin-right: auto;
+}
+
+.mdl-badge[data-badge]:after {
+ content: attr(data-badge);
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-flex-wrap: wrap;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ -webkit-justify-content: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-align-content: center;
+ -ms-flex-line-pack: center;
+ align-content: center;
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+ position: absolute;
+ top: -11px;
+ right: -24px;
+ font-family: "Roboto";
+ font-weight: 600;
+ font-size: 12px;
+ width: 22px;
+ height: 22px;
+ border-radius: 50%;
+ background: rgb(255, 64, 129);
+ color: rgb(255, 255, 255);
+}
+
+.mdl-button .mdl-badge[data-badge]:after {
+ top: -10px;
+ right: -5px;
+}
+
+.mdl-badge.mdl-badge--no-background[data-badge]:after {
+ color: rgb(255, 64, 129);
+ background: rgba(255, 255, 255, 0.2);
+ box-shadow: 0 0 1px gray;
+}
+
+.mdl-badge.mdl-badge--overlap {
+ margin-right: 10px;
+}
+
+.mdl-badge.mdl-badge--overlap:after {
+ right: -10px;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-button {
+ background: transparent;
+ border: none;
+ border-radius: 2px;
+ color: rgb(0, 0, 0);
+ position: relative;
+ height: 36px;
+ margin: 0;
+ min-width: 64px;
+ padding: 0 16px;
+ display: inline-block;
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ text-transform: uppercase;
+ line-height: 1;
+ letter-spacing: 0;
+ overflow: hidden;
+ will-change: box-shadow;
+ transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+ outline: none;
+ cursor: pointer;
+ text-decoration: none;
+ text-align: center;
+ line-height: 36px;
+ vertical-align: middle;
+}
+
+.mdl-button::-moz-focus-inner {
+ border: 0;
+}
+
+.mdl-button:hover {
+ background-color: rgba(158, 158, 158, 0.20);
+}
+
+.mdl-button:focus:not(:active) {
+ background-color: rgba(0, 0, 0, 0.12);
+}
+
+.mdl-button:active {
+ background-color: rgba(158, 158, 158, 0.40);
+}
+
+.mdl-button.mdl-button--colored {
+ color: rgb(63, 81, 181);
+}
+
+.mdl-button.mdl-button--colored:focus:not(:active) {
+ background-color: rgba(0, 0, 0, 0.12);
+}
+
+input.mdl-button[type="submit"] {
+ -webkit-appearance: none;
+}
+
+.mdl-button--raised {
+ background: rgba(158, 158, 158, 0.20);
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-button--raised:active {
+ box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
+ background-color: rgba(158, 158, 158, 0.40);
+}
+
+.mdl-button--raised:focus:not(:active) {
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
+ background-color: rgba(158, 158, 158, 0.40);
+}
+
+.mdl-button--raised.mdl-button--colored {
+ background: rgb(63, 81, 181);
+ color: rgb(255, 255, 255);
+}
+
+.mdl-button--raised.mdl-button--colored:hover {
+ background-color: rgb(63, 81, 181);
+}
+
+.mdl-button--raised.mdl-button--colored:active {
+ background-color: rgb(63, 81, 181);
+}
+
+.mdl-button--raised.mdl-button--colored:focus:not(:active) {
+ background-color: rgb(63, 81, 181);
+}
+
+.mdl-button--raised.mdl-button--colored .mdl-ripple {
+ background: rgb(255, 255, 255);
+}
+
+.mdl-button--fab {
+ border-radius: 50%;
+ font-size: 24px;
+ height: 56px;
+ margin: auto;
+ min-width: 56px;
+ width: 56px;
+ padding: 0;
+ overflow: hidden;
+ background: rgba(158, 158, 158, 0.20);
+ box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
+ position: relative;
+ line-height: normal;
+}
+
+.mdl-button--fab .material-icons {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ -webkit-transform: translate(-12px, -12px);
+ transform: translate(-12px, -12px);
+ line-height: 24px;
+ width: 24px;
+}
+
+.mdl-button--fab.mdl-button--mini-fab {
+ height: 40px;
+ min-width: 40px;
+ width: 40px;
+}
+
+.mdl-button--fab .mdl-button__ripple-container {
+ border-radius: 50%;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+}
+
+.mdl-button--fab:active {
+ box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
+ background-color: rgba(158, 158, 158, 0.40);
+}
+
+.mdl-button--fab:focus:not(:active) {
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
+ background-color: rgba(158, 158, 158, 0.40);
+}
+
+.mdl-button--fab.mdl-button--colored {
+ background: rgb(255, 64, 129);
+ color: rgb(255, 255, 255);
+}
+
+.mdl-button--fab.mdl-button--colored:hover {
+ background-color: rgb(255, 64, 129);
+}
+
+.mdl-button--fab.mdl-button--colored:focus:not(:active) {
+ background-color: rgb(255, 64, 129);
+}
+
+.mdl-button--fab.mdl-button--colored:active {
+ background-color: rgb(255, 64, 129);
+}
+
+.mdl-button--fab.mdl-button--colored .mdl-ripple {
+ background: rgb(255, 255, 255);
+}
+
+.mdl-button--icon {
+ border-radius: 50%;
+ font-size: 24px;
+ height: 32px;
+ margin-left: 0;
+ margin-right: 0;
+ min-width: 32px;
+ width: 32px;
+ padding: 0;
+ overflow: hidden;
+ color: inherit;
+ line-height: normal;
+}
+
+.mdl-button--icon .material-icons {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ -webkit-transform: translate(-12px, -12px);
+ transform: translate(-12px, -12px);
+ line-height: 24px;
+ width: 24px;
+}
+
+.mdl-button--icon.mdl-button--mini-icon {
+ height: 24px;
+ min-width: 24px;
+ width: 24px;
+}
+
+.mdl-button--icon.mdl-button--mini-icon .material-icons {
+ top: 0px;
+ left: 0px;
+}
+
+.mdl-button--icon .mdl-button__ripple-container {
+ border-radius: 50%;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+}
+
+.mdl-button__ripple-container {
+ display: block;
+ height: 100%;
+ left: 0px;
+ position: absolute;
+ top: 0px;
+ width: 100%;
+ z-index: 0;
+ overflow: hidden;
+}
+
+.mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple,
+.mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple {
+ background-color: transparent;
+}
+
+.mdl-button--primary.mdl-button--primary {
+ color: rgb(63, 81, 181);
+}
+
+.mdl-button--primary.mdl-button--primary .mdl-ripple {
+ background: rgb(255, 255, 255);
+}
+
+.mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab {
+ color: rgb(255, 255, 255);
+ background-color: rgb(63, 81, 181);
+}
+
+.mdl-button--accent.mdl-button--accent {
+ color: rgb(255, 64, 129);
+}
+
+.mdl-button--accent.mdl-button--accent .mdl-ripple {
+ background: rgb(255, 255, 255);
+}
+
+.mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab {
+ color: rgb(255, 255, 255);
+ background-color: rgb(255, 64, 129);
+}
+
+.mdl-button[disabled][disabled], .mdl-button.mdl-button--disabled.mdl-button--disabled {
+ color: rgba(0, 0, 0, 0.26);
+ cursor: default;
+ background-color: transparent;
+}
+
+.mdl-button--fab[disabled][disabled], .mdl-button--fab.mdl-button--disabled.mdl-button--disabled {
+ background-color: rgba(0, 0, 0, 0.12);
+ color: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-button--raised[disabled][disabled], .mdl-button--raised.mdl-button--disabled.mdl-button--disabled {
+ background-color: rgba(0, 0, 0, 0.12);
+ color: rgba(0, 0, 0, 0.26);
+ box-shadow: none;
+}
+
+.mdl-button--colored[disabled][disabled], .mdl-button--colored.mdl-button--disabled.mdl-button--disabled {
+ color: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-button .material-icons {
+ vertical-align: middle;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-card {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ font-size: 16px;
+ font-weight: 400;
+ min-height: 200px;
+ overflow: hidden;
+ width: 330px;
+ z-index: 1;
+ position: relative;
+ background: rgb(255, 255, 255);
+ border-radius: 2px;
+ box-sizing: border-box;
+}
+
+.mdl-card__media {
+ background-color: rgb(255, 64, 129);
+ background-repeat: repeat;
+ background-position: 50% 50%;
+ background-size: cover;
+ background-origin: padding-box;
+ background-attachment: scroll;
+ box-sizing: border-box;
+}
+
+.mdl-card__title {
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+ color: rgb(0, 0, 0);
+ display: block;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-justify-content: stretch;
+ -ms-flex-pack: stretch;
+ justify-content: stretch;
+ line-height: normal;
+ padding: 16px 16px;
+ -webkit-perspective-origin: 165px 56px;
+ perspective-origin: 165px 56px;
+ -webkit-transform-origin: 165px 56px;
+ transform-origin: 165px 56px;
+ box-sizing: border-box;
+}
+
+.mdl-card__title.mdl-card--border {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.mdl-card__title-text {
+ -webkit-align-self: flex-end;
+ -ms-flex-item-align: end;
+ align-self: flex-end;
+ color: inherit;
+ display: block;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ font-size: 24px;
+ font-weight: 300;
+ line-height: normal;
+ overflow: hidden;
+ -webkit-transform-origin: 149px 48px;
+ transform-origin: 149px 48px;
+ margin: 0;
+}
+
+.mdl-card__subtitle-text {
+ font-size: 14px;
+ color: rgba(0, 0, 0, 0.54);
+ margin: 0;
+}
+
+.mdl-card__supporting-text {
+ color: rgba(0, 0, 0, 0.54);
+ font-size: 1rem;
+ line-height: 18px;
+ overflow: hidden;
+ padding: 16px 16px;
+ width: 90%;
+}
+
+.mdl-card__supporting-text.mdl-card--border {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.mdl-card__actions {
+ font-size: 16px;
+ line-height: normal;
+ width: 100%;
+ background-color: transparent;
+ padding: 8px;
+ box-sizing: border-box;
+}
+
+.mdl-card__actions.mdl-card--border {
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+.mdl-card--expand {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.mdl-card__menu {
+ position: absolute;
+ right: 16px;
+ top: 16px;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-checkbox {
+ position: relative;
+ z-index: 1;
+ vertical-align: middle;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 100%;
+ height: 24px;
+ margin: 0;
+ padding: 0;
+}
+
+.mdl-checkbox.is-upgraded {
+ padding-left: 24px;
+}
+
+.mdl-checkbox__input {
+ line-height: 24px;
+}
+
+.mdl-checkbox.is-upgraded .mdl-checkbox__input {
+ position: absolute;
+ width: 0;
+ height: 0;
+ margin: 0;
+ padding: 0;
+ opacity: 0;
+ -ms-appearance: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ appearance: none;
+ border: none;
+}
+
+.mdl-checkbox__box-outline {
+ position: absolute;
+ top: 3px;
+ left: 0;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 16px;
+ height: 16px;
+ margin: 0;
+ cursor: pointer;
+ overflow: hidden;
+ border: 2px solid rgba(0, 0, 0, 0.54);
+ border-radius: 2px;
+ z-index: 2;
+}
+
+.mdl-checkbox.is-checked .mdl-checkbox__box-outline {
+ border: 2px solid rgb(63, 81, 181);
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,
+.mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
+ border: 2px solid rgba(0, 0, 0, 0.26);
+ cursor: auto;
+}
+
+.mdl-checkbox__focus-helper {
+ position: absolute;
+ top: 3px;
+ left: 0;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 16px;
+ height: 16px;
+ border-radius: 50%;
+ background-color: transparent;
+}
+
+.mdl-checkbox.is-focused .mdl-checkbox__focus-helper {
+ box-shadow: 0 0 0px 8px rgba(0, 0, 0, 0.1);
+ background-color: rgba(0, 0, 0, 0.1);
+}
+
+.mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper {
+ box-shadow: 0 0 0px 8px rgba(63, 81, 181, 0.26);
+ background-color: rgba(63, 81, 181, 0.26);
+}
+
+.mdl-checkbox__tick-outline {
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");
+ mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");
+ background: transparent;
+ transition-duration: 0.28s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: background;
+}
+
+.mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
+ background: rgb(63, 81, 181) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K");
+}
+
+fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,
+.mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline {
+ background: rgba(0, 0, 0, 0.26) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K");
+}
+
+.mdl-checkbox__label {
+ position: relative;
+ cursor: pointer;
+ font-size: 16px;
+ line-height: 24px;
+ margin: 0;
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,
+.mdl-checkbox.is-disabled .mdl-checkbox__label {
+ color: rgba(0, 0, 0, 0.26);
+ cursor: auto;
+}
+
+.mdl-checkbox__ripple-container {
+ position: absolute;
+ z-index: 2;
+ top: -6px;
+ left: -10px;
+ box-sizing: border-box;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ cursor: pointer;
+ overflow: hidden;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+}
+
+.mdl-checkbox__ripple-container .mdl-ripple {
+ background: rgb(63, 81, 181);
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container,
+.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container {
+ cursor: auto;
+}
+
+fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,
+.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple {
+ background: transparent;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-chip {
+ height: 32px;
+ font-family: "Roboto";
+ line-height: 32px;
+ padding: 0 12px;
+ border: 0;
+ border-radius: 16px;
+ background-color: #dedede;
+ display: inline-block;
+ color: rgba(0, 0, 0, 0.87);
+ margin: 2px 0;
+ font-size: 0;
+ white-space: nowrap;
+}
+
+.mdl-chip__text {
+ font-size: 13px;
+ vertical-align: middle;
+ display: inline-block;
+}
+
+.mdl-chip__action {
+ height: 24px;
+ width: 24px;
+ background: transparent;
+ opacity: 0.54;
+ display: inline-block;
+ cursor: pointer;
+ text-align: center;
+ vertical-align: middle;
+ padding: 0;
+ margin: 0 0 0 4px;
+ font-size: 13px;
+ text-decoration: none;
+ color: rgba(0, 0, 0, 0.87);
+ border: none;
+ outline: none;
+ overflow: hidden;
+}
+
+.mdl-chip__contact {
+ height: 32px;
+ width: 32px;
+ border-radius: 16px;
+ display: inline-block;
+ vertical-align: middle;
+ margin-right: 8px;
+ overflow: hidden;
+ text-align: center;
+ font-size: 18px;
+ line-height: 32px;
+}
+
+.mdl-chip:focus {
+ outline: 0;
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-chip:active {
+ background-color: #d6d6d6;
+}
+
+.mdl-chip--deletable {
+ padding-right: 4px;
+}
+
+.mdl-chip--contact {
+ padding-left: 0;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-data-table {
+ position: relative;
+ border: 1px solid rgba(0, 0, 0, 0.12);
+ border-collapse: collapse;
+ white-space: nowrap;
+ font-size: 13px;
+ background-color: rgb(255, 255, 255);
+}
+
+.mdl-data-table thead {
+ padding-bottom: 3px;
+}
+
+.mdl-data-table thead .mdl-data-table__select {
+ margin-top: 0;
+}
+
+.mdl-data-table tbody tr {
+ position: relative;
+ height: 48px;
+ transition-duration: 0.28s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: background-color;
+}
+
+.mdl-data-table tbody tr.is-selected {
+ background-color: #e0e0e0;
+}
+
+.mdl-data-table tbody tr:hover {
+ background-color: #eeeeee;
+}
+
+.mdl-data-table td, .mdl-data-table th {
+ padding: 0 18px 12px 18px;
+ text-align: right;
+}
+
+.mdl-data-table td:first-of-type, .mdl-data-table th:first-of-type {
+ padding-left: 24px;
+}
+
+.mdl-data-table td:last-of-type, .mdl-data-table th:last-of-type {
+ padding-right: 24px;
+}
+
+.mdl-data-table td {
+ position: relative;
+ vertical-align: middle;
+ height: 48px;
+ border-top: 1px solid rgba(0, 0, 0, 0.12);
+ border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+ padding-top: 12px;
+ box-sizing: border-box;
+}
+
+.mdl-data-table td .mdl-data-table__select {
+ vertical-align: middle;
+}
+
+.mdl-data-table th {
+ position: relative;
+ vertical-align: bottom;
+ text-overflow: ellipsis;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 24px;
+ letter-spacing: 0;
+ height: 48px;
+ font-size: 12px;
+ color: rgba(0, 0, 0, 0.54);
+ padding-bottom: 8px;
+ box-sizing: border-box;
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending {
+ color: rgba(0, 0, 0, 0.87);
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before {
+ font-family: 'Material Icons';
+ font-weight: normal;
+ font-style: normal;
+ font-size: 24px;
+ line-height: 1;
+ letter-spacing: normal;
+ text-transform: none;
+ display: inline-block;
+ word-wrap: normal;
+ -moz-font-feature-settings: 'liga';
+ font-feature-settings: 'liga';
+ -webkit-font-feature-settings: 'liga';
+ -webkit-font-smoothing: antialiased;
+ font-size: 16px;
+ content: "\e5d8";
+ margin-right: 5px;
+ vertical-align: sub;
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover {
+ cursor: pointer;
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before {
+ color: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-data-table th.mdl-data-table__header--sorted-descending:before {
+ content: "\e5db";
+}
+
+.mdl-data-table__select {
+ width: 16px;
+}
+
+.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric {
+ text-align: left;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-dialog {
+ border: none;
+ box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2);
+ width: 280px;
+}
+
+.mdl-dialog__title {
+ padding: 24px 24px 0;
+ margin: 0;
+ font-size: 2.5rem;
+}
+
+.mdl-dialog__actions {
+ padding: 8px 8px 8px 24px;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row-reverse;
+ -ms-flex-direction: row-reverse;
+ flex-direction: row-reverse;
+ -webkit-flex-wrap: wrap;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.mdl-dialog__actions > * {
+ margin-right: 8px;
+ height: 36px;
+}
+
+.mdl-dialog__actions > *:first-child {
+ margin-right: 0;
+}
+
+.mdl-dialog__actions--full-width {
+ padding: 0 0 8px 0;
+}
+
+.mdl-dialog__actions--full-width > * {
+ height: 48px;
+ -webkit-flex: 0 0 100%;
+ -ms-flex: 0 0 100%;
+ flex: 0 0 100%;
+ padding-right: 16px;
+ margin-right: 0;
+ text-align: right;
+}
+
+.mdl-dialog__content {
+ padding: 20px 24px 24px 24px;
+ color: rgba(0, 0, 0, 0.54);
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-mega-footer {
+ padding: 16px 40px;
+ color: rgb(158, 158, 158);
+ background-color: rgb(66, 66, 66);
+}
+
+.mdl-mega-footer--top-section:after,
+.mdl-mega-footer--middle-section:after,
+.mdl-mega-footer--bottom-section:after,
+.mdl-mega-footer__top-section:after,
+.mdl-mega-footer__middle-section:after,
+.mdl-mega-footer__bottom-section:after {
+ content: '';
+ display: block;
+ clear: both;
+}
+
+.mdl-mega-footer--left-section,
+.mdl-mega-footer__left-section {
+ margin-bottom: 16px;
+}
+
+.mdl-mega-footer--right-section,
+.mdl-mega-footer__right-section {
+ margin-bottom: 16px;
+}
+
+.mdl-mega-footer--right-section a,
+.mdl-mega-footer__right-section a {
+ display: block;
+ margin-bottom: 16px;
+ color: inherit;
+ text-decoration: none;
+}
+
+@media screen and (min-width: 760px) {
+ .mdl-mega-footer--left-section,
+ .mdl-mega-footer__left-section {
+ float: left;
+ }
+
+ .mdl-mega-footer--right-section,
+ .mdl-mega-footer__right-section {
+ float: right;
+ }
+
+ .mdl-mega-footer--right-section a,
+ .mdl-mega-footer__right-section a {
+ display: inline-block;
+ margin-left: 16px;
+ line-height: 36px;
+ vertical-align: middle;
+ }
+}
+
+.mdl-mega-footer--social-btn,
+.mdl-mega-footer__social-btn {
+ width: 36px;
+ height: 36px;
+ padding: 0;
+ margin: 0;
+ background-color: rgb(158, 158, 158);
+ border: none;
+}
+
+.mdl-mega-footer--drop-down-section,
+.mdl-mega-footer__drop-down-section {
+ display: block;
+ position: relative;
+}
+
+@media screen and (min-width: 760px) {
+ .mdl-mega-footer--drop-down-section,
+ .mdl-mega-footer__drop-down-section {
+ width: 33%;
+ }
+
+ .mdl-mega-footer--drop-down-section:nth-child(1),
+ .mdl-mega-footer--drop-down-section:nth-child(2),
+ .mdl-mega-footer__drop-down-section:nth-child(1),
+ .mdl-mega-footer__drop-down-section:nth-child(2) {
+ float: left;
+ }
+
+ .mdl-mega-footer--drop-down-section:nth-child(3),
+ .mdl-mega-footer__drop-down-section:nth-child(3) {
+ float: right;
+ }
+
+ .mdl-mega-footer--drop-down-section:nth-child(3):after,
+ .mdl-mega-footer__drop-down-section:nth-child(3):after {
+ clear: right;
+ }
+
+ .mdl-mega-footer--drop-down-section:nth-child(4),
+ .mdl-mega-footer__drop-down-section:nth-child(4) {
+ clear: right;
+ float: right;
+ }
+
+ .mdl-mega-footer--middle-section:after,
+ .mdl-mega-footer__middle-section:after {
+ content: '';
+ display: block;
+ clear: both;
+ }
+
+ .mdl-mega-footer--bottom-section,
+ .mdl-mega-footer__bottom-section {
+ padding-top: 0;
+ }
+}
+
+@media screen and (min-width: 1024px) {
+ .mdl-mega-footer--drop-down-section,
+ .mdl-mega-footer--drop-down-section:nth-child(3),
+ .mdl-mega-footer--drop-down-section:nth-child(4),
+ .mdl-mega-footer__drop-down-section,
+ .mdl-mega-footer__drop-down-section:nth-child(3),
+ .mdl-mega-footer__drop-down-section:nth-child(4) {
+ width: 24%;
+ float: left;
+ }
+}
+
+.mdl-mega-footer--heading-checkbox,
+.mdl-mega-footer__heading-checkbox {
+ position: absolute;
+ width: 100%;
+ height: 55.8px;
+ padding: 32px;
+ margin: 0;
+ margin-top: -16px;
+ cursor: pointer;
+ z-index: 1;
+ opacity: 0;
+}
+
+.mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after,
+.mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after,
+.mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
+ font-family: 'Material Icons';
+ content: '\E5CE';
+}
+
+.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list,
+.mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list,
+.mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list,
+.mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list,
+.mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list,
+.mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list,
+.mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list,
+.mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list {
+ display: none;
+}
+
+.mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after,
+.mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after,
+.mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
+ font-family: 'Material Icons';
+ content: '\E5CF';
+}
+
+.mdl-mega-footer--heading,
+.mdl-mega-footer__heading {
+ position: relative;
+ width: 100%;
+ padding-right: 39.8px;
+ margin-bottom: 16px;
+ box-sizing: border-box;
+ font-size: 14px;
+ line-height: 23.8px;
+ font-weight: 500;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ color: rgb(224, 224, 224);
+}
+
+.mdl-mega-footer--heading:after,
+.mdl-mega-footer__heading:after {
+ content: '';
+ position: absolute;
+ top: 0;
+ right: 0;
+ display: block;
+ width: 23.8px;
+ height: 23.8px;
+ background-size: cover;
+}
+
+.mdl-mega-footer--link-list,
+.mdl-mega-footer__link-list {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ margin-bottom: 32px;
+}
+
+.mdl-mega-footer--link-list:after,
+.mdl-mega-footer__link-list:after {
+ clear: both;
+ display: block;
+ content: '';
+}
+
+.mdl-mega-footer--link-list li,
+.mdl-mega-footer__link-list li {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ line-height: 20px;
+}
+
+.mdl-mega-footer--link-list a,
+.mdl-mega-footer__link-list a {
+ color: inherit;
+ text-decoration: none;
+ white-space: nowrap;
+}
+
+@media screen and (min-width: 760px) {
+ .mdl-mega-footer--heading-checkbox,
+ .mdl-mega-footer__heading-checkbox {
+ display: none;
+ }
+
+ .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after,
+ .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after,
+ .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after,
+ .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after {
+ content: '';
+ }
+
+ .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list,
+ .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list,
+ .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list,
+ .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list,
+ .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list,
+ .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list,
+ .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list,
+ .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list {
+ display: block;
+ }
+
+ .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after,
+ .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after,
+ .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after,
+ .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after {
+ content: '';
+ }
+}
+
+.mdl-mega-footer--bottom-section,
+.mdl-mega-footer__bottom-section {
+ padding-top: 16px;
+ margin-bottom: 16px;
+}
+
+.mdl-logo {
+ margin-bottom: 16px;
+ color: white;
+}
+
+.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li,
+.mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li {
+ float: left;
+ margin-bottom: 0;
+ margin-right: 16px;
+}
+
+@media screen and (min-width: 760px) {
+ .mdl-logo {
+ float: left;
+ margin-bottom: 0;
+ margin-right: 16px;
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-mini-footer {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-flow: row wrap;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ -webkit-justify-content: space-between;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ padding: 32px 16px;
+ color: rgb(158, 158, 158);
+ background-color: rgb(66, 66, 66);
+}
+
+.mdl-mini-footer:after {
+ content: '';
+ display: block;
+}
+
+.mdl-mini-footer .mdl-logo {
+ line-height: 36px;
+}
+
+.mdl-mini-footer--link-list,
+.mdl-mini-footer__link-list {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-flow: row nowrap;
+ -ms-flex-flow: row nowrap;
+ flex-flow: row nowrap;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+.mdl-mini-footer--link-list li,
+.mdl-mini-footer__link-list li {
+ margin-bottom: 0;
+ margin-right: 16px;
+}
+
+@media screen and (min-width: 760px) {
+ .mdl-mini-footer--link-list li,
+ .mdl-mini-footer__link-list li {
+ line-height: 36px;
+ }
+}
+
+.mdl-mini-footer--link-list a,
+.mdl-mini-footer__link-list a {
+ color: inherit;
+ text-decoration: none;
+ white-space: nowrap;
+}
+
+.mdl-mini-footer--left-section,
+.mdl-mini-footer__left-section {
+ display: inline-block;
+ -webkit-order: 0;
+ -ms-flex-order: 0;
+ order: 0;
+}
+
+.mdl-mini-footer--right-section,
+.mdl-mini-footer__right-section {
+ display: inline-block;
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+}
+
+.mdl-mini-footer--social-btn,
+.mdl-mini-footer__social-btn {
+ width: 36px;
+ height: 36px;
+ padding: 0;
+ margin: 0;
+ background-color: rgb(158, 158, 158);
+ border: none;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-icon-toggle {
+ position: relative;
+ z-index: 1;
+ vertical-align: middle;
+ display: inline-block;
+ height: 32px;
+ margin: 0;
+ padding: 0;
+}
+
+.mdl-icon-toggle__input {
+ line-height: 32px;
+}
+
+.mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input {
+ position: absolute;
+ width: 0;
+ height: 0;
+ margin: 0;
+ padding: 0;
+ opacity: 0;
+ -ms-appearance: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ appearance: none;
+ border: none;
+}
+
+.mdl-icon-toggle__label {
+ display: inline-block;
+ position: relative;
+ cursor: pointer;
+ height: 32px;
+ width: 32px;
+ min-width: 32px;
+ color: rgb(97, 97, 97);
+ border-radius: 50%;
+ padding: 0;
+ margin-left: 0;
+ margin-right: 0;
+ text-align: center;
+ background-color: transparent;
+ will-change: background-color;
+ transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-icon-toggle__label.material-icons {
+ line-height: 32px;
+ font-size: 24px;
+}
+
+.mdl-icon-toggle.is-checked .mdl-icon-toggle__label {
+ color: rgb(63, 81, 181);
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__label {
+ color: rgba(0, 0, 0, 0.26);
+ cursor: auto;
+ transition: none;
+}
+
+.mdl-icon-toggle.is-focused .mdl-icon-toggle__label {
+ background-color: rgba(0, 0, 0, 0.12);
+}
+
+.mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label {
+ background-color: rgba(63, 81, 181, 0.26);
+}
+
+.mdl-icon-toggle__ripple-container {
+ position: absolute;
+ z-index: 2;
+ top: -2px;
+ left: -2px;
+ box-sizing: border-box;
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ cursor: pointer;
+ overflow: hidden;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+}
+
+.mdl-icon-toggle__ripple-container .mdl-ripple {
+ background: rgb(97, 97, 97);
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container {
+ cursor: auto;
+}
+
+.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple {
+ background: transparent;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-list {
+ display: block;
+ padding: 8px 0;
+ list-style: none;
+}
+
+.mdl-list__item {
+ font-family: "Roboto";
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0.04em;
+ line-height: 1;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ min-height: 48px;
+ box-sizing: border-box;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-flex-wrap: nowrap;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+ padding: 16px;
+ cursor: default;
+ color: rgba(0, 0, 0, 0.87);
+ overflow: hidden;
+}
+
+.mdl-list__item .mdl-list__item-primary-content {
+ -webkit-order: 0;
+ -ms-flex-order: 0;
+ order: 0;
+ -webkit-flex-grow: 2;
+ -ms-flex-positive: 2;
+ flex-grow: 2;
+ text-decoration: none;
+ box-sizing: border-box;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+
+.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon {
+ margin-right: 32px;
+}
+
+.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar {
+ margin-right: 16px;
+}
+
+.mdl-list__item .mdl-list__item-secondary-content {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-flow: column;
+ -ms-flex-flow: column;
+ flex-flow: column;
+ -webkit-align-items: flex-end;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ margin-left: 16px;
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label {
+ display: inline;
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1;
+ letter-spacing: 0;
+ color: rgba(0, 0, 0, 0.54);
+}
+
+.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header {
+ padding: 0 0 0 16px;
+}
+
+.mdl-list__item-icon,
+.mdl-list__item-icon.material-icons {
+ height: 24px;
+ width: 24px;
+ font-size: 24px;
+ box-sizing: border-box;
+ color: rgb(117, 117, 117);
+}
+
+.mdl-list__item-avatar,
+.mdl-list__item-avatar.material-icons {
+ height: 40px;
+ width: 40px;
+ box-sizing: border-box;
+ border-radius: 50%;
+ background-color: rgb(117, 117, 117);
+ font-size: 40px;
+ color: white;
+}
+
+.mdl-list__item--two-line {
+ height: 72px;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content {
+ height: 36px;
+ line-height: 20px;
+ display: block;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar {
+ float: left;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon {
+ float: left;
+ margin-top: 6px;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content {
+ height: 36px;
+}
+
+.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ line-height: 18px;
+ color: rgba(0, 0, 0, 0.54);
+ display: block;
+ padding: 0;
+}
+
+.mdl-list__item--three-line {
+ height: 88px;
+}
+
+.mdl-list__item--three-line .mdl-list__item-primary-content {
+ height: 52px;
+ line-height: 20px;
+ display: block;
+}
+
+.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar,
+.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon {
+ float: left;
+}
+
+.mdl-list__item--three-line .mdl-list__item-secondary-content {
+ height: 52px;
+}
+
+.mdl-list__item--three-line .mdl-list__item-text-body {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ line-height: 18px;
+ height: 52px;
+ color: rgba(0, 0, 0, 0.54);
+ display: block;
+ padding: 0;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-menu__container {
+ display: block;
+ margin: 0;
+ padding: 0;
+ border: none;
+ position: absolute;
+ overflow: visible;
+ height: 0;
+ width: 0;
+ visibility: hidden;
+ z-index: -1;
+}
+
+.mdl-menu__container.is-visible, .mdl-menu__container.is-animating {
+ z-index: 999;
+ visibility: visible;
+}
+
+.mdl-menu__outline {
+ display: block;
+ background: rgb(255, 255, 255);
+ margin: 0;
+ padding: 0;
+ border: none;
+ border-radius: 2px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ overflow: hidden;
+ opacity: 0;
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ -webkit-transform-origin: 0 0;
+ transform-origin: 0 0;
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+ will-change: transform;
+ transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+ z-index: -1;
+}
+
+.mdl-menu__container.is-visible .mdl-menu__outline {
+ opacity: 1;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ z-index: 999;
+}
+
+.mdl-menu__outline.mdl-menu--bottom-right {
+ -webkit-transform-origin: 100% 0;
+ transform-origin: 100% 0;
+}
+
+.mdl-menu__outline.mdl-menu--top-left {
+ -webkit-transform-origin: 0 100%;
+ transform-origin: 0 100%;
+}
+
+.mdl-menu__outline.mdl-menu--top-right {
+ -webkit-transform-origin: 100% 100%;
+ transform-origin: 100% 100%;
+}
+
+.mdl-menu {
+ position: absolute;
+ list-style: none;
+ top: 0;
+ left: 0;
+ height: auto;
+ width: auto;
+ min-width: 124px;
+ padding: 8px 0;
+ margin: 0;
+ opacity: 0;
+ clip: rect(0 0 0 0);
+ z-index: -1;
+}
+
+.mdl-menu__container.is-visible .mdl-menu {
+ opacity: 1;
+ z-index: 999;
+}
+
+.mdl-menu.is-animating {
+ transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-menu.mdl-menu--bottom-right {
+ left: auto;
+ right: 0;
+}
+
+.mdl-menu.mdl-menu--top-left {
+ top: auto;
+ bottom: 0;
+}
+
+.mdl-menu.mdl-menu--top-right {
+ top: auto;
+ left: auto;
+ bottom: 0;
+ right: 0;
+}
+
+.mdl-menu.mdl-menu--unaligned {
+ top: auto;
+ left: auto;
+}
+
+.mdl-menu__item {
+ display: block;
+ border: none;
+ color: rgba(0, 0, 0, 0.87);
+ background-color: transparent;
+ text-align: left;
+ margin: 0;
+ padding: 0 16px;
+ outline-color: rgb(189, 189, 189);
+ position: relative;
+ overflow: hidden;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ text-decoration: none;
+ cursor: pointer;
+ height: 48px;
+ line-height: 48px;
+ white-space: nowrap;
+ opacity: 0;
+ transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.mdl-menu__container.is-visible .mdl-menu__item {
+ opacity: 1;
+}
+
+.mdl-menu__item::-moz-focus-inner {
+ border: 0;
+}
+
+.mdl-menu__item--full-bleed-divider {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+}
+
+.mdl-menu__item[disabled], .mdl-menu__item[data-mdl-disabled] {
+ color: rgb(189, 189, 189);
+ background-color: transparent;
+ cursor: auto;
+}
+
+.mdl-menu__item[disabled]:hover, .mdl-menu__item[data-mdl-disabled]:hover {
+ background-color: transparent;
+}
+
+.mdl-menu__item[disabled]:focus, .mdl-menu__item[data-mdl-disabled]:focus {
+ background-color: transparent;
+}
+
+.mdl-menu__item[disabled] .mdl-ripple, .mdl-menu__item[data-mdl-disabled] .mdl-ripple {
+ background: transparent;
+}
+
+.mdl-menu__item:hover {
+ background-color: rgb(238, 238, 238);
+}
+
+.mdl-menu__item:focus {
+ outline: none;
+ background-color: rgb(238, 238, 238);
+}
+
+.mdl-menu__item:active {
+ background-color: rgb(224, 224, 224);
+}
+
+.mdl-menu__item--ripple-container {
+ display: block;
+ height: 100%;
+ left: 0px;
+ position: absolute;
+ top: 0px;
+ width: 100%;
+ z-index: 0;
+ overflow: hidden;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-progress {
+ display: block;
+ position: relative;
+ height: 4px;
+ width: 500px;
+ max-width: 100%;
+}
+
+.mdl-progress > .bar {
+ display: block;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ width: 0%;
+ transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-progress > .progressbar {
+ background-color: rgb(63, 81, 181);
+ z-index: 1;
+ left: 0;
+}
+
+.mdl-progress > .bufferbar {
+ background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), linear-gradient(to right, rgb(63, 81, 181), rgb(63, 81, 181));
+ z-index: 0;
+ left: 0;
+}
+
+.mdl-progress > .auxbar {
+ right: 0;
+}
+
+@supports (-webkit-appearance: none) {
+ .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate) > .auxbar,
+ .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate) > .auxbar {
+ background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), linear-gradient(to right, rgb(63, 81, 181), rgb(63, 81, 181));
+ -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");
+ mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");
+ }
+}
+
+.mdl-progress:not(.mdl-progress--indeterminate) > .auxbar,
+.mdl-progress:not(.mdl-progress__indeterminate) > .auxbar {
+ background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), linear-gradient(to right, rgb(63, 81, 181), rgb(63, 81, 181));
+}
+
+.mdl-progress.mdl-progress--indeterminate > .bar1,
+.mdl-progress.mdl-progress__indeterminate > .bar1 {
+ background-color: rgb(63, 81, 181);
+ -webkit-animation-name: indeterminate1;
+ animation-name: indeterminate1;
+ -webkit-animation-duration: 2s;
+ animation-duration: 2s;
+ -webkit-animation-iteration-count: infinite;
+ animation-iteration-count: infinite;
+ -webkit-animation-timing-function: linear;
+ animation-timing-function: linear;
+}
+
+.mdl-progress.mdl-progress--indeterminate > .bar3,
+.mdl-progress.mdl-progress__indeterminate > .bar3 {
+ background-image: none;
+ background-color: rgb(63, 81, 181);
+ -webkit-animation-name: indeterminate2;
+ animation-name: indeterminate2;
+ -webkit-animation-duration: 2s;
+ animation-duration: 2s;
+ -webkit-animation-iteration-count: infinite;
+ animation-iteration-count: infinite;
+ -webkit-animation-timing-function: linear;
+ animation-timing-function: linear;
+}
+
+@-webkit-keyframes indeterminate1 {
+ 0% {
+ left: 0%;
+ width: 0%;
+ }
+ 50% {
+ left: 25%;
+ width: 75%;
+ }
+ 75% {
+ left: 100%;
+ width: 0%;
+ }
+}
+
+@keyframes indeterminate1 {
+ 0% {
+ left: 0%;
+ width: 0%;
+ }
+ 50% {
+ left: 25%;
+ width: 75%;
+ }
+ 75% {
+ left: 100%;
+ width: 0%;
+ }
+}
+
+@-webkit-keyframes indeterminate2 {
+ 0% {
+ left: 0%;
+ width: 0%;
+ }
+ 50% {
+ left: 0%;
+ width: 0%;
+ }
+ 75% {
+ left: 0%;
+ width: 25%;
+ }
+ 100% {
+ left: 100%;
+ width: 0%;
+ }
+}
+
+@keyframes indeterminate2 {
+ 0% {
+ left: 0%;
+ width: 0%;
+ }
+ 50% {
+ left: 0%;
+ width: 0%;
+ }
+ 75% {
+ left: 0%;
+ width: 25%;
+ }
+ 100% {
+ left: 100%;
+ width: 0%;
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-navigation {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-wrap: nowrap;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ box-sizing: border-box;
+}
+
+.mdl-navigation__link {
+ color: rgb(66, 66, 66);
+ text-decoration: none;
+ margin: 0;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 24px;
+ letter-spacing: 0;
+ opacity: 0.87;
+}
+
+.mdl-navigation__link .material-icons {
+ vertical-align: middle;
+}
+
+.mdl-layout {
+ width: 100%;
+ height: 100%;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ overflow-y: auto;
+ overflow-x: hidden;
+ position: relative;
+ -webkit-overflow-scrolling: touch;
+}
+
+.mdl-layout.is-small-screen .mdl-layout--large-screen-only {
+ display: none;
+}
+
+.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only {
+ display: none;
+}
+
+.mdl-layout__container {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+}
+
+.mdl-layout__title,
+.mdl-layout-title {
+ display: block;
+ position: relative;
+ font-family: "Roboto";
+ font-size: 20px;
+ font-weight: 500;
+ line-height: 1;
+ letter-spacing: 0.02em;
+ font-weight: 400;
+ box-sizing: border-box;
+}
+
+.mdl-layout-spacer {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+
+.mdl-layout__drawer {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-flex-wrap: nowrap;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ width: 240px;
+ height: 100%;
+ max-height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+ box-sizing: border-box;
+ border-right: 1px solid rgb(224, 224, 224);
+ background: rgb(250, 250, 250);
+ -webkit-transform: translateX(-250px);
+ transform: translateX(-250px);
+ -webkit-transform-style: preserve-3d;
+ transform-style: preserve-3d;
+ will-change: transform;
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: -webkit-transform;
+ transition-property: transform;
+ transition-property: transform, -webkit-transform;
+ color: rgb(66, 66, 66);
+ overflow: visible;
+ overflow-y: auto;
+ z-index: 5;
+}
+
+.mdl-layout__drawer.is-visible {
+ -webkit-transform: translateX(0);
+ transform: translateX(0);
+}
+
+.mdl-layout__drawer.is-visible ~ .mdl-layout__content.mdl-layout__content {
+ overflow: hidden;
+}
+
+.mdl-layout__drawer > * {
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.mdl-layout__drawer > .mdl-layout__title,
+.mdl-layout__drawer > .mdl-layout-title {
+ line-height: 64px;
+ padding-left: 40px;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__drawer > .mdl-layout__title,
+ .mdl-layout__drawer > .mdl-layout-title {
+ line-height: 56px;
+ padding-left: 16px;
+ }
+}
+
+.mdl-layout__drawer .mdl-navigation {
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-align-items: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+ padding-top: 16px;
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
+ display: block;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ padding: 16px 40px;
+ margin: 0;
+ color: #757575;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
+ padding: 16px 16px;
+ }
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover {
+ background-color: rgb(224, 224, 224);
+}
+
+.mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current {
+ background-color: rgb(224, 224, 224);
+ color: rgb(0, 0, 0);
+}
+
+@media screen and (min-width: 1025px) {
+ .mdl-layout--fixed-drawer > .mdl-layout__drawer {
+ -webkit-transform: translateX(0);
+ transform: translateX(0);
+ }
+}
+
+.mdl-layout__drawer-button {
+ display: block;
+ position: absolute;
+ height: 48px;
+ width: 48px;
+ border: 0;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ overflow: hidden;
+ text-align: center;
+ cursor: pointer;
+ font-size: 26px;
+ line-height: 56px;
+ font-family: Roboto;
+ margin: 8px 12px;
+ top: 0;
+ left: 0;
+ color: rgb(255, 255, 255);
+ z-index: 4;
+}
+
+.mdl-layout__header .mdl-layout__drawer-button {
+ position: absolute;
+ color: rgb(255, 255, 255);
+ background-color: inherit;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header .mdl-layout__drawer-button {
+ margin: 4px;
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__drawer-button {
+ margin: 4px;
+ color: rgba(0, 0, 0, 0.5);
+ }
+}
+
+@media screen and (min-width: 1025px) {
+ .mdl-layout__drawer-button {
+ line-height: 54px;
+ }
+
+ .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button,
+ .mdl-layout--fixed-drawer > .mdl-layout__drawer-button,
+ .mdl-layout--no-drawer-button .mdl-layout__drawer-button {
+ display: none;
+ }
+}
+
+.mdl-layout__header {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-flex-wrap: nowrap;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ -webkit-justify-content: flex-start;
+ -ms-flex-pack: start;
+ justify-content: flex-start;
+ box-sizing: border-box;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ border: none;
+ min-height: 64px;
+ max-height: 1000px;
+ z-index: 3;
+ background-color: rgb(63, 81, 181);
+ color: rgb(255, 255, 255);
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: max-height, box-shadow;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header {
+ min-height: 56px;
+ }
+}
+
+.mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen) > .mdl-layout__header {
+ margin-left: 240px;
+ width: calc(100% - 240px);
+}
+
+@media screen and (min-width: 1025px) {
+ .mdl-layout--fixed-drawer > .mdl-layout__header .mdl-layout__header-row {
+ padding-left: 40px;
+ }
+}
+
+.mdl-layout__header > .mdl-layout-icon {
+ position: absolute;
+ left: 40px;
+ top: 16px;
+ height: 32px;
+ width: 32px;
+ overflow: hidden;
+ z-index: 3;
+ display: block;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header > .mdl-layout-icon {
+ left: 16px;
+ top: 12px;
+ }
+}
+
+.mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon {
+ display: none;
+}
+
+.mdl-layout__header.is-compact {
+ max-height: 64px;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header.is-compact {
+ max-height: 56px;
+ }
+}
+
+.mdl-layout__header.is-compact.has-tabs {
+ height: 112px;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header.is-compact.has-tabs {
+ min-height: 104px;
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header {
+ display: none;
+ }
+
+ .mdl-layout--fixed-header > .mdl-layout__header {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ }
+}
+
+.mdl-layout__header--transparent.mdl-layout__header--transparent {
+ background-color: transparent;
+ box-shadow: none;
+}
+
+.mdl-layout__header--seamed {
+ box-shadow: none;
+}
+
+.mdl-layout__header--scroll {
+ box-shadow: none;
+}
+
+.mdl-layout__header--waterfall {
+ box-shadow: none;
+ overflow: hidden;
+}
+
+.mdl-layout__header--waterfall.is-casting-shadow {
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top {
+ -webkit-justify-content: flex-end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+
+.mdl-layout__header-row {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-flex-wrap: nowrap;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ box-sizing: border-box;
+ -webkit-align-self: stretch;
+ -ms-flex-item-align: stretch;
+ align-self: stretch;
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+ height: 64px;
+ margin: 0;
+ padding: 0 40px 0 80px;
+}
+
+.mdl-layout--no-drawer-button .mdl-layout__header-row {
+ padding-left: 40px;
+}
+
+@media screen and (min-width: 1025px) {
+ .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row {
+ padding-left: 40px;
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header-row {
+ height: 56px;
+ padding: 0 16px 0 72px;
+ }
+
+ .mdl-layout--no-drawer-button .mdl-layout__header-row {
+ padding-left: 16px;
+ }
+}
+
+.mdl-layout__header-row > * {
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+}
+
+.mdl-layout__header--scroll .mdl-layout__header-row {
+ width: 100%;
+}
+
+.mdl-layout__header-row .mdl-navigation {
+ margin: 0;
+ padding: 0;
+ height: 64px;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-align-items: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header-row .mdl-navigation {
+ height: 56px;
+ }
+}
+
+.mdl-layout__header-row .mdl-navigation__link {
+ display: block;
+ color: rgb(255, 255, 255);
+ line-height: 64px;
+ padding: 0 24px;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__header-row .mdl-navigation__link {
+ line-height: 56px;
+ padding: 0 16px;
+ }
+}
+
+.mdl-layout__obfuscator {
+ background-color: transparent;
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ z-index: 4;
+ visibility: hidden;
+ transition-property: background-color;
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-layout__obfuscator.is-visible {
+ background-color: rgba(0, 0, 0, 0.5);
+ visibility: visible;
+}
+
+@supports (pointer-events: auto) {
+ .mdl-layout__obfuscator {
+ background-color: rgba(0, 0, 0, 0.5);
+ opacity: 0;
+ transition-property: opacity;
+ visibility: visible;
+ pointer-events: none;
+ }
+
+ .mdl-layout__obfuscator.is-visible {
+ pointer-events: auto;
+ opacity: 1;
+ }
+}
+
+.mdl-layout__content {
+ -ms-flex: 0 1 auto;
+ position: relative;
+ display: inline-block;
+ overflow-y: auto;
+ overflow-x: hidden;
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ z-index: 1;
+ -webkit-overflow-scrolling: touch;
+}
+
+.mdl-layout--fixed-drawer > .mdl-layout__content {
+ margin-left: 240px;
+}
+
+.mdl-layout__container.has-scrolling-header .mdl-layout__content {
+ overflow: visible;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout--fixed-drawer > .mdl-layout__content {
+ margin-left: 0;
+ }
+
+ .mdl-layout__container.has-scrolling-header .mdl-layout__content {
+ overflow-y: auto;
+ overflow-x: hidden;
+ }
+}
+
+.mdl-layout__tab-bar {
+ height: 96px;
+ margin: 0;
+ width: calc(100% - 112px);
+ padding: 0 0 0 56px;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ background-color: rgb(63, 81, 181);
+ overflow-y: hidden;
+ overflow-x: scroll;
+}
+
+.mdl-layout__tab-bar::-webkit-scrollbar {
+ display: none;
+}
+
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar {
+ padding-left: 16px;
+ width: calc(100% - 32px);
+}
+
+@media screen and (min-width: 1025px) {
+ .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar {
+ padding-left: 16px;
+ width: calc(100% - 32px);
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__tab-bar {
+ width: calc(100% - 60px);
+ padding: 0 0 0 60px;
+ }
+
+ .mdl-layout--no-drawer-button .mdl-layout__tab-bar {
+ width: calc(100% - 8px);
+ padding-left: 4px;
+ }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab-bar {
+ padding: 0;
+ overflow: hidden;
+ width: 100%;
+}
+
+.mdl-layout__tab-bar-container {
+ position: relative;
+ height: 48px;
+ width: 100%;
+ border: none;
+ margin: 0;
+ z-index: 2;
+ -webkit-flex-grow: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ overflow: hidden;
+}
+
+.mdl-layout__container > .mdl-layout__tab-bar-container {
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+.mdl-layout__tab-bar-button {
+ display: inline-block;
+ position: absolute;
+ top: 0;
+ height: 48px;
+ width: 56px;
+ z-index: 4;
+ text-align: center;
+ background-color: rgb(63, 81, 181);
+ color: transparent;
+ cursor: pointer;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button,
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button {
+ width: 16px;
+}
+
+.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons,
+.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons {
+ position: relative;
+ left: -4px;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__tab-bar-button {
+ width: 60px;
+ }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button {
+ display: none;
+}
+
+.mdl-layout__tab-bar-button .material-icons {
+ line-height: 48px;
+}
+
+.mdl-layout__tab-bar-button.is-active {
+ color: rgb(255, 255, 255);
+}
+
+.mdl-layout__tab-bar-left-button {
+ left: 0;
+}
+
+.mdl-layout__tab-bar-right-button {
+ right: 0;
+}
+
+.mdl-layout__tab {
+ margin: 0;
+ border: none;
+ padding: 0 24px 0 24px;
+ float: left;
+ position: relative;
+ display: block;
+ -webkit-flex-grow: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ -webkit-flex-shrink: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ text-decoration: none;
+ height: 48px;
+ line-height: 48px;
+ text-align: center;
+ font-weight: 500;
+ font-size: 14px;
+ text-transform: uppercase;
+ color: rgba(255, 255, 255, 0.6);
+ overflow: hidden;
+}
+
+@media screen and (max-width: 1024px) {
+ .mdl-layout__tab {
+ padding: 0 12px 0 12px;
+ }
+}
+
+.mdl-layout--fixed-tabs .mdl-layout__tab {
+ float: none;
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ padding: 0;
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab.is-active {
+ color: rgb(255, 255, 255);
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab.is-active::after {
+ height: 2px;
+ width: 100%;
+ display: block;
+ content: " ";
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ background: rgb(255, 64, 129);
+ -webkit-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
+ animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
+ transition: all 1s cubic-bezier(0.4, 0, 1, 1);
+}
+
+.mdl-layout__tab .mdl-layout__tab-ripple-container {
+ display: block;
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ left: 0;
+ top: 0;
+ z-index: 1;
+ overflow: hidden;
+}
+
+.mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple {
+ background-color: rgb(255, 255, 255);
+}
+
+.mdl-layout__tab-panel {
+ display: block;
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab-panel {
+ display: none;
+}
+
+.mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active {
+ display: block;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-radio {
+ position: relative;
+ font-size: 16px;
+ line-height: 24px;
+ display: inline-block;
+ vertical-align: middle;
+ box-sizing: border-box;
+ height: 24px;
+ margin: 0;
+ padding-left: 0;
+}
+
+.mdl-radio.is-upgraded {
+ padding-left: 24px;
+}
+
+.mdl-radio__button {
+ line-height: 24px;
+}
+
+.mdl-radio.is-upgraded .mdl-radio__button {
+ position: absolute;
+ width: 0;
+ height: 0;
+ margin: 0;
+ padding: 0;
+ opacity: 0;
+ -ms-appearance: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ appearance: none;
+ border: none;
+}
+
+.mdl-radio__outer-circle {
+ position: absolute;
+ top: 4px;
+ left: 0;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 16px;
+ height: 16px;
+ margin: 0;
+ cursor: pointer;
+ border: 2px solid rgba(0, 0, 0, 0.54);
+ border-radius: 50%;
+ z-index: 2;
+}
+
+.mdl-radio.is-checked .mdl-radio__outer-circle {
+ border: 2px solid rgb(63, 81, 181);
+}
+
+.mdl-radio__outer-circle fieldset[disabled] .mdl-radio,
+.mdl-radio.is-disabled .mdl-radio__outer-circle {
+ border: 2px solid rgba(0, 0, 0, 0.26);
+ cursor: auto;
+}
+
+.mdl-radio__inner-circle {
+ position: absolute;
+ z-index: 1;
+ margin: 0;
+ top: 8px;
+ left: 4px;
+ box-sizing: border-box;
+ width: 8px;
+ height: 8px;
+ cursor: pointer;
+ transition-duration: 0.28s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: -webkit-transform;
+ transition-property: transform;
+ transition-property: transform, -webkit-transform;
+ -webkit-transform: scale(0, 0);
+ transform: scale(0, 0);
+ border-radius: 50%;
+ background: rgb(63, 81, 181);
+}
+
+.mdl-radio.is-checked .mdl-radio__inner-circle {
+ -webkit-transform: scale(1, 1);
+ transform: scale(1, 1);
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,
+.mdl-radio.is-disabled .mdl-radio__inner-circle {
+ background: rgba(0, 0, 0, 0.26);
+ cursor: auto;
+}
+
+.mdl-radio.is-focused .mdl-radio__inner-circle {
+ box-shadow: 0 0 0px 10px rgba(0, 0, 0, 0.1);
+}
+
+.mdl-radio__label {
+ cursor: pointer;
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__label,
+.mdl-radio.is-disabled .mdl-radio__label {
+ color: rgba(0, 0, 0, 0.26);
+ cursor: auto;
+}
+
+.mdl-radio__ripple-container {
+ position: absolute;
+ z-index: 2;
+ top: -9px;
+ left: -13px;
+ box-sizing: border-box;
+ width: 42px;
+ height: 42px;
+ border-radius: 50%;
+ cursor: pointer;
+ overflow: hidden;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+}
+
+.mdl-radio__ripple-container .mdl-ripple {
+ background: rgb(63, 81, 181);
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__ripple-container,
+.mdl-radio.is-disabled .mdl-radio__ripple-container {
+ cursor: auto;
+}
+
+fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,
+.mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple {
+ background: transparent;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+_:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded {
+ -ms-appearance: none;
+ height: 32px;
+ margin: 0;
+}
+
+.mdl-slider {
+ width: calc(100% - 40px);
+ margin: 0 20px;
+}
+
+.mdl-slider.is-upgraded {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ height: 2px;
+ background: transparent;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ outline: 0;
+ padding: 0;
+ color: rgb(63, 81, 181);
+ -webkit-align-self: center;
+ -ms-flex-item-align: center;
+ -ms-grid-row-align: center;
+ align-self: center;
+ z-index: 1;
+ cursor: pointer;
+ /**************************** Tracks ****************************/
+ /**************************** Thumbs ****************************/
+ /**************************** 0-value ****************************/
+ /**************************** Disabled ****************************/
+}
+
+.mdl-slider.is-upgraded::-moz-focus-outer {
+ border: 0;
+}
+
+.mdl-slider.is-upgraded::-ms-tooltip {
+ display: none;
+}
+
+.mdl-slider.is-upgraded::-webkit-slider-runnable-track {
+ background: transparent;
+}
+
+.mdl-slider.is-upgraded::-moz-range-track {
+ background: transparent;
+ border: none;
+}
+
+.mdl-slider.is-upgraded::-ms-track {
+ background: none;
+ color: transparent;
+ height: 2px;
+ width: 100%;
+ border: none;
+}
+
+.mdl-slider.is-upgraded::-ms-fill-lower {
+ padding: 0;
+ background: linear-gradient(to right, transparent, transparent 16px, rgb(63, 81, 181) 16px, rgb(63, 81, 181) 0);
+}
+
+.mdl-slider.is-upgraded::-ms-fill-upper {
+ padding: 0;
+ background: linear-gradient(to left, transparent, transparent 16px, rgba(0, 0, 0, 0.26) 16px, rgba(0, 0, 0, 0.26) 0);
+}
+
+.mdl-slider.is-upgraded::-webkit-slider-thumb {
+ -webkit-appearance: none;
+ width: 12px;
+ height: 12px;
+ box-sizing: border-box;
+ border-radius: 50%;
+ background: rgb(63, 81, 181);
+ border: none;
+ transition: border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-slider.is-upgraded::-moz-range-thumb {
+ -moz-appearance: none;
+ width: 12px;
+ height: 12px;
+ box-sizing: border-box;
+ border-radius: 50%;
+ background-image: none;
+ background: rgb(63, 81, 181);
+ border: none;
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb {
+ box-shadow: 0 0 0 10px rgba(63, 81, 181, 0.26);
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb {
+ box-shadow: 0 0 0 10px rgba(63, 81, 181, 0.26);
+}
+
+.mdl-slider.is-upgraded:active::-webkit-slider-thumb {
+ background-image: none;
+ background: rgb(63, 81, 181);
+ -webkit-transform: scale(1.5);
+ transform: scale(1.5);
+}
+
+.mdl-slider.is-upgraded:active::-moz-range-thumb {
+ background-image: none;
+ background: rgb(63, 81, 181);
+ transform: scale(1.5);
+}
+
+.mdl-slider.is-upgraded::-ms-thumb {
+ width: 32px;
+ height: 32px;
+ border: none;
+ border-radius: 50%;
+ background: rgb(63, 81, 181);
+ transform: scale(0.375);
+ transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
+ transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.18s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb {
+ background: radial-gradient(circle closest-side, rgb(63, 81, 181) 0%, rgb(63, 81, 181) 37.5%, rgba(63, 81, 181, 0.26) 37.5%, rgba(63, 81, 181, 0.26) 100%);
+ transform: scale(1);
+}
+
+.mdl-slider.is-upgraded:active::-ms-thumb {
+ background: rgb(63, 81, 181);
+ transform: scale(0.5625);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb {
+ border: 2px solid rgba(0, 0, 0, 0.26);
+ background: transparent;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb {
+ border: 2px solid rgba(0, 0, 0, 0.26);
+ background: transparent;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value +
+.mdl-slider__background-flex > .mdl-slider__background-upper {
+ left: 6px;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb {
+ box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.12);
+ background: rgba(0, 0, 0, 0.12);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb {
+ box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.12);
+ background: rgba(0, 0, 0, 0.12);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb {
+ border: 1.6px solid rgba(0, 0, 0, 0.26);
+ -webkit-transform: scale(1.5);
+ transform: scale(1.5);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active +
+.mdl-slider__background-flex > .mdl-slider__background-upper {
+ left: 9px;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb {
+ border: 1.5px solid rgba(0, 0, 0, 0.26);
+ transform: scale(1.5);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-thumb {
+ background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0, 0, 0, 0.26) 66.67%, rgba(0, 0, 0, 0.26) 100%);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb {
+ background: radial-gradient(circle closest-side, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.12) 25%, rgba(0, 0, 0, 0.26) 25%, rgba(0, 0, 0, 0.26) 37.5%, rgba(0, 0, 0, 0.12) 37.5%, rgba(0, 0, 0, 0.12) 100%);
+ transform: scale(1);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb {
+ transform: scale(0.5625);
+ background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0, 0, 0, 0.26) 77.78%, rgba(0, 0, 0, 0.26) 100%);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower {
+ background: transparent;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper {
+ margin-left: 6px;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper {
+ margin-left: 9px;
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb {
+ -webkit-transform: scale(0.667);
+ transform: scale(0.667);
+ background: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded:disabled::-moz-range-thumb {
+ transform: scale(0.667);
+ background: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-slider.is-upgraded:disabled +
+.mdl-slider__background-flex > .mdl-slider__background-lower {
+ background-color: rgba(0, 0, 0, 0.26);
+ left: -6px;
+}
+
+.mdl-slider.is-upgraded:disabled +
+.mdl-slider__background-flex > .mdl-slider__background-upper {
+ left: 6px;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb {
+ border: 3px solid rgba(0, 0, 0, 0.26);
+ background: transparent;
+ -webkit-transform: scale(0.667);
+ transform: scale(0.667);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb {
+ border: 3px solid rgba(0, 0, 0, 0.26);
+ background: transparent;
+ transform: scale(0.667);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active +
+.mdl-slider__background-flex > .mdl-slider__background-upper {
+ left: 6px;
+}
+
+.mdl-slider.is-upgraded:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded:disabled:active::-ms-thumb, .mdl-slider.is-upgraded:disabled::-ms-thumb {
+ transform: scale(0.25);
+ background: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb {
+ transform: scale(0.25);
+ background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0, 0, 0, 0.26) 50%, rgba(0, 0, 0, 0.26) 100%);
+}
+
+.mdl-slider.is-upgraded:disabled::-ms-fill-lower {
+ margin-right: 6px;
+ background: linear-gradient(to right, transparent, transparent 25px, rgba(0, 0, 0, 0.26) 25px, rgba(0, 0, 0, 0.26) 0);
+}
+
+.mdl-slider.is-upgraded:disabled::-ms-fill-upper {
+ margin-left: 6px;
+}
+
+.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper {
+ margin-left: 6px;
+}
+
+.mdl-slider__ie-container {
+ height: 18px;
+ overflow: visible;
+ border: none;
+ margin: none;
+ padding: none;
+}
+
+.mdl-slider__container {
+ height: 18px;
+ position: relative;
+ background: none;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+}
+
+.mdl-slider__background-flex {
+ background: transparent;
+ position: absolute;
+ height: 2px;
+ width: calc(100% - 52px);
+ top: 50%;
+ left: 0;
+ margin: 0 26px;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ overflow: hidden;
+ border: 0;
+ padding: 0;
+ -webkit-transform: translate(0, -1px);
+ transform: translate(0, -1px);
+}
+
+.mdl-slider__background-lower {
+ background: rgb(63, 81, 181);
+ -webkit-flex: 0;
+ -ms-flex: 0;
+ flex: 0;
+ position: relative;
+ border: 0;
+ padding: 0;
+}
+
+.mdl-slider__background-upper {
+ background: rgba(0, 0, 0, 0.26);
+ -webkit-flex: 0;
+ -ms-flex: 0;
+ flex: 0;
+ position: relative;
+ border: 0;
+ padding: 0;
+ transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-snackbar {
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ cursor: default;
+ background-color: #323232;
+ z-index: 3;
+ display: block;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-justify-content: space-between;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ font-family: "Roboto";
+ will-change: transform;
+ -webkit-transform: translate(0, 80px);
+ transform: translate(0, 80px);
+ transition: -webkit-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
+ transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
+ transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.25s cubic-bezier(0.4, 0, 1, 1);
+ pointer-events: none;
+}
+
+@media (max-width: 479px) {
+ .mdl-snackbar {
+ width: 100%;
+ left: 0;
+ min-height: 48px;
+ max-height: 80px;
+ }
+}
+
+@media (min-width: 480px) {
+ .mdl-snackbar {
+ min-width: 288px;
+ max-width: 568px;
+ border-radius: 2px;
+ -webkit-transform: translate(-50%, 80px);
+ transform: translate(-50%, 80px);
+ }
+}
+
+.mdl-snackbar--active {
+ -webkit-transform: translate(0, 0);
+ transform: translate(0, 0);
+ pointer-events: auto;
+ transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
+ transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1);
+ transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.25s cubic-bezier(0, 0, 0.2, 1);
+}
+
+@media (min-width: 480px) {
+ .mdl-snackbar--active {
+ -webkit-transform: translate(-50%, 0);
+ transform: translate(-50%, 0);
+ }
+}
+
+.mdl-snackbar__text {
+ padding: 14px 12px 14px 24px;
+ vertical-align: middle;
+ color: white;
+ float: left;
+}
+
+.mdl-snackbar__action {
+ background: transparent;
+ border: none;
+ color: rgb(255, 64, 129);
+ float: right;
+ text-transform: uppercase;
+ padding: 14px 24px 14px 12px;
+ font-family: "Roboto";
+ font-size: 14px;
+ font-weight: 500;
+ text-transform: uppercase;
+ line-height: 1;
+ letter-spacing: 0;
+ overflow: hidden;
+ outline: none;
+ opacity: 0;
+ pointer-events: none;
+ cursor: pointer;
+ text-decoration: none;
+ text-align: center;
+ -webkit-align-self: center;
+ -ms-flex-item-align: center;
+ -ms-grid-row-align: center;
+ align-self: center;
+}
+
+.mdl-snackbar__action::-moz-focus-inner {
+ border: 0;
+}
+
+.mdl-snackbar__action:not([aria-hidden]) {
+ opacity: 1;
+ pointer-events: auto;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-spinner {
+ display: inline-block;
+ position: relative;
+ width: 28px;
+ height: 28px;
+}
+
+.mdl-spinner:not(.is-upgraded).is-active:after {
+ content: "Loading...";
+}
+
+.mdl-spinner.is-upgraded.is-active {
+ -webkit-animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite;
+ animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite;
+}
+
+@-webkit-keyframes mdl-spinner__container-rotate {
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+
+@keyframes mdl-spinner__container-rotate {
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
+
+.mdl-spinner__layer {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ opacity: 0;
+}
+
+.mdl-spinner__layer-1 {
+ border-color: rgb(66, 165, 245);
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-1 {
+ border-color: rgb(63, 81, 181);
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-1 {
+ -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+.mdl-spinner__layer-2 {
+ border-color: rgb(244, 67, 54);
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-2 {
+ border-color: rgb(63, 81, 181);
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-2 {
+ -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+.mdl-spinner__layer-3 {
+ border-color: rgb(253, 216, 53);
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-3 {
+ border-color: rgb(63, 81, 181);
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-3 {
+ -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+.mdl-spinner__layer-4 {
+ border-color: rgb(76, 175, 80);
+}
+
+.mdl-spinner--single-color .mdl-spinner__layer-4 {
+ border-color: rgb(63, 81, 181);
+}
+
+.mdl-spinner.is-active .mdl-spinner__layer-4 {
+ -webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+@-webkit-keyframes mdl-spinner__fill-unfill-rotate {
+ 12.5% {
+ -webkit-transform: rotate(135deg);
+ transform: rotate(135deg);
+ }
+ 25% {
+ -webkit-transform: rotate(270deg);
+ transform: rotate(270deg);
+ }
+ 37.5% {
+ -webkit-transform: rotate(405deg);
+ transform: rotate(405deg);
+ }
+ 50% {
+ -webkit-transform: rotate(540deg);
+ transform: rotate(540deg);
+ }
+ 62.5% {
+ -webkit-transform: rotate(675deg);
+ transform: rotate(675deg);
+ }
+ 75% {
+ -webkit-transform: rotate(810deg);
+ transform: rotate(810deg);
+ }
+ 87.5% {
+ -webkit-transform: rotate(945deg);
+ transform: rotate(945deg);
+ }
+ to {
+ -webkit-transform: rotate(1080deg);
+ transform: rotate(1080deg);
+ }
+}
+
+@keyframes mdl-spinner__fill-unfill-rotate {
+ 12.5% {
+ -webkit-transform: rotate(135deg);
+ transform: rotate(135deg);
+ }
+ 25% {
+ -webkit-transform: rotate(270deg);
+ transform: rotate(270deg);
+ }
+ 37.5% {
+ -webkit-transform: rotate(405deg);
+ transform: rotate(405deg);
+ }
+ 50% {
+ -webkit-transform: rotate(540deg);
+ transform: rotate(540deg);
+ }
+ 62.5% {
+ -webkit-transform: rotate(675deg);
+ transform: rotate(675deg);
+ }
+ 75% {
+ -webkit-transform: rotate(810deg);
+ transform: rotate(810deg);
+ }
+ 87.5% {
+ -webkit-transform: rotate(945deg);
+ transform: rotate(945deg);
+ }
+ to {
+ -webkit-transform: rotate(1080deg);
+ transform: rotate(1080deg);
+ }
+}
+
+/**
+* HACK: Even though the intention is to have the current .mdl-spinner__layer-N
+* at `opacity: 1`, we set it to `opacity: 0.99` instead since this forces Chrome
+* to do proper subpixel rendering for the elements being animated. This is
+* especially visible in Chrome 39 on Ubuntu 14.04. See:
+*
+* - https://github.com/Polymer/paper-spinner/issues/9
+* - https://code.google.com/p/chromium/issues/detail?id=436255
+*/
+@-webkit-keyframes mdl-spinner__layer-1-fade-in-out {
+ from {
+ opacity: 0.99;
+ }
+ 25% {
+ opacity: 0.99;
+ }
+ 26% {
+ opacity: 0;
+ }
+ 89% {
+ opacity: 0;
+ }
+ 90% {
+ opacity: 0.99;
+ }
+ 100% {
+ opacity: 0.99;
+ }
+}
+
+@keyframes mdl-spinner__layer-1-fade-in-out {
+ from {
+ opacity: 0.99;
+ }
+ 25% {
+ opacity: 0.99;
+ }
+ 26% {
+ opacity: 0;
+ }
+ 89% {
+ opacity: 0;
+ }
+ 90% {
+ opacity: 0.99;
+ }
+ 100% {
+ opacity: 0.99;
+ }
+}
+
+@-webkit-keyframes mdl-spinner__layer-2-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 15% {
+ opacity: 0;
+ }
+ 25% {
+ opacity: 0.99;
+ }
+ 50% {
+ opacity: 0.99;
+ }
+ 51% {
+ opacity: 0;
+ }
+}
+
+@keyframes mdl-spinner__layer-2-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 15% {
+ opacity: 0;
+ }
+ 25% {
+ opacity: 0.99;
+ }
+ 50% {
+ opacity: 0.99;
+ }
+ 51% {
+ opacity: 0;
+ }
+}
+
+@-webkit-keyframes mdl-spinner__layer-3-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 40% {
+ opacity: 0;
+ }
+ 50% {
+ opacity: 0.99;
+ }
+ 75% {
+ opacity: 0.99;
+ }
+ 76% {
+ opacity: 0;
+ }
+}
+
+@keyframes mdl-spinner__layer-3-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 40% {
+ opacity: 0;
+ }
+ 50% {
+ opacity: 0.99;
+ }
+ 75% {
+ opacity: 0.99;
+ }
+ 76% {
+ opacity: 0;
+ }
+}
+
+@-webkit-keyframes mdl-spinner__layer-4-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 65% {
+ opacity: 0;
+ }
+ 75% {
+ opacity: 0.99;
+ }
+ 90% {
+ opacity: 0.99;
+ }
+ 100% {
+ opacity: 0;
+ }
+}
+
+@keyframes mdl-spinner__layer-4-fade-in-out {
+ from {
+ opacity: 0;
+ }
+ 65% {
+ opacity: 0;
+ }
+ 75% {
+ opacity: 0.99;
+ }
+ 90% {
+ opacity: 0.99;
+ }
+ 100% {
+ opacity: 0;
+ }
+}
+
+/**
+* Patch the gap that appear between the two adjacent
+* div.mdl-spinner__circle-clipper while the spinner is rotating
+* (appears on Chrome 38, Safari 7.1, and IE 11).
+*
+* Update: the gap no longer appears on Chrome when .mdl-spinner__layer-N's
+* opacity is 0.99, but still does on Safari and IE.
+*/
+.mdl-spinner__gap-patch {
+ position: absolute;
+ box-sizing: border-box;
+ top: 0;
+ left: 45%;
+ width: 10%;
+ height: 100%;
+ overflow: hidden;
+ border-color: inherit;
+}
+
+.mdl-spinner__gap-patch .mdl-spinner__circle {
+ width: 1000%;
+ left: -450%;
+}
+
+.mdl-spinner__circle-clipper {
+ display: inline-block;
+ position: relative;
+ width: 50%;
+ height: 100%;
+ overflow: hidden;
+ border-color: inherit;
+}
+
+.mdl-spinner__circle-clipper.mdl-spinner__left {
+ float: left;
+}
+
+.mdl-spinner__circle-clipper.mdl-spinner__right {
+ float: right;
+}
+
+.mdl-spinner__circle-clipper .mdl-spinner__circle {
+ width: 200%;
+}
+
+.mdl-spinner__circle {
+ box-sizing: border-box;
+ height: 100%;
+ border-width: 3px;
+ border-style: solid;
+ border-color: inherit;
+ border-bottom-color: transparent !important;
+ border-radius: 50%;
+ -webkit-animation: none;
+ animation: none;
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+}
+
+.mdl-spinner__left .mdl-spinner__circle {
+ border-right-color: transparent !important;
+ -webkit-transform: rotate(129deg);
+ transform: rotate(129deg);
+}
+
+.mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle {
+ -webkit-animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+.mdl-spinner__right .mdl-spinner__circle {
+ left: -100%;
+ border-left-color: transparent !important;
+ -webkit-transform: rotate(-129deg);
+ transform: rotate(-129deg);
+}
+
+.mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle {
+ -webkit-animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+ animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
+}
+
+@-webkit-keyframes mdl-spinner__left-spin {
+ from {
+ -webkit-transform: rotate(130deg);
+ transform: rotate(130deg);
+ }
+ 50% {
+ -webkit-transform: rotate(-5deg);
+ transform: rotate(-5deg);
+ }
+ to {
+ -webkit-transform: rotate(130deg);
+ transform: rotate(130deg);
+ }
+}
+
+@keyframes mdl-spinner__left-spin {
+ from {
+ -webkit-transform: rotate(130deg);
+ transform: rotate(130deg);
+ }
+ 50% {
+ -webkit-transform: rotate(-5deg);
+ transform: rotate(-5deg);
+ }
+ to {
+ -webkit-transform: rotate(130deg);
+ transform: rotate(130deg);
+ }
+}
+
+@-webkit-keyframes mdl-spinner__right-spin {
+ from {
+ -webkit-transform: rotate(-130deg);
+ transform: rotate(-130deg);
+ }
+ 50% {
+ -webkit-transform: rotate(5deg);
+ transform: rotate(5deg);
+ }
+ to {
+ -webkit-transform: rotate(-130deg);
+ transform: rotate(-130deg);
+ }
+}
+
+@keyframes mdl-spinner__right-spin {
+ from {
+ -webkit-transform: rotate(-130deg);
+ transform: rotate(-130deg);
+ }
+ 50% {
+ -webkit-transform: rotate(5deg);
+ transform: rotate(5deg);
+ }
+ to {
+ -webkit-transform: rotate(-130deg);
+ transform: rotate(-130deg);
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-switch {
+ position: relative;
+ z-index: 1;
+ vertical-align: middle;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 100%;
+ height: 24px;
+ margin: 0;
+ padding: 0;
+ overflow: visible;
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.mdl-switch.is-upgraded {
+ padding-left: 28px;
+}
+
+.mdl-switch__input {
+ line-height: 24px;
+}
+
+.mdl-switch.is-upgraded .mdl-switch__input {
+ position: absolute;
+ width: 0;
+ height: 0;
+ margin: 0;
+ padding: 0;
+ opacity: 0;
+ -ms-appearance: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ appearance: none;
+ border: none;
+}
+
+.mdl-switch__track {
+ background: rgba(0, 0, 0, 0.26);
+ position: absolute;
+ left: 0;
+ top: 5px;
+ height: 14px;
+ width: 36px;
+ border-radius: 14px;
+ cursor: pointer;
+}
+
+.mdl-switch.is-checked .mdl-switch__track {
+ background: rgba(63, 81, 181, 0.5);
+}
+
+.mdl-switch__track fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__track {
+ background: rgba(0, 0, 0, 0.12);
+ cursor: auto;
+}
+
+.mdl-switch__thumb {
+ background: rgb(250, 250, 250);
+ position: absolute;
+ left: 0;
+ top: 2px;
+ height: 20px;
+ width: 20px;
+ border-radius: 50%;
+ cursor: pointer;
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+ transition-duration: 0.28s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-property: left;
+}
+
+.mdl-switch.is-checked .mdl-switch__thumb {
+ background: rgb(63, 81, 181);
+ left: 16px;
+ box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-switch__thumb fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__thumb {
+ background: rgb(189, 189, 189);
+ cursor: auto;
+}
+
+.mdl-switch__focus-helper {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ -webkit-transform: translate(-4px, -4px);
+ transform: translate(-4px, -4px);
+ display: inline-block;
+ box-sizing: border-box;
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ background-color: transparent;
+}
+
+.mdl-switch.is-focused .mdl-switch__focus-helper {
+ box-shadow: 0 0 0px 20px rgba(0, 0, 0, 0.1);
+ background-color: rgba(0, 0, 0, 0.1);
+}
+
+.mdl-switch.is-focused.is-checked .mdl-switch__focus-helper {
+ box-shadow: 0 0 0px 20px rgba(63, 81, 181, 0.26);
+ background-color: rgba(63, 81, 181, 0.26);
+}
+
+.mdl-switch__label {
+ position: relative;
+ cursor: pointer;
+ font-size: 16px;
+ line-height: 24px;
+ margin: 0;
+ left: 24px;
+}
+
+.mdl-switch__label fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__label {
+ color: rgb(189, 189, 189);
+ cursor: auto;
+}
+
+.mdl-switch__ripple-container {
+ position: absolute;
+ z-index: 2;
+ top: -12px;
+ left: -14px;
+ box-sizing: border-box;
+ width: 48px;
+ height: 48px;
+ border-radius: 50%;
+ cursor: pointer;
+ overflow: hidden;
+ -webkit-mask-image: -webkit-radial-gradient(circle, white, black);
+ transition-duration: 0.40s;
+ transition-timing-function: step-end;
+ transition-property: left;
+}
+
+.mdl-switch__ripple-container .mdl-ripple {
+ background: rgb(63, 81, 181);
+}
+
+.mdl-switch__ripple-container fieldset[disabled] .mdl-switch,
+.mdl-switch.is-disabled .mdl-switch__ripple-container {
+ cursor: auto;
+}
+
+fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,
+.mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple {
+ background: transparent;
+}
+
+.mdl-switch.is-checked .mdl-switch__ripple-container {
+ left: 2px;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-tabs {
+ display: block;
+ width: 100%;
+}
+
+.mdl-tabs__tab-bar {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-justify-content: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-align-content: space-between;
+ -ms-flex-line-pack: justify;
+ align-content: space-between;
+ -webkit-align-items: flex-start;
+ -ms-flex-align: start;
+ align-items: flex-start;
+ height: 48px;
+ padding: 0 0 0 0;
+ margin: 0;
+ border-bottom: 1px solid rgb(224, 224, 224);
+}
+
+.mdl-tabs__tab {
+ margin: 0;
+ border: none;
+ padding: 0 24px 0 24px;
+ float: left;
+ position: relative;
+ display: block;
+ text-decoration: none;
+ height: 48px;
+ line-height: 48px;
+ text-align: center;
+ font-weight: 500;
+ font-size: 14px;
+ text-transform: uppercase;
+ color: rgba(0, 0, 0, 0.54);
+ overflow: hidden;
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active {
+ color: rgba(0, 0, 0, 0.87);
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after {
+ height: 2px;
+ width: 100%;
+ display: block;
+ content: " ";
+ bottom: 0px;
+ left: 0px;
+ position: absolute;
+ background: rgb(63, 81, 181);
+ -webkit-animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
+ animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards;
+ transition: all 1s cubic-bezier(0.4, 0, 1, 1);
+}
+
+.mdl-tabs__tab .mdl-tabs__ripple-container {
+ display: block;
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ left: 0px;
+ top: 0px;
+ z-index: 1;
+ overflow: hidden;
+}
+
+.mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple {
+ background: rgb(63, 81, 181);
+}
+
+.mdl-tabs__panel {
+ display: block;
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__panel {
+ display: none;
+}
+
+.mdl-tabs.is-upgraded .mdl-tabs__panel.is-active {
+ display: block;
+}
+
+@-webkit-keyframes border-expand {
+ 0% {
+ opacity: 0;
+ width: 0;
+ }
+ 100% {
+ opacity: 1;
+ width: 100%;
+ }
+}
+
+@keyframes border-expand {
+ 0% {
+ opacity: 0;
+ width: 0;
+ }
+ 100% {
+ opacity: 1;
+ width: 100%;
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-textfield {
+ position: relative;
+ font-size: 16px;
+ display: inline-block;
+ box-sizing: border-box;
+ width: 300px;
+ max-width: 100%;
+ margin: 0;
+ padding: 20px 0;
+}
+
+.mdl-textfield .mdl-button {
+ position: absolute;
+ bottom: 20px;
+}
+
+.mdl-textfield--align-right {
+ text-align: right;
+}
+
+.mdl-textfield--full-width {
+ width: 100%;
+}
+
+.mdl-textfield--expandable {
+ min-width: 32px;
+ width: auto;
+ min-height: 32px;
+}
+
+.mdl-textfield--expandable .mdl-button--icon {
+ top: 16px;
+}
+
+.mdl-textfield__input {
+ border: none;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.12);
+ display: block;
+ font-size: 16px;
+ font-family: "Roboto";
+ margin: 0;
+ padding: 4px 0;
+ width: 100%;
+ background: none;
+ text-align: left;
+ color: inherit;
+}
+
+.mdl-textfield__input[type="number"] {
+ -moz-appearance: textfield;
+}
+
+.mdl-textfield__input[type="number"]::-webkit-inner-spin-button, .mdl-textfield__input[type="number"]::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+}
+
+.mdl-textfield.is-focused .mdl-textfield__input {
+ outline: none;
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__input {
+ border-color: rgb(213, 0, 0);
+ box-shadow: none;
+}
+
+fieldset[disabled] .mdl-textfield .mdl-textfield__input,
+.mdl-textfield.is-disabled .mdl-textfield__input {
+ background-color: transparent;
+ border-bottom: 1px dotted rgba(0, 0, 0, 0.12);
+ color: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-textfield textarea.mdl-textfield__input {
+ display: block;
+}
+
+.mdl-textfield__label {
+ bottom: 0;
+ color: rgba(0, 0, 0, 0.26);
+ font-size: 16px;
+ left: 0;
+ right: 0;
+ pointer-events: none;
+ position: absolute;
+ display: block;
+ top: 24px;
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-align: left;
+}
+
+.mdl-textfield.is-dirty .mdl-textfield__label,
+.mdl-textfield.has-placeholder .mdl-textfield__label {
+ visibility: hidden;
+}
+
+.mdl-textfield--floating-label .mdl-textfield__label {
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
+ transition: none;
+}
+
+fieldset[disabled] .mdl-textfield .mdl-textfield__label,
+.mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
+ color: rgba(0, 0, 0, 0.26);
+}
+
+.mdl-textfield--floating-label.is-focused .mdl-textfield__label,
+.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
+ color: rgb(63, 81, 181);
+ font-size: 12px;
+ top: 4px;
+ visibility: visible;
+}
+
+.mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label,
+.mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label,
+.mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label {
+ top: -16px;
+}
+
+.mdl-textfield--floating-label.is-invalid .mdl-textfield__label {
+ color: rgb(213, 0, 0);
+ font-size: 12px;
+}
+
+.mdl-textfield__label:after {
+ background-color: rgb(63, 81, 181);
+ bottom: 20px;
+ content: '';
+ height: 2px;
+ left: 45%;
+ position: absolute;
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ visibility: hidden;
+ width: 10px;
+}
+
+.mdl-textfield.is-focused .mdl-textfield__label:after {
+ left: 0;
+ visibility: visible;
+ width: 100%;
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__label:after {
+ background-color: rgb(213, 0, 0);
+}
+
+.mdl-textfield__error {
+ color: rgb(213, 0, 0);
+ position: absolute;
+ font-size: 12px;
+ margin-top: 3px;
+ visibility: hidden;
+ display: block;
+}
+
+.mdl-textfield.is-invalid .mdl-textfield__error {
+ visibility: visible;
+}
+
+.mdl-textfield__expandable-holder {
+ display: inline-block;
+ position: relative;
+ margin-left: 32px;
+ transition-duration: 0.2s;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ display: inline-block;
+ max-width: 0.1px;
+}
+
+.mdl-textfield.is-focused .mdl-textfield__expandable-holder, .mdl-textfield.is-dirty .mdl-textfield__expandable-holder {
+ max-width: 600px;
+}
+
+.mdl-textfield__expandable-holder .mdl-textfield__label:after {
+ bottom: 0;
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-tooltip {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ -webkit-transform-origin: top center;
+ transform-origin: top center;
+ z-index: 999;
+ background: rgba(97, 97, 97, 0.9);
+ border-radius: 2px;
+ color: rgb(255, 255, 255);
+ display: inline-block;
+ font-size: 10px;
+ font-weight: 500;
+ line-height: 14px;
+ max-width: 170px;
+ position: fixed;
+ top: -500px;
+ left: -500px;
+ padding: 8px;
+ text-align: center;
+}
+
+.mdl-tooltip.is-active {
+ -webkit-animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards;
+ animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards;
+}
+
+.mdl-tooltip--large {
+ line-height: 14px;
+ font-size: 14px;
+ padding: 16px;
+}
+
+@-webkit-keyframes pulse {
+ 0% {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(0.99);
+ transform: scale(0.99);
+ }
+ 100% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ opacity: 1;
+ visibility: visible;
+ }
+}
+
+@keyframes pulse {
+ 0% {
+ -webkit-transform: scale(0);
+ transform: scale(0);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(0.99);
+ transform: scale(0.99);
+ }
+ 100% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ opacity: 1;
+ visibility: visible;
+ }
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* Typography */
+/* Shadows */
+/* Animations */
+/* Dialog */
+.mdl-shadow--2dp {
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-shadow--3dp {
+ box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
+}
+
+.mdl-shadow--4dp {
+ box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
+}
+
+.mdl-shadow--6dp {
+ box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2);
+}
+
+.mdl-shadow--8dp {
+ box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
+}
+
+.mdl-shadow--16dp {
+ box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
+}
+
+.mdl-shadow--24dp {
+ box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2);
+}
+
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*
+* NOTE: Some rules here are applied using duplicate selectors.
+* This is on purpose to increase their specificity when applied.
+* For example: `.mdl-cell--1-col-phone.mdl-cell--1-col-phone`
+*/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*------------------------------------* $CONTENTS
+\*------------------------------------*/
+/**
+ * STYLE GUIDE VARIABLES------------------Declarations of Sass variables
+ * -----Typography
+ * -----Colors
+ * -----Textfield
+ * -----Switch
+ * -----Spinner
+ * -----Radio
+ * -----Menu
+ * -----List
+ * -----Layout
+ * -----Icon toggles
+ * -----Footer
+ * -----Column
+ * -----Checkbox
+ * -----Card
+ * -----Button
+ * -----Animation
+ * -----Progress
+ * -----Badge
+ * -----Shadows
+ * -----Grid
+ * -----Data table
+ * -----Dialog
+ * -----Snackbar
+ * -----Tooltip
+ * -----Chip
+ *
+ * Even though all variables have the `!default` directive, most of them
+ * should not be changed as they are dependent one another. This can cause
+ * visual distortions (like alignment issues) that are hard to track down
+ * and fix.
+ */
+/* ========== TYPOGRAPHY ========== */
+/* We're splitting fonts into "preferred" and "performance" in order to optimize
+ page loading. For important text, such as the body, we want it to load
+ immediately and not wait for the web font load, whereas for other sections,
+ such as headers and titles, we're OK with things taking a bit longer to load.
+ We do have some optional classes and parameters in the mixins, in case you
+ definitely want to make sure you're using the preferred font and don't mind
+ the performance hit.
+ We should be able to improve on this once CSS Font Loading L3 becomes more
+ widely available.
+*/
+/* ========== COLORS ========== */
+/**
+*
+* Material design color palettes.
+* @see http://www.google.com/design/spec/style/color.html
+*
+**/
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== Color Palettes ========== */
+/* colors.scss */
+/**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/* ========== IMAGES ========== */
+/* ========== Color & Themes ========== */
+/* ========== Typography ========== */
+/* ========== Components ========== */
+/* ========== Standard Buttons ========== */
+/* ========== Icon Toggles ========== */
+/* ========== Radio Buttons ========== */
+/* ========== Ripple effect ========== */
+/* ========== Layout ========== */
+/* ========== Content Tabs ========== */
+/* ========== Checkboxes ========== */
+/* ========== Switches ========== */
+/* ========== Spinner ========== */
+/* ========== Text fields ========== */
+/* ========== Card ========== */
+/* ========== Sliders ========== */
+/* ========== Progress ========== */
+/* ========== List ========== */
+/* ========== Item ========== */
+/* ========== Dropdown menu ========== */
+/* ========== Tooltips ========== */
+/* ========== Footer ========== */
+/* TEXTFIELD */
+/* SWITCH */
+/* SPINNER */
+/* RADIO */
+/* MENU */
+/* LIST */
+/* LAYOUT */
+/* ICON TOGGLE */
+/* FOOTER */
+/*mega-footer*/
+/*mini-footer*/
+/* CHECKBOX */
+/* CARD */
+/* Card dimensions */
+/* Cover image */
+/* BUTTON */
+/**
+ *
+ * Dimensions
+ *
+ */
+/* ANIMATION */
+/* PROGRESS */
+/* BADGE */
+/* SHADOWS */
+/* GRID */
+/* DATA TABLE */
+/* DIALOG */
+/* SNACKBAR */
+/* TOOLTIP */
+/* CHIP */
+.mdl-grid {
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-flow: row wrap;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ margin: 0 auto 0 auto;
+ -webkit-align-items: stretch;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+}
+
+.mdl-grid.mdl-grid--no-spacing {
+ padding: 0;
+}
+
+.mdl-cell {
+ box-sizing: border-box;
+}
+
+.mdl-cell--top {
+ -webkit-align-self: flex-start;
+ -ms-flex-item-align: start;
+ align-self: flex-start;
+}
+
+.mdl-cell--middle {
+ -webkit-align-self: center;
+ -ms-flex-item-align: center;
+ -ms-grid-row-align: center;
+ align-self: center;
+}
+
+.mdl-cell--bottom {
+ -webkit-align-self: flex-end;
+ -ms-flex-item-align: end;
+ align-self: flex-end;
+}
+
+.mdl-cell--stretch {
+ -webkit-align-self: stretch;
+ -ms-flex-item-align: stretch;
+ -ms-grid-row-align: stretch;
+ align-self: stretch;
+}
+
+.mdl-grid.mdl-grid--no-spacing > .mdl-cell {
+ margin: 0;
+}
+
+.mdl-cell--order-1 {
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+}
+
+.mdl-cell--order-2 {
+ -webkit-order: 2;
+ -ms-flex-order: 2;
+ order: 2;
+}
+
+.mdl-cell--order-3 {
+ -webkit-order: 3;
+ -ms-flex-order: 3;
+ order: 3;
+}
+
+.mdl-cell--order-4 {
+ -webkit-order: 4;
+ -ms-flex-order: 4;
+ order: 4;
+}
+
+.mdl-cell--order-5 {
+ -webkit-order: 5;
+ -ms-flex-order: 5;
+ order: 5;
+}
+
+.mdl-cell--order-6 {
+ -webkit-order: 6;
+ -ms-flex-order: 6;
+ order: 6;
+}
+
+.mdl-cell--order-7 {
+ -webkit-order: 7;
+ -ms-flex-order: 7;
+ order: 7;
+}
+
+.mdl-cell--order-8 {
+ -webkit-order: 8;
+ -ms-flex-order: 8;
+ order: 8;
+}
+
+.mdl-cell--order-9 {
+ -webkit-order: 9;
+ -ms-flex-order: 9;
+ order: 9;
+}
+
+.mdl-cell--order-10 {
+ -webkit-order: 10;
+ -ms-flex-order: 10;
+ order: 10;
+}
+
+.mdl-cell--order-11 {
+ -webkit-order: 11;
+ -ms-flex-order: 11;
+ order: 11;
+}
+
+.mdl-cell--order-12 {
+ -webkit-order: 12;
+ -ms-flex-order: 12;
+ order: 12;
+}
+
+@media (max-width: 479px) {
+ .mdl-grid {
+ padding: 8px;
+ }
+
+ .mdl-cell {
+ margin: 8px;
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell {
+ width: 100%;
+ }
+
+ .mdl-cell--hide-phone {
+ display: none !important;
+ }
+
+ .mdl-cell--order-1-phone.mdl-cell--order-1-phone {
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+
+ .mdl-cell--order-2-phone.mdl-cell--order-2-phone {
+ -webkit-order: 2;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+
+ .mdl-cell--order-3-phone.mdl-cell--order-3-phone {
+ -webkit-order: 3;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+
+ .mdl-cell--order-4-phone.mdl-cell--order-4-phone {
+ -webkit-order: 4;
+ -ms-flex-order: 4;
+ order: 4;
+ }
+
+ .mdl-cell--order-5-phone.mdl-cell--order-5-phone {
+ -webkit-order: 5;
+ -ms-flex-order: 5;
+ order: 5;
+ }
+
+ .mdl-cell--order-6-phone.mdl-cell--order-6-phone {
+ -webkit-order: 6;
+ -ms-flex-order: 6;
+ order: 6;
+ }
+
+ .mdl-cell--order-7-phone.mdl-cell--order-7-phone {
+ -webkit-order: 7;
+ -ms-flex-order: 7;
+ order: 7;
+ }
+
+ .mdl-cell--order-8-phone.mdl-cell--order-8-phone {
+ -webkit-order: 8;
+ -ms-flex-order: 8;
+ order: 8;
+ }
+
+ .mdl-cell--order-9-phone.mdl-cell--order-9-phone {
+ -webkit-order: 9;
+ -ms-flex-order: 9;
+ order: 9;
+ }
+
+ .mdl-cell--order-10-phone.mdl-cell--order-10-phone {
+ -webkit-order: 10;
+ -ms-flex-order: 10;
+ order: 10;
+ }
+
+ .mdl-cell--order-11-phone.mdl-cell--order-11-phone {
+ -webkit-order: 11;
+ -ms-flex-order: 11;
+ order: 11;
+ }
+
+ .mdl-cell--order-12-phone.mdl-cell--order-12-phone {
+ -webkit-order: 12;
+ -ms-flex-order: 12;
+ order: 12;
+ }
+
+ .mdl-cell--1-col,
+ .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
+ width: calc(25% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
+ .mdl-cell--1-col-phone.mdl-cell--1-col-phone {
+ width: 25%;
+ }
+
+ .mdl-cell--2-col,
+ .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
+ width: calc(50% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
+ .mdl-cell--2-col-phone.mdl-cell--2-col-phone {
+ width: 50%;
+ }
+
+ .mdl-cell--3-col,
+ .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
+ width: calc(75% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
+ .mdl-cell--3-col-phone.mdl-cell--3-col-phone {
+ width: 75%;
+ }
+
+ .mdl-cell--4-col,
+ .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
+ .mdl-cell--4-col-phone.mdl-cell--4-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--5-col,
+ .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
+ .mdl-cell--5-col-phone.mdl-cell--5-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--6-col,
+ .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
+ .mdl-cell--6-col-phone.mdl-cell--6-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--7-col,
+ .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
+ .mdl-cell--7-col-phone.mdl-cell--7-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--8-col,
+ .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
+ .mdl-cell--8-col-phone.mdl-cell--8-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--9-col,
+ .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
+ .mdl-cell--9-col-phone.mdl-cell--9-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--10-col,
+ .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
+ .mdl-cell--10-col-phone.mdl-cell--10-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--11-col,
+ .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
+ .mdl-cell--11-col-phone.mdl-cell--11-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--12-col,
+ .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
+ .mdl-cell--12-col-phone.mdl-cell--12-col-phone {
+ width: 100%;
+ }
+
+ .mdl-cell--1-offset,
+ .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
+ margin-left: calc(25% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone {
+ margin-left: 25%;
+ }
+
+ .mdl-cell--2-offset,
+ .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
+ margin-left: calc(50% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone {
+ margin-left: 50%;
+ }
+
+ .mdl-cell--3-offset,
+ .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
+ margin-left: calc(75% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone {
+ margin-left: 75%;
+ }
+}
+
+@media (min-width: 480px) and (max-width: 839px) {
+ .mdl-grid {
+ padding: 8px;
+ }
+
+ .mdl-cell {
+ margin: 8px;
+ width: calc(50% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell {
+ width: 50%;
+ }
+
+ .mdl-cell--hide-tablet {
+ display: none !important;
+ }
+
+ .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet {
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+
+ .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet {
+ -webkit-order: 2;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+
+ .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet {
+ -webkit-order: 3;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+
+ .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet {
+ -webkit-order: 4;
+ -ms-flex-order: 4;
+ order: 4;
+ }
+
+ .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet {
+ -webkit-order: 5;
+ -ms-flex-order: 5;
+ order: 5;
+ }
+
+ .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet {
+ -webkit-order: 6;
+ -ms-flex-order: 6;
+ order: 6;
+ }
+
+ .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet {
+ -webkit-order: 7;
+ -ms-flex-order: 7;
+ order: 7;
+ }
+
+ .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet {
+ -webkit-order: 8;
+ -ms-flex-order: 8;
+ order: 8;
+ }
+
+ .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet {
+ -webkit-order: 9;
+ -ms-flex-order: 9;
+ order: 9;
+ }
+
+ .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet {
+ -webkit-order: 10;
+ -ms-flex-order: 10;
+ order: 10;
+ }
+
+ .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet {
+ -webkit-order: 11;
+ -ms-flex-order: 11;
+ order: 11;
+ }
+
+ .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet {
+ -webkit-order: 12;
+ -ms-flex-order: 12;
+ order: 12;
+ }
+
+ .mdl-cell--1-col,
+ .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
+ width: calc(12.5% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
+ .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet {
+ width: 12.5%;
+ }
+
+ .mdl-cell--2-col,
+ .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
+ width: calc(25% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
+ .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet {
+ width: 25%;
+ }
+
+ .mdl-cell--3-col,
+ .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
+ width: calc(37.5% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
+ .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet {
+ width: 37.5%;
+ }
+
+ .mdl-cell--4-col,
+ .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
+ width: calc(50% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
+ .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet {
+ width: 50%;
+ }
+
+ .mdl-cell--5-col,
+ .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
+ width: calc(62.5% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
+ .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet {
+ width: 62.5%;
+ }
+
+ .mdl-cell--6-col,
+ .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
+ width: calc(75% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
+ .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
+ width: 75%;
+ }
+
+ .mdl-cell--7-col,
+ .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
+ width: calc(87.5% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
+ .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet {
+ width: 87.5%;
+ }
+
+ .mdl-cell--8-col,
+ .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
+ .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet {
+ width: 100%;
+ }
+
+ .mdl-cell--9-col,
+ .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
+ .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet {
+ width: 100%;
+ }
+
+ .mdl-cell--10-col,
+ .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
+ .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet {
+ width: 100%;
+ }
+
+ .mdl-cell--11-col,
+ .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
+ .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet {
+ width: 100%;
+ }
+
+ .mdl-cell--12-col,
+ .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
+ .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet {
+ width: 100%;
+ }
+
+ .mdl-cell--1-offset,
+ .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
+ margin-left: calc(12.5% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet {
+ margin-left: 12.5%;
+ }
+
+ .mdl-cell--2-offset,
+ .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
+ margin-left: calc(25% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet {
+ margin-left: 25%;
+ }
+
+ .mdl-cell--3-offset,
+ .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
+ margin-left: calc(37.5% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet {
+ margin-left: 37.5%;
+ }
+
+ .mdl-cell--4-offset,
+ .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
+ margin-left: calc(50% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet {
+ margin-left: 50%;
+ }
+
+ .mdl-cell--5-offset,
+ .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
+ margin-left: calc(62.5% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet {
+ margin-left: 62.5%;
+ }
+
+ .mdl-cell--6-offset,
+ .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
+ margin-left: calc(75% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet {
+ margin-left: 75%;
+ }
+
+ .mdl-cell--7-offset,
+ .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
+ margin-left: calc(87.5% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet {
+ margin-left: 87.5%;
+ }
+}
+
+@media (min-width: 840px) {
+ .mdl-grid {
+ padding: 8px;
+ }
+
+ .mdl-cell {
+ margin: 8px;
+ width: calc(33.3333333333% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell {
+ width: 33.3333333333%;
+ }
+
+ .mdl-cell--hide-desktop {
+ display: none !important;
+ }
+
+ .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop {
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+ }
+
+ .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop {
+ -webkit-order: 2;
+ -ms-flex-order: 2;
+ order: 2;
+ }
+
+ .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop {
+ -webkit-order: 3;
+ -ms-flex-order: 3;
+ order: 3;
+ }
+
+ .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop {
+ -webkit-order: 4;
+ -ms-flex-order: 4;
+ order: 4;
+ }
+
+ .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop {
+ -webkit-order: 5;
+ -ms-flex-order: 5;
+ order: 5;
+ }
+
+ .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop {
+ -webkit-order: 6;
+ -ms-flex-order: 6;
+ order: 6;
+ }
+
+ .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop {
+ -webkit-order: 7;
+ -ms-flex-order: 7;
+ order: 7;
+ }
+
+ .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop {
+ -webkit-order: 8;
+ -ms-flex-order: 8;
+ order: 8;
+ }
+
+ .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop {
+ -webkit-order: 9;
+ -ms-flex-order: 9;
+ order: 9;
+ }
+
+ .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop {
+ -webkit-order: 10;
+ -ms-flex-order: 10;
+ order: 10;
+ }
+
+ .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop {
+ -webkit-order: 11;
+ -ms-flex-order: 11;
+ order: 11;
+ }
+
+ .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop {
+ -webkit-order: 12;
+ -ms-flex-order: 12;
+ order: 12;
+ }
+
+ .mdl-cell--1-col,
+ .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
+ width: calc(8.3333333333% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing >
+ .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop {
+ width: 8.3333333333%;
+ }
+
+ .mdl-cell--2-col,
+ .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
+ width: calc(16.6666666667% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing >
+ .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop {
+ width: 16.6666666667%;
+ }
+
+ .mdl-cell--3-col,
+ .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
+ width: calc(25% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing >
+ .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop {
+ width: 25%;
+ }
+
+ .mdl-cell--4-col,
+ .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
+ width: calc(33.3333333333% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing >
+ .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop {
+ width: 33.3333333333%;
+ }
+
+ .mdl-cell--5-col,
+ .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
+ width: calc(41.6666666667% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing >
+ .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop {
+ width: 41.6666666667%;
+ }
+
+ .mdl-cell--6-col,
+ .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
+ width: calc(50% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing >
+ .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop {
+ width: 50%;
+ }
+
+ .mdl-cell--7-col,
+ .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
+ width: calc(58.3333333333% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing >
+ .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop {
+ width: 58.3333333333%;
+ }
+
+ .mdl-cell--8-col,
+ .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
+ width: calc(66.6666666667% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing >
+ .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop {
+ width: 66.6666666667%;
+ }
+
+ .mdl-cell--9-col,
+ .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
+ width: calc(75% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing >
+ .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop {
+ width: 75%;
+ }
+
+ .mdl-cell--10-col,
+ .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
+ width: calc(83.3333333333% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing >
+ .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop {
+ width: 83.3333333333%;
+ }
+
+ .mdl-cell--11-col,
+ .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
+ width: calc(91.6666666667% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing >
+ .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop {
+ width: 91.6666666667%;
+ }
+
+ .mdl-cell--12-col,
+ .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
+ width: calc(100% - 16px);
+ }
+
+ .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing >
+ .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop {
+ width: 100%;
+ }
+
+ .mdl-cell--1-offset,
+ .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
+ margin-left: calc(8.3333333333% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop {
+ margin-left: 8.3333333333%;
+ }
+
+ .mdl-cell--2-offset,
+ .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
+ margin-left: calc(16.6666666667% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop {
+ margin-left: 16.6666666667%;
+ }
+
+ .mdl-cell--3-offset,
+ .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
+ margin-left: calc(25% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop {
+ margin-left: 25%;
+ }
+
+ .mdl-cell--4-offset,
+ .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
+ margin-left: calc(33.3333333333% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop {
+ margin-left: 33.3333333333%;
+ }
+
+ .mdl-cell--5-offset,
+ .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
+ margin-left: calc(41.6666666667% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop {
+ margin-left: 41.6666666667%;
+ }
+
+ .mdl-cell--6-offset,
+ .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
+ margin-left: calc(50% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop {
+ margin-left: 50%;
+ }
+
+ .mdl-cell--7-offset,
+ .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
+ margin-left: calc(58.3333333333% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop {
+ margin-left: 58.3333333333%;
+ }
+
+ .mdl-cell--8-offset,
+ .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
+ margin-left: calc(66.6666666667% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop {
+ margin-left: 66.6666666667%;
+ }
+
+ .mdl-cell--9-offset,
+ .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
+ margin-left: calc(75% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop {
+ margin-left: 75%;
+ }
+
+ .mdl-cell--10-offset,
+ .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
+ margin-left: calc(83.3333333333% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop {
+ margin-left: 83.3333333333%;
+ }
+
+ .mdl-cell--11-offset,
+ .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
+ margin-left: calc(91.6666666667% + 8px);
+ }
+
+ .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing >
+ .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop {
+ margin-left: 91.6666666667%;
+ }
+}
\ No newline at end of file
diff --git a/src/material.js b/src/material.js
new file mode 100644
index 0000000..cd63c92
--- /dev/null
+++ b/src/material.js
@@ -0,0 +1,4010 @@
+;(function () {
+ "use strict";
+
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+ /**
+ * A component handler interface using the revealing module design pattern.
+ * More details on this design pattern here:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @author Jason Mayes.
+ */
+ /* exported componentHandler */
+
+// Pre-defining the componentHandler interface, for closure documentation and
+// static verification.
+ var componentHandler = {
+ /**
+ * Searches existing DOM for elements of our component type and upgrades them
+ * if they have not already been upgraded.
+ *
+ * @param {string=} optJsClass the programatic name of the element class we
+ * need to create a new instance of.
+ * @param {string=} optCssClass the name of the CSS class elements of this
+ * type will have.
+ */
+ upgradeDom: function (optJsClass, optCssClass) {
+ },
+ /**
+ * Upgrades a specific element rather than all in the DOM.
+ *
+ * @param {!Element} element The element we wish to upgrade.
+ * @param {string=} optJsClass Optional name of the class we want to upgrade
+ * the element to.
+ */
+ upgradeElement: function (element, optJsClass) {
+ },
+ /**
+ * Upgrades a specific list of elements rather than all in the DOM.
+ *
+ * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements
+ * The elements we wish to upgrade.
+ */
+ upgradeElements: function (elements) {
+ },
+ /**
+ * Upgrades all registered components found in the current DOM. This is
+ * automatically called on window load.
+ */
+ upgradeAllRegistered: function () {
+ },
+ /**
+ * Allows user to be alerted to any upgrades that are performed for a given
+ * component type
+ *
+ * @param {string} jsClass The class name of the MDL component we wish
+ * to hook into for any upgrades performed.
+ * @param {function(!HTMLElement)} callback The function to call upon an
+ * upgrade. This function should expect 1 parameter - the HTMLElement which
+ * got upgraded.
+ */
+ registerUpgradedCallback: function (jsClass, callback) {
+ },
+ /**
+ * Registers a class for future use and attempts to upgrade existing DOM.
+ *
+ * @param {componentHandler.ComponentConfigPublic} config the registration configuration
+ */
+ register: function (config) {
+ },
+ /**
+ * Downgrade either a given node, an array of nodes, or a NodeList.
+ *
+ * @param {!Node|!Array<!Node>|!NodeList} nodes
+ */
+ downgradeElements: function (nodes) {
+ }
+ };
+
+ componentHandler = (function () {
+ 'use strict';
+
+ /** @type {!Array<componentHandler.ComponentConfig>} */
+ var registeredComponents_ = [];
+
+ /** @type {!Array<componentHandler.Component>} */
+ var createdComponents_ = [];
+
+ var componentConfigProperty_ = 'mdlComponentConfigInternal_';
+
+ /**
+ * Searches registered components for a class we are interested in using.
+ * Optionally replaces a match with passed object if specified.
+ *
+ * @param {string} name The name of a class we want to use.
+ * @param {componentHandler.ComponentConfig=} optReplace Optional object to replace match with.
+ * @return {!Object|boolean}
+ * @private
+ */
+ function findRegisteredClass_(name, optReplace) {
+ for (var i = 0; i < registeredComponents_.length; i++) {
+ if (registeredComponents_[i].className === name) {
+ if (typeof optReplace !== 'undefined') {
+ registeredComponents_[i] = optReplace;
+ }
+ return registeredComponents_[i];
+ }
+ }
+ return false;
+ }
+
+ /**
+ * Returns an array of the classNames of the upgraded classes on the element.
+ *
+ * @param {!Element} element The element to fetch data from.
+ * @return {!Array<string>}
+ * @private
+ */
+ function getUpgradedListOfElement_(element) {
+ var dataUpgraded = element.getAttribute('data-upgraded');
+ // Use `['']` as default value to conform the `,name,name...` style.
+ return dataUpgraded === null ? [''] : dataUpgraded.split(',');
+ }
+
+ /**
+ * Returns true if the given element has already been upgraded for the given
+ * class.
+ *
+ * @param {!Element} element The element we want to check.
+ * @param {string} jsClass The class to check for.
+ * @returns {boolean}
+ * @private
+ */
+ function isElementUpgraded_(element, jsClass) {
+ var upgradedList = getUpgradedListOfElement_(element);
+ return upgradedList.indexOf(jsClass) !== -1;
+ }
+
+ /**
+ * Create an event object.
+ *
+ * @param {string} eventType The type name of the event.
+ * @param {boolean} bubbles Whether the event should bubble up the DOM.
+ * @param {boolean} cancelable Whether the event can be canceled.
+ * @returns {!Event}
+ */
+ function createEvent_(eventType, bubbles, cancelable) {
+ if ('CustomEvent' in window && typeof window.CustomEvent === 'function') {
+ return new CustomEvent(eventType, {
+ bubbles: bubbles,
+ cancelable: cancelable
+ });
+ } else {
+ var ev = document.createEvent('Events');
+ ev.initEvent(eventType, bubbles, cancelable);
+ return ev;
+ }
+ }
+
+ /**
+ * Searches existing DOM for elements of our component type and upgrades them
+ * if they have not already been upgraded.
+ *
+ * @param {string=} optJsClass the programatic name of the element class we
+ * need to create a new instance of.
+ * @param {string=} optCssClass the name of the CSS class elements of this
+ * type will have.
+ */
+ function upgradeDomInternal(optJsClass, optCssClass) {
+ if (typeof optJsClass === 'undefined' &&
+ typeof optCssClass === 'undefined') {
+ for (var i = 0; i < registeredComponents_.length; i++) {
+ upgradeDomInternal(registeredComponents_[i].className,
+ registeredComponents_[i].cssClass);
+ }
+ } else {
+ var jsClass = /** @type {string} */ (optJsClass);
+ if (typeof optCssClass === 'undefined') {
+ var registeredClass = findRegisteredClass_(jsClass);
+ if (registeredClass) {
+ optCssClass = registeredClass.cssClass;
+ }
+ }
+
+ var elements = document.querySelectorAll('.' + optCssClass);
+ for (var n = 0; n < elements.length; n++) {
+ upgradeElementInternal(elements[n], jsClass);
+ }
+ }
+ }
+
+ /**
+ * Upgrades a specific element rather than all in the DOM.
+ *
+ * @param {!Element} element The element we wish to upgrade.
+ * @param {string=} optJsClass Optional name of the class we want to upgrade
+ * the element to.
+ */
+ function upgradeElementInternal(element, optJsClass) {
+ // Verify argument type.
+ if (!(typeof element === 'object' && element instanceof Element)) {
+ throw new Error('Invalid argument provided to upgrade MDL element.');
+ }
+ // Allow upgrade to be canceled by canceling emitted event.
+ var upgradingEv = createEvent_('mdl-componentupgrading', true, true);
+ element.dispatchEvent(upgradingEv);
+ if (upgradingEv.defaultPrevented) {
+ return;
+ }
+
+ var upgradedList = getUpgradedListOfElement_(element);
+ var classesToUpgrade = [];
+ // If jsClass is not provided scan the registered components to find the
+ // ones matching the element's CSS classList.
+ if (!optJsClass) {
+ var classList = element.classList;
+ registeredComponents_.forEach(function (component) {
+ // Match CSS & Not to be upgraded & Not upgraded.
+ if (classList.contains(component.cssClass) &&
+ classesToUpgrade.indexOf(component) === -1 &&
+ !isElementUpgraded_(element, component.className)) {
+ classesToUpgrade.push(component);
+ }
+ });
+ } else if (!isElementUpgraded_(element, optJsClass)) {
+ classesToUpgrade.push(findRegisteredClass_(optJsClass));
+ }
+
+ // Upgrade the element for each classes.
+ for (var i = 0, n = classesToUpgrade.length, registeredClass; i < n; i++) {
+ registeredClass = classesToUpgrade[i];
+ if (registeredClass) {
+ // Mark element as upgraded.
+ upgradedList.push(registeredClass.className);
+ element.setAttribute('data-upgraded', upgradedList.join(','));
+ var instance = new registeredClass.classConstructor(element);
+ instance[componentConfigProperty_] = registeredClass;
+ createdComponents_.push(instance);
+ // Call any callbacks the user has registered with this component type.
+ for (var j = 0, m = registeredClass.callbacks.length; j < m; j++) {
+ registeredClass.callbacks[j](element);
+ }
+
+ if (registeredClass.widget) {
+ // Assign per element instance for control over API
+ element[registeredClass.className] = instance;
+ }
+ } else {
+ throw new Error(
+ 'Unable to find a registered component for the given class.');
+ }
+
+ var upgradedEv = createEvent_('mdl-componentupgraded', true, false);
+ element.dispatchEvent(upgradedEv);
+ }
+ }
+
+ /**
+ * Upgrades a specific list of elements rather than all in the DOM.
+ *
+ * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements
+ * The elements we wish to upgrade.
+ */
+ function upgradeElementsInternal(elements) {
+ if (!Array.isArray(elements)) {
+ if (elements instanceof Element) {
+ elements = [elements];
+ } else {
+ elements = Array.prototype.slice.call(elements);
+ }
+ }
+ for (var i = 0, n = elements.length, element; i < n; i++) {
+ element = elements[i];
+ if (element instanceof HTMLElement) {
+ upgradeElementInternal(element);
+ if (element.children.length > 0) {
+ upgradeElementsInternal(element.children);
+ }
+ }
+ }
+ }
+
+ /**
+ * Registers a class for future use and attempts to upgrade existing DOM.
+ *
+ * @param {componentHandler.ComponentConfigPublic} config
+ */
+ function registerInternal(config) {
+ // In order to support both Closure-compiled and uncompiled code accessing
+ // this method, we need to allow for both the dot and array syntax for
+ // property access. You'll therefore see the `foo.bar || foo['bar']`
+ // pattern repeated across this method.
+ var widgetMissing = (typeof config.widget === 'undefined' &&
+ typeof config['widget'] === 'undefined');
+ var widget = true;
+
+ if (!widgetMissing) {
+ widget = config.widget || config['widget'];
+ }
+
+ var newConfig = /** @type {componentHandler.ComponentConfig} */ ({
+ classConstructor: config.constructor || config['constructor'],
+ className: config.classAsString || config['classAsString'],
+ cssClass: config.cssClass || config['cssClass'],
+ widget: widget,
+ callbacks: []
+ });
+
+ registeredComponents_.forEach(function (item) {
+ if (item.cssClass === newConfig.cssClass) {
+ throw new Error('The provided cssClass has already been registered: ' + item.cssClass);
+ }
+ if (item.className === newConfig.className) {
+ throw new Error('The provided className has already been registered');
+ }
+ });
+
+ if (config.constructor.prototype
+ .hasOwnProperty(componentConfigProperty_)) {
+ throw new Error(
+ 'MDL component classes must not have ' + componentConfigProperty_ +
+ ' defined as a property.');
+ }
+
+ var found = findRegisteredClass_(config.classAsString, newConfig);
+
+ if (!found) {
+ registeredComponents_.push(newConfig);
+ }
+ }
+
+ /**
+ * Allows user to be alerted to any upgrades that are performed for a given
+ * component type
+ *
+ * @param {string} jsClass The class name of the MDL component we wish
+ * to hook into for any upgrades performed.
+ * @param {function(!HTMLElement)} callback The function to call upon an
+ * upgrade. This function should expect 1 parameter - the HTMLElement which
+ * got upgraded.
+ */
+ function registerUpgradedCallbackInternal(jsClass, callback) {
+ var regClass = findRegisteredClass_(jsClass);
+ if (regClass) {
+ regClass.callbacks.push(callback);
+ }
+ }
+
+ /**
+ * Upgrades all registered components found in the current DOM. This is
+ * automatically called on window load.
+ */
+ function upgradeAllRegisteredInternal() {
+ for (var n = 0; n < registeredComponents_.length; n++) {
+ upgradeDomInternal(registeredComponents_[n].className);
+ }
+ }
+
+ /**
+ * Check the component for the downgrade method.
+ * Execute if found.
+ * Remove component from createdComponents list.
+ *
+ * @param {?componentHandler.Component} component
+ */
+ function deconstructComponentInternal(component) {
+ if (component) {
+ var componentIndex = createdComponents_.indexOf(component);
+ createdComponents_.splice(componentIndex, 1);
+
+ var upgrades = component.element_.getAttribute('data-upgraded').split(',');
+ var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);
+ upgrades.splice(componentPlace, 1);
+ component.element_.setAttribute('data-upgraded', upgrades.join(','));
+
+ var ev = createEvent_('mdl-componentdowngraded', true, false);
+ component.element_.dispatchEvent(ev);
+ }
+ }
+
+ /**
+ * Downgrade either a given node, an array of nodes, or a NodeList.
+ *
+ * @param {!Node|!Array<!Node>|!NodeList} nodes
+ */
+ function downgradeNodesInternal(nodes) {
+ /**
+ * Auxiliary function to downgrade a single node.
+ * @param {!Node} node the node to be downgraded
+ */
+ var downgradeNode = function (node) {
+ createdComponents_.filter(function (item) {
+ return item.element_ === node;
+ }).forEach(deconstructComponentInternal);
+ };
+ if (nodes instanceof Array || nodes instanceof NodeList) {
+ for (var n = 0; n < nodes.length; n++) {
+ downgradeNode(nodes[n]);
+ }
+ } else if (nodes instanceof Node) {
+ downgradeNode(nodes);
+ } else {
+ throw new Error('Invalid argument provided to downgrade MDL nodes.');
+ }
+ }
+
+ // Now return the functions that should be made public with their publicly
+ // facing names...
+ return {
+ upgradeDom: upgradeDomInternal,
+ upgradeElement: upgradeElementInternal,
+ upgradeElements: upgradeElementsInternal,
+ upgradeAllRegistered: upgradeAllRegisteredInternal,
+ registerUpgradedCallback: registerUpgradedCallbackInternal,
+ register: registerInternal,
+ downgradeElements: downgradeNodesInternal
+ };
+ })();
+
+ /**
+ * Describes the type of a registered component type managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ * constructor: Function,
+ * classAsString: string,
+ * cssClass: string,
+ * widget: (string|boolean|undefined)
+ * }}
+ */
+ componentHandler.ComponentConfigPublic; // jshint ignore:line
+
+ /**
+ * Describes the type of a registered component type managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ * constructor: !Function,
+ * className: string,
+ * cssClass: string,
+ * widget: (string|boolean),
+ * callbacks: !Array<function(!HTMLElement)>
+ * }}
+ */
+ componentHandler.ComponentConfig; // jshint ignore:line
+
+ /**
+ * Created component (i.e., upgraded element) type as managed by
+ * componentHandler. Provided for benefit of the Closure compiler.
+ *
+ * @typedef {{
+ * element_: !HTMLElement,
+ * className: string,
+ * classAsString: string,
+ * cssClass: string,
+ * widget: string
+ * }}
+ */
+ componentHandler.Component; // jshint ignore:line
+
+// Export all symbols, for the benefit of Closure compiler.
+// No effect on uncompiled code.
+ componentHandler['upgradeDom'] = componentHandler.upgradeDom;
+ componentHandler['upgradeElement'] = componentHandler.upgradeElement;
+ componentHandler['upgradeElements'] = componentHandler.upgradeElements;
+ componentHandler['upgradeAllRegistered'] =
+ componentHandler.upgradeAllRegistered;
+ componentHandler['registerUpgradedCallback'] =
+ componentHandler.registerUpgradedCallback;
+ componentHandler['register'] = componentHandler.register;
+ componentHandler['downgradeElements'] = componentHandler.downgradeElements;
+ window.componentHandler = componentHandler;
+ window['componentHandler'] = componentHandler;
+
+ window.addEventListener('load', function () {
+ 'use strict';
+
+ /**
+ * Performs a "Cutting the mustard" test. If the browser supports the features
+ * tested, adds a mdl-js class to the <html> element. It then upgrades all MDL
+ * components requiring JavaScript.
+ */
+ if ('classList' in document.createElement('div') &&
+ 'querySelector' in document &&
+ 'addEventListener' in window && Array.prototype.forEach) {
+ document.documentElement.classList.add('mdl-js');
+ componentHandler.upgradeAllRegistered();
+ } else {
+ /**
+ * Dummy function to avoid JS errors.
+ */
+ componentHandler.upgradeElement = function () {
+ };
+ /**
+ * Dummy function to avoid JS errors.
+ */
+ componentHandler.register = function () {
+ };
+ }
+ });
+
+// Source: https://github.com/darius/requestAnimationFrame/blob/master/requestAnimationFrame.js
+// Adapted from https://gist.github.com/paulirish/1579671 which derived from
+// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
+// requestAnimationFrame polyfill by Erik Möller.
+// Fixes from Paul Irish, Tino Zijdel, Andrew Mao, Klemen Slavič, Darius Bacon
+// MIT license
+ if (!Date.now) {
+ /**
+ * Date.now polyfill.
+ * @return {number} the current Date
+ */
+ Date.now = function () {
+ return new Date().getTime();
+ };
+ Date['now'] = Date.now;
+ }
+ var vendors = [
+ 'webkit',
+ 'moz'
+ ];
+ for (var i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {
+ var vp = vendors[i];
+ window.requestAnimationFrame = window[vp + 'RequestAnimationFrame'];
+ window.cancelAnimationFrame = window[vp + 'CancelAnimationFrame'] || window[vp + 'CancelRequestAnimationFrame'];
+ window['requestAnimationFrame'] = window.requestAnimationFrame;
+ window['cancelAnimationFrame'] = window.cancelAnimationFrame;
+ }
+ if (/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent) || !window.requestAnimationFrame || !window.cancelAnimationFrame) {
+ var lastTime = 0;
+ /**
+ * requestAnimationFrame polyfill.
+ * @param {!Function} callback the callback function.
+ */
+ window.requestAnimationFrame = function (callback) {
+ var now = Date.now();
+ var nextTime = Math.max(lastTime + 16, now);
+ return setTimeout(function () {
+ callback(lastTime = nextTime);
+ }, nextTime - now);
+ };
+ window.cancelAnimationFrame = clearTimeout;
+ window['requestAnimationFrame'] = window.requestAnimationFrame;
+ window['cancelAnimationFrame'] = window.cancelAnimationFrame;
+ }
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Button MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialButton = function MaterialButton(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialButton'] = MaterialButton;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialButton.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialButton.prototype.CssClasses_ = {
+ RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_CONTAINER: 'mdl-button__ripple-container',
+ RIPPLE: 'mdl-ripple'
+ };
+ /**
+ * Handle blur of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialButton.prototype.blurHandler_ = function (event) {
+ if (event) {
+ this.element_.blur();
+ }
+ };
+// Public methods.
+ /**
+ * Disable button.
+ *
+ * @public
+ */
+ MaterialButton.prototype.disable = function () {
+ this.element_.disabled = true;
+ };
+ MaterialButton.prototype['disable'] = MaterialButton.prototype.disable;
+ /**
+ * Enable button.
+ *
+ * @public
+ */
+ MaterialButton.prototype.enable = function () {
+ this.element_.disabled = false;
+ };
+ MaterialButton.prototype['enable'] = MaterialButton.prototype.enable;
+ /**
+ * Initialize element.
+ */
+ MaterialButton.prototype.init = function () {
+ if (this.element_) {
+ if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+ var rippleContainer = document.createElement('span');
+ rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+ this.rippleElement_ = document.createElement('span');
+ this.rippleElement_.classList.add(this.CssClasses_.RIPPLE);
+ rippleContainer.appendChild(this.rippleElement_);
+ this.boundRippleBlurHandler = this.blurHandler_.bind(this);
+ this.rippleElement_.addEventListener('mouseup', this.boundRippleBlurHandler);
+ this.element_.appendChild(rippleContainer);
+ }
+ this.boundButtonBlurHandler = this.blurHandler_.bind(this);
+ this.element_.addEventListener('mouseup', this.boundButtonBlurHandler);
+ this.element_.addEventListener('mouseleave', this.boundButtonBlurHandler);
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialButton,
+ classAsString: 'MaterialButton',
+ cssClass: 'mdl-js-button',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Checkbox MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialCheckbox = function MaterialCheckbox(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialCheckbox'] = MaterialCheckbox;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialCheckbox.prototype.Constant_ = {TINY_TIMEOUT: 0.001};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialCheckbox.prototype.CssClasses_ = {
+ INPUT: 'mdl-checkbox__input',
+ BOX_OUTLINE: 'mdl-checkbox__box-outline',
+ FOCUS_HELPER: 'mdl-checkbox__focus-helper',
+ TICK_OUTLINE: 'mdl-checkbox__tick-outline',
+ RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE_CONTAINER: 'mdl-checkbox__ripple-container',
+ RIPPLE_CENTER: 'mdl-ripple--center',
+ RIPPLE: 'mdl-ripple',
+ IS_FOCUSED: 'is-focused',
+ IS_DISABLED: 'is-disabled',
+ IS_CHECKED: 'is-checked',
+ IS_UPGRADED: 'is-upgraded'
+ };
+ /**
+ * Handle change of state.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialCheckbox.prototype.onChange_ = function (event) {
+ this.updateClasses_();
+ };
+ /**
+ * Handle focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialCheckbox.prototype.onFocus_ = function (event) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle lost focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialCheckbox.prototype.onBlur_ = function (event) {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle mouseup.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialCheckbox.prototype.onMouseUp_ = function (event) {
+ this.blur_();
+ };
+ /**
+ * Handle class updates.
+ *
+ * @private
+ */
+ MaterialCheckbox.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkToggleState();
+ };
+ /**
+ * Add blur.
+ *
+ * @private
+ */
+ MaterialCheckbox.prototype.blur_ = function () {
+ // TODO: figure out why there's a focus event being fired after our blur,
+ // so that we can avoid this hack.
+ window.setTimeout(function () {
+ this.inputElement_.blur();
+ }.bind(this), this.Constant_.TINY_TIMEOUT);
+ };
+// Public methods.
+ /**
+ * Check the inputs toggle state and update display.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.checkToggleState = function () {
+ if (this.inputElement_.checked) {
+ this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+ }
+ };
+ MaterialCheckbox.prototype['checkToggleState'] = MaterialCheckbox.prototype.checkToggleState;
+ /**
+ * Check the inputs disabled state and update display.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.checkDisabled = function () {
+ if (this.inputElement_.disabled) {
+ this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+ }
+ };
+ MaterialCheckbox.prototype['checkDisabled'] = MaterialCheckbox.prototype.checkDisabled;
+ /**
+ * Disable checkbox.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.disable = function () {
+ this.inputElement_.disabled = true;
+ this.updateClasses_();
+ };
+ MaterialCheckbox.prototype['disable'] = MaterialCheckbox.prototype.disable;
+ /**
+ * Enable checkbox.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.enable = function () {
+ this.inputElement_.disabled = false;
+ this.updateClasses_();
+ };
+ MaterialCheckbox.prototype['enable'] = MaterialCheckbox.prototype.enable;
+ /**
+ * Check checkbox.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.check = function () {
+ this.inputElement_.checked = true;
+ this.updateClasses_();
+ };
+ MaterialCheckbox.prototype['check'] = MaterialCheckbox.prototype.check;
+ /**
+ * Uncheck checkbox.
+ *
+ * @public
+ */
+ MaterialCheckbox.prototype.uncheck = function () {
+ this.inputElement_.checked = false;
+ this.updateClasses_();
+ };
+ MaterialCheckbox.prototype['uncheck'] = MaterialCheckbox.prototype.uncheck;
+ /**
+ * Initialize element.
+ */
+ MaterialCheckbox.prototype.init = function () {
+ if (this.element_) {
+ this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+ var boxOutline = document.createElement('span');
+ boxOutline.classList.add(this.CssClasses_.BOX_OUTLINE);
+ var tickContainer = document.createElement('span');
+ tickContainer.classList.add(this.CssClasses_.FOCUS_HELPER);
+ var tickOutline = document.createElement('span');
+ tickOutline.classList.add(this.CssClasses_.TICK_OUTLINE);
+ boxOutline.appendChild(tickOutline);
+ this.element_.appendChild(tickContainer);
+ this.element_.appendChild(boxOutline);
+ if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ this.rippleContainerElement_ = document.createElement('span');
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+ this.boundRippleMouseUp = this.onMouseUp_.bind(this);
+ this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);
+ var ripple = document.createElement('span');
+ ripple.classList.add(this.CssClasses_.RIPPLE);
+ this.rippleContainerElement_.appendChild(ripple);
+ this.element_.appendChild(this.rippleContainerElement_);
+ }
+ this.boundInputOnChange = this.onChange_.bind(this);
+ this.boundInputOnFocus = this.onFocus_.bind(this);
+ this.boundInputOnBlur = this.onBlur_.bind(this);
+ this.boundElementMouseUp = this.onMouseUp_.bind(this);
+ this.inputElement_.addEventListener('change', this.boundInputOnChange);
+ this.inputElement_.addEventListener('focus', this.boundInputOnFocus);
+ this.inputElement_.addEventListener('blur', this.boundInputOnBlur);
+ this.element_.addEventListener('mouseup', this.boundElementMouseUp);
+ this.updateClasses_();
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialCheckbox,
+ classAsString: 'MaterialCheckbox',
+ cssClass: 'mdl-js-checkbox',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for icon toggle MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialIconToggle = function MaterialIconToggle(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialIconToggle'] = MaterialIconToggle;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialIconToggle.prototype.Constant_ = {TINY_TIMEOUT: 0.001};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialIconToggle.prototype.CssClasses_ = {
+ INPUT: 'mdl-icon-toggle__input',
+ JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE_CONTAINER: 'mdl-icon-toggle__ripple-container',
+ RIPPLE_CENTER: 'mdl-ripple--center',
+ RIPPLE: 'mdl-ripple',
+ IS_FOCUSED: 'is-focused',
+ IS_DISABLED: 'is-disabled',
+ IS_CHECKED: 'is-checked'
+ };
+ /**
+ * Handle change of state.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialIconToggle.prototype.onChange_ = function (event) {
+ this.updateClasses_();
+ };
+ /**
+ * Handle focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialIconToggle.prototype.onFocus_ = function (event) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle lost focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialIconToggle.prototype.onBlur_ = function (event) {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle mouseup.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialIconToggle.prototype.onMouseUp_ = function (event) {
+ this.blur_();
+ };
+ /**
+ * Handle class updates.
+ *
+ * @private
+ */
+ MaterialIconToggle.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkToggleState();
+ };
+ /**
+ * Add blur.
+ *
+ * @private
+ */
+ MaterialIconToggle.prototype.blur_ = function () {
+ // TODO: figure out why there's a focus event being fired after our blur,
+ // so that we can avoid this hack.
+ window.setTimeout(function () {
+ this.inputElement_.blur();
+ }.bind(this), this.Constant_.TINY_TIMEOUT);
+ };
+// Public methods.
+ /**
+ * Check the inputs toggle state and update display.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.checkToggleState = function () {
+ if (this.inputElement_.checked) {
+ this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+ }
+ };
+ MaterialIconToggle.prototype['checkToggleState'] = MaterialIconToggle.prototype.checkToggleState;
+ /**
+ * Check the inputs disabled state and update display.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.checkDisabled = function () {
+ if (this.inputElement_.disabled) {
+ this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+ }
+ };
+ MaterialIconToggle.prototype['checkDisabled'] = MaterialIconToggle.prototype.checkDisabled;
+ /**
+ * Disable icon toggle.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.disable = function () {
+ this.inputElement_.disabled = true;
+ this.updateClasses_();
+ };
+ MaterialIconToggle.prototype['disable'] = MaterialIconToggle.prototype.disable;
+ /**
+ * Enable icon toggle.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.enable = function () {
+ this.inputElement_.disabled = false;
+ this.updateClasses_();
+ };
+ MaterialIconToggle.prototype['enable'] = MaterialIconToggle.prototype.enable;
+ /**
+ * Check icon toggle.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.check = function () {
+ this.inputElement_.checked = true;
+ this.updateClasses_();
+ };
+ MaterialIconToggle.prototype['check'] = MaterialIconToggle.prototype.check;
+ /**
+ * Uncheck icon toggle.
+ *
+ * @public
+ */
+ MaterialIconToggle.prototype.uncheck = function () {
+ this.inputElement_.checked = false;
+ this.updateClasses_();
+ };
+ MaterialIconToggle.prototype['uncheck'] = MaterialIconToggle.prototype.uncheck;
+ /**
+ * Initialize element.
+ */
+ MaterialIconToggle.prototype.init = function () {
+ if (this.element_) {
+ this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+ if (this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ this.rippleContainerElement_ = document.createElement('span');
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+ this.boundRippleMouseUp = this.onMouseUp_.bind(this);
+ this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);
+ var ripple = document.createElement('span');
+ ripple.classList.add(this.CssClasses_.RIPPLE);
+ this.rippleContainerElement_.appendChild(ripple);
+ this.element_.appendChild(this.rippleContainerElement_);
+ }
+ this.boundInputOnChange = this.onChange_.bind(this);
+ this.boundInputOnFocus = this.onFocus_.bind(this);
+ this.boundInputOnBlur = this.onBlur_.bind(this);
+ this.boundElementOnMouseUp = this.onMouseUp_.bind(this);
+ this.inputElement_.addEventListener('change', this.boundInputOnChange);
+ this.inputElement_.addEventListener('focus', this.boundInputOnFocus);
+ this.inputElement_.addEventListener('blur', this.boundInputOnBlur);
+ this.element_.addEventListener('mouseup', this.boundElementOnMouseUp);
+ this.updateClasses_();
+ this.element_.classList.add('is-upgraded');
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialIconToggle,
+ classAsString: 'MaterialIconToggle',
+ cssClass: 'mdl-js-icon-toggle',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for dropdown MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialMenu = function MaterialMenu(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialMenu'] = MaterialMenu;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialMenu.prototype.Constant_ = {
+ // Total duration of the menu animation.
+ TRANSITION_DURATION_SECONDS: 0.3,
+ // The fraction of the total duration we want to use for menu item animations.
+ TRANSITION_DURATION_FRACTION: 0.8,
+ // How long the menu stays open after choosing an option (so the user can see
+ // the ripple).
+ CLOSE_TIMEOUT: 150
+ };
+ /**
+ * Keycodes, for code readability.
+ *
+ * @enum {number}
+ * @private
+ */
+ MaterialMenu.prototype.Keycodes_ = {
+ ENTER: 13,
+ ESCAPE: 27,
+ SPACE: 32,
+ UP_ARROW: 38,
+ DOWN_ARROW: 40
+ };
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialMenu.prototype.CssClasses_ = {
+ CONTAINER: 'mdl-menu__container',
+ OUTLINE: 'mdl-menu__outline',
+ ITEM: 'mdl-menu__item',
+ ITEM_RIPPLE_CONTAINER: 'mdl-menu__item-ripple-container',
+ RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE: 'mdl-ripple',
+ // Statuses
+ IS_UPGRADED: 'is-upgraded',
+ IS_VISIBLE: 'is-visible',
+ IS_ANIMATING: 'is-animating',
+ // Alignment options
+ BOTTOM_LEFT: 'mdl-menu--bottom-left',
+ // This is the default.
+ BOTTOM_RIGHT: 'mdl-menu--bottom-right',
+ TOP_LEFT: 'mdl-menu--top-left',
+ TOP_RIGHT: 'mdl-menu--top-right',
+ UNALIGNED: 'mdl-menu--unaligned'
+ };
+ /**
+ * Initialize element.
+ */
+ MaterialMenu.prototype.init = function () {
+ if (this.element_) {
+ // Create container for the menu.
+ var container = document.createElement('div');
+ container.classList.add(this.CssClasses_.CONTAINER);
+ this.element_.parentElement.insertBefore(container, this.element_);
+ this.element_.parentElement.removeChild(this.element_);
+ container.appendChild(this.element_);
+ this.container_ = container;
+ // Create outline for the menu (shadow and background).
+ var outline = document.createElement('div');
+ outline.classList.add(this.CssClasses_.OUTLINE);
+ this.outline_ = outline;
+ container.insertBefore(outline, this.element_);
+ // Find the "for" element and bind events to it.
+ var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');
+ var forEl = null;
+ if (forElId) {
+ forEl = document.getElementById(forElId);
+ if (forEl) {
+ this.forElement_ = forEl;
+ forEl.addEventListener('click', this.handleForClick_.bind(this));
+ forEl.addEventListener('keydown', this.handleForKeyboardEvent_.bind(this));
+ }
+ }
+ var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+ this.boundItemKeydown_ = this.handleItemKeyboardEvent_.bind(this);
+ this.boundItemClick_ = this.handleItemClick_.bind(this);
+ for (var i = 0; i < items.length; i++) {
+ // Add a listener to each menu item.
+ items[i].addEventListener('click', this.boundItemClick_);
+ // Add a tab index to each menu item.
+ items[i].tabIndex = '-1';
+ // Add a keyboard listener to each menu item.
+ items[i].addEventListener('keydown', this.boundItemKeydown_);
+ }
+ // Add ripple classes to each item, if the user has enabled ripples.
+ if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ for (i = 0; i < items.length; i++) {
+ var item = items[i];
+ var rippleContainer = document.createElement('span');
+ rippleContainer.classList.add(this.CssClasses_.ITEM_RIPPLE_CONTAINER);
+ var ripple = document.createElement('span');
+ ripple.classList.add(this.CssClasses_.RIPPLE);
+ rippleContainer.appendChild(ripple);
+ item.appendChild(rippleContainer);
+ item.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+ }
+ }
+ // Copy alignment classes to the container, so the outline can use them.
+ if (this.element_.classList.contains(this.CssClasses_.BOTTOM_LEFT)) {
+ this.outline_.classList.add(this.CssClasses_.BOTTOM_LEFT);
+ }
+ if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+ this.outline_.classList.add(this.CssClasses_.BOTTOM_RIGHT);
+ }
+ if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+ this.outline_.classList.add(this.CssClasses_.TOP_LEFT);
+ }
+ if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+ this.outline_.classList.add(this.CssClasses_.TOP_RIGHT);
+ }
+ if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+ this.outline_.classList.add(this.CssClasses_.UNALIGNED);
+ }
+ container.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+ /**
+ * Handles a click on the "for" element, by positioning the menu and then
+ * toggling it.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialMenu.prototype.handleForClick_ = function (evt) {
+ if (this.element_ && this.forElement_) {
+ var rect = this.forElement_.getBoundingClientRect();
+ var forRect = this.forElement_.parentElement.getBoundingClientRect();
+ if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+ } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+ // Position below the "for" element, aligned to its right.
+ this.container_.style.right = forRect.right - rect.right + 'px';
+ this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';
+ } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+ // Position above the "for" element, aligned to its left.
+ this.container_.style.left = this.forElement_.offsetLeft + 'px';
+ this.container_.style.bottom = forRect.bottom - rect.top + 'px';
+ } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+ // Position above the "for" element, aligned to its right.
+ this.container_.style.right = forRect.right - rect.right + 'px';
+ this.container_.style.bottom = forRect.bottom - rect.top + 'px';
+ } else {
+ // Default: position below the "for" element, aligned to its left.
+ this.container_.style.left = this.forElement_.offsetLeft + 'px';
+ this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';
+ }
+ }
+ this.toggle(evt);
+ };
+ /**
+ * Handles a keyboard event on the "for" element.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialMenu.prototype.handleForKeyboardEvent_ = function (evt) {
+ if (this.element_ && this.container_ && this.forElement_) {
+ var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');
+ if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+ if (evt.keyCode === this.Keycodes_.UP_ARROW) {
+ evt.preventDefault();
+ items[items.length - 1].focus();
+ } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {
+ evt.preventDefault();
+ items[0].focus();
+ }
+ }
+ }
+ };
+ /**
+ * Handles a keyboard event on an item.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialMenu.prototype.handleItemKeyboardEvent_ = function (evt) {
+ if (this.element_ && this.container_) {
+ var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');
+ if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+ var currentIndex = Array.prototype.slice.call(items).indexOf(evt.target);
+ if (evt.keyCode === this.Keycodes_.UP_ARROW) {
+ evt.preventDefault();
+ if (currentIndex > 0) {
+ items[currentIndex - 1].focus();
+ } else {
+ items[items.length - 1].focus();
+ }
+ } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {
+ evt.preventDefault();
+ if (items.length > currentIndex + 1) {
+ items[currentIndex + 1].focus();
+ } else {
+ items[0].focus();
+ }
+ } else if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {
+ evt.preventDefault();
+ // Send mousedown and mouseup to trigger ripple.
+ var e = new MouseEvent('mousedown');
+ evt.target.dispatchEvent(e);
+ e = new MouseEvent('mouseup');
+ evt.target.dispatchEvent(e);
+ // Send click.
+ evt.target.click();
+ } else if (evt.keyCode === this.Keycodes_.ESCAPE) {
+ evt.preventDefault();
+ this.hide();
+ }
+ }
+ }
+ };
+ /**
+ * Handles a click event on an item.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialMenu.prototype.handleItemClick_ = function (evt) {
+ if (evt.target.hasAttribute('disabled')) {
+ evt.stopPropagation();
+ } else {
+ // Wait some time before closing menu, so the user can see the ripple.
+ this.closing_ = true;
+ window.setTimeout(function (evt) {
+ this.hide();
+ this.closing_ = false;
+ }.bind(this), this.Constant_.CLOSE_TIMEOUT);
+ }
+ };
+ /**
+ * Calculates the initial clip (for opening the menu) or final clip (for closing
+ * it), and applies it. This allows us to animate from or to the correct point,
+ * that is, the point it's aligned to in the "for" element.
+ *
+ * @param {number} height Height of the clip rectangle
+ * @param {number} width Width of the clip rectangle
+ * @private
+ */
+ MaterialMenu.prototype.applyClip_ = function (height, width) {
+ if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {
+ // Do not clip.
+ this.element_.style.clip = '';
+ } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {
+ // Clip to the top right corner of the menu.
+ this.element_.style.clip = 'rect(0 ' + width + 'px ' + '0 ' + width + 'px)';
+ } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {
+ // Clip to the bottom left corner of the menu.
+ this.element_.style.clip = 'rect(' + height + 'px 0 ' + height + 'px 0)';
+ } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+ // Clip to the bottom right corner of the menu.
+ this.element_.style.clip = 'rect(' + height + 'px ' + width + 'px ' + height + 'px ' + width + 'px)';
+ } else {
+ // Default: do not clip (same as clipping to the top left corner).
+ this.element_.style.clip = '';
+ }
+ };
+ /**
+ * Cleanup function to remove animation listeners.
+ *
+ * @param {Event} evt
+ * @private
+ */
+ MaterialMenu.prototype.removeAnimationEndListener_ = function (evt) {
+ evt.target.classList.remove(MaterialMenu.prototype.CssClasses_.IS_ANIMATING);
+ };
+ /**
+ * Adds an event listener to clean up after the animation ends.
+ *
+ * @private
+ */
+ MaterialMenu.prototype.addAnimationEndListener_ = function () {
+ this.element_.addEventListener('transitionend', this.removeAnimationEndListener_);
+ this.element_.addEventListener('webkitTransitionEnd', this.removeAnimationEndListener_);
+ };
+ /**
+ * Displays the menu.
+ *
+ * @public
+ */
+ MaterialMenu.prototype.show = function (evt) {
+ if (this.element_ && this.container_ && this.outline_) {
+ // Measure the inner element.
+ var height = this.element_.getBoundingClientRect().height;
+ var width = this.element_.getBoundingClientRect().width;
+ // Apply the inner element's size to the container and outline.
+ this.container_.style.width = width + 'px';
+ this.container_.style.height = height + 'px';
+ this.outline_.style.width = width + 'px';
+ this.outline_.style.height = height + 'px';
+ var transitionDuration = this.Constant_.TRANSITION_DURATION_SECONDS * this.Constant_.TRANSITION_DURATION_FRACTION;
+ // Calculate transition delays for individual menu items, so that they fade
+ // in one at a time.
+ var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+ for (var i = 0; i < items.length; i++) {
+ var itemDelay = null;
+ if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT) || this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {
+ itemDelay = (height - items[i].offsetTop - items[i].offsetHeight) / height * transitionDuration + 's';
+ } else {
+ itemDelay = items[i].offsetTop / height * transitionDuration + 's';
+ }
+ items[i].style.transitionDelay = itemDelay;
+ }
+ // Apply the initial clip to the text before we start animating.
+ this.applyClip_(height, width);
+ // Wait for the next frame, turn on animation, and apply the final clip.
+ // Also make it visible. This triggers the transitions.
+ window.requestAnimationFrame(function () {
+ this.element_.classList.add(this.CssClasses_.IS_ANIMATING);
+ this.element_.style.clip = 'rect(0 ' + width + 'px ' + height + 'px 0)';
+ this.container_.classList.add(this.CssClasses_.IS_VISIBLE);
+ }.bind(this));
+ // Clean up after the animation is complete.
+ this.addAnimationEndListener_();
+ // Add a click listener to the document, to close the menu.
+ var callback = function (e) {
+ // Check to see if the document is processing the same event that
+ // displayed the menu in the first place. If so, do nothing.
+ // Also check to see if the menu is in the process of closing itself, and
+ // do nothing in that case.
+ // Also check if the clicked element is a menu item
+ // if so, do nothing.
+ if (e !== evt && !this.closing_ && e.target.parentNode !== this.element_) {
+ document.removeEventListener('click', callback);
+ this.hide();
+ }
+ }.bind(this);
+ document.addEventListener('click', callback);
+ }
+ };
+ MaterialMenu.prototype['show'] = MaterialMenu.prototype.show;
+ /**
+ * Hides the menu.
+ *
+ * @public
+ */
+ MaterialMenu.prototype.hide = function () {
+ if (this.element_ && this.container_ && this.outline_) {
+ var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);
+ // Remove all transition delays; menu items fade out concurrently.
+ for (var i = 0; i < items.length; i++) {
+ items[i].style.removeProperty('transition-delay');
+ }
+ // Measure the inner element.
+ var rect = this.element_.getBoundingClientRect();
+ var height = rect.height;
+ var width = rect.width;
+ // Turn on animation, and apply the final clip. Also make invisible.
+ // This triggers the transitions.
+ this.element_.classList.add(this.CssClasses_.IS_ANIMATING);
+ this.applyClip_(height, width);
+ this.container_.classList.remove(this.CssClasses_.IS_VISIBLE);
+ // Clean up after the animation is complete.
+ this.addAnimationEndListener_();
+ }
+ };
+ MaterialMenu.prototype['hide'] = MaterialMenu.prototype.hide;
+ /**
+ * Displays or hides the menu, depending on current state.
+ *
+ * @public
+ */
+ MaterialMenu.prototype.toggle = function (evt) {
+ if (this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {
+ this.hide();
+ } else {
+ this.show(evt);
+ }
+ };
+ MaterialMenu.prototype['toggle'] = MaterialMenu.prototype.toggle;
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialMenu,
+ classAsString: 'MaterialMenu',
+ cssClass: 'mdl-js-menu',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Progress MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialProgress = function MaterialProgress(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialProgress'] = MaterialProgress;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialProgress.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialProgress.prototype.CssClasses_ = {INDETERMINATE_CLASS: 'mdl-progress__indeterminate'};
+ /**
+ * Set the current progress of the progressbar.
+ *
+ * @param {number} p Percentage of the progress (0-100)
+ * @public
+ */
+ MaterialProgress.prototype.setProgress = function (p) {
+ if (this.element_.classList.contains(this.CssClasses_.INDETERMINATE_CLASS)) {
+ return;
+ }
+ this.progressbar_.style.width = p + '%';
+ };
+ MaterialProgress.prototype['setProgress'] = MaterialProgress.prototype.setProgress;
+ /**
+ * Set the current progress of the buffer.
+ *
+ * @param {number} p Percentage of the buffer (0-100)
+ * @public
+ */
+ MaterialProgress.prototype.setBuffer = function (p) {
+ this.bufferbar_.style.width = p + '%';
+ this.auxbar_.style.width = 100 - p + '%';
+ };
+ MaterialProgress.prototype['setBuffer'] = MaterialProgress.prototype.setBuffer;
+ /**
+ * Initialize element.
+ */
+ MaterialProgress.prototype.init = function () {
+ if (this.element_) {
+ var el = document.createElement('div');
+ el.className = 'progressbar bar bar1';
+ this.element_.appendChild(el);
+ this.progressbar_ = el;
+ el = document.createElement('div');
+ el.className = 'bufferbar bar bar2';
+ this.element_.appendChild(el);
+ this.bufferbar_ = el;
+ el = document.createElement('div');
+ el.className = 'auxbar bar bar3';
+ this.element_.appendChild(el);
+ this.auxbar_ = el;
+ this.progressbar_.style.width = '0%';
+ this.bufferbar_.style.width = '100%';
+ this.auxbar_.style.width = '0%';
+ this.element_.classList.add('is-upgraded');
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialProgress,
+ classAsString: 'MaterialProgress',
+ cssClass: 'mdl-js-progress',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Radio MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialRadio = function MaterialRadio(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialRadio'] = MaterialRadio;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialRadio.prototype.Constant_ = {TINY_TIMEOUT: 0.001};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialRadio.prototype.CssClasses_ = {
+ IS_FOCUSED: 'is-focused',
+ IS_DISABLED: 'is-disabled',
+ IS_CHECKED: 'is-checked',
+ IS_UPGRADED: 'is-upgraded',
+ JS_RADIO: 'mdl-js-radio',
+ RADIO_BTN: 'mdl-radio__button',
+ RADIO_OUTER_CIRCLE: 'mdl-radio__outer-circle',
+ RADIO_INNER_CIRCLE: 'mdl-radio__inner-circle',
+ RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE_CONTAINER: 'mdl-radio__ripple-container',
+ RIPPLE_CENTER: 'mdl-ripple--center',
+ RIPPLE: 'mdl-ripple'
+ };
+ /**
+ * Handle change of state.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRadio.prototype.onChange_ = function (event) {
+ // Since other radio buttons don't get change events, we need to look for
+ // them to update their classes.
+ var radios = document.getElementsByClassName(this.CssClasses_.JS_RADIO);
+ for (var i = 0; i < radios.length; i++) {
+ var button = radios[i].querySelector('.' + this.CssClasses_.RADIO_BTN);
+ // Different name == different group, so no point updating those.
+ if (button.getAttribute('name') === this.btnElement_.getAttribute('name')) {
+ if (typeof radios[i]['MaterialRadio'] !== 'undefined') {
+ radios[i]['MaterialRadio'].updateClasses_();
+ }
+ }
+ }
+ };
+ /**
+ * Handle focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRadio.prototype.onFocus_ = function (event) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle lost focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRadio.prototype.onBlur_ = function (event) {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle mouseup.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRadio.prototype.onMouseup_ = function (event) {
+ this.blur_();
+ };
+ /**
+ * Update classes.
+ *
+ * @private
+ */
+ MaterialRadio.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkToggleState();
+ };
+ /**
+ * Add blur.
+ *
+ * @private
+ */
+ MaterialRadio.prototype.blur_ = function () {
+ // TODO: figure out why there's a focus event being fired after our blur,
+ // so that we can avoid this hack.
+ window.setTimeout(function () {
+ this.btnElement_.blur();
+ }.bind(this), this.Constant_.TINY_TIMEOUT);
+ };
+// Public methods.
+ /**
+ * Check the components disabled state.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.checkDisabled = function () {
+ if (this.btnElement_.disabled) {
+ this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+ }
+ };
+ MaterialRadio.prototype['checkDisabled'] = MaterialRadio.prototype.checkDisabled;
+ /**
+ * Check the components toggled state.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.checkToggleState = function () {
+ if (this.btnElement_.checked) {
+ this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+ }
+ };
+ MaterialRadio.prototype['checkToggleState'] = MaterialRadio.prototype.checkToggleState;
+ /**
+ * Disable radio.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.disable = function () {
+ this.btnElement_.disabled = true;
+ this.updateClasses_();
+ };
+ MaterialRadio.prototype['disable'] = MaterialRadio.prototype.disable;
+ /**
+ * Enable radio.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.enable = function () {
+ this.btnElement_.disabled = false;
+ this.updateClasses_();
+ };
+ MaterialRadio.prototype['enable'] = MaterialRadio.prototype.enable;
+ /**
+ * Check radio.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.check = function () {
+ this.btnElement_.checked = true;
+ this.onChange_(null);
+ };
+ MaterialRadio.prototype['check'] = MaterialRadio.prototype.check;
+ /**
+ * Uncheck radio.
+ *
+ * @public
+ */
+ MaterialRadio.prototype.uncheck = function () {
+ this.btnElement_.checked = false;
+ this.onChange_(null);
+ };
+ MaterialRadio.prototype['uncheck'] = MaterialRadio.prototype.uncheck;
+ /**
+ * Initialize element.
+ */
+ MaterialRadio.prototype.init = function () {
+ if (this.element_) {
+ this.btnElement_ = this.element_.querySelector('.' + this.CssClasses_.RADIO_BTN);
+ this.boundChangeHandler_ = this.onChange_.bind(this);
+ this.boundFocusHandler_ = this.onChange_.bind(this);
+ this.boundBlurHandler_ = this.onBlur_.bind(this);
+ this.boundMouseUpHandler_ = this.onMouseup_.bind(this);
+ var outerCircle = document.createElement('span');
+ outerCircle.classList.add(this.CssClasses_.RADIO_OUTER_CIRCLE);
+ var innerCircle = document.createElement('span');
+ innerCircle.classList.add(this.CssClasses_.RADIO_INNER_CIRCLE);
+ this.element_.appendChild(outerCircle);
+ this.element_.appendChild(innerCircle);
+ var rippleContainer;
+ if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ rippleContainer = document.createElement('span');
+ rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+ rippleContainer.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+ rippleContainer.classList.add(this.CssClasses_.RIPPLE_CENTER);
+ rippleContainer.addEventListener('mouseup', this.boundMouseUpHandler_);
+ var ripple = document.createElement('span');
+ ripple.classList.add(this.CssClasses_.RIPPLE);
+ rippleContainer.appendChild(ripple);
+ this.element_.appendChild(rippleContainer);
+ }
+ this.btnElement_.addEventListener('change', this.boundChangeHandler_);
+ this.btnElement_.addEventListener('focus', this.boundFocusHandler_);
+ this.btnElement_.addEventListener('blur', this.boundBlurHandler_);
+ this.element_.addEventListener('mouseup', this.boundMouseUpHandler_);
+ this.updateClasses_();
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialRadio,
+ classAsString: 'MaterialRadio',
+ cssClass: 'mdl-js-radio',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Slider MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialSlider = function MaterialSlider(element) {
+ this.element_ = element;
+ // Browser feature detection.
+ this.isIE_ = window.navigator.msPointerEnabled;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialSlider'] = MaterialSlider;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialSlider.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialSlider.prototype.CssClasses_ = {
+ IE_CONTAINER: 'mdl-slider__ie-container',
+ SLIDER_CONTAINER: 'mdl-slider__container',
+ BACKGROUND_FLEX: 'mdl-slider__background-flex',
+ BACKGROUND_LOWER: 'mdl-slider__background-lower',
+ BACKGROUND_UPPER: 'mdl-slider__background-upper',
+ IS_LOWEST_VALUE: 'is-lowest-value',
+ IS_UPGRADED: 'is-upgraded'
+ };
+ /**
+ * Handle input on element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSlider.prototype.onInput_ = function (event) {
+ this.updateValueStyles_();
+ };
+ /**
+ * Handle change on element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSlider.prototype.onChange_ = function (event) {
+ this.updateValueStyles_();
+ };
+ /**
+ * Handle mouseup on element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSlider.prototype.onMouseUp_ = function (event) {
+ event.target.blur();
+ };
+ /**
+ * Handle mousedown on container element.
+ * This handler is purpose is to not require the use to click
+ * exactly on the 2px slider element, as FireFox seems to be very
+ * strict about this.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ * @suppress {missingProperties}
+ */
+ MaterialSlider.prototype.onContainerMouseDown_ = function (event) {
+ // If this click is not on the parent element (but rather some child)
+ // ignore. It may still bubble up.
+ if (event.target !== this.element_.parentElement) {
+ return;
+ }
+ // Discard the original event and create a new event that
+ // is on the slider element.
+ event.preventDefault();
+ var newEvent = new MouseEvent('mousedown', {
+ target: event.target,
+ buttons: event.buttons,
+ clientX: event.clientX,
+ clientY: this.element_.getBoundingClientRect().y
+ });
+ this.element_.dispatchEvent(newEvent);
+ };
+ /**
+ * Handle updating of values.
+ *
+ * @private
+ */
+ MaterialSlider.prototype.updateValueStyles_ = function () {
+ // Calculate and apply percentages to div structure behind slider.
+ var fraction = (this.element_.value - this.element_.min) / (this.element_.max - this.element_.min);
+ if (fraction === 0) {
+ this.element_.classList.add(this.CssClasses_.IS_LOWEST_VALUE);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_LOWEST_VALUE);
+ }
+ if (!this.isIE_) {
+ this.backgroundLower_.style.flex = fraction;
+ this.backgroundLower_.style.webkitFlex = fraction;
+ this.backgroundUpper_.style.flex = 1 - fraction;
+ this.backgroundUpper_.style.webkitFlex = 1 - fraction;
+ }
+ };
+// Public methods.
+ /**
+ * Disable slider.
+ *
+ * @public
+ */
+ MaterialSlider.prototype.disable = function () {
+ this.element_.disabled = true;
+ };
+ MaterialSlider.prototype['disable'] = MaterialSlider.prototype.disable;
+ /**
+ * Enable slider.
+ *
+ * @public
+ */
+ MaterialSlider.prototype.enable = function () {
+ this.element_.disabled = false;
+ };
+ MaterialSlider.prototype['enable'] = MaterialSlider.prototype.enable;
+ /**
+ * Update slider value.
+ *
+ * @param {number} value The value to which to set the control (optional).
+ * @public
+ */
+ MaterialSlider.prototype.change = function (value) {
+ if (typeof value !== 'undefined') {
+ this.element_.value = value;
+ }
+ this.updateValueStyles_();
+ };
+ MaterialSlider.prototype['change'] = MaterialSlider.prototype.change;
+ /**
+ * Initialize element.
+ */
+ MaterialSlider.prototype.init = function () {
+ if (this.element_) {
+ if (this.isIE_) {
+ // Since we need to specify a very large height in IE due to
+ // implementation limitations, we add a parent here that trims it down to
+ // a reasonable size.
+ var containerIE = document.createElement('div');
+ containerIE.classList.add(this.CssClasses_.IE_CONTAINER);
+ this.element_.parentElement.insertBefore(containerIE, this.element_);
+ this.element_.parentElement.removeChild(this.element_);
+ containerIE.appendChild(this.element_);
+ } else {
+ // For non-IE browsers, we need a div structure that sits behind the
+ // slider and allows us to style the left and right sides of it with
+ // different colors.
+ var container = document.createElement('div');
+ container.classList.add(this.CssClasses_.SLIDER_CONTAINER);
+ this.element_.parentElement.insertBefore(container, this.element_);
+ this.element_.parentElement.removeChild(this.element_);
+ container.appendChild(this.element_);
+ var backgroundFlex = document.createElement('div');
+ backgroundFlex.classList.add(this.CssClasses_.BACKGROUND_FLEX);
+ container.appendChild(backgroundFlex);
+ this.backgroundLower_ = document.createElement('div');
+ this.backgroundLower_.classList.add(this.CssClasses_.BACKGROUND_LOWER);
+ backgroundFlex.appendChild(this.backgroundLower_);
+ this.backgroundUpper_ = document.createElement('div');
+ this.backgroundUpper_.classList.add(this.CssClasses_.BACKGROUND_UPPER);
+ backgroundFlex.appendChild(this.backgroundUpper_);
+ }
+ this.boundInputHandler = this.onInput_.bind(this);
+ this.boundChangeHandler = this.onChange_.bind(this);
+ this.boundMouseUpHandler = this.onMouseUp_.bind(this);
+ this.boundContainerMouseDownHandler = this.onContainerMouseDown_.bind(this);
+ this.element_.addEventListener('input', this.boundInputHandler);
+ this.element_.addEventListener('change', this.boundChangeHandler);
+ this.element_.addEventListener('mouseup', this.boundMouseUpHandler);
+ this.element_.parentElement.addEventListener('mousedown', this.boundContainerMouseDownHandler);
+ this.updateValueStyles_();
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialSlider,
+ classAsString: 'MaterialSlider',
+ cssClass: 'mdl-js-slider',
+ widget: true
+ });
+ /**
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Snackbar MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialSnackbar = function MaterialSnackbar(element) {
+ this.element_ = element;
+ this.textElement_ = this.element_.querySelector('.' + this.cssClasses_.MESSAGE);
+ this.actionElement_ = this.element_.querySelector('.' + this.cssClasses_.ACTION);
+ if (!this.textElement_) {
+ throw new Error('There must be a message element for a snackbar.');
+ }
+ if (!this.actionElement_) {
+ throw new Error('There must be an action element for a snackbar.');
+ }
+ this.active = false;
+ this.actionHandler_ = undefined;
+ this.message_ = undefined;
+ this.actionText_ = undefined;
+ this.queuedNotifications_ = [];
+ this.setActionHidden_(true);
+ };
+ window['MaterialSnackbar'] = MaterialSnackbar;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialSnackbar.prototype.Constant_ = {
+ // The duration of the snackbar show/hide animation, in ms.
+ ANIMATION_LENGTH: 250
+ };
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialSnackbar.prototype.cssClasses_ = {
+ SNACKBAR: 'mdl-snackbar',
+ MESSAGE: 'mdl-snackbar__text',
+ ACTION: 'mdl-snackbar__action',
+ ACTIVE: 'mdl-snackbar--active'
+ };
+ /**
+ * Display the snackbar.
+ *
+ * @private
+ */
+ MaterialSnackbar.prototype.displaySnackbar_ = function () {
+ this.element_.setAttribute('aria-hidden', 'true');
+ if (this.actionHandler_) {
+ this.actionElement_.textContent = this.actionText_;
+ this.actionElement_.addEventListener('click', this.actionHandler_);
+ this.setActionHidden_(false);
+ }
+ this.textElement_.textContent = this.message_;
+ this.element_.classList.add(this.cssClasses_.ACTIVE);
+ this.element_.setAttribute('aria-hidden', 'false');
+ setTimeout(this.cleanup_.bind(this), this.timeout_);
+ };
+ /**
+ * Show the snackbar.
+ *
+ * @param {Object} data The data for the notification.
+ * @public
+ */
+ MaterialSnackbar.prototype.showSnackbar = function (data) {
+ if (data === undefined) {
+ throw new Error('Please provide a data object with at least a message to display.');
+ }
+ if (data['message'] === undefined) {
+ throw new Error('Please provide a message to be displayed.');
+ }
+ if (data['actionHandler'] && !data['actionText']) {
+ throw new Error('Please provide action text with the handler.');
+ }
+ if (this.active) {
+ this.queuedNotifications_.push(data);
+ } else {
+ this.active = true;
+ this.message_ = data['message'];
+ if (data['timeout']) {
+ this.timeout_ = data['timeout'];
+ } else {
+ this.timeout_ = 2750;
+ }
+ if (data['actionHandler']) {
+ this.actionHandler_ = data['actionHandler'];
+ }
+ if (data['actionText']) {
+ this.actionText_ = data['actionText'];
+ }
+ this.displaySnackbar_();
+ }
+ };
+ MaterialSnackbar.prototype['showSnackbar'] = MaterialSnackbar.prototype.showSnackbar;
+ /**
+ * Check if the queue has items within it.
+ * If it does, display the next entry.
+ *
+ * @private
+ */
+ MaterialSnackbar.prototype.checkQueue_ = function () {
+ if (this.queuedNotifications_.length > 0) {
+ this.showSnackbar(this.queuedNotifications_.shift());
+ }
+ };
+ /**
+ * Cleanup the snackbar event listeners and accessiblity attributes.
+ *
+ * @private
+ */
+ MaterialSnackbar.prototype.cleanup_ = function () {
+ this.element_.classList.remove(this.cssClasses_.ACTIVE);
+ setTimeout(function () {
+ this.element_.setAttribute('aria-hidden', 'true');
+ this.textElement_.textContent = '';
+ if (!Boolean(this.actionElement_.getAttribute('aria-hidden'))) {
+ this.setActionHidden_(true);
+ this.actionElement_.textContent = '';
+ this.actionElement_.removeEventListener('click', this.actionHandler_);
+ }
+ this.actionHandler_ = undefined;
+ this.message_ = undefined;
+ this.actionText_ = undefined;
+ this.active = false;
+ this.checkQueue_();
+ }.bind(this), this.Constant_.ANIMATION_LENGTH);
+ };
+ /**
+ * Set the action handler hidden state.
+ *
+ * @param {boolean} value
+ * @private
+ */
+ MaterialSnackbar.prototype.setActionHidden_ = function (value) {
+ if (value) {
+ this.actionElement_.setAttribute('aria-hidden', 'true');
+ } else {
+ this.actionElement_.removeAttribute('aria-hidden');
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialSnackbar,
+ classAsString: 'MaterialSnackbar',
+ cssClass: 'mdl-js-snackbar',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Spinner MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @param {HTMLElement} element The element that will be upgraded.
+ * @constructor
+ */
+ var MaterialSpinner = function MaterialSpinner(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialSpinner'] = MaterialSpinner;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialSpinner.prototype.Constant_ = {MDL_SPINNER_LAYER_COUNT: 4};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialSpinner.prototype.CssClasses_ = {
+ MDL_SPINNER_LAYER: 'mdl-spinner__layer',
+ MDL_SPINNER_CIRCLE_CLIPPER: 'mdl-spinner__circle-clipper',
+ MDL_SPINNER_CIRCLE: 'mdl-spinner__circle',
+ MDL_SPINNER_GAP_PATCH: 'mdl-spinner__gap-patch',
+ MDL_SPINNER_LEFT: 'mdl-spinner__left',
+ MDL_SPINNER_RIGHT: 'mdl-spinner__right'
+ };
+ /**
+ * Auxiliary method to create a spinner layer.
+ *
+ * @param {number} index Index of the layer to be created.
+ * @public
+ */
+ MaterialSpinner.prototype.createLayer = function (index) {
+ var layer = document.createElement('div');
+ layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER);
+ layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER + '-' + index);
+ var leftClipper = document.createElement('div');
+ leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);
+ leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_LEFT);
+ var gapPatch = document.createElement('div');
+ gapPatch.classList.add(this.CssClasses_.MDL_SPINNER_GAP_PATCH);
+ var rightClipper = document.createElement('div');
+ rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);
+ rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_RIGHT);
+ var circleOwners = [
+ leftClipper,
+ gapPatch,
+ rightClipper
+ ];
+ for (var i = 0; i < circleOwners.length; i++) {
+ var circle = document.createElement('div');
+ circle.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE);
+ circleOwners[i].appendChild(circle);
+ }
+ layer.appendChild(leftClipper);
+ layer.appendChild(gapPatch);
+ layer.appendChild(rightClipper);
+ this.element_.appendChild(layer);
+ };
+ MaterialSpinner.prototype['createLayer'] = MaterialSpinner.prototype.createLayer;
+ /**
+ * Stops the spinner animation.
+ * Public method for users who need to stop the spinner for any reason.
+ *
+ * @public
+ */
+ MaterialSpinner.prototype.stop = function () {
+ this.element_.classList.remove('is-active');
+ };
+ MaterialSpinner.prototype['stop'] = MaterialSpinner.prototype.stop;
+ /**
+ * Starts the spinner animation.
+ * Public method for users who need to manually start the spinner for any reason
+ * (instead of just adding the 'is-active' class to their markup).
+ *
+ * @public
+ */
+ MaterialSpinner.prototype.start = function () {
+ this.element_.classList.add('is-active');
+ };
+ MaterialSpinner.prototype['start'] = MaterialSpinner.prototype.start;
+ /**
+ * Initialize element.
+ */
+ MaterialSpinner.prototype.init = function () {
+ if (this.element_) {
+ for (var i = 1; i <= this.Constant_.MDL_SPINNER_LAYER_COUNT; i++) {
+ this.createLayer(i);
+ }
+ this.element_.classList.add('is-upgraded');
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialSpinner,
+ classAsString: 'MaterialSpinner',
+ cssClass: 'mdl-js-spinner',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Checkbox MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialSwitch = function MaterialSwitch(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialSwitch'] = MaterialSwitch;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialSwitch.prototype.Constant_ = {TINY_TIMEOUT: 0.001};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialSwitch.prototype.CssClasses_ = {
+ INPUT: 'mdl-switch__input',
+ TRACK: 'mdl-switch__track',
+ THUMB: 'mdl-switch__thumb',
+ FOCUS_HELPER: 'mdl-switch__focus-helper',
+ RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE_CONTAINER: 'mdl-switch__ripple-container',
+ RIPPLE_CENTER: 'mdl-ripple--center',
+ RIPPLE: 'mdl-ripple',
+ IS_FOCUSED: 'is-focused',
+ IS_DISABLED: 'is-disabled',
+ IS_CHECKED: 'is-checked'
+ };
+ /**
+ * Handle change of state.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSwitch.prototype.onChange_ = function (event) {
+ this.updateClasses_();
+ };
+ /**
+ * Handle focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSwitch.prototype.onFocus_ = function (event) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle lost focus of element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSwitch.prototype.onBlur_ = function (event) {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle mouseup.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialSwitch.prototype.onMouseUp_ = function (event) {
+ this.blur_();
+ };
+ /**
+ * Handle class updates.
+ *
+ * @private
+ */
+ MaterialSwitch.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkToggleState();
+ };
+ /**
+ * Add blur.
+ *
+ * @private
+ */
+ MaterialSwitch.prototype.blur_ = function () {
+ // TODO: figure out why there's a focus event being fired after our blur,
+ // so that we can avoid this hack.
+ window.setTimeout(function () {
+ this.inputElement_.blur();
+ }.bind(this), this.Constant_.TINY_TIMEOUT);
+ };
+// Public methods.
+ /**
+ * Check the components disabled state.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.checkDisabled = function () {
+ if (this.inputElement_.disabled) {
+ this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+ }
+ };
+ MaterialSwitch.prototype['checkDisabled'] = MaterialSwitch.prototype.checkDisabled;
+ /**
+ * Check the components toggled state.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.checkToggleState = function () {
+ if (this.inputElement_.checked) {
+ this.element_.classList.add(this.CssClasses_.IS_CHECKED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_CHECKED);
+ }
+ };
+ MaterialSwitch.prototype['checkToggleState'] = MaterialSwitch.prototype.checkToggleState;
+ /**
+ * Disable switch.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.disable = function () {
+ this.inputElement_.disabled = true;
+ this.updateClasses_();
+ };
+ MaterialSwitch.prototype['disable'] = MaterialSwitch.prototype.disable;
+ /**
+ * Enable switch.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.enable = function () {
+ this.inputElement_.disabled = false;
+ this.updateClasses_();
+ };
+ MaterialSwitch.prototype['enable'] = MaterialSwitch.prototype.enable;
+ /**
+ * Activate switch.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.on = function () {
+ this.inputElement_.checked = true;
+ this.updateClasses_();
+ };
+ MaterialSwitch.prototype['on'] = MaterialSwitch.prototype.on;
+ /**
+ * Deactivate switch.
+ *
+ * @public
+ */
+ MaterialSwitch.prototype.off = function () {
+ this.inputElement_.checked = false;
+ this.updateClasses_();
+ };
+ MaterialSwitch.prototype['off'] = MaterialSwitch.prototype.off;
+ /**
+ * Initialize element.
+ */
+ MaterialSwitch.prototype.init = function () {
+ if (this.element_) {
+ this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+ var track = document.createElement('div');
+ track.classList.add(this.CssClasses_.TRACK);
+ var thumb = document.createElement('div');
+ thumb.classList.add(this.CssClasses_.THUMB);
+ var focusHelper = document.createElement('span');
+ focusHelper.classList.add(this.CssClasses_.FOCUS_HELPER);
+ thumb.appendChild(focusHelper);
+ this.element_.appendChild(track);
+ this.element_.appendChild(thumb);
+ this.boundMouseUpHandler = this.onMouseUp_.bind(this);
+ if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ this.rippleContainerElement_ = document.createElement('span');
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);
+ this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);
+ this.rippleContainerElement_.addEventListener('mouseup', this.boundMouseUpHandler);
+ var ripple = document.createElement('span');
+ ripple.classList.add(this.CssClasses_.RIPPLE);
+ this.rippleContainerElement_.appendChild(ripple);
+ this.element_.appendChild(this.rippleContainerElement_);
+ }
+ this.boundChangeHandler = this.onChange_.bind(this);
+ this.boundFocusHandler = this.onFocus_.bind(this);
+ this.boundBlurHandler = this.onBlur_.bind(this);
+ this.inputElement_.addEventListener('change', this.boundChangeHandler);
+ this.inputElement_.addEventListener('focus', this.boundFocusHandler);
+ this.inputElement_.addEventListener('blur', this.boundBlurHandler);
+ this.element_.addEventListener('mouseup', this.boundMouseUpHandler);
+ this.updateClasses_();
+ this.element_.classList.add('is-upgraded');
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialSwitch,
+ classAsString: 'MaterialSwitch',
+ cssClass: 'mdl-js-switch',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Tabs MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {Element} element The element that will be upgraded.
+ */
+ var MaterialTabs = function MaterialTabs(element) {
+ // Stores the HTML element.
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialTabs'] = MaterialTabs;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialTabs.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialTabs.prototype.CssClasses_ = {
+ TAB_CLASS: 'mdl-tabs__tab',
+ PANEL_CLASS: 'mdl-tabs__panel',
+ ACTIVE_CLASS: 'is-active',
+ UPGRADED_CLASS: 'is-upgraded',
+ MDL_JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ MDL_RIPPLE_CONTAINER: 'mdl-tabs__ripple-container',
+ MDL_RIPPLE: 'mdl-ripple',
+ MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'
+ };
+ /**
+ * Handle clicks to a tabs component
+ *
+ * @private
+ */
+ MaterialTabs.prototype.initTabs_ = function () {
+ if (this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS);
+ }
+ // Select element tabs, document panels
+ this.tabs_ = this.element_.querySelectorAll('.' + this.CssClasses_.TAB_CLASS);
+ this.panels_ = this.element_.querySelectorAll('.' + this.CssClasses_.PANEL_CLASS);
+ // Create new tabs for each tab element
+ for (var i = 0; i < this.tabs_.length; i++) {
+ new MaterialTab(this.tabs_[i], this);
+ }
+ this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS);
+ };
+ /**
+ * Reset tab state, dropping active classes
+ *
+ * @private
+ */
+ MaterialTabs.prototype.resetTabState_ = function () {
+ for (var k = 0; k < this.tabs_.length; k++) {
+ this.tabs_[k].classList.remove(this.CssClasses_.ACTIVE_CLASS);
+ }
+ };
+ /**
+ * Reset panel state, droping active classes
+ *
+ * @private
+ */
+ MaterialTabs.prototype.resetPanelState_ = function () {
+ for (var j = 0; j < this.panels_.length; j++) {
+ this.panels_[j].classList.remove(this.CssClasses_.ACTIVE_CLASS);
+ }
+ };
+ /**
+ * Initialize element.
+ */
+ MaterialTabs.prototype.init = function () {
+ if (this.element_) {
+ this.initTabs_();
+ }
+ };
+
+ /**
+ * Constructor for an individual tab.
+ *
+ * @constructor
+ * @param {Element} tab The HTML element for the tab.
+ * @param {MaterialTabs} ctx The MaterialTabs object that owns the tab.
+ */
+ function MaterialTab(tab, ctx) {
+ if (tab) {
+ if (ctx.element_.classList.contains(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
+ var rippleContainer = document.createElement('span');
+ rippleContainer.classList.add(ctx.CssClasses_.MDL_RIPPLE_CONTAINER);
+ rippleContainer.classList.add(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT);
+ var ripple = document.createElement('span');
+ ripple.classList.add(ctx.CssClasses_.MDL_RIPPLE);
+ rippleContainer.appendChild(ripple);
+ tab.appendChild(rippleContainer);
+ }
+ tab.addEventListener('click', function (e) {
+ if (tab.getAttribute('href').charAt(0) === '#') {
+ e.preventDefault();
+ var href = tab.href.split('#')[1];
+ var panel = ctx.element_.querySelector('#' + href);
+ ctx.resetTabState_();
+ ctx.resetPanelState_();
+ tab.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
+ panel.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
+ }
+ });
+ }
+ }
+
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialTabs,
+ classAsString: 'MaterialTabs',
+ cssClass: 'mdl-js-tabs'
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Textfield MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialTextfield = function MaterialTextfield(element) {
+ this.element_ = element;
+ this.maxRows = this.Constant_.NO_MAX_ROWS;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialTextfield'] = MaterialTextfield;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialTextfield.prototype.Constant_ = {
+ NO_MAX_ROWS: -1,
+ MAX_ROWS_ATTRIBUTE: 'maxrows'
+ };
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialTextfield.prototype.CssClasses_ = {
+ LABEL: 'mdl-textfield__label',
+ INPUT: 'mdl-textfield__input',
+ IS_DIRTY: 'is-dirty',
+ IS_FOCUSED: 'is-focused',
+ IS_DISABLED: 'is-disabled',
+ IS_INVALID: 'is-invalid',
+ IS_UPGRADED: 'is-upgraded',
+ HAS_PLACEHOLDER: 'has-placeholder'
+ };
+ /**
+ * Handle input being entered.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialTextfield.prototype.onKeyDown_ = function (event) {
+ var currentRowCount = event.target.value.split('\n').length;
+ if (event.keyCode === 13) {
+ if (currentRowCount >= this.maxRows) {
+ event.preventDefault();
+ }
+ }
+ };
+ /**
+ * Handle focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialTextfield.prototype.onFocus_ = function (event) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle lost focus.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialTextfield.prototype.onBlur_ = function (event) {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ };
+ /**
+ * Handle reset event from out side.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialTextfield.prototype.onReset_ = function (event) {
+ this.updateClasses_();
+ };
+ /**
+ * Handle class updates.
+ *
+ * @private
+ */
+ MaterialTextfield.prototype.updateClasses_ = function () {
+ this.checkDisabled();
+ this.checkValidity();
+ this.checkDirty();
+ this.checkFocus();
+ };
+// Public methods.
+ /**
+ * Check the disabled state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.checkDisabled = function () {
+ if (this.input_.disabled) {
+ this.element_.classList.add(this.CssClasses_.IS_DISABLED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DISABLED);
+ }
+ };
+ MaterialTextfield.prototype['checkDisabled'] = MaterialTextfield.prototype.checkDisabled;
+ /**
+ * Check the focus state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.checkFocus = function () {
+ if (Boolean(this.element_.querySelector(':focus'))) {
+ this.element_.classList.add(this.CssClasses_.IS_FOCUSED);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);
+ }
+ };
+ MaterialTextfield.prototype['checkFocus'] = MaterialTextfield.prototype.checkFocus;
+ /**
+ * Check the validity state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.checkValidity = function () {
+ if (this.input_.validity) {
+ if (this.input_.validity.valid) {
+ this.element_.classList.remove(this.CssClasses_.IS_INVALID);
+ } else {
+ this.element_.classList.add(this.CssClasses_.IS_INVALID);
+ }
+ }
+ };
+ MaterialTextfield.prototype['checkValidity'] = MaterialTextfield.prototype.checkValidity;
+ /**
+ * Check the dirty state and update field accordingly.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.checkDirty = function () {
+ if (this.input_.value && this.input_.value.length > 0) {
+ this.element_.classList.add(this.CssClasses_.IS_DIRTY);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_DIRTY);
+ }
+ };
+ MaterialTextfield.prototype['checkDirty'] = MaterialTextfield.prototype.checkDirty;
+ /**
+ * Disable text field.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.disable = function () {
+ this.input_.disabled = true;
+ this.updateClasses_();
+ };
+ MaterialTextfield.prototype['disable'] = MaterialTextfield.prototype.disable;
+ /**
+ * Enable text field.
+ *
+ * @public
+ */
+ MaterialTextfield.prototype.enable = function () {
+ this.input_.disabled = false;
+ this.updateClasses_();
+ };
+ MaterialTextfield.prototype['enable'] = MaterialTextfield.prototype.enable;
+ /**
+ * Update text field value.
+ *
+ * @param {string} value The value to which to set the control (optional).
+ * @public
+ */
+ MaterialTextfield.prototype.change = function (value) {
+ this.input_.value = value || '';
+ this.updateClasses_();
+ };
+ MaterialTextfield.prototype['change'] = MaterialTextfield.prototype.change;
+ /**
+ * Initialize element.
+ */
+ MaterialTextfield.prototype.init = function () {
+ if (this.element_) {
+ this.label_ = this.element_.querySelector('.' + this.CssClasses_.LABEL);
+ this.input_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);
+ if (this.input_) {
+ if (this.input_.hasAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE)) {
+ this.maxRows = parseInt(this.input_.getAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE), 10);
+ if (isNaN(this.maxRows)) {
+ this.maxRows = this.Constant_.NO_MAX_ROWS;
+ }
+ }
+ if (this.input_.hasAttribute('placeholder')) {
+ this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);
+ }
+ this.boundUpdateClassesHandler = this.updateClasses_.bind(this);
+ this.boundFocusHandler = this.onFocus_.bind(this);
+ this.boundBlurHandler = this.onBlur_.bind(this);
+ this.boundResetHandler = this.onReset_.bind(this);
+ this.input_.addEventListener('input', this.boundUpdateClassesHandler);
+ this.input_.addEventListener('focus', this.boundFocusHandler);
+ this.input_.addEventListener('blur', this.boundBlurHandler);
+ this.input_.addEventListener('reset', this.boundResetHandler);
+ if (this.maxRows !== this.Constant_.NO_MAX_ROWS) {
+ // TODO: This should handle pasting multi line text.
+ // Currently doesn't.
+ this.boundKeyDownHandler = this.onKeyDown_.bind(this);
+ this.input_.addEventListener('keydown', this.boundKeyDownHandler);
+ }
+ var invalid = this.element_.classList.contains(this.CssClasses_.IS_INVALID);
+ this.updateClasses_();
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ if (invalid) {
+ this.element_.classList.add(this.CssClasses_.IS_INVALID);
+ }
+ if (this.input_.hasAttribute('autofocus')) {
+ this.element_.focus();
+ this.checkFocus();
+ }
+ }
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialTextfield,
+ classAsString: 'MaterialTextfield',
+ cssClass: 'mdl-js-textfield',
+ widget: true
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Tooltip MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialTooltip = function MaterialTooltip(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialTooltip'] = MaterialTooltip;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialTooltip.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialTooltip.prototype.CssClasses_ = {
+ IS_ACTIVE: 'is-active',
+ BOTTOM: 'mdl-tooltip--bottom',
+ LEFT: 'mdl-tooltip--left',
+ RIGHT: 'mdl-tooltip--right',
+ TOP: 'mdl-tooltip--top'
+ };
+ /**
+ * Handle mouseenter for tooltip.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialTooltip.prototype.handleMouseEnter_ = function (event) {
+ var props = event.target.getBoundingClientRect();
+ var left = props.left + props.width / 2;
+ var top = props.top + props.height / 2;
+ var marginLeft = -1 * (this.element_.offsetWidth / 2);
+ var marginTop = -1 * (this.element_.offsetHeight / 2);
+ if (this.element_.classList.contains(this.CssClasses_.LEFT) || this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+ left = props.width / 2;
+ if (top + marginTop < 0) {
+ this.element_.style.top = '0';
+ this.element_.style.marginTop = '0';
+ } else {
+ this.element_.style.top = top + 'px';
+ this.element_.style.marginTop = marginTop + 'px';
+ }
+ } else {
+ if (left + marginLeft < 0) {
+ this.element_.style.left = '0';
+ this.element_.style.marginLeft = '0';
+ } else {
+ this.element_.style.left = left + 'px';
+ this.element_.style.marginLeft = marginLeft + 'px';
+ }
+ }
+ if (this.element_.classList.contains(this.CssClasses_.TOP)) {
+ this.element_.style.top = props.top - this.element_.offsetHeight - 10 + 'px';
+ } else if (this.element_.classList.contains(this.CssClasses_.RIGHT)) {
+ this.element_.style.left = props.left + props.width + 10 + 'px';
+ } else if (this.element_.classList.contains(this.CssClasses_.LEFT)) {
+ this.element_.style.left = props.left - this.element_.offsetWidth - 10 + 'px';
+ } else {
+ this.element_.style.top = props.top + props.height + 10 + 'px';
+ }
+ this.element_.classList.add(this.CssClasses_.IS_ACTIVE);
+ };
+ /**
+ * Hide tooltip on mouseleave or scroll
+ *
+ * @private
+ */
+ MaterialTooltip.prototype.hideTooltip_ = function () {
+ this.element_.classList.remove(this.CssClasses_.IS_ACTIVE);
+ };
+ /**
+ * Initialize element.
+ */
+ MaterialTooltip.prototype.init = function () {
+ if (this.element_) {
+ var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');
+ if (forElId) {
+ this.forElement_ = document.getElementById(forElId);
+ }
+ if (this.forElement_) {
+ // It's left here because it prevents accidental text selection on Android
+ if (!this.forElement_.hasAttribute('tabindex')) {
+ this.forElement_.setAttribute('tabindex', '0');
+ }
+ this.boundMouseEnterHandler = this.handleMouseEnter_.bind(this);
+ this.boundMouseLeaveAndScrollHandler = this.hideTooltip_.bind(this);
+ this.forElement_.addEventListener('mouseenter', this.boundMouseEnterHandler, false);
+ this.forElement_.addEventListener('touchend', this.boundMouseEnterHandler, false);
+ this.forElement_.addEventListener('mouseleave', this.boundMouseLeaveAndScrollHandler, false);
+ window.addEventListener('scroll', this.boundMouseLeaveAndScrollHandler, true);
+ window.addEventListener('touchstart', this.boundMouseLeaveAndScrollHandler);
+ }
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialTooltip,
+ classAsString: 'MaterialTooltip',
+ cssClass: 'mdl-tooltip'
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Layout MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialLayout = function MaterialLayout(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialLayout'] = MaterialLayout;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialLayout.prototype.Constant_ = {
+ MAX_WIDTH: '(max-width: 1024px)',
+ TAB_SCROLL_PIXELS: 100,
+ RESIZE_TIMEOUT: 100,
+ MENU_ICON: '',
+ CHEVRON_LEFT: 'chevron_left',
+ CHEVRON_RIGHT: 'chevron_right'
+ };
+ /**
+ * Keycodes, for code readability.
+ *
+ * @enum {number}
+ * @private
+ */
+ MaterialLayout.prototype.Keycodes_ = {
+ ENTER: 13,
+ ESCAPE: 27,
+ SPACE: 32
+ };
+ /**
+ * Modes.
+ *
+ * @enum {number}
+ * @private
+ */
+ MaterialLayout.prototype.Mode_ = {
+ STANDARD: 0,
+ SEAMED: 1,
+ WATERFALL: 2,
+ SCROLL: 3
+ };
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialLayout.prototype.CssClasses_ = {
+ CONTAINER: 'mdl-layout__container',
+ HEADER: 'mdl-layout__header',
+ DRAWER: 'mdl-layout__drawer',
+ CONTENT: 'mdl-layout__content',
+ DRAWER_BTN: 'mdl-layout__drawer-button',
+ ICON: 'material-icons',
+ JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ RIPPLE_CONTAINER: 'mdl-layout__tab-ripple-container',
+ RIPPLE: 'mdl-ripple',
+ RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ HEADER_SEAMED: 'mdl-layout__header--seamed',
+ HEADER_WATERFALL: 'mdl-layout__header--waterfall',
+ HEADER_SCROLL: 'mdl-layout__header--scroll',
+ FIXED_HEADER: 'mdl-layout--fixed-header',
+ OBFUSCATOR: 'mdl-layout__obfuscator',
+ TAB_BAR: 'mdl-layout__tab-bar',
+ TAB_CONTAINER: 'mdl-layout__tab-bar-container',
+ TAB: 'mdl-layout__tab',
+ TAB_BAR_BUTTON: 'mdl-layout__tab-bar-button',
+ TAB_BAR_LEFT_BUTTON: 'mdl-layout__tab-bar-left-button',
+ TAB_BAR_RIGHT_BUTTON: 'mdl-layout__tab-bar-right-button',
+ TAB_MANUAL_SWITCH: 'mdl-layout__tab-manual-switch',
+ PANEL: 'mdl-layout__tab-panel',
+ HAS_DRAWER: 'has-drawer',
+ HAS_TABS: 'has-tabs',
+ HAS_SCROLLING_HEADER: 'has-scrolling-header',
+ CASTING_SHADOW: 'is-casting-shadow',
+ IS_COMPACT: 'is-compact',
+ IS_SMALL_SCREEN: 'is-small-screen',
+ IS_DRAWER_OPEN: 'is-visible',
+ IS_ACTIVE: 'is-active',
+ IS_UPGRADED: 'is-upgraded',
+ IS_ANIMATING: 'is-animating',
+ ON_LARGE_SCREEN: 'mdl-layout--large-screen-only',
+ ON_SMALL_SCREEN: 'mdl-layout--small-screen-only'
+ };
+ /**
+ * Handles scrolling on the content.
+ *
+ * @private
+ */
+ MaterialLayout.prototype.contentScrollHandler_ = function () {
+ if (this.header_.classList.contains(this.CssClasses_.IS_ANIMATING)) {
+ return;
+ }
+ var headerVisible = !this.element_.classList.contains(this.CssClasses_.IS_SMALL_SCREEN) || this.element_.classList.contains(this.CssClasses_.FIXED_HEADER);
+ if (this.content_.scrollTop > 0 && !this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+ this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);
+ this.header_.classList.add(this.CssClasses_.IS_COMPACT);
+ if (headerVisible) {
+ this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+ }
+ } else if (this.content_.scrollTop <= 0 && this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+ this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+ this.header_.classList.remove(this.CssClasses_.IS_COMPACT);
+ if (headerVisible) {
+ this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+ }
+ }
+ };
+ /**
+ * Handles a keyboard event on the drawer.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialLayout.prototype.keyboardEventHandler_ = function (evt) {
+ // Only react when the drawer is open.
+ if (evt.keyCode === this.Keycodes_.ESCAPE && this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
+ this.toggleDrawer();
+ }
+ };
+ /**
+ * Handles changes in screen size.
+ *
+ * @private
+ */
+ MaterialLayout.prototype.screenSizeHandler_ = function () {
+ if (this.screenSizeMediaQuery_.matches) {
+ this.element_.classList.add(this.CssClasses_.IS_SMALL_SCREEN);
+ } else {
+ this.element_.classList.remove(this.CssClasses_.IS_SMALL_SCREEN);
+ // Collapse drawer (if any) when moving to a large screen size.
+ if (this.drawer_) {
+ this.drawer_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);
+ this.obfuscator_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);
+ }
+ }
+ };
+ /**
+ * Handles events of drawer button.
+ *
+ * @param {Event} evt The event that fired.
+ * @private
+ */
+ MaterialLayout.prototype.drawerToggleHandler_ = function (evt) {
+ if (evt && evt.type === 'keydown') {
+ if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {
+ // prevent scrolling in drawer nav
+ evt.preventDefault();
+ } else {
+ // prevent other keys
+ return;
+ }
+ }
+ this.toggleDrawer();
+ };
+ /**
+ * Handles (un)setting the `is-animating` class
+ *
+ * @private
+ */
+ MaterialLayout.prototype.headerTransitionEndHandler_ = function () {
+ this.header_.classList.remove(this.CssClasses_.IS_ANIMATING);
+ };
+ /**
+ * Handles expanding the header on click
+ *
+ * @private
+ */
+ MaterialLayout.prototype.headerClickHandler_ = function () {
+ if (this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {
+ this.header_.classList.remove(this.CssClasses_.IS_COMPACT);
+ this.header_.classList.add(this.CssClasses_.IS_ANIMATING);
+ }
+ };
+ /**
+ * Reset tab state, dropping active classes
+ *
+ * @private
+ */
+ MaterialLayout.prototype.resetTabState_ = function (tabBar) {
+ for (var k = 0; k < tabBar.length; k++) {
+ tabBar[k].classList.remove(this.CssClasses_.IS_ACTIVE);
+ }
+ };
+ /**
+ * Reset panel state, droping active classes
+ *
+ * @private
+ */
+ MaterialLayout.prototype.resetPanelState_ = function (panels) {
+ for (var j = 0; j < panels.length; j++) {
+ panels[j].classList.remove(this.CssClasses_.IS_ACTIVE);
+ }
+ };
+ /**
+ * Toggle drawer state
+ *
+ * @public
+ */
+ MaterialLayout.prototype.toggleDrawer = function () {
+ var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);
+ this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
+ this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);
+ // Set accessibility properties.
+ if (this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {
+ this.drawer_.setAttribute('aria-hidden', 'false');
+ drawerButton.setAttribute('aria-expanded', 'true');
+ } else {
+ this.drawer_.setAttribute('aria-hidden', 'true');
+ drawerButton.setAttribute('aria-expanded', 'false');
+ }
+ };
+ MaterialLayout.prototype['toggleDrawer'] = MaterialLayout.prototype.toggleDrawer;
+ /**
+ * Initialize element.
+ */
+ MaterialLayout.prototype.init = function () {
+ if (this.element_) {
+ var container = document.createElement('div');
+ container.classList.add(this.CssClasses_.CONTAINER);
+ var focusedElement = this.element_.querySelector(':focus');
+ this.element_.parentElement.insertBefore(container, this.element_);
+ this.element_.parentElement.removeChild(this.element_);
+ container.appendChild(this.element_);
+ if (focusedElement) {
+ focusedElement.focus();
+ }
+ var directChildren = this.element_.childNodes;
+ var numChildren = directChildren.length;
+ for (var c = 0; c < numChildren; c++) {
+ var child = directChildren[c];
+ if (child.classList && child.classList.contains(this.CssClasses_.HEADER)) {
+ this.header_ = child;
+ }
+ if (child.classList && child.classList.contains(this.CssClasses_.DRAWER)) {
+ this.drawer_ = child;
+ }
+ if (child.classList && child.classList.contains(this.CssClasses_.CONTENT)) {
+ this.content_ = child;
+ }
+ }
+ window.addEventListener('pageshow', function (e) {
+ if (e.persisted) {
+ // when page is loaded from back/forward cache
+ // trigger repaint to let layout scroll in safari
+ this.element_.style.overflowY = 'hidden';
+ requestAnimationFrame(function () {
+ this.element_.style.overflowY = '';
+ }.bind(this));
+ }
+ }.bind(this), false);
+ if (this.header_) {
+ this.tabBar_ = this.header_.querySelector('.' + this.CssClasses_.TAB_BAR);
+ }
+ var mode = this.Mode_.STANDARD;
+ if (this.header_) {
+ if (this.header_.classList.contains(this.CssClasses_.HEADER_SEAMED)) {
+ mode = this.Mode_.SEAMED;
+ } else if (this.header_.classList.contains(this.CssClasses_.HEADER_WATERFALL)) {
+ mode = this.Mode_.WATERFALL;
+ this.header_.addEventListener('transitionend', this.headerTransitionEndHandler_.bind(this));
+ this.header_.addEventListener('click', this.headerClickHandler_.bind(this));
+ } else if (this.header_.classList.contains(this.CssClasses_.HEADER_SCROLL)) {
+ mode = this.Mode_.SCROLL;
+ container.classList.add(this.CssClasses_.HAS_SCROLLING_HEADER);
+ }
+ if (mode === this.Mode_.STANDARD) {
+ this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);
+ if (this.tabBar_) {
+ this.tabBar_.classList.add(this.CssClasses_.CASTING_SHADOW);
+ }
+ } else if (mode === this.Mode_.SEAMED || mode === this.Mode_.SCROLL) {
+ this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+ if (this.tabBar_) {
+ this.tabBar_.classList.remove(this.CssClasses_.CASTING_SHADOW);
+ }
+ } else if (mode === this.Mode_.WATERFALL) {
+ // Add and remove shadows depending on scroll position.
+ // Also add/remove auxiliary class for styling of the compact version of
+ // the header.
+ this.content_.addEventListener('scroll', this.contentScrollHandler_.bind(this));
+ this.contentScrollHandler_();
+ }
+ }
+ // Add drawer toggling button to our layout, if we have an openable drawer.
+ if (this.drawer_) {
+ var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);
+ if (!drawerButton) {
+ drawerButton = document.createElement('div');
+ drawerButton.setAttribute('aria-expanded', 'false');
+ drawerButton.setAttribute('role', 'button');
+ drawerButton.setAttribute('tabindex', '0');
+ drawerButton.classList.add(this.CssClasses_.DRAWER_BTN);
+ var drawerButtonIcon = document.createElement('i');
+ drawerButtonIcon.classList.add(this.CssClasses_.ICON);
+ drawerButtonIcon.innerHTML = this.Constant_.MENU_ICON;
+ drawerButton.appendChild(drawerButtonIcon);
+ }
+ if (this.drawer_.classList.contains(this.CssClasses_.ON_LARGE_SCREEN)) {
+ //If drawer has ON_LARGE_SCREEN class then add it to the drawer toggle button as well.
+ drawerButton.classList.add(this.CssClasses_.ON_LARGE_SCREEN);
+ } else if (this.drawer_.classList.contains(this.CssClasses_.ON_SMALL_SCREEN)) {
+ //If drawer has ON_SMALL_SCREEN class then add it to the drawer toggle button as well.
+ drawerButton.classList.add(this.CssClasses_.ON_SMALL_SCREEN);
+ }
+ drawerButton.addEventListener('click', this.drawerToggleHandler_.bind(this));
+ drawerButton.addEventListener('keydown', this.drawerToggleHandler_.bind(this));
+ // Add a class if the layout has a drawer, for altering the left padding.
+ // Adds the HAS_DRAWER to the elements since this.header_ may or may
+ // not be present.
+ this.element_.classList.add(this.CssClasses_.HAS_DRAWER);
+ // If we have a fixed header, add the button to the header rather than
+ // the layout.
+ if (this.element_.classList.contains(this.CssClasses_.FIXED_HEADER)) {
+ this.header_.insertBefore(drawerButton, this.header_.firstChild);
+ } else {
+ this.element_.insertBefore(drawerButton, this.content_);
+ }
+ var obfuscator = document.createElement('div');
+ obfuscator.classList.add(this.CssClasses_.OBFUSCATOR);
+ this.element_.appendChild(obfuscator);
+ obfuscator.addEventListener('click', this.drawerToggleHandler_.bind(this));
+ this.obfuscator_ = obfuscator;
+ this.drawer_.addEventListener('keydown', this.keyboardEventHandler_.bind(this));
+ this.drawer_.setAttribute('aria-hidden', 'true');
+ }
+ // Keep an eye on screen size, and add/remove auxiliary class for styling
+ // of small screens.
+ this.screenSizeMediaQuery_ = window.matchMedia(this.Constant_.MAX_WIDTH);
+ this.screenSizeMediaQuery_.addListener(this.screenSizeHandler_.bind(this));
+ this.screenSizeHandler_();
+ // Initialize tabs, if any.
+ if (this.header_ && this.tabBar_) {
+ this.element_.classList.add(this.CssClasses_.HAS_TABS);
+ var tabContainer = document.createElement('div');
+ tabContainer.classList.add(this.CssClasses_.TAB_CONTAINER);
+ this.header_.insertBefore(tabContainer, this.tabBar_);
+ this.header_.removeChild(this.tabBar_);
+ var leftButton = document.createElement('div');
+ leftButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);
+ leftButton.classList.add(this.CssClasses_.TAB_BAR_LEFT_BUTTON);
+ var leftButtonIcon = document.createElement('i');
+ leftButtonIcon.classList.add(this.CssClasses_.ICON);
+ leftButtonIcon.textContent = this.Constant_.CHEVRON_LEFT;
+ leftButton.appendChild(leftButtonIcon);
+ leftButton.addEventListener('click', function () {
+ this.tabBar_.scrollLeft -= this.Constant_.TAB_SCROLL_PIXELS;
+ }.bind(this));
+ var rightButton = document.createElement('div');
+ rightButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);
+ rightButton.classList.add(this.CssClasses_.TAB_BAR_RIGHT_BUTTON);
+ var rightButtonIcon = document.createElement('i');
+ rightButtonIcon.classList.add(this.CssClasses_.ICON);
+ rightButtonIcon.textContent = this.Constant_.CHEVRON_RIGHT;
+ rightButton.appendChild(rightButtonIcon);
+ rightButton.addEventListener('click', function () {
+ this.tabBar_.scrollLeft += this.Constant_.TAB_SCROLL_PIXELS;
+ }.bind(this));
+ tabContainer.appendChild(leftButton);
+ tabContainer.appendChild(this.tabBar_);
+ tabContainer.appendChild(rightButton);
+ // Add and remove tab buttons depending on scroll position and total
+ // window size.
+ var tabUpdateHandler = function () {
+ if (this.tabBar_.scrollLeft > 0) {
+ leftButton.classList.add(this.CssClasses_.IS_ACTIVE);
+ } else {
+ leftButton.classList.remove(this.CssClasses_.IS_ACTIVE);
+ }
+ if (this.tabBar_.scrollLeft < this.tabBar_.scrollWidth - this.tabBar_.offsetWidth) {
+ rightButton.classList.add(this.CssClasses_.IS_ACTIVE);
+ } else {
+ rightButton.classList.remove(this.CssClasses_.IS_ACTIVE);
+ }
+ }.bind(this);
+ this.tabBar_.addEventListener('scroll', tabUpdateHandler);
+ tabUpdateHandler();
+ // Update tabs when the window resizes.
+ var windowResizeHandler = function () {
+ // Use timeouts to make sure it doesn't happen too often.
+ if (this.resizeTimeoutId_) {
+ clearTimeout(this.resizeTimeoutId_);
+ }
+ this.resizeTimeoutId_ = setTimeout(function () {
+ tabUpdateHandler();
+ this.resizeTimeoutId_ = null;
+ }.bind(this), this.Constant_.RESIZE_TIMEOUT);
+ }.bind(this);
+ window.addEventListener('resize', windowResizeHandler);
+ if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
+ this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);
+ }
+ // Select element tabs, document panels
+ var tabs = this.tabBar_.querySelectorAll('.' + this.CssClasses_.TAB);
+ var panels = this.content_.querySelectorAll('.' + this.CssClasses_.PANEL);
+ // Create new tabs for each tab element
+ for (var i = 0; i < tabs.length; i++) {
+ new MaterialLayoutTab(tabs[i], tabs, panels, this);
+ }
+ }
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+
+ /**
+ * Constructor for an individual tab.
+ *
+ * @constructor
+ * @param {HTMLElement} tab The HTML element for the tab.
+ * @param {!Array<HTMLElement>} tabs Array with HTML elements for all tabs.
+ * @param {!Array<HTMLElement>} panels Array with HTML elements for all panels.
+ * @param {MaterialLayout} layout The MaterialLayout object that owns the tab.
+ */
+ function MaterialLayoutTab(tab, tabs, panels, layout) {
+ /**
+ * Auxiliary method to programmatically select a tab in the UI.
+ */
+ function selectTab() {
+ var href = tab.href.split('#')[1];
+ var panel = layout.content_.querySelector('#' + href);
+ layout.resetTabState_(tabs);
+ layout.resetPanelState_(panels);
+ tab.classList.add(layout.CssClasses_.IS_ACTIVE);
+ panel.classList.add(layout.CssClasses_.IS_ACTIVE);
+ }
+
+ if (layout.tabBar_.classList.contains(layout.CssClasses_.JS_RIPPLE_EFFECT)) {
+ var rippleContainer = document.createElement('span');
+ rippleContainer.classList.add(layout.CssClasses_.RIPPLE_CONTAINER);
+ rippleContainer.classList.add(layout.CssClasses_.JS_RIPPLE_EFFECT);
+ var ripple = document.createElement('span');
+ ripple.classList.add(layout.CssClasses_.RIPPLE);
+ rippleContainer.appendChild(ripple);
+ tab.appendChild(rippleContainer);
+ }
+ if (!layout.tabBar_.classList.contains(layout.CssClasses_.TAB_MANUAL_SWITCH)) {
+ tab.addEventListener('click', function (e) {
+ if (tab.getAttribute('href').charAt(0) === '#') {
+ e.preventDefault();
+ selectTab();
+ }
+ });
+ }
+ tab.show = selectTab;
+ }
+
+ window['MaterialLayoutTab'] = MaterialLayoutTab;
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialLayout,
+ classAsString: 'MaterialLayout',
+ cssClass: 'mdl-js-layout'
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Data Table Card MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {Element} element The element that will be upgraded.
+ */
+ var MaterialDataTable = function MaterialDataTable(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialDataTable'] = MaterialDataTable;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialDataTable.prototype.Constant_ = {};
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialDataTable.prototype.CssClasses_ = {
+ DATA_TABLE: 'mdl-data-table',
+ SELECTABLE: 'mdl-data-table--selectable',
+ SELECT_ELEMENT: 'mdl-data-table__select',
+ IS_SELECTED: 'is-selected',
+ IS_UPGRADED: 'is-upgraded'
+ };
+ /**
+ * Generates and returns a function that toggles the selection state of a
+ * single row (or multiple rows).
+ *
+ * @param {Element} checkbox Checkbox that toggles the selection state.
+ * @param {Element} row Row to toggle when checkbox changes.
+ * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
+ * @private
+ */
+ MaterialDataTable.prototype.selectRow_ = function (checkbox, row, opt_rows) {
+ if (row) {
+ return function () {
+ if (checkbox.checked) {
+ row.classList.add(this.CssClasses_.IS_SELECTED);
+ } else {
+ row.classList.remove(this.CssClasses_.IS_SELECTED);
+ }
+ }.bind(this);
+ }
+ if (opt_rows) {
+ return function () {
+ var i;
+ var el;
+ if (checkbox.checked) {
+ for (i = 0; i < opt_rows.length; i++) {
+ el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');
+ el['MaterialCheckbox'].check();
+ opt_rows[i].classList.add(this.CssClasses_.IS_SELECTED);
+ }
+ } else {
+ for (i = 0; i < opt_rows.length; i++) {
+ el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');
+ el['MaterialCheckbox'].uncheck();
+ opt_rows[i].classList.remove(this.CssClasses_.IS_SELECTED);
+ }
+ }
+ }.bind(this);
+ }
+ };
+ /**
+ * Creates a checkbox for a single or or multiple rows and hooks up the
+ * event handling.
+ *
+ * @param {Element} row Row to toggle when checkbox changes.
+ * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.
+ * @private
+ */
+ MaterialDataTable.prototype.createCheckbox_ = function (row, opt_rows) {
+ var label = document.createElement('label');
+ var labelClasses = [
+ 'mdl-checkbox',
+ 'mdl-js-checkbox',
+ 'mdl-js-ripple-effect',
+ this.CssClasses_.SELECT_ELEMENT
+ ];
+ label.className = labelClasses.join(' ');
+ var checkbox = document.createElement('input');
+ checkbox.type = 'checkbox';
+ checkbox.classList.add('mdl-checkbox__input');
+ if (row) {
+ checkbox.checked = row.classList.contains(this.CssClasses_.IS_SELECTED);
+ checkbox.addEventListener('change', this.selectRow_(checkbox, row));
+ } else if (opt_rows) {
+ checkbox.addEventListener('change', this.selectRow_(checkbox, null, opt_rows));
+ }
+ label.appendChild(checkbox);
+ componentHandler.upgradeElement(label, 'MaterialCheckbox');
+ return label;
+ };
+ /**
+ * Initialize element.
+ */
+ MaterialDataTable.prototype.init = function () {
+ if (this.element_) {
+ var firstHeader = this.element_.querySelector('th');
+ var bodyRows = Array.prototype.slice.call(this.element_.querySelectorAll('tbody tr'));
+ var footRows = Array.prototype.slice.call(this.element_.querySelectorAll('tfoot tr'));
+ var rows = bodyRows.concat(footRows);
+ if (this.element_.classList.contains(this.CssClasses_.SELECTABLE)) {
+ var th = document.createElement('th');
+ var headerCheckbox = this.createCheckbox_(null, rows);
+ th.appendChild(headerCheckbox);
+ firstHeader.parentElement.insertBefore(th, firstHeader);
+ for (var i = 0; i < rows.length; i++) {
+ var firstCell = rows[i].querySelector('td');
+ if (firstCell) {
+ var td = document.createElement('td');
+ if (rows[i].parentNode.nodeName.toUpperCase() === 'TBODY') {
+ var rowCheckbox = this.createCheckbox_(rows[i]);
+ td.appendChild(rowCheckbox);
+ }
+ rows[i].insertBefore(td, firstCell);
+ }
+ }
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialDataTable,
+ classAsString: 'MaterialDataTable',
+ cssClass: 'mdl-js-data-table'
+ });
+ /**
+ * @license
+ * Copyright 2015 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ /**
+ * Class constructor for Ripple MDL component.
+ * Implements MDL component design pattern defined at:
+ * https://github.com/jasonmayes/mdl-component-design-pattern
+ *
+ * @constructor
+ * @param {HTMLElement} element The element that will be upgraded.
+ */
+ var MaterialRipple = function MaterialRipple(element) {
+ this.element_ = element;
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialRipple'] = MaterialRipple;
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string | number}
+ * @private
+ */
+ MaterialRipple.prototype.Constant_ = {
+ INITIAL_SCALE: 'scale(0.0001, 0.0001)',
+ INITIAL_SIZE: '1px',
+ INITIAL_OPACITY: '0.4',
+ FINAL_OPACITY: '0',
+ FINAL_SCALE: ''
+ };
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialRipple.prototype.CssClasses_ = {
+ RIPPLE_CENTER: 'mdl-ripple--center',
+ RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',
+ RIPPLE: 'mdl-ripple',
+ IS_ANIMATING: 'is-animating',
+ IS_VISIBLE: 'is-visible'
+ };
+ /**
+ * Handle mouse / finger down on element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRipple.prototype.downHandler_ = function (event) {
+ if (!this.rippleElement_.style.width && !this.rippleElement_.style.height) {
+ var rect = this.element_.getBoundingClientRect();
+ this.boundHeight = rect.height;
+ this.boundWidth = rect.width;
+ this.rippleSize_ = Math.sqrt(rect.width * rect.width + rect.height * rect.height) * 2 + 2;
+ this.rippleElement_.style.width = this.rippleSize_ + 'px';
+ this.rippleElement_.style.height = this.rippleSize_ + 'px';
+ }
+ this.rippleElement_.classList.add(this.CssClasses_.IS_VISIBLE);
+ if (event.type === 'mousedown' && this.ignoringMouseDown_) {
+ this.ignoringMouseDown_ = false;
+ } else {
+ if (event.type === 'touchstart') {
+ this.ignoringMouseDown_ = true;
+ }
+ var frameCount = this.getFrameCount();
+ if (frameCount > 0) {
+ return;
+ }
+ this.setFrameCount(1);
+ var bound = event.currentTarget.getBoundingClientRect();
+ var x;
+ var y;
+ // Check if we are handling a keyboard click.
+ if (event.clientX === 0 && event.clientY === 0) {
+ x = Math.round(bound.width / 2);
+ y = Math.round(bound.height / 2);
+ } else {
+ var clientX = event.clientX !== undefined ? event.clientX : event.touches[0].clientX;
+ var clientY = event.clientY !== undefined ? event.clientY : event.touches[0].clientY;
+ x = Math.round(clientX - bound.left);
+ y = Math.round(clientY - bound.top);
+ }
+ this.setRippleXY(x, y);
+ this.setRippleStyles(true);
+ window.requestAnimationFrame(this.animFrameHandler.bind(this));
+ }
+ };
+ /**
+ * Handle mouse / finger up on element.
+ *
+ * @param {Event} event The event that fired.
+ * @private
+ */
+ MaterialRipple.prototype.upHandler_ = function (event) {
+ // Don't fire for the artificial "mouseup" generated by a double-click.
+ if (event && event.detail !== 2) {
+ // Allow a repaint to occur before removing this class, so the animation
+ // shows for tap events, which seem to trigger a mouseup too soon after
+ // mousedown.
+ window.setTimeout(function () {
+ this.rippleElement_.classList.remove(this.CssClasses_.IS_VISIBLE);
+ }.bind(this), 0);
+ }
+ };
+ /**
+ * Initialize element.
+ */
+ MaterialRipple.prototype.init = function () {
+ if (this.element_) {
+ var recentering = this.element_.classList.contains(this.CssClasses_.RIPPLE_CENTER);
+ if (!this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT_IGNORE_EVENTS)) {
+ this.rippleElement_ = this.element_.querySelector('.' + this.CssClasses_.RIPPLE);
+ this.frameCount_ = 0;
+ this.rippleSize_ = 0;
+ this.x_ = 0;
+ this.y_ = 0;
+ // Touch start produces a compat mouse down event, which would cause a
+ // second ripples. To avoid that, we use this property to ignore the first
+ // mouse down after a touch start.
+ this.ignoringMouseDown_ = false;
+ this.boundDownHandler = this.downHandler_.bind(this);
+ this.element_.addEventListener('mousedown', this.boundDownHandler);
+ this.element_.addEventListener('touchstart', this.boundDownHandler);
+ this.boundUpHandler = this.upHandler_.bind(this);
+ this.element_.addEventListener('mouseup', this.boundUpHandler);
+ this.element_.addEventListener('mouseleave', this.boundUpHandler);
+ this.element_.addEventListener('touchend', this.boundUpHandler);
+ this.element_.addEventListener('blur', this.boundUpHandler);
+ /**
+ * Getter for frameCount_.
+ * @return {number} the frame count.
+ */
+ this.getFrameCount = function () {
+ return this.frameCount_;
+ };
+ /**
+ * Setter for frameCount_.
+ * @param {number} fC the frame count.
+ */
+ this.setFrameCount = function (fC) {
+ this.frameCount_ = fC;
+ };
+ /**
+ * Getter for rippleElement_.
+ * @return {Element} the ripple element.
+ */
+ this.getRippleElement = function () {
+ return this.rippleElement_;
+ };
+ /**
+ * Sets the ripple X and Y coordinates.
+ * @param {number} newX the new X coordinate
+ * @param {number} newY the new Y coordinate
+ */
+ this.setRippleXY = function (newX, newY) {
+ this.x_ = newX;
+ this.y_ = newY;
+ };
+ /**
+ * Sets the ripple styles.
+ * @param {boolean} start whether or not this is the start frame.
+ */
+ this.setRippleStyles = function (start) {
+ if (this.rippleElement_ !== null) {
+ var transformString;
+ var scale;
+ var size;
+ var offset = 'translate(' + this.x_ + 'px, ' + this.y_ + 'px)';
+ if (start) {
+ scale = this.Constant_.INITIAL_SCALE;
+ size = this.Constant_.INITIAL_SIZE;
+ } else {
+ scale = this.Constant_.FINAL_SCALE;
+ size = this.rippleSize_ + 'px';
+ if (recentering) {
+ offset = 'translate(' + this.boundWidth / 2 + 'px, ' + this.boundHeight / 2 + 'px)';
+ }
+ }
+ transformString = 'translate(-50%, -50%) ' + offset + scale;
+ this.rippleElement_.style.webkitTransform = transformString;
+ this.rippleElement_.style.msTransform = transformString;
+ this.rippleElement_.style.transform = transformString;
+ if (start) {
+ this.rippleElement_.classList.remove(this.CssClasses_.IS_ANIMATING);
+ } else {
+ this.rippleElement_.classList.add(this.CssClasses_.IS_ANIMATING);
+ }
+ }
+ };
+ /**
+ * Handles an animation frame.
+ */
+ this.animFrameHandler = function () {
+ if (this.frameCount_-- > 0) {
+ window.requestAnimationFrame(this.animFrameHandler.bind(this));
+ } else {
+ this.setRippleStyles(false);
+ }
+ };
+ }
+ }
+ };
+// The component registers itself. It can assume componentHandler is available
+// in the global scope.
+ componentHandler.register({
+ constructor: MaterialRipple,
+ classAsString: 'MaterialRipple',
+ cssClass: 'mdl-js-ripple-effect',
+ widget: false
+ });
+}());
diff --git a/src/material.min.css b/src/material.min.css
new file mode 100644
index 0000000..e0ba7eb
--- /dev/null
+++ b/src/material.min.css
@@ -0,0 +1,9 @@
+/**
+ * material-design-lite - Material Design Components in CSS, JS and HTML
+ * @version v1.3.0
+ * @license Apache-2.0
+ * @copyright 2015 Google, Inc.
+ * @link https://github.com/google/material-design-lite
+ */
+@charset "UTF-8";html{color:rgba(0,0,0,.87)}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.browserupgrade{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}.hidden{display:none!important}.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,*:before,*:after,*:first-letter{background:transparent!important;color:#000!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}a,.mdl-accordion,.mdl-button,.mdl-card,.mdl-checkbox,.mdl-dropdown-menu,.mdl-icon-toggle,.mdl-item,.mdl-radio,.mdl-slider,.mdl-switch,.mdl-tabs__tab{-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:rgba(255,255,255,0)}html{width:100%;height:100%;-ms-touch-action:manipulation;touch-action:manipulation}body{width:100%;min-height:100%;margin:0}main{display:block}*[hidden]{display:none!important}html,body{font-family:"Roboto";font-size:14px;font-weight:400;line-height:20px}h1,h2,h3,h4,h5,h6,p{padding:0}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400;line-height:1.35;letter-spacing:-.02em;opacity:.54;font-size:.6em}h1{font-size:56px;line-height:1.35;letter-spacing:-.02em;margin:24px 0}h1,h2{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400}h2{font-size:45px;line-height:48px}h2,h3{margin:24px 0}h3{font-size:34px;line-height:40px}h3,h4{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400}h4{font-size:24px;line-height:32px;-moz-osx-font-smoothing:grayscale;margin:24px 0 16px}h5{font-size:20px;font-weight:500;line-height:1;letter-spacing:.02em}h5,h6{font-family:"Roboto","Helvetica","Arial",sans-serif;margin:24px 0 16px}h6{font-size:16px;letter-spacing:.04em}h6,p{font-weight:400;line-height:24px}p{font-size:14px;letter-spacing:0;margin:0 0 16px}a{color:#ff4081;font-weight:500}blockquote{font-family:"Roboto","Helvetica","Arial",sans-serif;position:relative;font-size:24px;font-weight:300;font-style:italic;line-height:1.35;letter-spacing:.08em}blockquote:before{position:absolute;left:-.5em;content:'“'}blockquote:after{content:'”';margin-left:-.05em}mark{background-color:#f4ff81}dt{font-weight:700}address{font-size:12px;line-height:1;font-style:normal}address,ul,ol{font-weight:400;letter-spacing:0}ul,ol{font-size:14px;line-height:24px}.mdl-typography--display-4,.mdl-typography--display-4-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:112px;font-weight:300;line-height:1;letter-spacing:-.04em}.mdl-typography--display-4-color-contrast{opacity:.54}.mdl-typography--display-3,.mdl-typography--display-3-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:56px;font-weight:400;line-height:1.35;letter-spacing:-.02em}.mdl-typography--display-3-color-contrast{opacity:.54}.mdl-typography--display-2,.mdl-typography--display-2-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:45px;font-weight:400;line-height:48px}.mdl-typography--display-2-color-contrast{opacity:.54}.mdl-typography--display-1,.mdl-typography--display-1-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:34px;font-weight:400;line-height:40px}.mdl-typography--display-1-color-contrast{opacity:.54}.mdl-typography--headline,.mdl-typography--headline-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:24px;font-weight:400;line-height:32px;-moz-osx-font-smoothing:grayscale}.mdl-typography--headline-color-contrast{opacity:.87}.mdl-typography--title,.mdl-typography--title-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:20px;font-weight:500;line-height:1;letter-spacing:.02em}.mdl-typography--title-color-contrast{opacity:.87}.mdl-typography--subhead,.mdl-typography--subhead-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:.04em}.mdl-typography--subhead-color-contrast{opacity:.87}.mdl-typography--body-2,.mdl-typography--body-2-color-contrast{font-size:14px;font-weight:700;line-height:24px;letter-spacing:0}.mdl-typography--body-2-color-contrast{opacity:.87}.mdl-typography--body-1,.mdl-typography--body-1-color-contrast{font-size:14px;font-weight:400;line-height:24px;letter-spacing:0}.mdl-typography--body-1-color-contrast{opacity:.87}.mdl-typography--body-2-force-preferred-font,.mdl-typography--body-2-force-preferred-font-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;line-height:24px;letter-spacing:0}.mdl-typography--body-2-force-preferred-font-color-contrast{opacity:.87}.mdl-typography--body-1-force-preferred-font,.mdl-typography--body-1-force-preferred-font-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:400;line-height:24px;letter-spacing:0}.mdl-typography--body-1-force-preferred-font-color-contrast{opacity:.87}.mdl-typography--caption,.mdl-typography--caption-force-preferred-font{font-size:12px;font-weight:400;line-height:1;letter-spacing:0}.mdl-typography--caption-force-preferred-font{font-family:"Roboto","Helvetica","Arial",sans-serif}.mdl-typography--caption-color-contrast,.mdl-typography--caption-force-preferred-font-color-contrast{font-size:12px;font-weight:400;line-height:1;letter-spacing:0;opacity:.54}.mdl-typography--caption-force-preferred-font-color-contrast,.mdl-typography--menu{font-family:"Roboto","Helvetica","Arial",sans-serif}.mdl-typography--menu{font-size:14px;font-weight:500;line-height:1;letter-spacing:0}.mdl-typography--menu-color-contrast{opacity:.87}.mdl-typography--menu-color-contrast,.mdl-typography--button,.mdl-typography--button-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;line-height:1;letter-spacing:0}.mdl-typography--button,.mdl-typography--button-color-contrast{text-transform:uppercase}.mdl-typography--button-color-contrast{opacity:.87}.mdl-typography--text-left{text-align:left}.mdl-typography--text-right{text-align:right}.mdl-typography--text-center{text-align:center}.mdl-typography--text-justify{text-align:justify}.mdl-typography--text-nowrap{white-space:nowrap}.mdl-typography--text-lowercase{text-transform:lowercase}.mdl-typography--text-uppercase{text-transform:uppercase}.mdl-typography--text-capitalize{text-transform:capitalize}.mdl-typography--font-thin{font-weight:200!important}.mdl-typography--font-light{font-weight:300!important}.mdl-typography--font-regular{font-weight:400!important}.mdl-typography--font-medium{font-weight:500!important}.mdl-typography--font-bold{font-weight:700!important}.mdl-typography--font-black{font-weight:900!important}.material-icons{font-family:'Material Icons';font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;word-wrap:normal;-moz-font-feature-settings:'liga';font-feature-settings:'liga';-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}.mdl-color-text--red{color:#f44336 !important}.mdl-color--red{background-color:#f44336 !important}.mdl-color-text--red-50{color:#ffebee !important}.mdl-color--red-50{background-color:#ffebee !important}.mdl-color-text--red-100{color:#ffcdd2 !important}.mdl-color--red-100{background-color:#ffcdd2 !important}.mdl-color-text--red-200{color:#ef9a9a !important}.mdl-color--red-200{background-color:#ef9a9a !important}.mdl-color-text--red-300{color:#e57373 !important}.mdl-color--red-300{background-color:#e57373 !important}.mdl-color-text--red-400{color:#ef5350 !important}.mdl-color--red-400{background-color:#ef5350 !important}.mdl-color-text--red-500{color:#f44336 !important}.mdl-color--red-500{background-color:#f44336 !important}.mdl-color-text--red-600{color:#e53935 !important}.mdl-color--red-600{background-color:#e53935 !important}.mdl-color-text--red-700{color:#d32f2f !important}.mdl-color--red-700{background-color:#d32f2f !important}.mdl-color-text--red-800{color:#c62828 !important}.mdl-color--red-800{background-color:#c62828 !important}.mdl-color-text--red-900{color:#b71c1c !important}.mdl-color--red-900{background-color:#b71c1c !important}.mdl-color-text--red-A100{color:#ff8a80 !important}.mdl-color--red-A100{background-color:#ff8a80 !important}.mdl-color-text--red-A200{color:#ff5252 !important}.mdl-color--red-A200{background-color:#ff5252 !important}.mdl-color-text--red-A400{color:#ff1744 !important}.mdl-color--red-A400{background-color:#ff1744 !important}.mdl-color-text--red-A700{color:#d50000 !important}.mdl-color--red-A700{background-color:#d50000 !important}.mdl-color-text--pink{color:#e91e63 !important}.mdl-color--pink{background-color:#e91e63 !important}.mdl-color-text--pink-50{color:#fce4ec !important}.mdl-color--pink-50{background-color:#fce4ec !important}.mdl-color-text--pink-100{color:#f8bbd0 !important}.mdl-color--pink-100{background-color:#f8bbd0 !important}.mdl-color-text--pink-200{color:#f48fb1 !important}.mdl-color--pink-200{background-color:#f48fb1 !important}.mdl-color-text--pink-300{color:#f06292 !important}.mdl-color--pink-300{background-color:#f06292 !important}.mdl-color-text--pink-400{color:#ec407a !important}.mdl-color--pink-400{background-color:#ec407a !important}.mdl-color-text--pink-500{color:#e91e63 !important}.mdl-color--pink-500{background-color:#e91e63 !important}.mdl-color-text--pink-600{color:#d81b60 !important}.mdl-color--pink-600{background-color:#d81b60 !important}.mdl-color-text--pink-700{color:#c2185b !important}.mdl-color--pink-700{background-color:#c2185b !important}.mdl-color-text--pink-800{color:#ad1457 !important}.mdl-color--pink-800{background-color:#ad1457 !important}.mdl-color-text--pink-900{color:#880e4f !important}.mdl-color--pink-900{background-color:#880e4f !important}.mdl-color-text--pink-A100{color:#ff80ab !important}.mdl-color--pink-A100{background-color:#ff80ab !important}.mdl-color-text--pink-A200{color:#ff4081 !important}.mdl-color--pink-A200{background-color:#ff4081 !important}.mdl-color-text--pink-A400{color:#f50057 !important}.mdl-color--pink-A400{background-color:#f50057 !important}.mdl-color-text--pink-A700{color:#c51162 !important}.mdl-color--pink-A700{background-color:#c51162 !important}.mdl-color-text--purple{color:#9c27b0 !important}.mdl-color--purple{background-color:#9c27b0 !important}.mdl-color-text--purple-50{color:#f3e5f5 !important}.mdl-color--purple-50{background-color:#f3e5f5 !important}.mdl-color-text--purple-100{color:#e1bee7 !important}.mdl-color--purple-100{background-color:#e1bee7 !important}.mdl-color-text--purple-200{color:#ce93d8 !important}.mdl-color--purple-200{background-color:#ce93d8 !important}.mdl-color-text--purple-300{color:#ba68c8 !important}.mdl-color--purple-300{background-color:#ba68c8 !important}.mdl-color-text--purple-400{color:#ab47bc !important}.mdl-color--purple-400{background-color:#ab47bc !important}.mdl-color-text--purple-500{color:#9c27b0 !important}.mdl-color--purple-500{background-color:#9c27b0 !important}.mdl-color-text--purple-600{color:#8e24aa !important}.mdl-color--purple-600{background-color:#8e24aa !important}.mdl-color-text--purple-700{color:#7b1fa2 !important}.mdl-color--purple-700{background-color:#7b1fa2 !important}.mdl-color-text--purple-800{color:#6a1b9a !important}.mdl-color--purple-800{background-color:#6a1b9a !important}.mdl-color-text--purple-900{color:#4a148c !important}.mdl-color--purple-900{background-color:#4a148c !important}.mdl-color-text--purple-A100{color:#ea80fc !important}.mdl-color--purple-A100{background-color:#ea80fc !important}.mdl-color-text--purple-A200{color:#e040fb !important}.mdl-color--purple-A200{background-color:#e040fb !important}.mdl-color-text--purple-A400{color:#d500f9 !important}.mdl-color--purple-A400{background-color:#d500f9 !important}.mdl-color-text--purple-A700{color:#a0f !important}.mdl-color--purple-A700{background-color:#a0f !important}.mdl-color-text--deep-purple{color:#673ab7 !important}.mdl-color--deep-purple{background-color:#673ab7 !important}.mdl-color-text--deep-purple-50{color:#ede7f6 !important}.mdl-color--deep-purple-50{background-color:#ede7f6 !important}.mdl-color-text--deep-purple-100{color:#d1c4e9 !important}.mdl-color--deep-purple-100{background-color:#d1c4e9 !important}.mdl-color-text--deep-purple-200{color:#b39ddb !important}.mdl-color--deep-purple-200{background-color:#b39ddb !important}.mdl-color-text--deep-purple-300{color:#9575cd !important}.mdl-color--deep-purple-300{background-color:#9575cd !important}.mdl-color-text--deep-purple-400{color:#7e57c2 !important}.mdl-color--deep-purple-400{background-color:#7e57c2 !important}.mdl-color-text--deep-purple-500{color:#673ab7 !important}.mdl-color--deep-purple-500{background-color:#673ab7 !important}.mdl-color-text--deep-purple-600{color:#5e35b1 !important}.mdl-color--deep-purple-600{background-color:#5e35b1 !important}.mdl-color-text--deep-purple-700{color:#512da8 !important}.mdl-color--deep-purple-700{background-color:#512da8 !important}.mdl-color-text--deep-purple-800{color:#4527a0 !important}.mdl-color--deep-purple-800{background-color:#4527a0 !important}.mdl-color-text--deep-purple-900{color:#311b92 !important}.mdl-color--deep-purple-900{background-color:#311b92 !important}.mdl-color-text--deep-purple-A100{color:#b388ff !important}.mdl-color--deep-purple-A100{background-color:#b388ff !important}.mdl-color-text--deep-purple-A200{color:#7c4dff !important}.mdl-color--deep-purple-A200{background-color:#7c4dff !important}.mdl-color-text--deep-purple-A400{color:#651fff !important}.mdl-color--deep-purple-A400{background-color:#651fff !important}.mdl-color-text--deep-purple-A700{color:#6200ea !important}.mdl-color--deep-purple-A700{background-color:#6200ea !important}.mdl-color-text--indigo{color:#3f51b5 !important}.mdl-color--indigo{background-color:#3f51b5 !important}.mdl-color-text--indigo-50{color:#e8eaf6 !important}.mdl-color--indigo-50{background-color:#e8eaf6 !important}.mdl-color-text--indigo-100{color:#c5cae9 !important}.mdl-color--indigo-100{background-color:#c5cae9 !important}.mdl-color-text--indigo-200{color:#9fa8da !important}.mdl-color--indigo-200{background-color:#9fa8da !important}.mdl-color-text--indigo-300{color:#7986cb !important}.mdl-color--indigo-300{background-color:#7986cb !important}.mdl-color-text--indigo-400{color:#5c6bc0 !important}.mdl-color--indigo-400{background-color:#5c6bc0 !important}.mdl-color-text--indigo-500{color:#3f51b5 !important}.mdl-color--indigo-500{background-color:#3f51b5 !important}.mdl-color-text--indigo-600{color:#3949ab !important}.mdl-color--indigo-600{background-color:#3949ab !important}.mdl-color-text--indigo-700{color:#303f9f !important}.mdl-color--indigo-700{background-color:#303f9f !important}.mdl-color-text--indigo-800{color:#283593 !important}.mdl-color--indigo-800{background-color:#283593 !important}.mdl-color-text--indigo-900{color:#1a237e !important}.mdl-color--indigo-900{background-color:#1a237e !important}.mdl-color-text--indigo-A100{color:#8c9eff !important}.mdl-color--indigo-A100{background-color:#8c9eff !important}.mdl-color-text--indigo-A200{color:#536dfe !important}.mdl-color--indigo-A200{background-color:#536dfe !important}.mdl-color-text--indigo-A400{color:#3d5afe !important}.mdl-color--indigo-A400{background-color:#3d5afe !important}.mdl-color-text--indigo-A700{color:#304ffe !important}.mdl-color--indigo-A700{background-color:#304ffe !important}.mdl-color-text--blue{color:#2196f3 !important}.mdl-color--blue{background-color:#2196f3 !important}.mdl-color-text--blue-50{color:#e3f2fd !important}.mdl-color--blue-50{background-color:#e3f2fd !important}.mdl-color-text--blue-100{color:#bbdefb !important}.mdl-color--blue-100{background-color:#bbdefb !important}.mdl-color-text--blue-200{color:#90caf9 !important}.mdl-color--blue-200{background-color:#90caf9 !important}.mdl-color-text--blue-300{color:#64b5f6 !important}.mdl-color--blue-300{background-color:#64b5f6 !important}.mdl-color-text--blue-400{color:#42a5f5 !important}.mdl-color--blue-400{background-color:#42a5f5 !important}.mdl-color-text--blue-500{color:#2196f3 !important}.mdl-color--blue-500{background-color:#2196f3 !important}.mdl-color-text--blue-600{color:#1e88e5 !important}.mdl-color--blue-600{background-color:#1e88e5 !important}.mdl-color-text--blue-700{color:#1976d2 !important}.mdl-color--blue-700{background-color:#1976d2 !important}.mdl-color-text--blue-800{color:#1565c0 !important}.mdl-color--blue-800{background-color:#1565c0 !important}.mdl-color-text--blue-900{color:#0d47a1 !important}.mdl-color--blue-900{background-color:#0d47a1 !important}.mdl-color-text--blue-A100{color:#82b1ff !important}.mdl-color--blue-A100{background-color:#82b1ff !important}.mdl-color-text--blue-A200{color:#448aff !important}.mdl-color--blue-A200{background-color:#448aff !important}.mdl-color-text--blue-A400{color:#2979ff !important}.mdl-color--blue-A400{background-color:#2979ff !important}.mdl-color-text--blue-A700{color:#2962ff !important}.mdl-color--blue-A700{background-color:#2962ff !important}.mdl-color-text--light-blue{color:#03a9f4 !important}.mdl-color--light-blue{background-color:#03a9f4 !important}.mdl-color-text--light-blue-50{color:#e1f5fe !important}.mdl-color--light-blue-50{background-color:#e1f5fe !important}.mdl-color-text--light-blue-100{color:#b3e5fc !important}.mdl-color--light-blue-100{background-color:#b3e5fc !important}.mdl-color-text--light-blue-200{color:#81d4fa !important}.mdl-color--light-blue-200{background-color:#81d4fa !important}.mdl-color-text--light-blue-300{color:#4fc3f7 !important}.mdl-color--light-blue-300{background-color:#4fc3f7 !important}.mdl-color-text--light-blue-400{color:#29b6f6 !important}.mdl-color--light-blue-400{background-color:#29b6f6 !important}.mdl-color-text--light-blue-500{color:#03a9f4 !important}.mdl-color--light-blue-500{background-color:#03a9f4 !important}.mdl-color-text--light-blue-600{color:#039be5 !important}.mdl-color--light-blue-600{background-color:#039be5 !important}.mdl-color-text--light-blue-700{color:#0288d1 !important}.mdl-color--light-blue-700{background-color:#0288d1 !important}.mdl-color-text--light-blue-800{color:#0277bd !important}.mdl-color--light-blue-800{background-color:#0277bd !important}.mdl-color-text--light-blue-900{color:#01579b !important}.mdl-color--light-blue-900{background-color:#01579b !important}.mdl-color-text--light-blue-A100{color:#80d8ff !important}.mdl-color--light-blue-A100{background-color:#80d8ff !important}.mdl-color-text--light-blue-A200{color:#40c4ff !important}.mdl-color--light-blue-A200{background-color:#40c4ff !important}.mdl-color-text--light-blue-A400{color:#00b0ff !important}.mdl-color--light-blue-A400{background-color:#00b0ff !important}.mdl-color-text--light-blue-A700{color:#0091ea !important}.mdl-color--light-blue-A700{background-color:#0091ea !important}.mdl-color-text--cyan{color:#00bcd4 !important}.mdl-color--cyan{background-color:#00bcd4 !important}.mdl-color-text--cyan-50{color:#e0f7fa !important}.mdl-color--cyan-50{background-color:#e0f7fa !important}.mdl-color-text--cyan-100{color:#b2ebf2 !important}.mdl-color--cyan-100{background-color:#b2ebf2 !important}.mdl-color-text--cyan-200{color:#80deea !important}.mdl-color--cyan-200{background-color:#80deea !important}.mdl-color-text--cyan-300{color:#4dd0e1 !important}.mdl-color--cyan-300{background-color:#4dd0e1 !important}.mdl-color-text--cyan-400{color:#26c6da !important}.mdl-color--cyan-400{background-color:#26c6da !important}.mdl-color-text--cyan-500{color:#00bcd4 !important}.mdl-color--cyan-500{background-color:#00bcd4 !important}.mdl-color-text--cyan-600{color:#00acc1 !important}.mdl-color--cyan-600{background-color:#00acc1 !important}.mdl-color-text--cyan-700{color:#0097a7 !important}.mdl-color--cyan-700{background-color:#0097a7 !important}.mdl-color-text--cyan-800{color:#00838f !important}.mdl-color--cyan-800{background-color:#00838f !important}.mdl-color-text--cyan-900{color:#006064 !important}.mdl-color--cyan-900{background-color:#006064 !important}.mdl-color-text--cyan-A100{color:#84ffff !important}.mdl-color--cyan-A100{background-color:#84ffff !important}.mdl-color-text--cyan-A200{color:#18ffff !important}.mdl-color--cyan-A200{background-color:#18ffff !important}.mdl-color-text--cyan-A400{color:#00e5ff !important}.mdl-color--cyan-A400{background-color:#00e5ff !important}.mdl-color-text--cyan-A700{color:#00b8d4 !important}.mdl-color--cyan-A700{background-color:#00b8d4 !important}.mdl-color-text--teal{color:#009688 !important}.mdl-color--teal{background-color:#009688 !important}.mdl-color-text--teal-50{color:#e0f2f1 !important}.mdl-color--teal-50{background-color:#e0f2f1 !important}.mdl-color-text--teal-100{color:#b2dfdb !important}.mdl-color--teal-100{background-color:#b2dfdb !important}.mdl-color-text--teal-200{color:#80cbc4 !important}.mdl-color--teal-200{background-color:#80cbc4 !important}.mdl-color-text--teal-300{color:#4db6ac !important}.mdl-color--teal-300{background-color:#4db6ac !important}.mdl-color-text--teal-400{color:#26a69a !important}.mdl-color--teal-400{background-color:#26a69a !important}.mdl-color-text--teal-500{color:#009688 !important}.mdl-color--teal-500{background-color:#009688 !important}.mdl-color-text--teal-600{color:#00897b !important}.mdl-color--teal-600{background-color:#00897b !important}.mdl-color-text--teal-700{color:#00796b !important}.mdl-color--teal-700{background-color:#00796b !important}.mdl-color-text--teal-800{color:#00695c !important}.mdl-color--teal-800{background-color:#00695c !important}.mdl-color-text--teal-900{color:#004d40 !important}.mdl-color--teal-900{background-color:#004d40 !important}.mdl-color-text--teal-A100{color:#a7ffeb !important}.mdl-color--teal-A100{background-color:#a7ffeb !important}.mdl-color-text--teal-A200{color:#64ffda !important}.mdl-color--teal-A200{background-color:#64ffda !important}.mdl-color-text--teal-A400{color:#1de9b6 !important}.mdl-color--teal-A400{background-color:#1de9b6 !important}.mdl-color-text--teal-A700{color:#00bfa5 !important}.mdl-color--teal-A700{background-color:#00bfa5 !important}.mdl-color-text--green{color:#4caf50 !important}.mdl-color--green{background-color:#4caf50 !important}.mdl-color-text--green-50{color:#e8f5e9 !important}.mdl-color--green-50{background-color:#e8f5e9 !important}.mdl-color-text--green-100{color:#c8e6c9 !important}.mdl-color--green-100{background-color:#c8e6c9 !important}.mdl-color-text--green-200{color:#a5d6a7 !important}.mdl-color--green-200{background-color:#a5d6a7 !important}.mdl-color-text--green-300{color:#81c784 !important}.mdl-color--green-300{background-color:#81c784 !important}.mdl-color-text--green-400{color:#66bb6a !important}.mdl-color--green-400{background-color:#66bb6a !important}.mdl-color-text--green-500{color:#4caf50 !important}.mdl-color--green-500{background-color:#4caf50 !important}.mdl-color-text--green-600{color:#43a047 !important}.mdl-color--green-600{background-color:#43a047 !important}.mdl-color-text--green-700{color:#388e3c !important}.mdl-color--green-700{background-color:#388e3c !important}.mdl-color-text--green-800{color:#2e7d32 !important}.mdl-color--green-800{background-color:#2e7d32 !important}.mdl-color-text--green-900{color:#1b5e20 !important}.mdl-color--green-900{background-color:#1b5e20 !important}.mdl-color-text--green-A100{color:#b9f6ca !important}.mdl-color--green-A100{background-color:#b9f6ca !important}.mdl-color-text--green-A200{color:#69f0ae !important}.mdl-color--green-A200{background-color:#69f0ae !important}.mdl-color-text--green-A400{color:#00e676 !important}.mdl-color--green-A400{background-color:#00e676 !important}.mdl-color-text--green-A700{color:#00c853 !important}.mdl-color--green-A700{background-color:#00c853 !important}.mdl-color-text--light-green{color:#8bc34a !important}.mdl-color--light-green{background-color:#8bc34a !important}.mdl-color-text--light-green-50{color:#f1f8e9 !important}.mdl-color--light-green-50{background-color:#f1f8e9 !important}.mdl-color-text--light-green-100{color:#dcedc8 !important}.mdl-color--light-green-100{background-color:#dcedc8 !important}.mdl-color-text--light-green-200{color:#c5e1a5 !important}.mdl-color--light-green-200{background-color:#c5e1a5 !important}.mdl-color-text--light-green-300{color:#aed581 !important}.mdl-color--light-green-300{background-color:#aed581 !important}.mdl-color-text--light-green-400{color:#9ccc65 !important}.mdl-color--light-green-400{background-color:#9ccc65 !important}.mdl-color-text--light-green-500{color:#8bc34a !important}.mdl-color--light-green-500{background-color:#8bc34a !important}.mdl-color-text--light-green-600{color:#7cb342 !important}.mdl-color--light-green-600{background-color:#7cb342 !important}.mdl-color-text--light-green-700{color:#689f38 !important}.mdl-color--light-green-700{background-color:#689f38 !important}.mdl-color-text--light-green-800{color:#558b2f !important}.mdl-color--light-green-800{background-color:#558b2f !important}.mdl-color-text--light-green-900{color:#33691e !important}.mdl-color--light-green-900{background-color:#33691e !important}.mdl-color-text--light-green-A100{color:#ccff90 !important}.mdl-color--light-green-A100{background-color:#ccff90 !important}.mdl-color-text--light-green-A200{color:#b2ff59 !important}.mdl-color--light-green-A200{background-color:#b2ff59 !important}.mdl-color-text--light-green-A400{color:#76ff03 !important}.mdl-color--light-green-A400{background-color:#76ff03 !important}.mdl-color-text--light-green-A700{color:#64dd17 !important}.mdl-color--light-green-A700{background-color:#64dd17 !important}.mdl-color-text--lime{color:#cddc39 !important}.mdl-color--lime{background-color:#cddc39 !important}.mdl-color-text--lime-50{color:#f9fbe7 !important}.mdl-color--lime-50{background-color:#f9fbe7 !important}.mdl-color-text--lime-100{color:#f0f4c3 !important}.mdl-color--lime-100{background-color:#f0f4c3 !important}.mdl-color-text--lime-200{color:#e6ee9c !important}.mdl-color--lime-200{background-color:#e6ee9c !important}.mdl-color-text--lime-300{color:#dce775 !important}.mdl-color--lime-300{background-color:#dce775 !important}.mdl-color-text--lime-400{color:#d4e157 !important}.mdl-color--lime-400{background-color:#d4e157 !important}.mdl-color-text--lime-500{color:#cddc39 !important}.mdl-color--lime-500{background-color:#cddc39 !important}.mdl-color-text--lime-600{color:#c0ca33 !important}.mdl-color--lime-600{background-color:#c0ca33 !important}.mdl-color-text--lime-700{color:#afb42b !important}.mdl-color--lime-700{background-color:#afb42b !important}.mdl-color-text--lime-800{color:#9e9d24 !important}.mdl-color--lime-800{background-color:#9e9d24 !important}.mdl-color-text--lime-900{color:#827717 !important}.mdl-color--lime-900{background-color:#827717 !important}.mdl-color-text--lime-A100{color:#f4ff81 !important}.mdl-color--lime-A100{background-color:#f4ff81 !important}.mdl-color-text--lime-A200{color:#eeff41 !important}.mdl-color--lime-A200{background-color:#eeff41 !important}.mdl-color-text--lime-A400{color:#c6ff00 !important}.mdl-color--lime-A400{background-color:#c6ff00 !important}.mdl-color-text--lime-A700{color:#aeea00 !important}.mdl-color--lime-A700{background-color:#aeea00 !important}.mdl-color-text--yellow{color:#ffeb3b !important}.mdl-color--yellow{background-color:#ffeb3b !important}.mdl-color-text--yellow-50{color:#fffde7 !important}.mdl-color--yellow-50{background-color:#fffde7 !important}.mdl-color-text--yellow-100{color:#fff9c4 !important}.mdl-color--yellow-100{background-color:#fff9c4 !important}.mdl-color-text--yellow-200{color:#fff59d !important}.mdl-color--yellow-200{background-color:#fff59d !important}.mdl-color-text--yellow-300{color:#fff176 !important}.mdl-color--yellow-300{background-color:#fff176 !important}.mdl-color-text--yellow-400{color:#ffee58 !important}.mdl-color--yellow-400{background-color:#ffee58 !important}.mdl-color-text--yellow-500{color:#ffeb3b !important}.mdl-color--yellow-500{background-color:#ffeb3b !important}.mdl-color-text--yellow-600{color:#fdd835 !important}.mdl-color--yellow-600{background-color:#fdd835 !important}.mdl-color-text--yellow-700{color:#fbc02d !important}.mdl-color--yellow-700{background-color:#fbc02d !important}.mdl-color-text--yellow-800{color:#f9a825 !important}.mdl-color--yellow-800{background-color:#f9a825 !important}.mdl-color-text--yellow-900{color:#f57f17 !important}.mdl-color--yellow-900{background-color:#f57f17 !important}.mdl-color-text--yellow-A100{color:#ffff8d !important}.mdl-color--yellow-A100{background-color:#ffff8d !important}.mdl-color-text--yellow-A200{color:#ff0 !important}.mdl-color--yellow-A200{background-color:#ff0 !important}.mdl-color-text--yellow-A400{color:#ffea00 !important}.mdl-color--yellow-A400{background-color:#ffea00 !important}.mdl-color-text--yellow-A700{color:#ffd600 !important}.mdl-color--yellow-A700{background-color:#ffd600 !important}.mdl-color-text--amber{color:#ffc107 !important}.mdl-color--amber{background-color:#ffc107 !important}.mdl-color-text--amber-50{color:#fff8e1 !important}.mdl-color--amber-50{background-color:#fff8e1 !important}.mdl-color-text--amber-100{color:#ffecb3 !important}.mdl-color--amber-100{background-color:#ffecb3 !important}.mdl-color-text--amber-200{color:#ffe082 !important}.mdl-color--amber-200{background-color:#ffe082 !important}.mdl-color-text--amber-300{color:#ffd54f !important}.mdl-color--amber-300{background-color:#ffd54f !important}.mdl-color-text--amber-400{color:#ffca28 !important}.mdl-color--amber-400{background-color:#ffca28 !important}.mdl-color-text--amber-500{color:#ffc107 !important}.mdl-color--amber-500{background-color:#ffc107 !important}.mdl-color-text--amber-600{color:#ffb300 !important}.mdl-color--amber-600{background-color:#ffb300 !important}.mdl-color-text--amber-700{color:#ffa000 !important}.mdl-color--amber-700{background-color:#ffa000 !important}.mdl-color-text--amber-800{color:#ff8f00 !important}.mdl-color--amber-800{background-color:#ff8f00 !important}.mdl-color-text--amber-900{color:#ff6f00 !important}.mdl-color--amber-900{background-color:#ff6f00 !important}.mdl-color-text--amber-A100{color:#ffe57f !important}.mdl-color--amber-A100{background-color:#ffe57f !important}.mdl-color-text--amber-A200{color:#ffd740 !important}.mdl-color--amber-A200{background-color:#ffd740 !important}.mdl-color-text--amber-A400{color:#ffc400 !important}.mdl-color--amber-A400{background-color:#ffc400 !important}.mdl-color-text--amber-A700{color:#ffab00 !important}.mdl-color--amber-A700{background-color:#ffab00 !important}.mdl-color-text--orange{color:#ff9800 !important}.mdl-color--orange{background-color:#ff9800 !important}.mdl-color-text--orange-50{color:#fff3e0 !important}.mdl-color--orange-50{background-color:#fff3e0 !important}.mdl-color-text--orange-100{color:#ffe0b2 !important}.mdl-color--orange-100{background-color:#ffe0b2 !important}.mdl-color-text--orange-200{color:#ffcc80 !important}.mdl-color--orange-200{background-color:#ffcc80 !important}.mdl-color-text--orange-300{color:#ffb74d !important}.mdl-color--orange-300{background-color:#ffb74d !important}.mdl-color-text--orange-400{color:#ffa726 !important}.mdl-color--orange-400{background-color:#ffa726 !important}.mdl-color-text--orange-500{color:#ff9800 !important}.mdl-color--orange-500{background-color:#ff9800 !important}.mdl-color-text--orange-600{color:#fb8c00 !important}.mdl-color--orange-600{background-color:#fb8c00 !important}.mdl-color-text--orange-700{color:#f57c00 !important}.mdl-color--orange-700{background-color:#f57c00 !important}.mdl-color-text--orange-800{color:#ef6c00 !important}.mdl-color--orange-800{background-color:#ef6c00 !important}.mdl-color-text--orange-900{color:#e65100 !important}.mdl-color--orange-900{background-color:#e65100 !important}.mdl-color-text--orange-A100{color:#ffd180 !important}.mdl-color--orange-A100{background-color:#ffd180 !important}.mdl-color-text--orange-A200{color:#ffab40 !important}.mdl-color--orange-A200{background-color:#ffab40 !important}.mdl-color-text--orange-A400{color:#ff9100 !important}.mdl-color--orange-A400{background-color:#ff9100 !important}.mdl-color-text--orange-A700{color:#ff6d00 !important}.mdl-color--orange-A700{background-color:#ff6d00 !important}.mdl-color-text--deep-orange{color:#ff5722 !important}.mdl-color--deep-orange{background-color:#ff5722 !important}.mdl-color-text--deep-orange-50{color:#fbe9e7 !important}.mdl-color--deep-orange-50{background-color:#fbe9e7 !important}.mdl-color-text--deep-orange-100{color:#ffccbc !important}.mdl-color--deep-orange-100{background-color:#ffccbc !important}.mdl-color-text--deep-orange-200{color:#ffab91 !important}.mdl-color--deep-orange-200{background-color:#ffab91 !important}.mdl-color-text--deep-orange-300{color:#ff8a65 !important}.mdl-color--deep-orange-300{background-color:#ff8a65 !important}.mdl-color-text--deep-orange-400{color:#ff7043 !important}.mdl-color--deep-orange-400{background-color:#ff7043 !important}.mdl-color-text--deep-orange-500{color:#ff5722 !important}.mdl-color--deep-orange-500{background-color:#ff5722 !important}.mdl-color-text--deep-orange-600{color:#f4511e !important}.mdl-color--deep-orange-600{background-color:#f4511e !important}.mdl-color-text--deep-orange-700{color:#e64a19 !important}.mdl-color--deep-orange-700{background-color:#e64a19 !important}.mdl-color-text--deep-orange-800{color:#d84315 !important}.mdl-color--deep-orange-800{background-color:#d84315 !important}.mdl-color-text--deep-orange-900{color:#bf360c !important}.mdl-color--deep-orange-900{background-color:#bf360c !important}.mdl-color-text--deep-orange-A100{color:#ff9e80 !important}.mdl-color--deep-orange-A100{background-color:#ff9e80 !important}.mdl-color-text--deep-orange-A200{color:#ff6e40 !important}.mdl-color--deep-orange-A200{background-color:#ff6e40 !important}.mdl-color-text--deep-orange-A400{color:#ff3d00 !important}.mdl-color--deep-orange-A400{background-color:#ff3d00 !important}.mdl-color-text--deep-orange-A700{color:#dd2c00 !important}.mdl-color--deep-orange-A700{background-color:#dd2c00 !important}.mdl-color-text--brown{color:#795548 !important}.mdl-color--brown{background-color:#795548 !important}.mdl-color-text--brown-50{color:#efebe9 !important}.mdl-color--brown-50{background-color:#efebe9 !important}.mdl-color-text--brown-100{color:#d7ccc8 !important}.mdl-color--brown-100{background-color:#d7ccc8 !important}.mdl-color-text--brown-200{color:#bcaaa4 !important}.mdl-color--brown-200{background-color:#bcaaa4 !important}.mdl-color-text--brown-300{color:#a1887f !important}.mdl-color--brown-300{background-color:#a1887f !important}.mdl-color-text--brown-400{color:#8d6e63 !important}.mdl-color--brown-400{background-color:#8d6e63 !important}.mdl-color-text--brown-500{color:#795548 !important}.mdl-color--brown-500{background-color:#795548 !important}.mdl-color-text--brown-600{color:#6d4c41 !important}.mdl-color--brown-600{background-color:#6d4c41 !important}.mdl-color-text--brown-700{color:#5d4037 !important}.mdl-color--brown-700{background-color:#5d4037 !important}.mdl-color-text--brown-800{color:#4e342e !important}.mdl-color--brown-800{background-color:#4e342e !important}.mdl-color-text--brown-900{color:#3e2723 !important}.mdl-color--brown-900{background-color:#3e2723 !important}.mdl-color-text--grey{color:#9e9e9e !important}.mdl-color--grey{background-color:#9e9e9e !important}.mdl-color-text--grey-50{color:#fafafa !important}.mdl-color--grey-50{background-color:#fafafa !important}.mdl-color-text--grey-100{color:#f5f5f5 !important}.mdl-color--grey-100{background-color:#f5f5f5 !important}.mdl-color-text--grey-200{color:#eee !important}.mdl-color--grey-200{background-color:#eee !important}.mdl-color-text--grey-300{color:#e0e0e0 !important}.mdl-color--grey-300{background-color:#e0e0e0 !important}.mdl-color-text--grey-400{color:#bdbdbd !important}.mdl-color--grey-400{background-color:#bdbdbd !important}.mdl-color-text--grey-500{color:#9e9e9e !important}.mdl-color--grey-500{background-color:#9e9e9e !important}.mdl-color-text--grey-600{color:#757575 !important}.mdl-color--grey-600{background-color:#757575 !important}.mdl-color-text--grey-700{color:#616161 !important}.mdl-color--grey-700{background-color:#616161 !important}.mdl-color-text--grey-800{color:#424242 !important}.mdl-color--grey-800{background-color:#424242 !important}.mdl-color-text--grey-900{color:#212121 !important}.mdl-color--grey-900{background-color:#212121 !important}.mdl-color-text--blue-grey{color:#607d8b !important}.mdl-color--blue-grey{background-color:#607d8b !important}.mdl-color-text--blue-grey-50{color:#eceff1 !important}.mdl-color--blue-grey-50{background-color:#eceff1 !important}.mdl-color-text--blue-grey-100{color:#cfd8dc !important}.mdl-color--blue-grey-100{background-color:#cfd8dc !important}.mdl-color-text--blue-grey-200{color:#b0bec5 !important}.mdl-color--blue-grey-200{background-color:#b0bec5 !important}.mdl-color-text--blue-grey-300{color:#90a4ae !important}.mdl-color--blue-grey-300{background-color:#90a4ae !important}.mdl-color-text--blue-grey-400{color:#78909c !important}.mdl-color--blue-grey-400{background-color:#78909c !important}.mdl-color-text--blue-grey-500{color:#607d8b !important}.mdl-color--blue-grey-500{background-color:#607d8b !important}.mdl-color-text--blue-grey-600{color:#546e7a !important}.mdl-color--blue-grey-600{background-color:#546e7a !important}.mdl-color-text--blue-grey-700{color:#455a64 !important}.mdl-color--blue-grey-700{background-color:#455a64 !important}.mdl-color-text--blue-grey-800{color:#37474f !important}.mdl-color--blue-grey-800{background-color:#37474f !important}.mdl-color-text--blue-grey-900{color:#263238 !important}.mdl-color--blue-grey-900{background-color:#263238 !important}.mdl-color--black{background-color:#000 !important}.mdl-color-text--black{color:#000 !important}.mdl-color--white{background-color:#fff !important}.mdl-color-text--white{color:#fff !important}.mdl-color--primary{background-color:#3f51b5 !important}.mdl-color--primary-contrast{background-color:#fff !important}.mdl-color--primary-dark{background-color:#303f9f !important}.mdl-color--accent{background-color:#ff4081 !important}.mdl-color--accent-contrast{background-color:#fff !important}.mdl-color-text--primary{color:#3f51b5 !important}.mdl-color-text--primary-contrast{color:#fff !important}.mdl-color-text--primary-dark{color:#303f9f !important}.mdl-color-text--accent{color:#ff4081 !important}.mdl-color-text--accent-contrast{color:#fff !important}.mdl-ripple{background:#000;border-radius:50%;height:50px;left:0;opacity:0;pointer-events:none;position:absolute;top:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:50px;overflow:hidden}.mdl-ripple.is-animating{transition:transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1);transition:transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1),-webkit-transform .3s cubic-bezier(0,0,.2,1)}.mdl-ripple.is-visible{opacity:.3}.mdl-animation--default,.mdl-animation--fast-out-slow-in{transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-animation--linear-out-slow-in{transition-timing-function:cubic-bezier(0,0,.2,1)}.mdl-animation--fast-out-linear-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.mdl-badge{position:relative;white-space:nowrap;margin-right:24px}.mdl-badge:not([data-badge]){margin-right:auto}.mdl-badge[data-badge]:after{content:attr(data-badge);display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;position:absolute;top:-11px;right:-24px;font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:600;font-size:12px;width:22px;height:22px;border-radius:50%;background:#ff4081;color:#fff}.mdl-button .mdl-badge[data-badge]:after{top:-10px;right:-5px}.mdl-badge.mdl-badge--no-background[data-badge]:after{color:#ff4081;background:rgba(255,255,255,.2);box-shadow:0 0 1px gray}.mdl-badge.mdl-badge--overlap{margin-right:10px}.mdl-badge.mdl-badge--overlap:after{right:-10px}.mdl-button{background:0 0;border:none;border-radius:2px;color:#000;position:relative;height:36px;margin:0;min-width:64px;padding:0 16px;display:inline-block;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:0;overflow:hidden;will-change:box-shadow;transition:box-shadow .2s cubic-bezier(.4,0,1,1),background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1);outline:none;cursor:pointer;text-decoration:none;text-align:center;line-height:36px;vertical-align:middle}.mdl-button::-moz-focus-inner{border:0}.mdl-button:hover{background-color:rgba(158,158,158,.2)}.mdl-button:focus:not(:active){background-color:rgba(0,0,0,.12)}.mdl-button:active{background-color:rgba(158,158,158,.4)}.mdl-button.mdl-button--colored{color:#3f51b5}.mdl-button.mdl-button--colored:focus:not(:active){background-color:rgba(0,0,0,.12)}input.mdl-button[type="submit"]{-webkit-appearance:none}.mdl-button--raised{background:rgba(158,158,158,.2);box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-button--raised:active{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);background-color:rgba(158,158,158,.4)}.mdl-button--raised:focus:not(:active){box-shadow:0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);background-color:rgba(158,158,158,.4)}.mdl-button--raised.mdl-button--colored{background:#3f51b5;color:#fff}.mdl-button--raised.mdl-button--colored:hover{background-color:#3f51b5}.mdl-button--raised.mdl-button--colored:active{background-color:#3f51b5}.mdl-button--raised.mdl-button--colored:focus:not(:active){background-color:#3f51b5}.mdl-button--raised.mdl-button--colored .mdl-ripple{background:#fff}.mdl-button--fab{border-radius:50%;font-size:24px;height:56px;margin:auto;min-width:56px;width:56px;padding:0;overflow:hidden;background:rgba(158,158,158,.2);box-shadow:0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);position:relative;line-height:normal}.mdl-button--fab .material-icons{position:absolute;top:50%;left:50%;-webkit-transform:translate(-12px,-12px);transform:translate(-12px,-12px);line-height:24px;width:24px}.mdl-button--fab.mdl-button--mini-fab{height:40px;min-width:40px;width:40px}.mdl-button--fab .mdl-button__ripple-container{border-radius:50%;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-button--fab:active{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);background-color:rgba(158,158,158,.4)}.mdl-button--fab:focus:not(:active){box-shadow:0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);background-color:rgba(158,158,158,.4)}.mdl-button--fab.mdl-button--colored{background:#ff4081;color:#fff}.mdl-button--fab.mdl-button--colored:hover{background-color:#ff4081}.mdl-button--fab.mdl-button--colored:focus:not(:active){background-color:#ff4081}.mdl-button--fab.mdl-button--colored:active{background-color:#ff4081}.mdl-button--fab.mdl-button--colored .mdl-ripple{background:#fff}.mdl-button--icon{border-radius:50%;font-size:24px;height:32px;margin-left:0;margin-right:0;min-width:32px;width:32px;padding:0;overflow:hidden;color:inherit;line-height:normal}.mdl-button--icon .material-icons{position:absolute;top:50%;left:50%;-webkit-transform:translate(-12px,-12px);transform:translate(-12px,-12px);line-height:24px;width:24px}.mdl-button--icon.mdl-button--mini-icon{height:24px;min-width:24px;width:24px}.mdl-button--icon.mdl-button--mini-icon .material-icons{top:0;left:0}.mdl-button--icon .mdl-button__ripple-container{border-radius:50%;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-button__ripple-container{display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:0;overflow:hidden}.mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple,.mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple{background-color:transparent}.mdl-button--primary.mdl-button--primary{color:#3f51b5}.mdl-button--primary.mdl-button--primary .mdl-ripple{background:#fff}.mdl-button--primary.mdl-button--primary.mdl-button--raised,.mdl-button--primary.mdl-button--primary.mdl-button--fab{color:#fff;background-color:#3f51b5}.mdl-button--accent.mdl-button--accent{color:#ff4081}.mdl-button--accent.mdl-button--accent .mdl-ripple{background:#fff}.mdl-button--accent.mdl-button--accent.mdl-button--raised,.mdl-button--accent.mdl-button--accent.mdl-button--fab{color:#fff;background-color:#ff4081}.mdl-button[disabled][disabled],.mdl-button.mdl-button--disabled.mdl-button--disabled{color:rgba(0,0,0,.26);cursor:default;background-color:transparent}.mdl-button--fab[disabled][disabled],.mdl-button--fab.mdl-button--disabled.mdl-button--disabled{background-color:rgba(0,0,0,.12);color:rgba(0,0,0,.26)}.mdl-button--raised[disabled][disabled],.mdl-button--raised.mdl-button--disabled.mdl-button--disabled{background-color:rgba(0,0,0,.12);color:rgba(0,0,0,.26);box-shadow:none}.mdl-button--colored[disabled][disabled],.mdl-button--colored.mdl-button--disabled.mdl-button--disabled{color:rgba(0,0,0,.26)}.mdl-button .material-icons{vertical-align:middle}.mdl-card{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;font-size:16px;font-weight:400;min-height:200px;overflow:hidden;width:330px;z-index:1;position:relative;background:#fff;border-radius:2px;box-sizing:border-box}.mdl-card__media{background-color:#ff4081;background-repeat:repeat;background-position:50% 50%;background-size:cover;background-origin:padding-box;background-attachment:scroll;box-sizing:border-box}.mdl-card__title{-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#000;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:stretch;-ms-flex-pack:stretch;justify-content:stretch;line-height:normal;padding:16px;-webkit-perspective-origin:165px 56px;perspective-origin:165px 56px;-webkit-transform-origin:165px 56px;transform-origin:165px 56px;box-sizing:border-box}.mdl-card__title.mdl-card--border{border-bottom:1px solid rgba(0,0,0,.1)}.mdl-card__title-text{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;color:inherit;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;font-size:24px;font-weight:300;line-height:normal;overflow:hidden;-webkit-transform-origin:149px 48px;transform-origin:149px 48px;margin:0}.mdl-card__subtitle-text{font-size:14px;color:rgba(0,0,0,.54);margin:0}.mdl-card__supporting-text{color:rgba(0,0,0,.54);font-size:1rem;line-height:18px;overflow:hidden;padding:16px;width:90%}.mdl-card__supporting-text.mdl-card--border{border-bottom:1px solid rgba(0,0,0,.1)}.mdl-card__actions{font-size:16px;line-height:normal;width:100%;background-color:transparent;padding:8px;box-sizing:border-box}.mdl-card__actions.mdl-card--border{border-top:1px solid rgba(0,0,0,.1)}.mdl-card--expand{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.mdl-card__menu{position:absolute;right:16px;top:16px}.mdl-checkbox{position:relative;z-index:1;vertical-align:middle;display:inline-block;box-sizing:border-box;width:100%;height:24px;margin:0;padding:0}.mdl-checkbox.is-upgraded{padding-left:24px}.mdl-checkbox__input{line-height:24px}.mdl-checkbox.is-upgraded .mdl-checkbox__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-checkbox__box-outline{position:absolute;top:3px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;margin:0;cursor:pointer;overflow:hidden;border:2px solid rgba(0,0,0,.54);border-radius:2px;z-index:2}.mdl-checkbox.is-checked .mdl-checkbox__box-outline{border:2px solid #3f51b5}fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,.mdl-checkbox.is-disabled .mdl-checkbox__box-outline{border:2px solid rgba(0,0,0,.26);cursor:auto}.mdl-checkbox__focus-helper{position:absolute;top:3px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;border-radius:50%;background-color:transparent}.mdl-checkbox.is-focused .mdl-checkbox__focus-helper{box-shadow:0 0 0 8px rgba(0,0,0,.1);background-color:rgba(0,0,0,.1)}.mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper{box-shadow:0 0 0 8px rgba(63,81,181,.26);background-color:rgba(63,81,181,.26)}.mdl-checkbox__tick-outline{position:absolute;top:0;left:0;height:100%;width:100%;-webkit-mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");background:0 0;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:background}.mdl-checkbox.is-checked .mdl-checkbox__tick-outline{background:#3f51b5 url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")}fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,.mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline{background:rgba(0,0,0,.26)url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")}.mdl-checkbox__label{position:relative;cursor:pointer;font-size:16px;line-height:24px;margin:0}fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,.mdl-checkbox.is-disabled .mdl-checkbox__label{color:rgba(0,0,0,.26);cursor:auto}.mdl-checkbox__ripple-container{position:absolute;z-index:2;top:-6px;left:-10px;box-sizing:border-box;width:36px;height:36px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-checkbox__ripple-container .mdl-ripple{background:#3f51b5}fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container,.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container{cursor:auto}fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple{background:0 0}.mdl-chip{height:32px;font-family:"Roboto","Helvetica","Arial",sans-serif;line-height:32px;padding:0 12px;border:0;border-radius:16px;background-color:#dedede;display:inline-block;color:rgba(0,0,0,.87);margin:2px 0;font-size:0;white-space:nowrap}.mdl-chip__text{font-size:13px;vertical-align:middle;display:inline-block}.mdl-chip__action{height:24px;width:24px;background:0 0;opacity:.54;cursor:pointer;padding:0;margin:0 0 0 4px;font-size:13px;text-decoration:none;color:rgba(0,0,0,.87);border:none;outline:none}.mdl-chip__action,.mdl-chip__contact{display:inline-block;vertical-align:middle;overflow:hidden;text-align:center}.mdl-chip__contact{height:32px;width:32px;border-radius:16px;margin-right:8px;font-size:18px;line-height:32px}.mdl-chip:focus{outline:0;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-chip:active{background-color:#d6d6d6}.mdl-chip--deletable{padding-right:4px}.mdl-chip--contact{padding-left:0}.mdl-data-table{position:relative;border:1px solid rgba(0,0,0,.12);border-collapse:collapse;white-space:nowrap;font-size:13px;background-color:#fff}.mdl-data-table thead{padding-bottom:3px}.mdl-data-table thead .mdl-data-table__select{margin-top:0}.mdl-data-table tbody tr{position:relative;height:48px;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:background-color}.mdl-data-table tbody tr.is-selected{background-color:#e0e0e0}.mdl-data-table tbody tr:hover{background-color:#eee}.mdl-data-table td{text-align:right}.mdl-data-table th{padding:0 18px 12px 18px;text-align:right}.mdl-data-table td:first-of-type,.mdl-data-table th:first-of-type{padding-left:24px}.mdl-data-table td:last-of-type,.mdl-data-table th:last-of-type{padding-right:24px}.mdl-data-table td{position:relative;height:48px;border-top:1px solid rgba(0,0,0,.12);border-bottom:1px solid rgba(0,0,0,.12);padding:12px 18px;box-sizing:border-box}.mdl-data-table td,.mdl-data-table td .mdl-data-table__select{vertical-align:middle}.mdl-data-table th{position:relative;vertical-align:bottom;text-overflow:ellipsis;font-weight:700;line-height:24px;letter-spacing:0;height:48px;font-size:12px;color:rgba(0,0,0,.54);padding-bottom:8px;box-sizing:border-box}.mdl-data-table th.mdl-data-table__header--sorted-ascending,.mdl-data-table th.mdl-data-table__header--sorted-descending{color:rgba(0,0,0,.87)}.mdl-data-table th.mdl-data-table__header--sorted-ascending:before,.mdl-data-table th.mdl-data-table__header--sorted-descending:before{font-family:'Material Icons';font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;word-wrap:normal;-moz-font-feature-settings:'liga';font-feature-settings:'liga';-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-size:16px;content:"\e5d8";margin-right:5px;vertical-align:sub}.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover,.mdl-data-table th.mdl-data-table__header--sorted-descending:hover{cursor:pointer}.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before,.mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before{color:rgba(0,0,0,.26)}.mdl-data-table th.mdl-data-table__header--sorted-descending:before{content:"\e5db"}.mdl-data-table__select{width:16px}.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric{text-align:left}.mdl-dialog{border:none;box-shadow:0 9px 46px 8px rgba(0,0,0,.14),0 11px 15px -7px rgba(0,0,0,.12),0 24px 38px 3px rgba(0,0,0,.2);width:280px}.mdl-dialog__title{padding:24px 24px 0;margin:0;font-size:2.5rem}.mdl-dialog__actions{padding:8px 8px 8px 24px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.mdl-dialog__actions>*{margin-right:8px;height:36px}.mdl-dialog__actions>*:first-child{margin-right:0}.mdl-dialog__actions--full-width{padding:0 0 8px}.mdl-dialog__actions--full-width>*{height:48px;-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;padding-right:16px;margin-right:0;text-align:right}.mdl-dialog__content{padding:20px 24px 24px;color:rgba(0,0,0,.54)}.mdl-mega-footer{padding:16px 40px;color:#9e9e9e;background-color:#424242}.mdl-mega-footer--top-section:after,.mdl-mega-footer--middle-section:after,.mdl-mega-footer--bottom-section:after,.mdl-mega-footer__top-section:after,.mdl-mega-footer__middle-section:after,.mdl-mega-footer__bottom-section:after{content:'';display:block;clear:both}.mdl-mega-footer--left-section,.mdl-mega-footer__left-section,.mdl-mega-footer--right-section,.mdl-mega-footer__right-section{margin-bottom:16px}.mdl-mega-footer--right-section a,.mdl-mega-footer__right-section a{display:block;margin-bottom:16px;color:inherit;text-decoration:none}@media screen and (min-width:760px){.mdl-mega-footer--left-section,.mdl-mega-footer__left-section{float:left}.mdl-mega-footer--right-section,.mdl-mega-footer__right-section{float:right}.mdl-mega-footer--right-section a,.mdl-mega-footer__right-section a{display:inline-block;margin-left:16px;line-height:36px;vertical-align:middle}}.mdl-mega-footer--social-btn,.mdl-mega-footer__social-btn{width:36px;height:36px;padding:0;margin:0;background-color:#9e9e9e;border:none}.mdl-mega-footer--drop-down-section,.mdl-mega-footer__drop-down-section{display:block;position:relative}@media screen and (min-width:760px){.mdl-mega-footer--drop-down-section,.mdl-mega-footer__drop-down-section{width:33%}.mdl-mega-footer--drop-down-section:nth-child(1),.mdl-mega-footer--drop-down-section:nth-child(2),.mdl-mega-footer__drop-down-section:nth-child(1),.mdl-mega-footer__drop-down-section:nth-child(2){float:left}.mdl-mega-footer--drop-down-section:nth-child(3),.mdl-mega-footer__drop-down-section:nth-child(3){float:right}.mdl-mega-footer--drop-down-section:nth-child(3):after,.mdl-mega-footer__drop-down-section:nth-child(3):after{clear:right}.mdl-mega-footer--drop-down-section:nth-child(4),.mdl-mega-footer__drop-down-section:nth-child(4){clear:right;float:right}.mdl-mega-footer--middle-section:after,.mdl-mega-footer__middle-section:after{content:'';display:block;clear:both}.mdl-mega-footer--bottom-section,.mdl-mega-footer__bottom-section{padding-top:0}}@media screen and (min-width:1024px){.mdl-mega-footer--drop-down-section,.mdl-mega-footer--drop-down-section:nth-child(3),.mdl-mega-footer--drop-down-section:nth-child(4),.mdl-mega-footer__drop-down-section,.mdl-mega-footer__drop-down-section:nth-child(3),.mdl-mega-footer__drop-down-section:nth-child(4){width:24%;float:left}}.mdl-mega-footer--heading-checkbox,.mdl-mega-footer__heading-checkbox{position:absolute;width:100%;height:55.8px;padding:32px;margin:-16px 0 0;cursor:pointer;z-index:1;opacity:0}.mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after{font-family:'Material Icons';content:'\E5CE'}.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list{display:none}.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after{font-family:'Material Icons';content:'\E5CF'}.mdl-mega-footer--heading,.mdl-mega-footer__heading{position:relative;width:100%;padding-right:39.8px;margin-bottom:16px;box-sizing:border-box;font-size:14px;line-height:23.8px;font-weight:500;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#e0e0e0}.mdl-mega-footer--heading:after,.mdl-mega-footer__heading:after{content:'';position:absolute;top:0;right:0;display:block;width:23.8px;height:23.8px;background-size:cover}.mdl-mega-footer--link-list,.mdl-mega-footer__link-list{list-style:none;padding:0;margin:0 0 32px}.mdl-mega-footer--link-list:after,.mdl-mega-footer__link-list:after{clear:both;display:block;content:''}.mdl-mega-footer--link-list li,.mdl-mega-footer__link-list li{font-size:14px;font-weight:400;letter-spacing:0;line-height:20px}.mdl-mega-footer--link-list a,.mdl-mega-footer__link-list a{color:inherit;text-decoration:none;white-space:nowrap}@media screen and (min-width:760px){.mdl-mega-footer--heading-checkbox,.mdl-mega-footer__heading-checkbox{display:none}.mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after{content:''}.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list{display:block}.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after{content:''}}.mdl-mega-footer--bottom-section,.mdl-mega-footer__bottom-section{padding-top:16px;margin-bottom:16px}.mdl-logo{margin-bottom:16px;color:#fff}.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li,.mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li{float:left;margin-bottom:0;margin-right:16px}@media screen and (min-width:760px){.mdl-logo{float:left;margin-bottom:0;margin-right:16px}}.mdl-mini-footer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:32px 16px;color:#9e9e9e;background-color:#424242}.mdl-mini-footer:after{content:'';display:block}.mdl-mini-footer .mdl-logo{line-height:36px}.mdl-mini-footer--link-list,.mdl-mini-footer__link-list{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;list-style:none;margin:0;padding:0}.mdl-mini-footer--link-list li,.mdl-mini-footer__link-list li{margin-bottom:0;margin-right:16px}@media screen and (min-width:760px){.mdl-mini-footer--link-list li,.mdl-mini-footer__link-list li{line-height:36px}}.mdl-mini-footer--link-list a,.mdl-mini-footer__link-list a{color:inherit;text-decoration:none;white-space:nowrap}.mdl-mini-footer--left-section,.mdl-mini-footer__left-section{display:inline-block;-webkit-order:0;-ms-flex-order:0;order:0}.mdl-mini-footer--right-section,.mdl-mini-footer__right-section{display:inline-block;-webkit-order:1;-ms-flex-order:1;order:1}.mdl-mini-footer--social-btn,.mdl-mini-footer__social-btn{width:36px;height:36px;padding:0;margin:0;background-color:#9e9e9e;border:none}.mdl-icon-toggle{position:relative;z-index:1;vertical-align:middle;display:inline-block;height:32px;margin:0;padding:0}.mdl-icon-toggle__input{line-height:32px}.mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-icon-toggle__label{display:inline-block;position:relative;cursor:pointer;height:32px;width:32px;min-width:32px;color:#616161;border-radius:50%;padding:0;margin-left:0;margin-right:0;text-align:center;background-color:transparent;will-change:background-color;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.mdl-icon-toggle__label.material-icons{line-height:32px;font-size:24px}.mdl-icon-toggle.is-checked .mdl-icon-toggle__label{color:#3f51b5}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__label{color:rgba(0,0,0,.26);cursor:auto;transition:none}.mdl-icon-toggle.is-focused .mdl-icon-toggle__label{background-color:rgba(0,0,0,.12)}.mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label{background-color:rgba(63,81,181,.26)}.mdl-icon-toggle__ripple-container{position:absolute;z-index:2;top:-2px;left:-2px;box-sizing:border-box;width:36px;height:36px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-icon-toggle__ripple-container .mdl-ripple{background:#616161}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container{cursor:auto}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple{background:0 0}.mdl-list{display:block;padding:8px 0;list-style:none}.mdl-list__item{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:16px;font-weight:400;letter-spacing:.04em;line-height:1;min-height:48px;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;padding:16px;cursor:default;color:rgba(0,0,0,.87);overflow:hidden}.mdl-list__item,.mdl-list__item .mdl-list__item-primary-content{box-sizing:border-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.mdl-list__item .mdl-list__item-primary-content{-webkit-order:0;-ms-flex-order:0;order:0;-webkit-flex-grow:2;-ms-flex-positive:2;flex-grow:2;text-decoration:none}.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon{margin-right:32px}.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar{margin-right:16px}.mdl-list__item .mdl-list__item-secondary-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:column;-ms-flex-flow:column;flex-flow:column;-webkit-align-items:flex-end;-ms-flex-align:end;align-items:flex-end;margin-left:16px}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label{display:inline}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info{font-size:12px;font-weight:400;line-height:1;letter-spacing:0;color:rgba(0,0,0,.54)}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header{padding:0 0 0 16px}.mdl-list__item-icon,.mdl-list__item-icon.material-icons{height:24px;width:24px;font-size:24px;box-sizing:border-box;color:#757575}.mdl-list__item-avatar,.mdl-list__item-avatar.material-icons{height:40px;width:40px;box-sizing:border-box;border-radius:50%;background-color:#757575;font-size:40px;color:#fff}.mdl-list__item--two-line{height:72px}.mdl-list__item--two-line .mdl-list__item-primary-content{height:36px;line-height:20px;display:block}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar{float:left}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon{float:left;margin-top:6px}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content{height:36px}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title{font-size:14px;font-weight:400;letter-spacing:0;line-height:18px;color:rgba(0,0,0,.54);display:block;padding:0}.mdl-list__item--three-line{height:88px}.mdl-list__item--three-line .mdl-list__item-primary-content{height:52px;line-height:20px;display:block}.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar,.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon{float:left}.mdl-list__item--three-line .mdl-list__item-secondary-content{height:52px}.mdl-list__item--three-line .mdl-list__item-text-body{font-size:14px;font-weight:400;letter-spacing:0;line-height:18px;height:52px;color:rgba(0,0,0,.54);display:block;padding:0}.mdl-menu__container{display:block;margin:0;padding:0;border:none;position:absolute;overflow:visible;height:0;width:0;visibility:hidden;z-index:-1}.mdl-menu__container.is-visible,.mdl-menu__container.is-animating{z-index:999;visibility:visible}.mdl-menu__outline{display:block;background:#fff;margin:0;padding:0;border:none;border-radius:2px;position:absolute;top:0;left:0;overflow:hidden;opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:0 0;transform-origin:0 0;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);will-change:transform;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);z-index:-1}.mdl-menu__container.is-visible .mdl-menu__outline{opacity:1;-webkit-transform:scale(1);transform:scale(1);z-index:999}.mdl-menu__outline.mdl-menu--bottom-right{-webkit-transform-origin:100% 0;transform-origin:100% 0}.mdl-menu__outline.mdl-menu--top-left{-webkit-transform-origin:0 100%;transform-origin:0 100%}.mdl-menu__outline.mdl-menu--top-right{-webkit-transform-origin:100% 100%;transform-origin:100% 100%}.mdl-menu{position:absolute;list-style:none;top:0;left:0;height:auto;width:auto;min-width:124px;padding:8px 0;margin:0;opacity:0;clip:rect(0 0 0 0);z-index:-1}.mdl-menu__container.is-visible .mdl-menu{opacity:1;z-index:999}.mdl-menu.is-animating{transition:opacity .2s cubic-bezier(.4,0,.2,1),clip .3s cubic-bezier(.4,0,.2,1)}.mdl-menu.mdl-menu--bottom-right{left:auto;right:0}.mdl-menu.mdl-menu--top-left{top:auto;bottom:0}.mdl-menu.mdl-menu--top-right{top:auto;left:auto;bottom:0;right:0}.mdl-menu.mdl-menu--unaligned{top:auto;left:auto}.mdl-menu__item{display:block;border:none;color:rgba(0,0,0,.87);background-color:transparent;text-align:left;margin:0;padding:0 16px;outline-color:#bdbdbd;position:relative;overflow:hidden;font-size:14px;font-weight:400;letter-spacing:0;text-decoration:none;cursor:pointer;height:48px;line-height:48px;white-space:nowrap;opacity:0;transition:opacity .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-menu__container.is-visible .mdl-menu__item{opacity:1}.mdl-menu__item::-moz-focus-inner{border:0}.mdl-menu__item--full-bleed-divider{border-bottom:1px solid rgba(0,0,0,.12)}.mdl-menu__item[disabled],.mdl-menu__item[data-mdl-disabled]{color:#bdbdbd;background-color:transparent;cursor:auto}.mdl-menu__item[disabled]:hover,.mdl-menu__item[data-mdl-disabled]:hover{background-color:transparent}.mdl-menu__item[disabled]:focus,.mdl-menu__item[data-mdl-disabled]:focus{background-color:transparent}.mdl-menu__item[disabled] .mdl-ripple,.mdl-menu__item[data-mdl-disabled] .mdl-ripple{background:0 0}.mdl-menu__item:hover{background-color:#eee}.mdl-menu__item:focus{outline:none;background-color:#eee}.mdl-menu__item:active{background-color:#e0e0e0}.mdl-menu__item--ripple-container{display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:0;overflow:hidden}.mdl-progress{display:block;position:relative;height:4px;width:500px;max-width:100%}.mdl-progress>.bar{display:block;position:absolute;top:0;bottom:0;width:0%;transition:width .2s cubic-bezier(.4,0,.2,1)}.mdl-progress>.progressbar{background-color:#3f51b5;z-index:1;left:0}.mdl-progress>.bufferbar{background-image:linear-gradient(to right,rgba(255,255,255,.7),rgba(255,255,255,.7)),linear-gradient(to right,#3f51b5 ,#3f51b5);z-index:0;left:0}.mdl-progress>.auxbar{right:0}@supports (-webkit-appearance:none){.mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate)>.auxbar,.mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate)>.auxbar{background-image:linear-gradient(to right,rgba(255,255,255,.7),rgba(255,255,255,.7)),linear-gradient(to right,#3f51b5 ,#3f51b5);-webkit-mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=")}}.mdl-progress:not(.mdl-progress--indeterminate)>.auxbar,.mdl-progress:not(.mdl-progress__indeterminate)>.auxbar{background-image:linear-gradient(to right,rgba(255,255,255,.9),rgba(255,255,255,.9)),linear-gradient(to right,#3f51b5 ,#3f51b5)}.mdl-progress.mdl-progress--indeterminate>.bar1,.mdl-progress.mdl-progress__indeterminate>.bar1{-webkit-animation-name:indeterminate1;animation-name:indeterminate1}.mdl-progress.mdl-progress--indeterminate>.bar1,.mdl-progress.mdl-progress__indeterminate>.bar1,.mdl-progress.mdl-progress--indeterminate>.bar3,.mdl-progress.mdl-progress__indeterminate>.bar3{background-color:#3f51b5;-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear}.mdl-progress.mdl-progress--indeterminate>.bar3,.mdl-progress.mdl-progress__indeterminate>.bar3{background-image:none;-webkit-animation-name:indeterminate2;animation-name:indeterminate2}@-webkit-keyframes indeterminate1{0%{left:0%;width:0%}50%{left:25%;width:75%}75%{left:100%;width:0%}}@keyframes indeterminate1{0%{left:0%;width:0%}50%{left:25%;width:75%}75%{left:100%;width:0%}}@-webkit-keyframes indeterminate2{0%,50%{left:0%;width:0%}75%{left:0%;width:25%}100%{left:100%;width:0%}}@keyframes indeterminate2{0%,50%{left:0%;width:0%}75%{left:0%;width:25%}100%{left:100%;width:0%}}.mdl-navigation{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;box-sizing:border-box}.mdl-navigation__link{color:#424242;text-decoration:none;margin:0;font-size:14px;font-weight:400;line-height:24px;letter-spacing:0;opacity:.87}.mdl-navigation__link .material-icons{vertical-align:middle}.mdl-layout{width:100%;height:100%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow-y:auto;overflow-x:hidden;position:relative;-webkit-overflow-scrolling:touch}.mdl-layout.is-small-screen .mdl-layout--large-screen-only{display:none}.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only{display:none}.mdl-layout__container{position:absolute;width:100%;height:100%}.mdl-layout__title,.mdl-layout-title{display:block;position:relative;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:20px;line-height:1;letter-spacing:.02em;font-weight:400;box-sizing:border-box}.mdl-layout-spacer{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.mdl-layout__drawer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:240px;height:100%;max-height:100%;position:absolute;top:0;left:0;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);box-sizing:border-box;border-right:1px solid #e0e0e0;background:#fafafa;-webkit-transform:translateX(-250px);transform:translateX(-250px);-webkit-transform-style:preserve-3d;transform-style:preserve-3d;will-change:transform;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:transform;transition-property:transform,-webkit-transform;color:#424242;overflow:visible;overflow-y:auto;z-index:5}.mdl-layout__drawer.is-visible{-webkit-transform:translateX(0);transform:translateX(0)}.mdl-layout__drawer.is-visible~.mdl-layout__content.mdl-layout__content{overflow:hidden}.mdl-layout__drawer>*{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}.mdl-layout__drawer>.mdl-layout__title,.mdl-layout__drawer>.mdl-layout-title{line-height:64px;padding-left:40px}@media screen and (max-width:1024px){.mdl-layout__drawer>.mdl-layout__title,.mdl-layout__drawer>.mdl-layout-title{line-height:56px;padding-left:16px}}.mdl-layout__drawer .mdl-navigation{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch;padding-top:16px}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link{display:block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;padding:16px 40px;margin:0;color:#757575}@media screen and (max-width:1024px){.mdl-layout__drawer .mdl-navigation .mdl-navigation__link{padding:16px}}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover{background-color:#e0e0e0}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current{background-color:#e0e0e0;color:#000}@media screen and (min-width:1025px){.mdl-layout--fixed-drawer>.mdl-layout__drawer{-webkit-transform:translateX(0);transform:translateX(0)}}.mdl-layout__drawer-button{display:block;position:absolute;height:48px;width:48px;border:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;overflow:hidden;text-align:center;cursor:pointer;font-size:26px;line-height:56px;font-family:Helvetica,Arial,sans-serif;margin:8px 12px;top:0;left:0;color:#fff;z-index:4}.mdl-layout__header .mdl-layout__drawer-button{position:absolute;color:#fff;background-color:inherit}@media screen and (max-width:1024px){.mdl-layout__header .mdl-layout__drawer-button{margin:4px}}@media screen and (max-width:1024px){.mdl-layout__drawer-button{margin:4px;color:rgba(0,0,0,.5)}}@media screen and (min-width:1025px){.mdl-layout__drawer-button{line-height:54px}.mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button,.mdl-layout--fixed-drawer>.mdl-layout__drawer-button,.mdl-layout--no-drawer-button .mdl-layout__drawer-button{display:none}}.mdl-layout__header{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;box-sizing:border-box;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;margin:0;padding:0;border:none;min-height:64px;max-height:1000px;z-index:3;background-color:#3f51b5;color:#fff;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:max-height,box-shadow}@media screen and (max-width:1024px){.mdl-layout__header{min-height:56px}}.mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen)>.mdl-layout__header{margin-left:240px;width:calc(100% - 240px)}@media screen and (min-width:1025px){.mdl-layout--fixed-drawer>.mdl-layout__header .mdl-layout__header-row{padding-left:40px}}.mdl-layout__header>.mdl-layout-icon{position:absolute;left:40px;top:16px;height:32px;width:32px;overflow:hidden;z-index:3;display:block}@media screen and (max-width:1024px){.mdl-layout__header>.mdl-layout-icon{left:16px;top:12px}}.mdl-layout.has-drawer .mdl-layout__header>.mdl-layout-icon{display:none}.mdl-layout__header.is-compact{max-height:64px}@media screen and (max-width:1024px){.mdl-layout__header.is-compact{max-height:56px}}.mdl-layout__header.is-compact.has-tabs{height:112px}@media screen and (max-width:1024px){.mdl-layout__header.is-compact.has-tabs{min-height:104px}}@media screen and (max-width:1024px){.mdl-layout__header{display:none}.mdl-layout--fixed-header>.mdl-layout__header{display:-webkit-flex;display:-ms-flexbox;display:flex}}.mdl-layout__header--transparent.mdl-layout__header--transparent{background-color:transparent;box-shadow:none}.mdl-layout__header--seamed,.mdl-layout__header--scroll{box-shadow:none}.mdl-layout__header--waterfall{box-shadow:none;overflow:hidden}.mdl-layout__header--waterfall.is-casting-shadow{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top{-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.mdl-layout__header-row{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;box-sizing:border-box;-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:64px;margin:0;padding:0 40px 0 80px}.mdl-layout--no-drawer-button .mdl-layout__header-row{padding-left:40px}@media screen and (min-width:1025px){.mdl-layout--no-desktop-drawer-button .mdl-layout__header-row{padding-left:40px}}@media screen and (max-width:1024px){.mdl-layout__header-row{height:56px;padding:0 16px 0 72px}.mdl-layout--no-drawer-button .mdl-layout__header-row{padding-left:16px}}.mdl-layout__header-row>*{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}.mdl-layout__header--scroll .mdl-layout__header-row{width:100%}.mdl-layout__header-row .mdl-navigation{margin:0;padding:0;height:64px;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:1024px){.mdl-layout__header-row .mdl-navigation{height:56px}}.mdl-layout__header-row .mdl-navigation__link{display:block;color:black;line-height:64px;padding:0 24px}@media screen and (max-width:1024px){.mdl-layout__header-row .mdl-navigation__link{line-height:56px;padding:0 16px}}.mdl-layout__obfuscator{background-color:transparent;position:absolute;top:0;left:0;height:100%;width:100%;z-index:4;visibility:hidden;transition-property:background-color;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-layout__obfuscator.is-visible{background-color:rgba(0,0,0,.5);visibility:visible}@supports (pointer-events:auto){.mdl-layout__obfuscator{background-color:rgba(0,0,0,.5);opacity:0;transition-property:opacity;visibility:visible;pointer-events:none}.mdl-layout__obfuscator.is-visible{pointer-events:auto;opacity:1}}.mdl-layout__content{-ms-flex:0 1 auto;position:relative;display:inline-block;overflow-y:auto;overflow-x:hidden;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;z-index:1;-webkit-overflow-scrolling:touch}.mdl-layout--fixed-drawer>.mdl-layout__content{margin-left:240px}.mdl-layout__container.has-scrolling-header .mdl-layout__content{overflow:visible}@media screen and (max-width:1024px){.mdl-layout--fixed-drawer>.mdl-layout__content{margin-left:0}.mdl-layout__container.has-scrolling-header .mdl-layout__content{overflow-y:auto;overflow-x:hidden}}.mdl-layout__tab-bar{height:96px;margin:0;width:calc(100% - 112px);padding:0 0 0 56px;display:-webkit-flex;display:-ms-flexbox;display:flex;background-color:#3f51b5;overflow-y:hidden;overflow-x:scroll}.mdl-layout__tab-bar::-webkit-scrollbar{display:none}.mdl-layout--no-drawer-button .mdl-layout__tab-bar{padding-left:16px;width:calc(100% - 32px)}@media screen and (min-width:1025px){.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar{padding-left:16px;width:calc(100% - 32px)}}@media screen and (max-width:1024px){.mdl-layout__tab-bar{width:calc(100% - 60px);padding:0 0 0 60px}.mdl-layout--no-drawer-button .mdl-layout__tab-bar{width:calc(100% - 8px);padding-left:4px}}.mdl-layout--fixed-tabs .mdl-layout__tab-bar{padding:0;overflow:hidden;width:100%}.mdl-layout__tab-bar-container{position:relative;height:48px;width:100%;border:none;margin:0;z-index:2;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.mdl-layout__container>.mdl-layout__tab-bar-container{position:absolute;top:0;left:0}.mdl-layout__tab-bar-button{display:inline-block;position:absolute;top:0;height:48px;width:56px;z-index:4;text-align:center;background-color:#3f51b5;color:transparent;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button,.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button{width:16px}.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons,.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons{position:relative;left:-4px}@media screen and (max-width:1024px){.mdl-layout__tab-bar-button{width:60px}}.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button{display:none}.mdl-layout__tab-bar-button .material-icons{line-height:48px}.mdl-layout__tab-bar-button.is-active{color:#fff}.mdl-layout__tab-bar-left-button{left:0}.mdl-layout__tab-bar-right-button{right:0}.mdl-layout__tab{margin:0;border:none;padding:0 24px;float:left;position:relative;display:block;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;text-decoration:none;height:48px;line-height:48px;text-align:center;font-weight:500;font-size:14px;text-transform:uppercase;color:rgba(255,255,255,.6);overflow:hidden}@media screen and (max-width:1024px){.mdl-layout__tab{padding:0 12px}}.mdl-layout--fixed-tabs .mdl-layout__tab{float:none;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:0}.mdl-layout.is-upgraded .mdl-layout__tab.is-active{color:#fff}.mdl-layout.is-upgraded .mdl-layout__tab.is-active::after{height:2px;width:100%;display:block;content:" ";bottom:0;left:0;position:absolute;background:#ff4081;-webkit-animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;transition:all 1s cubic-bezier(.4,0,1,1)}.mdl-layout__tab .mdl-layout__tab-ripple-container{display:block;position:absolute;height:100%;width:100%;left:0;top:0;z-index:1;overflow:hidden}.mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple{background-color:#fff}.mdl-layout__tab-panel{display:block}.mdl-layout.is-upgraded .mdl-layout__tab-panel{display:none}.mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active{display:block}.mdl-radio{position:relative;font-size:16px;line-height:24px;display:inline-block;vertical-align:middle;box-sizing:border-box;height:24px;margin:0;padding-left:0}.mdl-radio.is-upgraded{padding-left:24px}.mdl-radio__button{line-height:24px}.mdl-radio.is-upgraded .mdl-radio__button{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-radio__outer-circle{position:absolute;top:4px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;margin:0;cursor:pointer;border:2px solid rgba(0,0,0,.54);border-radius:50%;z-index:2}.mdl-radio.is-checked .mdl-radio__outer-circle{border:2px solid #3f51b5}.mdl-radio__outer-circle fieldset[disabled] .mdl-radio,.mdl-radio.is-disabled .mdl-radio__outer-circle{border:2px solid rgba(0,0,0,.26);cursor:auto}.mdl-radio__inner-circle{position:absolute;z-index:1;margin:0;top:8px;left:4px;box-sizing:border-box;width:8px;height:8px;cursor:pointer;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transform:scale(0,0);transform:scale(0,0);border-radius:50%;background:#3f51b5}.mdl-radio.is-checked .mdl-radio__inner-circle{-webkit-transform:scale(1,1);transform:scale(1,1)}fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,.mdl-radio.is-disabled .mdl-radio__inner-circle{background:rgba(0,0,0,.26);cursor:auto}.mdl-radio.is-focused .mdl-radio__inner-circle{box-shadow:0 0 0 10px rgba(0,0,0,.1)}.mdl-radio__label{cursor:pointer}fieldset[disabled] .mdl-radio .mdl-radio__label,.mdl-radio.is-disabled .mdl-radio__label{color:rgba(0,0,0,.26);cursor:auto}.mdl-radio__ripple-container{position:absolute;z-index:2;top:-9px;left:-13px;box-sizing:border-box;width:42px;height:42px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-radio__ripple-container .mdl-ripple{background:#3f51b5}fieldset[disabled] .mdl-radio .mdl-radio__ripple-container,.mdl-radio.is-disabled .mdl-radio__ripple-container{cursor:auto}fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,.mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple{background:0 0}_:-ms-input-placeholder,:root .mdl-slider.mdl-slider.is-upgraded{-ms-appearance:none;height:32px;margin:0}.mdl-slider{width:calc(100% - 40px);margin:0 20px}.mdl-slider.is-upgraded{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:2px;background:0 0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:0;padding:0;color:#3f51b5;-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;z-index:1;cursor:pointer}.mdl-slider.is-upgraded::-moz-focus-outer{border:0}.mdl-slider.is-upgraded::-ms-tooltip{display:none}.mdl-slider.is-upgraded::-webkit-slider-runnable-track{background:0 0}.mdl-slider.is-upgraded::-moz-range-track{background:0 0;border:none}.mdl-slider.is-upgraded::-ms-track{background:0 0;color:transparent;height:2px;width:100%;border:none}.mdl-slider.is-upgraded::-ms-fill-lower{padding:0;background:linear-gradient(to right,transparent,transparent 16px,#3f51b5 16px,#3f51b5 0)}.mdl-slider.is-upgraded::-ms-fill-upper{padding:0;background:linear-gradient(to left,transparent,transparent 16px,rgba(0,0,0,.26)16px,rgba(0,0,0,.26)0)}.mdl-slider.is-upgraded::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;box-sizing:border-box;border-radius:50%;background:#3f51b5;border:none;transition:transform .18s cubic-bezier(.4,0,.2,1),border .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1);transition:transform .18s cubic-bezier(.4,0,.2,1),border .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1),-webkit-transform .18s cubic-bezier(.4,0,.2,1)}.mdl-slider.is-upgraded::-moz-range-thumb{-moz-appearance:none;width:12px;height:12px;box-sizing:border-box;border-radius:50%;background-image:none;background:#3f51b5;border:none}.mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb{box-shadow:0 0 0 10px rgba(63,81,181,.26)}.mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb{box-shadow:0 0 0 10px rgba(63,81,181,.26)}.mdl-slider.is-upgraded:active::-webkit-slider-thumb{background-image:none;background:#3f51b5;-webkit-transform:scale(1.5);transform:scale(1.5)}.mdl-slider.is-upgraded:active::-moz-range-thumb{background-image:none;background:#3f51b5;transform:scale(1.5)}.mdl-slider.is-upgraded::-ms-thumb{width:32px;height:32px;border:none;border-radius:50%;background:#3f51b5;transform:scale(.375);transition:transform .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1);transition:transform .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1),-webkit-transform .18s cubic-bezier(.4,0,.2,1)}.mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb{background:radial-gradient(circle closest-side,#3f51b5 0%,#3f51b5 37.5%,rgba(63,81,181,.26)37.5%,rgba(63,81,181,.26)100%);transform:scale(1)}.mdl-slider.is-upgraded:active::-ms-thumb{background:#3f51b5;transform:scale(.5625)}.mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb{border:2px solid rgba(0,0,0,.26);background:0 0}.mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb{border:2px solid rgba(0,0,0,.26);background:0 0}.mdl-slider.is-upgraded.is-lowest-value+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb{box-shadow:0 0 0 10px rgba(0,0,0,.12);background:rgba(0,0,0,.12)}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb{box-shadow:0 0 0 10px rgba(0,0,0,.12);background:rgba(0,0,0,.12)}.mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb{border:1.6px solid rgba(0,0,0,.26);-webkit-transform:scale(1.5);transform:scale(1.5)}.mdl-slider.is-upgraded.is-lowest-value:active+.mdl-slider__background-flex>.mdl-slider__background-upper{left:9px}.mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb{border:1.5px solid rgba(0,0,0,.26);transform:scale(1.5)}.mdl-slider.is-upgraded.is-lowest-value::-ms-thumb{background:radial-gradient(circle closest-side,transparent 0%,transparent 66.67%,rgba(0,0,0,.26)66.67%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb{background:radial-gradient(circle closest-side,rgba(0,0,0,.12)0%,rgba(0,0,0,.12)25%,rgba(0,0,0,.26)25%,rgba(0,0,0,.26)37.5%,rgba(0,0,0,.12)37.5%,rgba(0,0,0,.12)100%);transform:scale(1)}.mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb{transform:scale(.5625);background:radial-gradient(circle closest-side,transparent 0%,transparent 77.78%,rgba(0,0,0,.26)77.78%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower{background:0 0}.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper{margin-left:6px}.mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper{margin-left:9px}.mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,.mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,.mdl-slider.is-upgraded:disabled::-webkit-slider-thumb{-webkit-transform:scale(.667);transform:scale(.667);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,.mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,.mdl-slider.is-upgraded:disabled::-moz-range-thumb{transform:scale(.667);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-lower{background-color:rgba(0,0,0,.26);left:-6px}.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb{border:3px solid rgba(0,0,0,.26);background:0 0;-webkit-transform:scale(.667);transform:scale(.667)}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb{border:3px solid rgba(0,0,0,.26);background:0 0;transform:scale(.667)}.mdl-slider.is-upgraded.is-lowest-value:disabled:active+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded:disabled:focus::-ms-thumb,.mdl-slider.is-upgraded:disabled:active::-ms-thumb,.mdl-slider.is-upgraded:disabled::-ms-thumb{transform:scale(.25);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb{transform:scale(.25);background:radial-gradient(circle closest-side,transparent 0%,transparent 50%,rgba(0,0,0,.26)50%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded:disabled::-ms-fill-lower{margin-right:6px;background:linear-gradient(to right,transparent,transparent 25px,rgba(0,0,0,.26)25px,rgba(0,0,0,.26)0)}.mdl-slider.is-upgraded:disabled::-ms-fill-upper{margin-left:6px}.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper{margin-left:6px}.mdl-slider__ie-container{height:18px;overflow:visible;border:none;margin:none;padding:none}.mdl-slider__container{height:18px;position:relative;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}.mdl-slider__container,.mdl-slider__background-flex{background:0 0;display:-webkit-flex;display:-ms-flexbox;display:flex}.mdl-slider__background-flex{position:absolute;height:2px;width:calc(100% - 52px);top:50%;left:0;margin:0 26px;overflow:hidden;border:0;padding:0;-webkit-transform:translate(0,-1px);transform:translate(0,-1px)}.mdl-slider__background-lower{background:#3f51b5}.mdl-slider__background-lower,.mdl-slider__background-upper{-webkit-flex:0;-ms-flex:0;flex:0;position:relative;border:0;padding:0}.mdl-slider__background-upper{background:rgba(0,0,0,.26);transition:left .18s cubic-bezier(.4,0,.2,1)}.mdl-snackbar{position:fixed;bottom:0;left:50%;cursor:default;background-color:#323232;z-index:3;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;font-family:"Roboto","Helvetica","Arial",sans-serif;will-change:transform;-webkit-transform:translate(0,80px);transform:translate(0,80px);transition:transform .25s cubic-bezier(.4,0,1,1);transition:transform .25s cubic-bezier(.4,0,1,1),-webkit-transform .25s cubic-bezier(.4,0,1,1);pointer-events:none}@media (max-width:479px){.mdl-snackbar{width:100%;left:0;min-height:48px;max-height:80px}}@media (min-width:480px){.mdl-snackbar{min-width:288px;max-width:568px;border-radius:2px;-webkit-transform:translate(-50%,80px);transform:translate(-50%,80px)}}.mdl-snackbar--active{-webkit-transform:translate(0,0);transform:translate(0,0);pointer-events:auto;transition:transform .25s cubic-bezier(0,0,.2,1);transition:transform .25s cubic-bezier(0,0,.2,1),-webkit-transform .25s cubic-bezier(0,0,.2,1)}@media (min-width:480px){.mdl-snackbar--active{-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}}.mdl-snackbar__text{padding:14px 12px 14px 24px;vertical-align:middle;color:#fff;float:left}.mdl-snackbar__action{background:0 0;border:none;color:#ff4081;float:right;padding:14px 24px 14px 12px;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;line-height:1;letter-spacing:0;overflow:hidden;outline:none;opacity:0;pointer-events:none;cursor:pointer;text-decoration:none;text-align:center;-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.mdl-snackbar__action::-moz-focus-inner{border:0}.mdl-snackbar__action:not([aria-hidden]){opacity:1;pointer-events:auto}.mdl-spinner{display:inline-block;position:relative;width:28px;height:28px}.mdl-spinner:not(.is-upgraded).is-active:after{content:"Loading..."}.mdl-spinner.is-upgraded.is-active{-webkit-animation:mdl-spinner__container-rotate 1568.23529412ms linear infinite;animation:mdl-spinner__container-rotate 1568.23529412ms linear infinite}@-webkit-keyframes mdl-spinner__container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes mdl-spinner__container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.mdl-spinner__layer{position:absolute;width:100%;height:100%;opacity:0}.mdl-spinner__layer-1{border-color:#42a5f5}.mdl-spinner--single-color .mdl-spinner__layer-1{border-color:#3f51b5}.mdl-spinner.is-active .mdl-spinner__layer-1{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-2{border-color:#f44336}.mdl-spinner--single-color .mdl-spinner__layer-2{border-color:#3f51b5}.mdl-spinner.is-active .mdl-spinner__layer-2{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-3{border-color:#fdd835}.mdl-spinner--single-color .mdl-spinner__layer-3{border-color:#3f51b5}.mdl-spinner.is-active .mdl-spinner__layer-3{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-4{border-color:#4caf50}.mdl-spinner--single-color .mdl-spinner__layer-4{border-color:#3f51b5}.mdl-spinner.is-active .mdl-spinner__layer-4{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}@-webkit-keyframes mdl-spinner__fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes mdl-spinner__fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes mdl-spinner__layer-1-fade-in-out{from,25%{opacity:.99}26%,89%{opacity:0}90%,100%{opacity:.99}}@keyframes mdl-spinner__layer-1-fade-in-out{from,25%{opacity:.99}26%,89%{opacity:0}90%,100%{opacity:.99}}@-webkit-keyframes mdl-spinner__layer-2-fade-in-out{from,15%{opacity:0}25%,50%{opacity:.99}51%{opacity:0}}@keyframes mdl-spinner__layer-2-fade-in-out{from,15%{opacity:0}25%,50%{opacity:.99}51%{opacity:0}}@-webkit-keyframes mdl-spinner__layer-3-fade-in-out{from,40%{opacity:0}50%,75%{opacity:.99}76%{opacity:0}}@keyframes mdl-spinner__layer-3-fade-in-out{from,40%{opacity:0}50%,75%{opacity:.99}76%{opacity:0}}@-webkit-keyframes mdl-spinner__layer-4-fade-in-out{from,65%{opacity:0}75%,90%{opacity:.99}100%{opacity:0}}@keyframes mdl-spinner__layer-4-fade-in-out{from,65%{opacity:0}75%,90%{opacity:.99}100%{opacity:0}}.mdl-spinner__gap-patch{position:absolute;box-sizing:border-box;top:0;left:45%;width:10%;height:100%;overflow:hidden;border-color:inherit}.mdl-spinner__gap-patch .mdl-spinner__circle{width:1000%;left:-450%}.mdl-spinner__circle-clipper{display:inline-block;position:relative;width:50%;height:100%;overflow:hidden;border-color:inherit}.mdl-spinner__circle-clipper.mdl-spinner__left{float:left}.mdl-spinner__circle-clipper.mdl-spinner__right{float:right}.mdl-spinner__circle-clipper .mdl-spinner__circle{width:200%}.mdl-spinner__circle{box-sizing:border-box;height:100%;border-width:3px;border-style:solid;border-color:inherit;border-bottom-color:transparent!important;border-radius:50%;-webkit-animation:none;animation:none;position:absolute;top:0;right:0;bottom:0;left:0}.mdl-spinner__left .mdl-spinner__circle{border-right-color:transparent!important;-webkit-transform:rotate(129deg);transform:rotate(129deg)}.mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle{-webkit-animation:mdl-spinner__left-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__left-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__right .mdl-spinner__circle{left:-100%;border-left-color:transparent!important;-webkit-transform:rotate(-129deg);transform:rotate(-129deg)}.mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle{-webkit-animation:mdl-spinner__right-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__right-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both}@-webkit-keyframes mdl-spinner__left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@keyframes mdl-spinner__left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@-webkit-keyframes mdl-spinner__right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}@keyframes mdl-spinner__right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}.mdl-switch{position:relative;z-index:1;vertical-align:middle;display:inline-block;box-sizing:border-box;width:100%;height:24px;margin:0;padding:0;overflow:visible;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-switch.is-upgraded{padding-left:28px}.mdl-switch__input{line-height:24px}.mdl-switch.is-upgraded .mdl-switch__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-switch__track{background:rgba(0,0,0,.26);position:absolute;left:0;top:5px;height:14px;width:36px;border-radius:14px;cursor:pointer}.mdl-switch.is-checked .mdl-switch__track{background:rgba(63,81,181,.5)}.mdl-switch__track fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__track{background:rgba(0,0,0,.12);cursor:auto}.mdl-switch__thumb{background:#fafafa;position:absolute;left:0;top:2px;height:20px;width:20px;border-radius:50%;cursor:pointer;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:left}.mdl-switch.is-checked .mdl-switch__thumb{background:#3f51b5;left:16px;box-shadow:0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12)}.mdl-switch__thumb fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__thumb{background:#bdbdbd;cursor:auto}.mdl-switch__focus-helper{position:absolute;top:50%;left:50%;-webkit-transform:translate(-4px,-4px);transform:translate(-4px,-4px);display:inline-block;box-sizing:border-box;width:8px;height:8px;border-radius:50%;background-color:transparent}.mdl-switch.is-focused .mdl-switch__focus-helper{box-shadow:0 0 0 20px rgba(0,0,0,.1);background-color:rgba(0,0,0,.1)}.mdl-switch.is-focused.is-checked .mdl-switch__focus-helper{box-shadow:0 0 0 20px rgba(63,81,181,.26);background-color:rgba(63,81,181,.26)}.mdl-switch__label{position:relative;cursor:pointer;font-size:16px;line-height:24px;margin:0;left:24px}.mdl-switch__label fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__label{color:#bdbdbd;cursor:auto}.mdl-switch__ripple-container{position:absolute;z-index:2;top:-12px;left:-14px;box-sizing:border-box;width:48px;height:48px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000);transition-duration:.4s;transition-timing-function:step-end;transition-property:left}.mdl-switch__ripple-container .mdl-ripple{background:#3f51b5}.mdl-switch__ripple-container fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__ripple-container{cursor:auto}fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,.mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple{background:0 0}.mdl-switch.is-checked .mdl-switch__ripple-container{left:2px}.mdl-tabs{display:block;width:100%}.mdl-tabs__tab-bar{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-content:space-between;-ms-flex-line-pack:justify;align-content:space-between;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;height:48px;padding:0;margin:0;border-bottom:1px solid #e0e0e0}.mdl-tabs__tab{margin:0;border:none;padding:0 24px;float:left;position:relative;display:block;text-decoration:none;height:48px;line-height:48px;text-align:center;font-weight:500;font-size:14px;text-transform:uppercase;color:rgba(0,0,0,.54);overflow:hidden}.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active{color:rgba(0,0,0,.87)}.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after{height:2px;width:100%;display:block;content:" ";bottom:0;left:0;position:absolute;background:#3f51b5;-webkit-animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;transition:all 1s cubic-bezier(.4,0,1,1)}.mdl-tabs__tab .mdl-tabs__ripple-container{display:block;position:absolute;height:100%;width:100%;left:0;top:0;z-index:1;overflow:hidden}.mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple{background:#3f51b5}.mdl-tabs__panel{display:block}.mdl-tabs.is-upgraded .mdl-tabs__panel{display:none}.mdl-tabs.is-upgraded .mdl-tabs__panel.is-active{display:block}@-webkit-keyframes border-expand{0%{opacity:0;width:0}100%{opacity:1;width:100%}}@keyframes border-expand{0%{opacity:0;width:0}100%{opacity:1;width:100%}}.mdl-textfield{position:relative;font-size:16px;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;padding:20px 0}.mdl-textfield .mdl-button{position:absolute;bottom:20px}.mdl-textfield--align-right{text-align:right}.mdl-textfield--full-width{width:100%}.mdl-textfield--expandable{min-width:32px;width:auto;min-height:32px}.mdl-textfield--expandable .mdl-button--icon{top:16px}.mdl-textfield__input{border:none;border-bottom:1px solid rgba(0,0,0,.12);display:block;font-size:16px;font-family:"Roboto";margin:0;padding:4px 0;width:100%;background:0 0;text-align:left;color:inherit}.mdl-textfield__input[type="number"]{-moz-appearance:textfield}.mdl-textfield__input[type="number"]::-webkit-inner-spin-button,.mdl-textfield__input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.mdl-textfield.is-focused .mdl-textfield__input{outline:none}.mdl-textfield.is-invalid .mdl-textfield__input{border-color:#d50000;box-shadow:none}fieldset[disabled] .mdl-textfield .mdl-textfield__input,.mdl-textfield.is-disabled .mdl-textfield__input{background-color:transparent;border-bottom:1px dotted rgba(0,0,0,.12);color:rgba(0,0,0,.26)}.mdl-textfield textarea.mdl-textfield__input{display:block}.mdl-textfield__label{bottom:0;color:rgba(0,0,0,.26);font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left}.mdl-textfield.is-dirty .mdl-textfield__label,.mdl-textfield.has-placeholder .mdl-textfield__label{visibility:hidden}.mdl-textfield--floating-label .mdl-textfield__label{transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label{transition:none}fieldset[disabled] .mdl-textfield .mdl-textfield__label,.mdl-textfield.is-disabled.is-disabled .mdl-textfield__label{color:rgba(0,0,0,.26)}.mdl-textfield--floating-label.is-focused .mdl-textfield__label,.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label{color:#3f51b5;font-size:12px;top:4px;visibility:visible}.mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label,.mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label,.mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label{top:-16px}.mdl-textfield--floating-label.is-invalid .mdl-textfield__label{color:#d50000;font-size:12px}.mdl-textfield__label:after{background-color:#3f51b5;bottom:20px;content:'';height:2px;left:45%;position:absolute;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);visibility:hidden;width:10px}.mdl-textfield.is-focused .mdl-textfield__label:after{left:0;visibility:visible;width:100%}.mdl-textfield.is-invalid .mdl-textfield__label:after{background-color:#d50000}.mdl-textfield__error{color:#d50000;position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block}.mdl-textfield.is-invalid .mdl-textfield__error{visibility:visible}.mdl-textfield__expandable-holder{display:inline-block;position:relative;margin-left:32px;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:inline-block;max-width:.1px}.mdl-textfield.is-focused .mdl-textfield__expandable-holder,.mdl-textfield.is-dirty .mdl-textfield__expandable-holder{max-width:600px}.mdl-textfield__expandable-holder .mdl-textfield__label:after{bottom:0}.mdl-tooltip{-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:top center;transform-origin:top center;z-index:999;background:rgba(97,97,97,.9);border-radius:2px;color:#fff;display:inline-block;font-size:10px;font-weight:500;line-height:14px;max-width:170px;position:fixed;top:-500px;left:-500px;padding:8px;text-align:center}.mdl-tooltip.is-active{-webkit-animation:pulse 200ms cubic-bezier(0,0,.2,1)forwards;animation:pulse 200ms cubic-bezier(0,0,.2,1)forwards}.mdl-tooltip--large{line-height:14px;font-size:14px;padding:16px}@-webkit-keyframes pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}50%{-webkit-transform:scale(.99);transform:scale(.99)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}}@keyframes pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}50%{-webkit-transform:scale(.99);transform:scale(.99)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}}.mdl-shadow--2dp{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-shadow--3dp{box-shadow:0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12)}.mdl-shadow--4dp{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2)}.mdl-shadow--6dp{box-shadow:0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12),0 3px 5px -1px rgba(0,0,0,.2)}.mdl-shadow--8dp{box-shadow:0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2)}.mdl-shadow--16dp{box-shadow:0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2)}.mdl-shadow--24dp{box-shadow:0 9px 46px 8px rgba(0,0,0,.14),0 11px 15px -7px rgba(0,0,0,.12),0 24px 38px 3px rgba(0,0,0,.2)}.mdl-grid{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;margin:0 auto;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.mdl-grid.mdl-grid--no-spacing{padding:0}.mdl-cell{box-sizing:border-box}.mdl-cell--top{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.mdl-cell--middle{-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.mdl-cell--bottom{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.mdl-cell--stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.mdl-grid.mdl-grid--no-spacing>.mdl-cell{margin:0}.mdl-cell--order-1{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12{-webkit-order:12;-ms-flex-order:12;order:12}@media (max-width:479px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:100%}.mdl-cell--hide-phone{display:none!important}.mdl-cell--order-1-phone.mdl-cell--order-1-phone{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-phone.mdl-cell--order-2-phone{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-phone.mdl-cell--order-3-phone{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-phone.mdl-cell--order-4-phone{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-phone.mdl-cell--order-5-phone{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-phone.mdl-cell--order-6-phone{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-phone.mdl-cell--order-7-phone{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-phone.mdl-cell--order-8-phone{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-phone.mdl-cell--order-9-phone{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-phone.mdl-cell--order-10-phone{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-phone.mdl-cell--order-11-phone{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-phone.mdl-cell--order-12-phone{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-phone.mdl-cell--1-col-phone{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-phone.mdl-cell--1-col-phone{width:25%}.mdl-cell--2-col,.mdl-cell--2-col-phone.mdl-cell--2-col-phone{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-phone.mdl-cell--2-col-phone{width:50%}.mdl-cell--3-col,.mdl-cell--3-col-phone.mdl-cell--3-col-phone{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-phone.mdl-cell--3-col-phone{width:75%}.mdl-cell--4-col,.mdl-cell--4-col-phone.mdl-cell--4-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-phone.mdl-cell--4-col-phone{width:100%}.mdl-cell--5-col,.mdl-cell--5-col-phone.mdl-cell--5-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-phone.mdl-cell--5-col-phone{width:100%}.mdl-cell--6-col,.mdl-cell--6-col-phone.mdl-cell--6-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-phone.mdl-cell--6-col-phone{width:100%}.mdl-cell--7-col,.mdl-cell--7-col-phone.mdl-cell--7-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-phone.mdl-cell--7-col-phone{width:100%}.mdl-cell--8-col,.mdl-cell--8-col-phone.mdl-cell--8-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-phone.mdl-cell--8-col-phone{width:100%}.mdl-cell--9-col,.mdl-cell--9-col-phone.mdl-cell--9-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-phone.mdl-cell--9-col-phone{width:100%}.mdl-cell--10-col,.mdl-cell--10-col-phone.mdl-cell--10-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-phone.mdl-cell--10-col-phone{width:100%}.mdl-cell--11-col,.mdl-cell--11-col-phone.mdl-cell--11-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-phone.mdl-cell--11-col-phone{width:100%}.mdl-cell--12-col,.mdl-cell--12-col-phone.mdl-cell--12-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-phone.mdl-cell--12-col-phone{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-phone.mdl-cell--1-offset-phone{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-phone.mdl-cell--1-offset-phone{margin-left:25%}.mdl-cell--2-offset,.mdl-cell--2-offset-phone.mdl-cell--2-offset-phone{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-phone.mdl-cell--2-offset-phone{margin-left:50%}.mdl-cell--3-offset,.mdl-cell--3-offset-phone.mdl-cell--3-offset-phone{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-phone.mdl-cell--3-offset-phone{margin-left:75%}}@media (min-width:480px) and (max-width:839px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:50%}.mdl-cell--hide-tablet{display:none!important}.mdl-cell--order-1-tablet.mdl-cell--order-1-tablet{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-tablet.mdl-cell--order-2-tablet{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-tablet.mdl-cell--order-3-tablet{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-tablet.mdl-cell--order-4-tablet{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-tablet.mdl-cell--order-5-tablet{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-tablet.mdl-cell--order-6-tablet{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-tablet.mdl-cell--order-7-tablet{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-tablet.mdl-cell--order-8-tablet{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-tablet.mdl-cell--order-9-tablet{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-tablet.mdl-cell--order-10-tablet{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-tablet.mdl-cell--order-11-tablet{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-tablet.mdl-cell--order-12-tablet{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet{width:calc(12.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet{width:12.5%}.mdl-cell--2-col,.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet{width:25%}.mdl-cell--3-col,.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet{width:calc(37.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet{width:37.5%}.mdl-cell--4-col,.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet{width:50%}.mdl-cell--5-col,.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet{width:calc(62.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet{width:62.5%}.mdl-cell--6-col,.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet{width:75%}.mdl-cell--7-col,.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet{width:calc(87.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet{width:87.5%}.mdl-cell--8-col,.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet{width:100%}.mdl-cell--9-col,.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet{width:100%}.mdl-cell--10-col,.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet{width:100%}.mdl-cell--11-col,.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet{width:100%}.mdl-cell--12-col,.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet{margin-left:calc(12.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet{margin-left:12.5%}.mdl-cell--2-offset,.mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet{margin-left:25%}.mdl-cell--3-offset,.mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet{margin-left:calc(37.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet{margin-left:37.5%}.mdl-cell--4-offset,.mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet{margin-left:50%}.mdl-cell--5-offset,.mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet{margin-left:calc(62.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet{margin-left:62.5%}.mdl-cell--6-offset,.mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet{margin-left:75%}.mdl-cell--7-offset,.mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet{margin-left:calc(87.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet{margin-left:87.5%}}@media (min-width:840px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(33.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:33.3333333333%}.mdl-cell--hide-desktop{display:none!important}.mdl-cell--order-1-desktop.mdl-cell--order-1-desktop{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-desktop.mdl-cell--order-2-desktop{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-desktop.mdl-cell--order-3-desktop{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-desktop.mdl-cell--order-4-desktop{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-desktop.mdl-cell--order-5-desktop{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-desktop.mdl-cell--order-6-desktop{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-desktop.mdl-cell--order-7-desktop{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-desktop.mdl-cell--order-8-desktop{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-desktop.mdl-cell--order-9-desktop{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-desktop.mdl-cell--order-10-desktop{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-desktop.mdl-cell--order-11-desktop{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-desktop.mdl-cell--order-12-desktop{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop{width:calc(8.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop{width:8.3333333333%}.mdl-cell--2-col,.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop{width:calc(16.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop{width:16.6666666667%}.mdl-cell--3-col,.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop{width:25%}.mdl-cell--4-col,.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop{width:calc(33.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop{width:33.3333333333%}.mdl-cell--5-col,.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop{width:calc(41.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop{width:41.6666666667%}.mdl-cell--6-col,.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop{width:50%}.mdl-cell--7-col,.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop{width:calc(58.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop{width:58.3333333333%}.mdl-cell--8-col,.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop{width:calc(66.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop{width:66.6666666667%}.mdl-cell--9-col,.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop{width:75%}.mdl-cell--10-col,.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop{width:calc(83.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop{width:83.3333333333%}.mdl-cell--11-col,.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop{width:calc(91.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop{width:91.6666666667%}.mdl-cell--12-col,.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop{margin-left:calc(8.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop{margin-left:8.3333333333%}.mdl-cell--2-offset,.mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop{margin-left:calc(16.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop{margin-left:16.6666666667%}.mdl-cell--3-offset,.mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop{margin-left:25%}.mdl-cell--4-offset,.mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop{margin-left:calc(33.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop{margin-left:33.3333333333%}.mdl-cell--5-offset,.mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop{margin-left:calc(41.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop{margin-left:41.6666666667%}.mdl-cell--6-offset,.mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop{margin-left:50%}.mdl-cell--7-offset,.mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop{margin-left:calc(58.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop{margin-left:58.3333333333%}.mdl-cell--8-offset,.mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop{margin-left:calc(66.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop{margin-left:66.6666666667%}.mdl-cell--9-offset,.mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop{margin-left:75%}.mdl-cell--10-offset,.mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop{margin-left:calc(83.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop{margin-left:83.3333333333%}.mdl-cell--11-offset,.mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop{margin-left:calc(91.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop{margin-left:91.6666666667%}}
+/*# sourceMappingURL=material.min.css.map */
diff --git a/src/material.min.js b/src/material.min.js
new file mode 100644
index 0000000..46524fb
--- /dev/null
+++ b/src/material.min.js
@@ -0,0 +1,10 @@
+/**
+ * material-design-lite - Material Design Components in CSS, JS and HTML
+ * @version v1.3.0
+ * @license Apache-2.0
+ * @copyright 2015 Google, Inc.
+ * @link https://github.com/google/material-design-lite
+ */
+!function(){"use strict";function e(e,t){if(e){if(t.element_.classList.contains(t.CssClasses_.MDL_JS_RIPPLE_EFFECT)){var s=document.createElement("span");s.classList.add(t.CssClasses_.MDL_RIPPLE_CONTAINER),s.classList.add(t.CssClasses_.MDL_JS_RIPPLE_EFFECT);var i=document.createElement("span");i.classList.add(t.CssClasses_.MDL_RIPPLE),s.appendChild(i),e.appendChild(s)}e.addEventListener("click",function(s){if("#"===e.getAttribute("href").charAt(0)){s.preventDefault();var i=e.href.split("#")[1],n=t.element_.querySelector("#"+i);t.resetTabState_(),t.resetPanelState_(),e.classList.add(t.CssClasses_.ACTIVE_CLASS),n.classList.add(t.CssClasses_.ACTIVE_CLASS)}})}}function t(e,t,s,i){function n(){var n=e.href.split("#")[1],a=i.content_.querySelector("#"+n);i.resetTabState_(t),i.resetPanelState_(s),e.classList.add(i.CssClasses_.IS_ACTIVE),a.classList.add(i.CssClasses_.IS_ACTIVE)}if(i.tabBar_.classList.contains(i.CssClasses_.JS_RIPPLE_EFFECT)){var a=document.createElement("span");a.classList.add(i.CssClasses_.RIPPLE_CONTAINER),a.classList.add(i.CssClasses_.JS_RIPPLE_EFFECT);var l=document.createElement("span");l.classList.add(i.CssClasses_.RIPPLE),a.appendChild(l),e.appendChild(a)}i.tabBar_.classList.contains(i.CssClasses_.TAB_MANUAL_SWITCH)||e.addEventListener("click",function(t){"#"===e.getAttribute("href").charAt(0)&&(t.preventDefault(),n())}),e.show=n}var s={upgradeDom:function(e,t){},upgradeElement:function(e,t){},upgradeElements:function(e){},upgradeAllRegistered:function(){},registerUpgradedCallback:function(e,t){},register:function(e){},downgradeElements:function(e){}};s=function(){function e(e,t){for(var s=0;s<c.length;s++)if(c[s].className===e)return"undefined"!=typeof t&&(c[s]=t),c[s];return!1}function t(e){var t=e.getAttribute("data-upgraded");return null===t?[""]:t.split(",")}function s(e,s){var i=t(e);return i.indexOf(s)!==-1}function i(e,t,s){if("CustomEvent"in window&&"function"==typeof window.CustomEvent)return new CustomEvent(e,{bubbles:t,cancelable:s});var i=document.createEvent("Events");return i.initEvent(e,t,s),i}function n(t,s){if("undefined"==typeof t&&"undefined"==typeof s)for(var i=0;i<c.length;i++)n(c[i].className,c[i].cssClass);else{var l=t;if("undefined"==typeof s){var o=e(l);o&&(s=o.cssClass)}for(var r=document.querySelectorAll("."+s),_=0;_<r.length;_++)a(r[_],l)}}function a(n,a){if(!("object"==typeof n&&n instanceof Element))throw new Error("Invalid argument provided to upgrade MDL element.");var l=i("mdl-componentupgrading",!0,!0);if(n.dispatchEvent(l),!l.defaultPrevented){var o=t(n),r=[];if(a)s(n,a)||r.push(e(a));else{var _=n.classList;c.forEach(function(e){_.contains(e.cssClass)&&r.indexOf(e)===-1&&!s(n,e.className)&&r.push(e)})}for(var d,h=0,u=r.length;h<u;h++){if(d=r[h],!d)throw new Error("Unable to find a registered component for the given class.");o.push(d.className),n.setAttribute("data-upgraded",o.join(","));var E=new d.classConstructor(n);E[C]=d,p.push(E);for(var m=0,L=d.callbacks.length;m<L;m++)d.callbacks[m](n);d.widget&&(n[d.className]=E);var I=i("mdl-componentupgraded",!0,!1);n.dispatchEvent(I)}}}function l(e){Array.isArray(e)||(e=e instanceof Element?[e]:Array.prototype.slice.call(e));for(var t,s=0,i=e.length;s<i;s++)t=e[s],t instanceof HTMLElement&&(a(t),t.children.length>0&&l(t.children))}function o(t){var s="undefined"==typeof t.widget&&"undefined"==typeof t.widget,i=!0;s||(i=t.widget||t.widget);var n={classConstructor:t.constructor||t.constructor,className:t.classAsString||t.classAsString,cssClass:t.cssClass||t.cssClass,widget:i,callbacks:[]};if(c.forEach(function(e){if(e.cssClass===n.cssClass)throw new Error("The provided cssClass has already been registered: "+e.cssClass);if(e.className===n.className)throw new Error("The provided className has already been registered")}),t.constructor.prototype.hasOwnProperty(C))throw new Error("MDL component classes must not have "+C+" defined as a property.");var a=e(t.classAsString,n);a||c.push(n)}function r(t,s){var i=e(t);i&&i.callbacks.push(s)}function _(){for(var e=0;e<c.length;e++)n(c[e].className)}function d(e){if(e){var t=p.indexOf(e);p.splice(t,1);var s=e.element_.getAttribute("data-upgraded").split(","),n=s.indexOf(e[C].classAsString);s.splice(n,1),e.element_.setAttribute("data-upgraded",s.join(","));var a=i("mdl-componentdowngraded",!0,!1);e.element_.dispatchEvent(a)}}function h(e){var t=function(e){p.filter(function(t){return t.element_===e}).forEach(d)};if(e instanceof Array||e instanceof NodeList)for(var s=0;s<e.length;s++)t(e[s]);else{if(!(e instanceof Node))throw new Error("Invalid argument provided to downgrade MDL nodes.");t(e)}}var c=[],p=[],C="mdlComponentConfigInternal_";return{upgradeDom:n,upgradeElement:a,upgradeElements:l,upgradeAllRegistered:_,registerUpgradedCallback:r,register:o,downgradeElements:h}}(),s.ComponentConfigPublic,s.ComponentConfig,s.Component,s.upgradeDom=s.upgradeDom,s.upgradeElement=s.upgradeElement,s.upgradeElements=s.upgradeElements,s.upgradeAllRegistered=s.upgradeAllRegistered,s.registerUpgradedCallback=s.registerUpgradedCallback,s.register=s.register,s.downgradeElements=s.downgradeElements,window.componentHandler=s,window.componentHandler=s,window.addEventListener("load",function(){"classList"in document.createElement("div")&&"querySelector"in document&&"addEventListener"in window&&Array.prototype.forEach?(document.documentElement.classList.add("mdl-js"),s.upgradeAllRegistered()):(s.upgradeElement=function(){},s.register=function(){})}),Date.now||(Date.now=function(){return(new Date).getTime()},Date.now=Date.now);for(var i=["webkit","moz"],n=0;n<i.length&&!window.requestAnimationFrame;++n){var a=i[n];window.requestAnimationFrame=window[a+"RequestAnimationFrame"],window.cancelAnimationFrame=window[a+"CancelAnimationFrame"]||window[a+"CancelRequestAnimationFrame"],window.requestAnimationFrame=window.requestAnimationFrame,window.cancelAnimationFrame=window.cancelAnimationFrame}if(/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent)||!window.requestAnimationFrame||!window.cancelAnimationFrame){var l=0;window.requestAnimationFrame=function(e){var t=Date.now(),s=Math.max(l+16,t);return setTimeout(function(){e(l=s)},s-t)},window.cancelAnimationFrame=clearTimeout,window.requestAnimationFrame=window.requestAnimationFrame,window.cancelAnimationFrame=window.cancelAnimationFrame}var o=function(e){this.element_=e,this.init()};window.MaterialButton=o,o.prototype.Constant_={},o.prototype.CssClasses_={RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_CONTAINER:"mdl-button__ripple-container",RIPPLE:"mdl-ripple"},o.prototype.blurHandler_=function(e){e&&this.element_.blur()},o.prototype.disable=function(){this.element_.disabled=!0},o.prototype.disable=o.prototype.disable,o.prototype.enable=function(){this.element_.disabled=!1},o.prototype.enable=o.prototype.enable,o.prototype.init=function(){if(this.element_){if(this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)){var e=document.createElement("span");e.classList.add(this.CssClasses_.RIPPLE_CONTAINER),this.rippleElement_=document.createElement("span"),this.rippleElement_.classList.add(this.CssClasses_.RIPPLE),e.appendChild(this.rippleElement_),this.boundRippleBlurHandler=this.blurHandler_.bind(this),this.rippleElement_.addEventListener("mouseup",this.boundRippleBlurHandler),this.element_.appendChild(e)}this.boundButtonBlurHandler=this.blurHandler_.bind(this),this.element_.addEventListener("mouseup",this.boundButtonBlurHandler),this.element_.addEventListener("mouseleave",this.boundButtonBlurHandler)}},s.register({constructor:o,classAsString:"MaterialButton",cssClass:"mdl-js-button",widget:!0});var r=function(e){this.element_=e,this.init()};window.MaterialCheckbox=r,r.prototype.Constant_={TINY_TIMEOUT:.001},r.prototype.CssClasses_={INPUT:"mdl-checkbox__input",BOX_OUTLINE:"mdl-checkbox__box-outline",FOCUS_HELPER:"mdl-checkbox__focus-helper",TICK_OUTLINE:"mdl-checkbox__tick-outline",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-checkbox__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked",IS_UPGRADED:"is-upgraded"},r.prototype.onChange_=function(e){this.updateClasses_()},r.prototype.onFocus_=function(e){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)},r.prototype.onBlur_=function(e){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},r.prototype.onMouseUp_=function(e){this.blur_()},r.prototype.updateClasses_=function(){this.checkDisabled(),this.checkToggleState()},r.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)},r.prototype.checkToggleState=function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)},r.prototype.checkToggleState=r.prototype.checkToggleState,r.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)},r.prototype.checkDisabled=r.prototype.checkDisabled,r.prototype.disable=function(){this.inputElement_.disabled=!0,this.updateClasses_()},r.prototype.disable=r.prototype.disable,r.prototype.enable=function(){this.inputElement_.disabled=!1,this.updateClasses_()},r.prototype.enable=r.prototype.enable,r.prototype.check=function(){this.inputElement_.checked=!0,this.updateClasses_()},r.prototype.check=r.prototype.check,r.prototype.uncheck=function(){this.inputElement_.checked=!1,this.updateClasses_()},r.prototype.uncheck=r.prototype.uncheck,r.prototype.init=function(){if(this.element_){this.inputElement_=this.element_.querySelector("."+this.CssClasses_.INPUT);var e=document.createElement("span");e.classList.add(this.CssClasses_.BOX_OUTLINE);var t=document.createElement("span");t.classList.add(this.CssClasses_.FOCUS_HELPER);var s=document.createElement("span");if(s.classList.add(this.CssClasses_.TICK_OUTLINE),e.appendChild(s),this.element_.appendChild(t),this.element_.appendChild(e),this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)){this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),this.rippleContainerElement_=document.createElement("span"),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER),this.boundRippleMouseUp=this.onMouseUp_.bind(this),this.rippleContainerElement_.addEventListener("mouseup",this.boundRippleMouseUp);var i=document.createElement("span");i.classList.add(this.CssClasses_.RIPPLE),this.rippleContainerElement_.appendChild(i),this.element_.appendChild(this.rippleContainerElement_)}this.boundInputOnChange=this.onChange_.bind(this),this.boundInputOnFocus=this.onFocus_.bind(this),this.boundInputOnBlur=this.onBlur_.bind(this),this.boundElementMouseUp=this.onMouseUp_.bind(this),this.inputElement_.addEventListener("change",this.boundInputOnChange),this.inputElement_.addEventListener("focus",this.boundInputOnFocus),this.inputElement_.addEventListener("blur",this.boundInputOnBlur),this.element_.addEventListener("mouseup",this.boundElementMouseUp),this.updateClasses_(),this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}},s.register({constructor:r,classAsString:"MaterialCheckbox",cssClass:"mdl-js-checkbox",widget:!0});var _=function(e){this.element_=e,this.init()};window.MaterialIconToggle=_,_.prototype.Constant_={TINY_TIMEOUT:.001},_.prototype.CssClasses_={INPUT:"mdl-icon-toggle__input",JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-icon-toggle__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked"},_.prototype.onChange_=function(e){this.updateClasses_()},_.prototype.onFocus_=function(e){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)},_.prototype.onBlur_=function(e){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},_.prototype.onMouseUp_=function(e){this.blur_()},_.prototype.updateClasses_=function(){this.checkDisabled(),this.checkToggleState()},_.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)},_.prototype.checkToggleState=function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)},_.prototype.checkToggleState=_.prototype.checkToggleState,_.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)},_.prototype.checkDisabled=_.prototype.checkDisabled,_.prototype.disable=function(){this.inputElement_.disabled=!0,this.updateClasses_()},_.prototype.disable=_.prototype.disable,_.prototype.enable=function(){this.inputElement_.disabled=!1,this.updateClasses_()},_.prototype.enable=_.prototype.enable,_.prototype.check=function(){this.inputElement_.checked=!0,this.updateClasses_()},_.prototype.check=_.prototype.check,_.prototype.uncheck=function(){this.inputElement_.checked=!1,this.updateClasses_()},_.prototype.uncheck=_.prototype.uncheck,_.prototype.init=function(){if(this.element_){if(this.inputElement_=this.element_.querySelector("."+this.CssClasses_.INPUT),this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)){this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),this.rippleContainerElement_=document.createElement("span"),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER),this.rippleContainerElement_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER),this.boundRippleMouseUp=this.onMouseUp_.bind(this),this.rippleContainerElement_.addEventListener("mouseup",this.boundRippleMouseUp);var e=document.createElement("span");e.classList.add(this.CssClasses_.RIPPLE),this.rippleContainerElement_.appendChild(e),this.element_.appendChild(this.rippleContainerElement_)}this.boundInputOnChange=this.onChange_.bind(this),this.boundInputOnFocus=this.onFocus_.bind(this),this.boundInputOnBlur=this.onBlur_.bind(this),this.boundElementOnMouseUp=this.onMouseUp_.bind(this),this.inputElement_.addEventListener("change",this.boundInputOnChange),this.inputElement_.addEventListener("focus",this.boundInputOnFocus),this.inputElement_.addEventListener("blur",this.boundInputOnBlur),this.element_.addEventListener("mouseup",this.boundElementOnMouseUp),this.updateClasses_(),this.element_.classList.add("is-upgraded")}},s.register({constructor:_,classAsString:"MaterialIconToggle",cssClass:"mdl-js-icon-toggle",widget:!0});var d=function(e){this.element_=e,this.init()};window.MaterialMenu=d,d.prototype.Constant_={TRANSITION_DURATION_SECONDS:.3,TRANSITION_DURATION_FRACTION:.8,CLOSE_TIMEOUT:150},d.prototype.Keycodes_={ENTER:13,ESCAPE:27,SPACE:32,UP_ARROW:38,DOWN_ARROW:40},d.prototype.CssClasses_={CONTAINER:"mdl-menu__container",OUTLINE:"mdl-menu__outline",ITEM:"mdl-menu__item",ITEM_RIPPLE_CONTAINER:"mdl-menu__item-ripple-container",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE:"mdl-ripple",IS_UPGRADED:"is-upgraded",IS_VISIBLE:"is-visible",IS_ANIMATING:"is-animating",BOTTOM_LEFT:"mdl-menu--bottom-left",BOTTOM_RIGHT:"mdl-menu--bottom-right",TOP_LEFT:"mdl-menu--top-left",TOP_RIGHT:"mdl-menu--top-right",UNALIGNED:"mdl-menu--unaligned"},d.prototype.init=function(){if(this.element_){var e=document.createElement("div");e.classList.add(this.CssClasses_.CONTAINER),this.element_.parentElement.insertBefore(e,this.element_),this.element_.parentElement.removeChild(this.element_),e.appendChild(this.element_),this.container_=e;var t=document.createElement("div");t.classList.add(this.CssClasses_.OUTLINE),this.outline_=t,e.insertBefore(t,this.element_);var s=this.element_.getAttribute("for")||this.element_.getAttribute("data-mdl-for"),i=null;s&&(i=document.getElementById(s),i&&(this.forElement_=i,i.addEventListener("click",this.handleForClick_.bind(this)),i.addEventListener("keydown",this.handleForKeyboardEvent_.bind(this))));var n=this.element_.querySelectorAll("."+this.CssClasses_.ITEM);this.boundItemKeydown_=this.handleItemKeyboardEvent_.bind(this),this.boundItemClick_=this.handleItemClick_.bind(this);for(var a=0;a<n.length;a++)n[a].addEventListener("click",this.boundItemClick_),n[a].tabIndex="-1",n[a].addEventListener("keydown",this.boundItemKeydown_);if(this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT))for(this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),a=0;a<n.length;a++){var l=n[a],o=document.createElement("span");o.classList.add(this.CssClasses_.ITEM_RIPPLE_CONTAINER);var r=document.createElement("span");r.classList.add(this.CssClasses_.RIPPLE),o.appendChild(r),l.appendChild(o),l.classList.add(this.CssClasses_.RIPPLE_EFFECT)}this.element_.classList.contains(this.CssClasses_.BOTTOM_LEFT)&&this.outline_.classList.add(this.CssClasses_.BOTTOM_LEFT),this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)&&this.outline_.classList.add(this.CssClasses_.BOTTOM_RIGHT),this.element_.classList.contains(this.CssClasses_.TOP_LEFT)&&this.outline_.classList.add(this.CssClasses_.TOP_LEFT),this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)&&this.outline_.classList.add(this.CssClasses_.TOP_RIGHT),this.element_.classList.contains(this.CssClasses_.UNALIGNED)&&this.outline_.classList.add(this.CssClasses_.UNALIGNED),e.classList.add(this.CssClasses_.IS_UPGRADED)}},d.prototype.handleForClick_=function(e){if(this.element_&&this.forElement_){var t=this.forElement_.getBoundingClientRect(),s=this.forElement_.parentElement.getBoundingClientRect();this.element_.classList.contains(this.CssClasses_.UNALIGNED)||(this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)?(this.container_.style.right=s.right-t.right+"px",this.container_.style.top=this.forElement_.offsetTop+this.forElement_.offsetHeight+"px"):this.element_.classList.contains(this.CssClasses_.TOP_LEFT)?(this.container_.style.left=this.forElement_.offsetLeft+"px",this.container_.style.bottom=s.bottom-t.top+"px"):this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?(this.container_.style.right=s.right-t.right+"px",this.container_.style.bottom=s.bottom-t.top+"px"):(this.container_.style.left=this.forElement_.offsetLeft+"px",this.container_.style.top=this.forElement_.offsetTop+this.forElement_.offsetHeight+"px"))}this.toggle(e)},d.prototype.handleForKeyboardEvent_=function(e){if(this.element_&&this.container_&&this.forElement_){var t=this.element_.querySelectorAll("."+this.CssClasses_.ITEM+":not([disabled])");t&&t.length>0&&this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)&&(e.keyCode===this.Keycodes_.UP_ARROW?(e.preventDefault(),t[t.length-1].focus()):e.keyCode===this.Keycodes_.DOWN_ARROW&&(e.preventDefault(),t[0].focus()))}},d.prototype.handleItemKeyboardEvent_=function(e){if(this.element_&&this.container_){var t=this.element_.querySelectorAll("."+this.CssClasses_.ITEM+":not([disabled])");if(t&&t.length>0&&this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)){var s=Array.prototype.slice.call(t).indexOf(e.target);if(e.keyCode===this.Keycodes_.UP_ARROW)e.preventDefault(),s>0?t[s-1].focus():t[t.length-1].focus();else if(e.keyCode===this.Keycodes_.DOWN_ARROW)e.preventDefault(),t.length>s+1?t[s+1].focus():t[0].focus();else if(e.keyCode===this.Keycodes_.SPACE||e.keyCode===this.Keycodes_.ENTER){e.preventDefault();var i=new MouseEvent("mousedown");e.target.dispatchEvent(i),i=new MouseEvent("mouseup"),e.target.dispatchEvent(i),e.target.click()}else e.keyCode===this.Keycodes_.ESCAPE&&(e.preventDefault(),this.hide())}}},d.prototype.handleItemClick_=function(e){e.target.hasAttribute("disabled")?e.stopPropagation():(this.closing_=!0,window.setTimeout(function(e){this.hide(),this.closing_=!1}.bind(this),this.Constant_.CLOSE_TIMEOUT))},d.prototype.applyClip_=function(e,t){this.element_.classList.contains(this.CssClasses_.UNALIGNED)?this.element_.style.clip="":this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)?this.element_.style.clip="rect(0 "+t+"px 0 "+t+"px)":this.element_.classList.contains(this.CssClasses_.TOP_LEFT)?this.element_.style.clip="rect("+e+"px 0 "+e+"px 0)":this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?this.element_.style.clip="rect("+e+"px "+t+"px "+e+"px "+t+"px)":this.element_.style.clip=""},d.prototype.removeAnimationEndListener_=function(e){e.target.classList.remove(d.prototype.CssClasses_.IS_ANIMATING)},d.prototype.addAnimationEndListener_=function(){this.element_.addEventListener("transitionend",this.removeAnimationEndListener_),this.element_.addEventListener("webkitTransitionEnd",this.removeAnimationEndListener_)},d.prototype.show=function(e){if(this.element_&&this.container_&&this.outline_){var t=this.element_.getBoundingClientRect().height,s=this.element_.getBoundingClientRect().width;this.container_.style.width=s+"px",this.container_.style.height=t+"px",this.outline_.style.width=s+"px",this.outline_.style.height=t+"px";for(var i=this.Constant_.TRANSITION_DURATION_SECONDS*this.Constant_.TRANSITION_DURATION_FRACTION,n=this.element_.querySelectorAll("."+this.CssClasses_.ITEM),a=0;a<n.length;a++){var l=null;l=this.element_.classList.contains(this.CssClasses_.TOP_LEFT)||this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)?(t-n[a].offsetTop-n[a].offsetHeight)/t*i+"s":n[a].offsetTop/t*i+"s",n[a].style.transitionDelay=l}this.applyClip_(t,s),window.requestAnimationFrame(function(){this.element_.classList.add(this.CssClasses_.IS_ANIMATING),this.element_.style.clip="rect(0 "+s+"px "+t+"px 0)",this.container_.classList.add(this.CssClasses_.IS_VISIBLE)}.bind(this)),this.addAnimationEndListener_();var o=function(t){t===e||this.closing_||t.target.parentNode===this.element_||(document.removeEventListener("click",o),this.hide())}.bind(this);document.addEventListener("click",o)}},d.prototype.show=d.prototype.show,d.prototype.hide=function(){if(this.element_&&this.container_&&this.outline_){for(var e=this.element_.querySelectorAll("."+this.CssClasses_.ITEM),t=0;t<e.length;t++)e[t].style.removeProperty("transition-delay");var s=this.element_.getBoundingClientRect(),i=s.height,n=s.width;this.element_.classList.add(this.CssClasses_.IS_ANIMATING),this.applyClip_(i,n),this.container_.classList.remove(this.CssClasses_.IS_VISIBLE),this.addAnimationEndListener_()}},d.prototype.hide=d.prototype.hide,d.prototype.toggle=function(e){this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)?this.hide():this.show(e)},d.prototype.toggle=d.prototype.toggle,s.register({constructor:d,classAsString:"MaterialMenu",cssClass:"mdl-js-menu",widget:!0});var h=function(e){this.element_=e,this.init()};window.MaterialProgress=h,h.prototype.Constant_={},h.prototype.CssClasses_={INDETERMINATE_CLASS:"mdl-progress__indeterminate"},h.prototype.setProgress=function(e){this.element_.classList.contains(this.CssClasses_.INDETERMINATE_CLASS)||(this.progressbar_.style.width=e+"%")},h.prototype.setProgress=h.prototype.setProgress,h.prototype.setBuffer=function(e){this.bufferbar_.style.width=e+"%",this.auxbar_.style.width=100-e+"%"},h.prototype.setBuffer=h.prototype.setBuffer,h.prototype.init=function(){if(this.element_){var e=document.createElement("div");e.className="progressbar bar bar1",this.element_.appendChild(e),this.progressbar_=e,e=document.createElement("div"),e.className="bufferbar bar bar2",this.element_.appendChild(e),this.bufferbar_=e,e=document.createElement("div"),e.className="auxbar bar bar3",this.element_.appendChild(e),this.auxbar_=e,this.progressbar_.style.width="0%",this.bufferbar_.style.width="100%",this.auxbar_.style.width="0%",this.element_.classList.add("is-upgraded")}},s.register({constructor:h,classAsString:"MaterialProgress",cssClass:"mdl-js-progress",widget:!0});var c=function(e){this.element_=e,this.init()};window.MaterialRadio=c,c.prototype.Constant_={TINY_TIMEOUT:.001},c.prototype.CssClasses_={IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked",IS_UPGRADED:"is-upgraded",JS_RADIO:"mdl-js-radio",RADIO_BTN:"mdl-radio__button",RADIO_OUTER_CIRCLE:"mdl-radio__outer-circle",RADIO_INNER_CIRCLE:"mdl-radio__inner-circle",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-radio__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple"},c.prototype.onChange_=function(e){for(var t=document.getElementsByClassName(this.CssClasses_.JS_RADIO),s=0;s<t.length;s++){var i=t[s].querySelector("."+this.CssClasses_.RADIO_BTN);i.getAttribute("name")===this.btnElement_.getAttribute("name")&&"undefined"!=typeof t[s].MaterialRadio&&t[s].MaterialRadio.updateClasses_()}},c.prototype.onFocus_=function(e){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)},c.prototype.onBlur_=function(e){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},c.prototype.onMouseup_=function(e){this.blur_()},c.prototype.updateClasses_=function(){this.checkDisabled(),this.checkToggleState()},c.prototype.blur_=function(){window.setTimeout(function(){this.btnElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)},c.prototype.checkDisabled=function(){this.btnElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)},c.prototype.checkDisabled=c.prototype.checkDisabled,c.prototype.checkToggleState=function(){this.btnElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)},c.prototype.checkToggleState=c.prototype.checkToggleState,c.prototype.disable=function(){this.btnElement_.disabled=!0,this.updateClasses_()},c.prototype.disable=c.prototype.disable,c.prototype.enable=function(){this.btnElement_.disabled=!1,this.updateClasses_()},c.prototype.enable=c.prototype.enable,c.prototype.check=function(){this.btnElement_.checked=!0,this.onChange_(null)},c.prototype.check=c.prototype.check,c.prototype.uncheck=function(){this.btnElement_.checked=!1,this.onChange_(null)},c.prototype.uncheck=c.prototype.uncheck,c.prototype.init=function(){if(this.element_){this.btnElement_=this.element_.querySelector("."+this.CssClasses_.RADIO_BTN),this.boundChangeHandler_=this.onChange_.bind(this),this.boundFocusHandler_=this.onChange_.bind(this),this.boundBlurHandler_=this.onBlur_.bind(this),this.boundMouseUpHandler_=this.onMouseup_.bind(this);var e=document.createElement("span");e.classList.add(this.CssClasses_.RADIO_OUTER_CIRCLE);var t=document.createElement("span");t.classList.add(this.CssClasses_.RADIO_INNER_CIRCLE),this.element_.appendChild(e),this.element_.appendChild(t);var s;if(this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)){this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),s=document.createElement("span"),s.classList.add(this.CssClasses_.RIPPLE_CONTAINER),s.classList.add(this.CssClasses_.RIPPLE_EFFECT),s.classList.add(this.CssClasses_.RIPPLE_CENTER),s.addEventListener("mouseup",this.boundMouseUpHandler_);var i=document.createElement("span");i.classList.add(this.CssClasses_.RIPPLE),s.appendChild(i),this.element_.appendChild(s)}this.btnElement_.addEventListener("change",this.boundChangeHandler_),this.btnElement_.addEventListener("focus",this.boundFocusHandler_),this.btnElement_.addEventListener("blur",this.boundBlurHandler_),this.element_.addEventListener("mouseup",this.boundMouseUpHandler_),this.updateClasses_(),this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}},s.register({constructor:c,classAsString:"MaterialRadio",cssClass:"mdl-js-radio",widget:!0});var p=function(e){this.element_=e,this.isIE_=window.navigator.msPointerEnabled,this.init()};window.MaterialSlider=p,p.prototype.Constant_={},p.prototype.CssClasses_={IE_CONTAINER:"mdl-slider__ie-container",SLIDER_CONTAINER:"mdl-slider__container",BACKGROUND_FLEX:"mdl-slider__background-flex",BACKGROUND_LOWER:"mdl-slider__background-lower",BACKGROUND_UPPER:"mdl-slider__background-upper",IS_LOWEST_VALUE:"is-lowest-value",IS_UPGRADED:"is-upgraded"},p.prototype.onInput_=function(e){this.updateValueStyles_()},p.prototype.onChange_=function(e){this.updateValueStyles_()},p.prototype.onMouseUp_=function(e){e.target.blur()},p.prototype.onContainerMouseDown_=function(e){if(e.target===this.element_.parentElement){e.preventDefault();var t=new MouseEvent("mousedown",{target:e.target,buttons:e.buttons,clientX:e.clientX,clientY:this.element_.getBoundingClientRect().y});this.element_.dispatchEvent(t)}},p.prototype.updateValueStyles_=function(){var e=(this.element_.value-this.element_.min)/(this.element_.max-this.element_.min);0===e?this.element_.classList.add(this.CssClasses_.IS_LOWEST_VALUE):this.element_.classList.remove(this.CssClasses_.IS_LOWEST_VALUE),this.isIE_||(this.backgroundLower_.style.flex=e,this.backgroundLower_.style.webkitFlex=e,this.backgroundUpper_.style.flex=1-e,this.backgroundUpper_.style.webkitFlex=1-e)},p.prototype.disable=function(){this.element_.disabled=!0},p.prototype.disable=p.prototype.disable,p.prototype.enable=function(){this.element_.disabled=!1},p.prototype.enable=p.prototype.enable,p.prototype.change=function(e){"undefined"!=typeof e&&(this.element_.value=e),this.updateValueStyles_()},p.prototype.change=p.prototype.change,p.prototype.init=function(){if(this.element_){if(this.isIE_){var e=document.createElement("div");e.classList.add(this.CssClasses_.IE_CONTAINER),this.element_.parentElement.insertBefore(e,this.element_),this.element_.parentElement.removeChild(this.element_),e.appendChild(this.element_)}else{var t=document.createElement("div");t.classList.add(this.CssClasses_.SLIDER_CONTAINER),this.element_.parentElement.insertBefore(t,this.element_),this.element_.parentElement.removeChild(this.element_),t.appendChild(this.element_);var s=document.createElement("div");s.classList.add(this.CssClasses_.BACKGROUND_FLEX),t.appendChild(s),this.backgroundLower_=document.createElement("div"),this.backgroundLower_.classList.add(this.CssClasses_.BACKGROUND_LOWER),s.appendChild(this.backgroundLower_),this.backgroundUpper_=document.createElement("div"),this.backgroundUpper_.classList.add(this.CssClasses_.BACKGROUND_UPPER),s.appendChild(this.backgroundUpper_)}this.boundInputHandler=this.onInput_.bind(this),this.boundChangeHandler=this.onChange_.bind(this),this.boundMouseUpHandler=this.onMouseUp_.bind(this),this.boundContainerMouseDownHandler=this.onContainerMouseDown_.bind(this),this.element_.addEventListener("input",this.boundInputHandler),this.element_.addEventListener("change",this.boundChangeHandler),this.element_.addEventListener("mouseup",this.boundMouseUpHandler),this.element_.parentElement.addEventListener("mousedown",this.boundContainerMouseDownHandler),this.updateValueStyles_(),this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}},s.register({constructor:p,classAsString:"MaterialSlider",cssClass:"mdl-js-slider",widget:!0});var C=function(e){if(this.element_=e,this.textElement_=this.element_.querySelector("."+this.cssClasses_.MESSAGE),this.actionElement_=this.element_.querySelector("."+this.cssClasses_.ACTION),!this.textElement_)throw new Error("There must be a message element for a snackbar.");if(!this.actionElement_)throw new Error("There must be an action element for a snackbar.");this.active=!1,this.actionHandler_=void 0,this.message_=void 0,this.actionText_=void 0,this.queuedNotifications_=[],this.setActionHidden_(!0)};window.MaterialSnackbar=C,C.prototype.Constant_={ANIMATION_LENGTH:250},C.prototype.cssClasses_={SNACKBAR:"mdl-snackbar",MESSAGE:"mdl-snackbar__text",ACTION:"mdl-snackbar__action",ACTIVE:"mdl-snackbar--active"},C.prototype.displaySnackbar_=function(){this.element_.setAttribute("aria-hidden","true"),
+this.actionHandler_&&(this.actionElement_.textContent=this.actionText_,this.actionElement_.addEventListener("click",this.actionHandler_),this.setActionHidden_(!1)),this.textElement_.textContent=this.message_,this.element_.classList.add(this.cssClasses_.ACTIVE),this.element_.setAttribute("aria-hidden","false"),setTimeout(this.cleanup_.bind(this),this.timeout_)},C.prototype.showSnackbar=function(e){if(void 0===e)throw new Error("Please provide a data object with at least a message to display.");if(void 0===e.message)throw new Error("Please provide a message to be displayed.");if(e.actionHandler&&!e.actionText)throw new Error("Please provide action text with the handler.");this.active?this.queuedNotifications_.push(e):(this.active=!0,this.message_=e.message,e.timeout?this.timeout_=e.timeout:this.timeout_=2750,e.actionHandler&&(this.actionHandler_=e.actionHandler),e.actionText&&(this.actionText_=e.actionText),this.displaySnackbar_())},C.prototype.showSnackbar=C.prototype.showSnackbar,C.prototype.checkQueue_=function(){this.queuedNotifications_.length>0&&this.showSnackbar(this.queuedNotifications_.shift())},C.prototype.cleanup_=function(){this.element_.classList.remove(this.cssClasses_.ACTIVE),setTimeout(function(){this.element_.setAttribute("aria-hidden","true"),this.textElement_.textContent="",Boolean(this.actionElement_.getAttribute("aria-hidden"))||(this.setActionHidden_(!0),this.actionElement_.textContent="",this.actionElement_.removeEventListener("click",this.actionHandler_)),this.actionHandler_=void 0,this.message_=void 0,this.actionText_=void 0,this.active=!1,this.checkQueue_()}.bind(this),this.Constant_.ANIMATION_LENGTH)},C.prototype.setActionHidden_=function(e){e?this.actionElement_.setAttribute("aria-hidden","true"):this.actionElement_.removeAttribute("aria-hidden")},s.register({constructor:C,classAsString:"MaterialSnackbar",cssClass:"mdl-js-snackbar",widget:!0});var u=function(e){this.element_=e,this.init()};window.MaterialSpinner=u,u.prototype.Constant_={MDL_SPINNER_LAYER_COUNT:4},u.prototype.CssClasses_={MDL_SPINNER_LAYER:"mdl-spinner__layer",MDL_SPINNER_CIRCLE_CLIPPER:"mdl-spinner__circle-clipper",MDL_SPINNER_CIRCLE:"mdl-spinner__circle",MDL_SPINNER_GAP_PATCH:"mdl-spinner__gap-patch",MDL_SPINNER_LEFT:"mdl-spinner__left",MDL_SPINNER_RIGHT:"mdl-spinner__right"},u.prototype.createLayer=function(e){var t=document.createElement("div");t.classList.add(this.CssClasses_.MDL_SPINNER_LAYER),t.classList.add(this.CssClasses_.MDL_SPINNER_LAYER+"-"+e);var s=document.createElement("div");s.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER),s.classList.add(this.CssClasses_.MDL_SPINNER_LEFT);var i=document.createElement("div");i.classList.add(this.CssClasses_.MDL_SPINNER_GAP_PATCH);var n=document.createElement("div");n.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER),n.classList.add(this.CssClasses_.MDL_SPINNER_RIGHT);for(var a=[s,i,n],l=0;l<a.length;l++){var o=document.createElement("div");o.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE),a[l].appendChild(o)}t.appendChild(s),t.appendChild(i),t.appendChild(n),this.element_.appendChild(t)},u.prototype.createLayer=u.prototype.createLayer,u.prototype.stop=function(){this.element_.classList.remove("is-active")},u.prototype.stop=u.prototype.stop,u.prototype.start=function(){this.element_.classList.add("is-active")},u.prototype.start=u.prototype.start,u.prototype.init=function(){if(this.element_){for(var e=1;e<=this.Constant_.MDL_SPINNER_LAYER_COUNT;e++)this.createLayer(e);this.element_.classList.add("is-upgraded")}},s.register({constructor:u,classAsString:"MaterialSpinner",cssClass:"mdl-js-spinner",widget:!0});var E=function(e){this.element_=e,this.init()};window.MaterialSwitch=E,E.prototype.Constant_={TINY_TIMEOUT:.001},E.prototype.CssClasses_={INPUT:"mdl-switch__input",TRACK:"mdl-switch__track",THUMB:"mdl-switch__thumb",FOCUS_HELPER:"mdl-switch__focus-helper",RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE_CONTAINER:"mdl-switch__ripple-container",RIPPLE_CENTER:"mdl-ripple--center",RIPPLE:"mdl-ripple",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_CHECKED:"is-checked"},E.prototype.onChange_=function(e){this.updateClasses_()},E.prototype.onFocus_=function(e){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)},E.prototype.onBlur_=function(e){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},E.prototype.onMouseUp_=function(e){this.blur_()},E.prototype.updateClasses_=function(){this.checkDisabled(),this.checkToggleState()},E.prototype.blur_=function(){window.setTimeout(function(){this.inputElement_.blur()}.bind(this),this.Constant_.TINY_TIMEOUT)},E.prototype.checkDisabled=function(){this.inputElement_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)},E.prototype.checkDisabled=E.prototype.checkDisabled,E.prototype.checkToggleState=function(){this.inputElement_.checked?this.element_.classList.add(this.CssClasses_.IS_CHECKED):this.element_.classList.remove(this.CssClasses_.IS_CHECKED)},E.prototype.checkToggleState=E.prototype.checkToggleState,E.prototype.disable=function(){this.inputElement_.disabled=!0,this.updateClasses_()},E.prototype.disable=E.prototype.disable,E.prototype.enable=function(){this.inputElement_.disabled=!1,this.updateClasses_()},E.prototype.enable=E.prototype.enable,E.prototype.on=function(){this.inputElement_.checked=!0,this.updateClasses_()},E.prototype.on=E.prototype.on,E.prototype.off=function(){this.inputElement_.checked=!1,this.updateClasses_()},E.prototype.off=E.prototype.off,E.prototype.init=function(){if(this.element_){this.inputElement_=this.element_.querySelector("."+this.CssClasses_.INPUT);var e=document.createElement("div");e.classList.add(this.CssClasses_.TRACK);var t=document.createElement("div");t.classList.add(this.CssClasses_.THUMB);var s=document.createElement("span");if(s.classList.add(this.CssClasses_.FOCUS_HELPER),t.appendChild(s),this.element_.appendChild(e),this.element_.appendChild(t),this.boundMouseUpHandler=this.onMouseUp_.bind(this),this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)){this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS),this.rippleContainerElement_=document.createElement("span"),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT),this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER),this.rippleContainerElement_.addEventListener("mouseup",this.boundMouseUpHandler);var i=document.createElement("span");i.classList.add(this.CssClasses_.RIPPLE),this.rippleContainerElement_.appendChild(i),this.element_.appendChild(this.rippleContainerElement_)}this.boundChangeHandler=this.onChange_.bind(this),this.boundFocusHandler=this.onFocus_.bind(this),this.boundBlurHandler=this.onBlur_.bind(this),this.inputElement_.addEventListener("change",this.boundChangeHandler),this.inputElement_.addEventListener("focus",this.boundFocusHandler),this.inputElement_.addEventListener("blur",this.boundBlurHandler),this.element_.addEventListener("mouseup",this.boundMouseUpHandler),this.updateClasses_(),this.element_.classList.add("is-upgraded")}},s.register({constructor:E,classAsString:"MaterialSwitch",cssClass:"mdl-js-switch",widget:!0});var m=function(e){this.element_=e,this.init()};window.MaterialTabs=m,m.prototype.Constant_={},m.prototype.CssClasses_={TAB_CLASS:"mdl-tabs__tab",PANEL_CLASS:"mdl-tabs__panel",ACTIVE_CLASS:"is-active",UPGRADED_CLASS:"is-upgraded",MDL_JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",MDL_RIPPLE_CONTAINER:"mdl-tabs__ripple-container",MDL_RIPPLE:"mdl-ripple",MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events"},m.prototype.initTabs_=function(){this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)&&this.element_.classList.add(this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS),this.tabs_=this.element_.querySelectorAll("."+this.CssClasses_.TAB_CLASS),this.panels_=this.element_.querySelectorAll("."+this.CssClasses_.PANEL_CLASS);for(var t=0;t<this.tabs_.length;t++)new e(this.tabs_[t],this);this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS)},m.prototype.resetTabState_=function(){for(var e=0;e<this.tabs_.length;e++)this.tabs_[e].classList.remove(this.CssClasses_.ACTIVE_CLASS)},m.prototype.resetPanelState_=function(){for(var e=0;e<this.panels_.length;e++)this.panels_[e].classList.remove(this.CssClasses_.ACTIVE_CLASS)},m.prototype.init=function(){this.element_&&this.initTabs_()},s.register({constructor:m,classAsString:"MaterialTabs",cssClass:"mdl-js-tabs"});var L=function(e){this.element_=e,this.maxRows=this.Constant_.NO_MAX_ROWS,this.init()};window.MaterialTextfield=L,L.prototype.Constant_={NO_MAX_ROWS:-1,MAX_ROWS_ATTRIBUTE:"maxrows"},L.prototype.CssClasses_={LABEL:"mdl-textfield__label",INPUT:"mdl-textfield__input",IS_DIRTY:"is-dirty",IS_FOCUSED:"is-focused",IS_DISABLED:"is-disabled",IS_INVALID:"is-invalid",IS_UPGRADED:"is-upgraded",HAS_PLACEHOLDER:"has-placeholder"},L.prototype.onKeyDown_=function(e){var t=e.target.value.split("\n").length;13===e.keyCode&&t>=this.maxRows&&e.preventDefault()},L.prototype.onFocus_=function(e){this.element_.classList.add(this.CssClasses_.IS_FOCUSED)},L.prototype.onBlur_=function(e){this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},L.prototype.onReset_=function(e){this.updateClasses_()},L.prototype.updateClasses_=function(){this.checkDisabled(),this.checkValidity(),this.checkDirty(),this.checkFocus()},L.prototype.checkDisabled=function(){this.input_.disabled?this.element_.classList.add(this.CssClasses_.IS_DISABLED):this.element_.classList.remove(this.CssClasses_.IS_DISABLED)},L.prototype.checkDisabled=L.prototype.checkDisabled,L.prototype.checkFocus=function(){Boolean(this.element_.querySelector(":focus"))?this.element_.classList.add(this.CssClasses_.IS_FOCUSED):this.element_.classList.remove(this.CssClasses_.IS_FOCUSED)},L.prototype.checkFocus=L.prototype.checkFocus,L.prototype.checkValidity=function(){this.input_.validity&&(this.input_.validity.valid?this.element_.classList.remove(this.CssClasses_.IS_INVALID):this.element_.classList.add(this.CssClasses_.IS_INVALID))},L.prototype.checkValidity=L.prototype.checkValidity,L.prototype.checkDirty=function(){this.input_.value&&this.input_.value.length>0?this.element_.classList.add(this.CssClasses_.IS_DIRTY):this.element_.classList.remove(this.CssClasses_.IS_DIRTY)},L.prototype.checkDirty=L.prototype.checkDirty,L.prototype.disable=function(){this.input_.disabled=!0,this.updateClasses_()},L.prototype.disable=L.prototype.disable,L.prototype.enable=function(){this.input_.disabled=!1,this.updateClasses_()},L.prototype.enable=L.prototype.enable,L.prototype.change=function(e){this.input_.value=e||"",this.updateClasses_()},L.prototype.change=L.prototype.change,L.prototype.init=function(){if(this.element_&&(this.label_=this.element_.querySelector("."+this.CssClasses_.LABEL),this.input_=this.element_.querySelector("."+this.CssClasses_.INPUT),this.input_)){this.input_.hasAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE)&&(this.maxRows=parseInt(this.input_.getAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE),10),isNaN(this.maxRows)&&(this.maxRows=this.Constant_.NO_MAX_ROWS)),this.input_.hasAttribute("placeholder")&&this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER),this.boundUpdateClassesHandler=this.updateClasses_.bind(this),this.boundFocusHandler=this.onFocus_.bind(this),this.boundBlurHandler=this.onBlur_.bind(this),this.boundResetHandler=this.onReset_.bind(this),this.input_.addEventListener("input",this.boundUpdateClassesHandler),this.input_.addEventListener("focus",this.boundFocusHandler),this.input_.addEventListener("blur",this.boundBlurHandler),this.input_.addEventListener("reset",this.boundResetHandler),this.maxRows!==this.Constant_.NO_MAX_ROWS&&(this.boundKeyDownHandler=this.onKeyDown_.bind(this),this.input_.addEventListener("keydown",this.boundKeyDownHandler));var e=this.element_.classList.contains(this.CssClasses_.IS_INVALID);this.updateClasses_(),this.element_.classList.add(this.CssClasses_.IS_UPGRADED),e&&this.element_.classList.add(this.CssClasses_.IS_INVALID),this.input_.hasAttribute("autofocus")&&(this.element_.focus(),this.checkFocus())}},s.register({constructor:L,classAsString:"MaterialTextfield",cssClass:"mdl-js-textfield",widget:!0});var I=function(e){this.element_=e,this.init()};window.MaterialTooltip=I,I.prototype.Constant_={},I.prototype.CssClasses_={IS_ACTIVE:"is-active",BOTTOM:"mdl-tooltip--bottom",LEFT:"mdl-tooltip--left",RIGHT:"mdl-tooltip--right",TOP:"mdl-tooltip--top"},I.prototype.handleMouseEnter_=function(e){var t=e.target.getBoundingClientRect(),s=t.left+t.width/2,i=t.top+t.height/2,n=-1*(this.element_.offsetWidth/2),a=-1*(this.element_.offsetHeight/2);this.element_.classList.contains(this.CssClasses_.LEFT)||this.element_.classList.contains(this.CssClasses_.RIGHT)?(s=t.width/2,i+a<0?(this.element_.style.top="0",this.element_.style.marginTop="0"):(this.element_.style.top=i+"px",this.element_.style.marginTop=a+"px")):s+n<0?(this.element_.style.left="0",this.element_.style.marginLeft="0"):(this.element_.style.left=s+"px",this.element_.style.marginLeft=n+"px"),this.element_.classList.contains(this.CssClasses_.TOP)?this.element_.style.top=t.top-this.element_.offsetHeight-10+"px":this.element_.classList.contains(this.CssClasses_.RIGHT)?this.element_.style.left=t.left+t.width+10+"px":this.element_.classList.contains(this.CssClasses_.LEFT)?this.element_.style.left=t.left-this.element_.offsetWidth-10+"px":this.element_.style.top=t.top+t.height+10+"px",this.element_.classList.add(this.CssClasses_.IS_ACTIVE)},I.prototype.hideTooltip_=function(){this.element_.classList.remove(this.CssClasses_.IS_ACTIVE)},I.prototype.init=function(){if(this.element_){var e=this.element_.getAttribute("for")||this.element_.getAttribute("data-mdl-for");e&&(this.forElement_=document.getElementById(e)),this.forElement_&&(this.forElement_.hasAttribute("tabindex")||this.forElement_.setAttribute("tabindex","0"),this.boundMouseEnterHandler=this.handleMouseEnter_.bind(this),this.boundMouseLeaveAndScrollHandler=this.hideTooltip_.bind(this),this.forElement_.addEventListener("mouseenter",this.boundMouseEnterHandler,!1),this.forElement_.addEventListener("touchend",this.boundMouseEnterHandler,!1),this.forElement_.addEventListener("mouseleave",this.boundMouseLeaveAndScrollHandler,!1),window.addEventListener("scroll",this.boundMouseLeaveAndScrollHandler,!0),window.addEventListener("touchstart",this.boundMouseLeaveAndScrollHandler))}},s.register({constructor:I,classAsString:"MaterialTooltip",cssClass:"mdl-tooltip"});var f=function(e){this.element_=e,this.init()};window.MaterialLayout=f,f.prototype.Constant_={MAX_WIDTH:"(max-width: 1024px)",TAB_SCROLL_PIXELS:100,RESIZE_TIMEOUT:100,MENU_ICON:"",CHEVRON_LEFT:"chevron_left",CHEVRON_RIGHT:"chevron_right"},f.prototype.Keycodes_={ENTER:13,ESCAPE:27,SPACE:32},f.prototype.Mode_={STANDARD:0,SEAMED:1,WATERFALL:2,SCROLL:3},f.prototype.CssClasses_={CONTAINER:"mdl-layout__container",HEADER:"mdl-layout__header",DRAWER:"mdl-layout__drawer",CONTENT:"mdl-layout__content",DRAWER_BTN:"mdl-layout__drawer-button",ICON:"material-icons",JS_RIPPLE_EFFECT:"mdl-js-ripple-effect",RIPPLE_CONTAINER:"mdl-layout__tab-ripple-container",RIPPLE:"mdl-ripple",RIPPLE_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",HEADER_SEAMED:"mdl-layout__header--seamed",HEADER_WATERFALL:"mdl-layout__header--waterfall",HEADER_SCROLL:"mdl-layout__header--scroll",FIXED_HEADER:"mdl-layout--fixed-header",OBFUSCATOR:"mdl-layout__obfuscator",TAB_BAR:"mdl-layout__tab-bar",TAB_CONTAINER:"mdl-layout__tab-bar-container",TAB:"mdl-layout__tab",TAB_BAR_BUTTON:"mdl-layout__tab-bar-button",TAB_BAR_LEFT_BUTTON:"mdl-layout__tab-bar-left-button",TAB_BAR_RIGHT_BUTTON:"mdl-layout__tab-bar-right-button",TAB_MANUAL_SWITCH:"mdl-layout__tab-manual-switch",PANEL:"mdl-layout__tab-panel",HAS_DRAWER:"has-drawer",HAS_TABS:"has-tabs",HAS_SCROLLING_HEADER:"has-scrolling-header",CASTING_SHADOW:"is-casting-shadow",IS_COMPACT:"is-compact",IS_SMALL_SCREEN:"is-small-screen",IS_DRAWER_OPEN:"is-visible",IS_ACTIVE:"is-active",IS_UPGRADED:"is-upgraded",IS_ANIMATING:"is-animating",ON_LARGE_SCREEN:"mdl-layout--large-screen-only",ON_SMALL_SCREEN:"mdl-layout--small-screen-only"},f.prototype.contentScrollHandler_=function(){if(!this.header_.classList.contains(this.CssClasses_.IS_ANIMATING)){var e=!this.element_.classList.contains(this.CssClasses_.IS_SMALL_SCREEN)||this.element_.classList.contains(this.CssClasses_.FIXED_HEADER);this.content_.scrollTop>0&&!this.header_.classList.contains(this.CssClasses_.IS_COMPACT)?(this.header_.classList.add(this.CssClasses_.CASTING_SHADOW),this.header_.classList.add(this.CssClasses_.IS_COMPACT),e&&this.header_.classList.add(this.CssClasses_.IS_ANIMATING)):this.content_.scrollTop<=0&&this.header_.classList.contains(this.CssClasses_.IS_COMPACT)&&(this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW),this.header_.classList.remove(this.CssClasses_.IS_COMPACT),e&&this.header_.classList.add(this.CssClasses_.IS_ANIMATING))}},f.prototype.keyboardEventHandler_=function(e){e.keyCode===this.Keycodes_.ESCAPE&&this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)&&this.toggleDrawer()},f.prototype.screenSizeHandler_=function(){this.screenSizeMediaQuery_.matches?this.element_.classList.add(this.CssClasses_.IS_SMALL_SCREEN):(this.element_.classList.remove(this.CssClasses_.IS_SMALL_SCREEN),this.drawer_&&(this.drawer_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN),this.obfuscator_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN)))},f.prototype.drawerToggleHandler_=function(e){if(e&&"keydown"===e.type){if(e.keyCode!==this.Keycodes_.SPACE&&e.keyCode!==this.Keycodes_.ENTER)return;e.preventDefault()}this.toggleDrawer()},f.prototype.headerTransitionEndHandler_=function(){this.header_.classList.remove(this.CssClasses_.IS_ANIMATING)},f.prototype.headerClickHandler_=function(){this.header_.classList.contains(this.CssClasses_.IS_COMPACT)&&(this.header_.classList.remove(this.CssClasses_.IS_COMPACT),this.header_.classList.add(this.CssClasses_.IS_ANIMATING))},f.prototype.resetTabState_=function(e){for(var t=0;t<e.length;t++)e[t].classList.remove(this.CssClasses_.IS_ACTIVE)},f.prototype.resetPanelState_=function(e){for(var t=0;t<e.length;t++)e[t].classList.remove(this.CssClasses_.IS_ACTIVE)},f.prototype.toggleDrawer=function(){var e=this.element_.querySelector("."+this.CssClasses_.DRAWER_BTN);this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN),this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN),this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)?(this.drawer_.setAttribute("aria-hidden","false"),e.setAttribute("aria-expanded","true")):(this.drawer_.setAttribute("aria-hidden","true"),e.setAttribute("aria-expanded","false"))},f.prototype.toggleDrawer=f.prototype.toggleDrawer,f.prototype.init=function(){if(this.element_){var e=document.createElement("div");e.classList.add(this.CssClasses_.CONTAINER);var s=this.element_.querySelector(":focus");this.element_.parentElement.insertBefore(e,this.element_),this.element_.parentElement.removeChild(this.element_),e.appendChild(this.element_),s&&s.focus();for(var i=this.element_.childNodes,n=i.length,a=0;a<n;a++){var l=i[a];l.classList&&l.classList.contains(this.CssClasses_.HEADER)&&(this.header_=l),l.classList&&l.classList.contains(this.CssClasses_.DRAWER)&&(this.drawer_=l),l.classList&&l.classList.contains(this.CssClasses_.CONTENT)&&(this.content_=l)}window.addEventListener("pageshow",function(e){e.persisted&&(this.element_.style.overflowY="hidden",requestAnimationFrame(function(){this.element_.style.overflowY=""}.bind(this)))}.bind(this),!1),this.header_&&(this.tabBar_=this.header_.querySelector("."+this.CssClasses_.TAB_BAR));var o=this.Mode_.STANDARD;if(this.header_&&(this.header_.classList.contains(this.CssClasses_.HEADER_SEAMED)?o=this.Mode_.SEAMED:this.header_.classList.contains(this.CssClasses_.HEADER_WATERFALL)?(o=this.Mode_.WATERFALL,this.header_.addEventListener("transitionend",this.headerTransitionEndHandler_.bind(this)),this.header_.addEventListener("click",this.headerClickHandler_.bind(this))):this.header_.classList.contains(this.CssClasses_.HEADER_SCROLL)&&(o=this.Mode_.SCROLL,e.classList.add(this.CssClasses_.HAS_SCROLLING_HEADER)),o===this.Mode_.STANDARD?(this.header_.classList.add(this.CssClasses_.CASTING_SHADOW),this.tabBar_&&this.tabBar_.classList.add(this.CssClasses_.CASTING_SHADOW)):o===this.Mode_.SEAMED||o===this.Mode_.SCROLL?(this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW),this.tabBar_&&this.tabBar_.classList.remove(this.CssClasses_.CASTING_SHADOW)):o===this.Mode_.WATERFALL&&(this.content_.addEventListener("scroll",this.contentScrollHandler_.bind(this)),this.contentScrollHandler_())),this.drawer_){var r=this.element_.querySelector("."+this.CssClasses_.DRAWER_BTN);if(!r){r=document.createElement("div"),r.setAttribute("aria-expanded","false"),r.setAttribute("role","button"),r.setAttribute("tabindex","0"),r.classList.add(this.CssClasses_.DRAWER_BTN);var _=document.createElement("i");_.classList.add(this.CssClasses_.ICON),_.innerHTML=this.Constant_.MENU_ICON,r.appendChild(_)}this.drawer_.classList.contains(this.CssClasses_.ON_LARGE_SCREEN)?r.classList.add(this.CssClasses_.ON_LARGE_SCREEN):this.drawer_.classList.contains(this.CssClasses_.ON_SMALL_SCREEN)&&r.classList.add(this.CssClasses_.ON_SMALL_SCREEN),r.addEventListener("click",this.drawerToggleHandler_.bind(this)),r.addEventListener("keydown",this.drawerToggleHandler_.bind(this)),this.element_.classList.add(this.CssClasses_.HAS_DRAWER),this.element_.classList.contains(this.CssClasses_.FIXED_HEADER)?this.header_.insertBefore(r,this.header_.firstChild):this.element_.insertBefore(r,this.content_);var d=document.createElement("div");d.classList.add(this.CssClasses_.OBFUSCATOR),this.element_.appendChild(d),d.addEventListener("click",this.drawerToggleHandler_.bind(this)),this.obfuscator_=d,this.drawer_.addEventListener("keydown",this.keyboardEventHandler_.bind(this)),this.drawer_.setAttribute("aria-hidden","true")}if(this.screenSizeMediaQuery_=window.matchMedia(this.Constant_.MAX_WIDTH),this.screenSizeMediaQuery_.addListener(this.screenSizeHandler_.bind(this)),this.screenSizeHandler_(),this.header_&&this.tabBar_){this.element_.classList.add(this.CssClasses_.HAS_TABS);var h=document.createElement("div");h.classList.add(this.CssClasses_.TAB_CONTAINER),this.header_.insertBefore(h,this.tabBar_),this.header_.removeChild(this.tabBar_);var c=document.createElement("div");c.classList.add(this.CssClasses_.TAB_BAR_BUTTON),c.classList.add(this.CssClasses_.TAB_BAR_LEFT_BUTTON);var p=document.createElement("i");p.classList.add(this.CssClasses_.ICON),p.textContent=this.Constant_.CHEVRON_LEFT,c.appendChild(p),c.addEventListener("click",function(){this.tabBar_.scrollLeft-=this.Constant_.TAB_SCROLL_PIXELS}.bind(this));var C=document.createElement("div");C.classList.add(this.CssClasses_.TAB_BAR_BUTTON),C.classList.add(this.CssClasses_.TAB_BAR_RIGHT_BUTTON);var u=document.createElement("i");u.classList.add(this.CssClasses_.ICON),u.textContent=this.Constant_.CHEVRON_RIGHT,C.appendChild(u),C.addEventListener("click",function(){this.tabBar_.scrollLeft+=this.Constant_.TAB_SCROLL_PIXELS}.bind(this)),h.appendChild(c),h.appendChild(this.tabBar_),h.appendChild(C);var E=function(){this.tabBar_.scrollLeft>0?c.classList.add(this.CssClasses_.IS_ACTIVE):c.classList.remove(this.CssClasses_.IS_ACTIVE),this.tabBar_.scrollLeft<this.tabBar_.scrollWidth-this.tabBar_.offsetWidth?C.classList.add(this.CssClasses_.IS_ACTIVE):C.classList.remove(this.CssClasses_.IS_ACTIVE)}.bind(this);this.tabBar_.addEventListener("scroll",E),E();var m=function(){this.resizeTimeoutId_&&clearTimeout(this.resizeTimeoutId_),this.resizeTimeoutId_=setTimeout(function(){E(),this.resizeTimeoutId_=null}.bind(this),this.Constant_.RESIZE_TIMEOUT)}.bind(this);window.addEventListener("resize",m),this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)&&this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);for(var L=this.tabBar_.querySelectorAll("."+this.CssClasses_.TAB),I=this.content_.querySelectorAll("."+this.CssClasses_.PANEL),f=0;f<L.length;f++)new t(L[f],L,I,this)}this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}},window.MaterialLayoutTab=t,s.register({constructor:f,classAsString:"MaterialLayout",cssClass:"mdl-js-layout"});var b=function(e){this.element_=e,this.init()};window.MaterialDataTable=b,b.prototype.Constant_={},b.prototype.CssClasses_={DATA_TABLE:"mdl-data-table",SELECTABLE:"mdl-data-table--selectable",SELECT_ELEMENT:"mdl-data-table__select",IS_SELECTED:"is-selected",IS_UPGRADED:"is-upgraded"},b.prototype.selectRow_=function(e,t,s){return t?function(){e.checked?t.classList.add(this.CssClasses_.IS_SELECTED):t.classList.remove(this.CssClasses_.IS_SELECTED)}.bind(this):s?function(){var t,i;if(e.checked)for(t=0;t<s.length;t++)i=s[t].querySelector("td").querySelector(".mdl-checkbox"),i.MaterialCheckbox.check(),s[t].classList.add(this.CssClasses_.IS_SELECTED);else for(t=0;t<s.length;t++)i=s[t].querySelector("td").querySelector(".mdl-checkbox"),i.MaterialCheckbox.uncheck(),s[t].classList.remove(this.CssClasses_.IS_SELECTED)}.bind(this):void 0},b.prototype.createCheckbox_=function(e,t){var i=document.createElement("label"),n=["mdl-checkbox","mdl-js-checkbox","mdl-js-ripple-effect",this.CssClasses_.SELECT_ELEMENT];i.className=n.join(" ");var a=document.createElement("input");return a.type="checkbox",a.classList.add("mdl-checkbox__input"),e?(a.checked=e.classList.contains(this.CssClasses_.IS_SELECTED),a.addEventListener("change",this.selectRow_(a,e))):t&&a.addEventListener("change",this.selectRow_(a,null,t)),i.appendChild(a),s.upgradeElement(i,"MaterialCheckbox"),i},b.prototype.init=function(){if(this.element_){var e=this.element_.querySelector("th"),t=Array.prototype.slice.call(this.element_.querySelectorAll("tbody tr")),s=Array.prototype.slice.call(this.element_.querySelectorAll("tfoot tr")),i=t.concat(s);if(this.element_.classList.contains(this.CssClasses_.SELECTABLE)){var n=document.createElement("th"),a=this.createCheckbox_(null,i);n.appendChild(a),e.parentElement.insertBefore(n,e);for(var l=0;l<i.length;l++){var o=i[l].querySelector("td");if(o){var r=document.createElement("td");if("TBODY"===i[l].parentNode.nodeName.toUpperCase()){var _=this.createCheckbox_(i[l]);r.appendChild(_)}i[l].insertBefore(r,o)}}this.element_.classList.add(this.CssClasses_.IS_UPGRADED)}}},s.register({constructor:b,classAsString:"MaterialDataTable",cssClass:"mdl-js-data-table"});var S=function(e){this.element_=e,this.init()};window.MaterialRipple=S,S.prototype.Constant_={INITIAL_SCALE:"scale(0.0001, 0.0001)",INITIAL_SIZE:"1px",INITIAL_OPACITY:"0.4",FINAL_OPACITY:"0",FINAL_SCALE:""},S.prototype.CssClasses_={RIPPLE_CENTER:"mdl-ripple--center",RIPPLE_EFFECT_IGNORE_EVENTS:"mdl-js-ripple-effect--ignore-events",RIPPLE:"mdl-ripple",IS_ANIMATING:"is-animating",IS_VISIBLE:"is-visible"},S.prototype.downHandler_=function(e){if(!this.rippleElement_.style.width&&!this.rippleElement_.style.height){var t=this.element_.getBoundingClientRect();this.boundHeight=t.height,this.boundWidth=t.width,this.rippleSize_=2*Math.sqrt(t.width*t.width+t.height*t.height)+2,this.rippleElement_.style.width=this.rippleSize_+"px",this.rippleElement_.style.height=this.rippleSize_+"px"}if(this.rippleElement_.classList.add(this.CssClasses_.IS_VISIBLE),"mousedown"===e.type&&this.ignoringMouseDown_)this.ignoringMouseDown_=!1;else{"touchstart"===e.type&&(this.ignoringMouseDown_=!0);var s=this.getFrameCount();if(s>0)return;this.setFrameCount(1);var i,n,a=e.currentTarget.getBoundingClientRect();if(0===e.clientX&&0===e.clientY)i=Math.round(a.width/2),n=Math.round(a.height/2);else{var l=void 0!==e.clientX?e.clientX:e.touches[0].clientX,o=void 0!==e.clientY?e.clientY:e.touches[0].clientY;i=Math.round(l-a.left),n=Math.round(o-a.top)}this.setRippleXY(i,n),this.setRippleStyles(!0),window.requestAnimationFrame(this.animFrameHandler.bind(this))}},S.prototype.upHandler_=function(e){e&&2!==e.detail&&window.setTimeout(function(){this.rippleElement_.classList.remove(this.CssClasses_.IS_VISIBLE)}.bind(this),0)},S.prototype.init=function(){if(this.element_){var e=this.element_.classList.contains(this.CssClasses_.RIPPLE_CENTER);this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT_IGNORE_EVENTS)||(this.rippleElement_=this.element_.querySelector("."+this.CssClasses_.RIPPLE),this.frameCount_=0,this.rippleSize_=0,this.x_=0,this.y_=0,this.ignoringMouseDown_=!1,this.boundDownHandler=this.downHandler_.bind(this),this.element_.addEventListener("mousedown",this.boundDownHandler),this.element_.addEventListener("touchstart",this.boundDownHandler),this.boundUpHandler=this.upHandler_.bind(this),this.element_.addEventListener("mouseup",this.boundUpHandler),this.element_.addEventListener("mouseleave",this.boundUpHandler),this.element_.addEventListener("touchend",this.boundUpHandler),this.element_.addEventListener("blur",this.boundUpHandler),this.getFrameCount=function(){return this.frameCount_},this.setFrameCount=function(e){this.frameCount_=e},this.getRippleElement=function(){return this.rippleElement_},this.setRippleXY=function(e,t){this.x_=e,this.y_=t},this.setRippleStyles=function(t){if(null!==this.rippleElement_){var s,i,n,a="translate("+this.x_+"px, "+this.y_+"px)";t?(i=this.Constant_.INITIAL_SCALE,n=this.Constant_.INITIAL_SIZE):(i=this.Constant_.FINAL_SCALE,n=this.rippleSize_+"px",e&&(a="translate("+this.boundWidth/2+"px, "+this.boundHeight/2+"px)")),s="translate(-50%, -50%) "+a+i,this.rippleElement_.style.webkitTransform=s,this.rippleElement_.style.msTransform=s,this.rippleElement_.style.transform=s,t?this.rippleElement_.classList.remove(this.CssClasses_.IS_ANIMATING):this.rippleElement_.classList.add(this.CssClasses_.IS_ANIMATING)}},this.animFrameHandler=function(){this.frameCount_-- >0?window.requestAnimationFrame(this.animFrameHandler.bind(this)):this.setRippleStyles(!1)})}},s.register({constructor:S,classAsString:"MaterialRipple",cssClass:"mdl-js-ripple-effect",widget:!1})}();
+//# sourceMappingURL=material.min.js.map
diff --git a/src/material.min.js.map b/src/material.min.js.map
new file mode 100644
index 0000000..6163150
--- /dev/null
+++ b/src/material.min.js.map
@@ -0,0 +1,630 @@
+{
+ "version": 3,
+ "sources": [
+ "tabs.js",
+ "layout.js",
+ "mdlComponentHandler.js",
+ "rAF.js",
+ "button.js",
+ "checkbox.js",
+ "icon-toggle.js",
+ "menu.js",
+ "progress.js",
+ "radio.js",
+ "slider.js",
+ "snackbar.js",
+ "spinner.js",
+ "switch.js",
+ "textfield.js",
+ "tooltip.js",
+ "data-table.js",
+ "ripple.js"
+ ],
+ "names": [
+ "MaterialTab",
+ "tab",
+ "ctx",
+ "element_",
+ "classList",
+ "contains",
+ "CssClasses_",
+ "MDL_JS_RIPPLE_EFFECT",
+ "rippleContainer",
+ "document",
+ "createElement",
+ "add",
+ "MDL_RIPPLE_CONTAINER",
+ "ripple",
+ "MDL_RIPPLE",
+ "appendChild",
+ "addEventListener",
+ "e",
+ "getAttribute",
+ "charAt",
+ "preventDefault",
+ "href",
+ "split",
+ "panel",
+ "querySelector",
+ "resetTabState_",
+ "resetPanelState_",
+ "ACTIVE_CLASS",
+ "MaterialLayoutTab",
+ "tabs",
+ "panels",
+ "layout",
+ "selectTab",
+ "content_",
+ "IS_ACTIVE",
+ "tabBar_",
+ "JS_RIPPLE_EFFECT",
+ "RIPPLE_CONTAINER",
+ "RIPPLE",
+ "TAB_MANUAL_SWITCH",
+ "show",
+ "componentHandler",
+ "upgradeDom",
+ "optJsClass",
+ "optCssClass",
+ "upgradeElement",
+ "element",
+ "upgradeElements",
+ "elements",
+ "upgradeAllRegistered",
+ "registerUpgradedCallback",
+ "jsClass",
+ "callback",
+ "register",
+ "config",
+ "downgradeElements",
+ "nodes",
+ "findRegisteredClass_",
+ "name",
+ "optReplace",
+ "i",
+ "registeredComponents_",
+ "length",
+ "className",
+ "getUpgradedListOfElement_",
+ "dataUpgraded",
+ "isElementUpgraded_",
+ "upgradedList",
+ "indexOf",
+ "createEvent_",
+ "eventType",
+ "bubbles",
+ "cancelable",
+ "window",
+ "CustomEvent",
+ "ev",
+ "createEvent",
+ "initEvent",
+ "upgradeDomInternal",
+ "cssClass",
+ "registeredClass",
+ "querySelectorAll",
+ "n",
+ "upgradeElementInternal",
+ "Element",
+ "Error",
+ "upgradingEv",
+ "dispatchEvent",
+ "defaultPrevented",
+ "classesToUpgrade",
+ "push",
+ "forEach",
+ "component",
+ "setAttribute",
+ "join",
+ "instance",
+ "classConstructor",
+ "componentConfigProperty_",
+ "createdComponents_",
+ "j",
+ "m",
+ "callbacks",
+ "widget",
+ "upgradedEv",
+ "upgradeElementsInternal",
+ "Array",
+ "isArray",
+ "prototype",
+ "slice",
+ "call",
+ "HTMLElement",
+ "children",
+ "registerInternal",
+ "widgetMissing",
+ "newConfig",
+ "constructor",
+ "classAsString",
+ "item",
+ "hasOwnProperty",
+ "found",
+ "registerUpgradedCallbackInternal",
+ "regClass",
+ "upgradeAllRegisteredInternal",
+ "deconstructComponentInternal",
+ "componentIndex",
+ "splice",
+ "upgrades",
+ "componentPlace",
+ "downgradeNodesInternal",
+ "downgradeNode",
+ "node",
+ "filter",
+ "NodeList",
+ "Node",
+ "ComponentConfigPublic",
+ "ComponentConfig",
+ "Component",
+ "documentElement",
+ "Date",
+ "now",
+ "getTime",
+ "vendors",
+ "requestAnimationFrame",
+ "vp",
+ "cancelAnimationFrame",
+ "test",
+ "navigator",
+ "userAgent",
+ "lastTime",
+ "nextTime",
+ "Math",
+ "max",
+ "setTimeout",
+ "clearTimeout",
+ "MaterialButton",
+ "this",
+ "init",
+ "Constant_",
+ "RIPPLE_EFFECT",
+ "blurHandler_",
+ "event",
+ "blur",
+ "disable",
+ "disabled",
+ "enable",
+ "rippleElement_",
+ "boundRippleBlurHandler",
+ "bind",
+ "boundButtonBlurHandler",
+ "MaterialCheckbox",
+ "TINY_TIMEOUT",
+ "INPUT",
+ "BOX_OUTLINE",
+ "FOCUS_HELPER",
+ "TICK_OUTLINE",
+ "RIPPLE_IGNORE_EVENTS",
+ "RIPPLE_CENTER",
+ "IS_FOCUSED",
+ "IS_DISABLED",
+ "IS_CHECKED",
+ "IS_UPGRADED",
+ "onChange_",
+ "updateClasses_",
+ "onFocus_",
+ "onBlur_",
+ "remove",
+ "onMouseUp_",
+ "blur_",
+ "checkDisabled",
+ "checkToggleState",
+ "inputElement_",
+ "checked",
+ "check",
+ "uncheck",
+ "boxOutline",
+ "tickContainer",
+ "tickOutline",
+ "rippleContainerElement_",
+ "boundRippleMouseUp",
+ "boundInputOnChange",
+ "boundInputOnFocus",
+ "boundInputOnBlur",
+ "boundElementMouseUp",
+ "MaterialIconToggle",
+ "boundElementOnMouseUp",
+ "MaterialMenu",
+ "TRANSITION_DURATION_SECONDS",
+ "TRANSITION_DURATION_FRACTION",
+ "CLOSE_TIMEOUT",
+ "Keycodes_",
+ "ENTER",
+ "ESCAPE",
+ "SPACE",
+ "UP_ARROW",
+ "DOWN_ARROW",
+ "CONTAINER",
+ "OUTLINE",
+ "ITEM",
+ "ITEM_RIPPLE_CONTAINER",
+ "IS_VISIBLE",
+ "IS_ANIMATING",
+ "BOTTOM_LEFT",
+ "BOTTOM_RIGHT",
+ "TOP_LEFT",
+ "TOP_RIGHT",
+ "UNALIGNED",
+ "container",
+ "parentElement",
+ "insertBefore",
+ "removeChild",
+ "container_",
+ "outline",
+ "outline_",
+ "forElId",
+ "forEl",
+ "getElementById",
+ "forElement_",
+ "handleForClick_",
+ "handleForKeyboardEvent_",
+ "items",
+ "boundItemKeydown_",
+ "handleItemKeyboardEvent_",
+ "boundItemClick_",
+ "handleItemClick_",
+ "tabIndex",
+ "evt",
+ "rect",
+ "getBoundingClientRect",
+ "forRect",
+ "style",
+ "right",
+ "top",
+ "offsetTop",
+ "offsetHeight",
+ "left",
+ "offsetLeft",
+ "bottom",
+ "toggle",
+ "keyCode",
+ "focus",
+ "currentIndex",
+ "target",
+ "MouseEvent",
+ "click",
+ "hide",
+ "hasAttribute",
+ "stopPropagation",
+ "closing_",
+ "applyClip_",
+ "height",
+ "width",
+ "clip",
+ "removeAnimationEndListener_",
+ "addAnimationEndListener_",
+ "transitionDuration",
+ "itemDelay",
+ "transitionDelay",
+ "parentNode",
+ "removeEventListener",
+ "removeProperty",
+ "MaterialProgress",
+ "INDETERMINATE_CLASS",
+ "setProgress",
+ "p",
+ "progressbar_",
+ "setBuffer",
+ "bufferbar_",
+ "auxbar_",
+ "el",
+ "MaterialRadio",
+ "JS_RADIO",
+ "RADIO_BTN",
+ "RADIO_OUTER_CIRCLE",
+ "RADIO_INNER_CIRCLE",
+ "radios",
+ "getElementsByClassName",
+ "button",
+ "btnElement_",
+ "onMouseup_",
+ "boundChangeHandler_",
+ "boundFocusHandler_",
+ "boundBlurHandler_",
+ "boundMouseUpHandler_",
+ "outerCircle",
+ "innerCircle",
+ "MaterialSlider",
+ "isIE_",
+ "msPointerEnabled",
+ "IE_CONTAINER",
+ "SLIDER_CONTAINER",
+ "BACKGROUND_FLEX",
+ "BACKGROUND_LOWER",
+ "BACKGROUND_UPPER",
+ "IS_LOWEST_VALUE",
+ "onInput_",
+ "updateValueStyles_",
+ "onContainerMouseDown_",
+ "newEvent",
+ "buttons",
+ "clientX",
+ "clientY",
+ "y",
+ "fraction",
+ "value",
+ "min",
+ "backgroundLower_",
+ "flex",
+ "webkitFlex",
+ "backgroundUpper_",
+ "change",
+ "containerIE",
+ "backgroundFlex",
+ "boundInputHandler",
+ "boundChangeHandler",
+ "boundMouseUpHandler",
+ "boundContainerMouseDownHandler",
+ "MaterialSnackbar",
+ "textElement_",
+ "cssClasses_",
+ "MESSAGE",
+ "actionElement_",
+ "ACTION",
+ "active",
+ "actionHandler_",
+ "undefined",
+ "message_",
+ "actionText_",
+ "queuedNotifications_",
+ "setActionHidden_",
+ "ANIMATION_LENGTH",
+ "SNACKBAR",
+ "ACTIVE",
+ "displaySnackbar_",
+ "textContent",
+ "cleanup_",
+ "timeout_",
+ "showSnackbar",
+ "data",
+ "checkQueue_",
+ "shift",
+ "Boolean",
+ "removeAttribute",
+ "MaterialSpinner",
+ "MDL_SPINNER_LAYER_COUNT",
+ "MDL_SPINNER_LAYER",
+ "MDL_SPINNER_CIRCLE_CLIPPER",
+ "MDL_SPINNER_CIRCLE",
+ "MDL_SPINNER_GAP_PATCH",
+ "MDL_SPINNER_LEFT",
+ "MDL_SPINNER_RIGHT",
+ "createLayer",
+ "index",
+ "layer",
+ "leftClipper",
+ "gapPatch",
+ "rightClipper",
+ "circleOwners",
+ "circle",
+ "stop",
+ "start",
+ "MaterialSwitch",
+ "TRACK",
+ "THUMB",
+ "on",
+ "off",
+ "track",
+ "thumb",
+ "focusHelper",
+ "boundFocusHandler",
+ "boundBlurHandler",
+ "MaterialTabs",
+ "TAB_CLASS",
+ "PANEL_CLASS",
+ "UPGRADED_CLASS",
+ "MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS",
+ "initTabs_",
+ "tabs_",
+ "panels_",
+ "k",
+ "MaterialTextfield",
+ "maxRows",
+ "NO_MAX_ROWS",
+ "MAX_ROWS_ATTRIBUTE",
+ "LABEL",
+ "IS_DIRTY",
+ "IS_INVALID",
+ "HAS_PLACEHOLDER",
+ "onKeyDown_",
+ "currentRowCount",
+ "onReset_",
+ "checkValidity",
+ "checkDirty",
+ "checkFocus",
+ "input_",
+ "validity",
+ "valid",
+ "label_",
+ "parseInt",
+ "isNaN",
+ "boundUpdateClassesHandler",
+ "boundResetHandler",
+ "boundKeyDownHandler",
+ "invalid",
+ "MaterialTooltip",
+ "BOTTOM",
+ "LEFT",
+ "RIGHT",
+ "TOP",
+ "handleMouseEnter_",
+ "props",
+ "marginLeft",
+ "offsetWidth",
+ "marginTop",
+ "hideTooltip_",
+ "boundMouseEnterHandler",
+ "boundMouseLeaveAndScrollHandler",
+ "MaterialLayout",
+ "MAX_WIDTH",
+ "TAB_SCROLL_PIXELS",
+ "RESIZE_TIMEOUT",
+ "MENU_ICON",
+ "CHEVRON_LEFT",
+ "CHEVRON_RIGHT",
+ "Mode_",
+ "STANDARD",
+ "SEAMED",
+ "WATERFALL",
+ "SCROLL",
+ "HEADER",
+ "DRAWER",
+ "CONTENT",
+ "DRAWER_BTN",
+ "ICON",
+ "HEADER_SEAMED",
+ "HEADER_WATERFALL",
+ "HEADER_SCROLL",
+ "FIXED_HEADER",
+ "OBFUSCATOR",
+ "TAB_BAR",
+ "TAB_CONTAINER",
+ "TAB",
+ "TAB_BAR_BUTTON",
+ "TAB_BAR_LEFT_BUTTON",
+ "TAB_BAR_RIGHT_BUTTON",
+ "PANEL",
+ "HAS_DRAWER",
+ "HAS_TABS",
+ "HAS_SCROLLING_HEADER",
+ "CASTING_SHADOW",
+ "IS_COMPACT",
+ "IS_SMALL_SCREEN",
+ "IS_DRAWER_OPEN",
+ "ON_LARGE_SCREEN",
+ "ON_SMALL_SCREEN",
+ "contentScrollHandler_",
+ "header_",
+ "headerVisible",
+ "scrollTop",
+ "keyboardEventHandler_",
+ "drawer_",
+ "toggleDrawer",
+ "screenSizeHandler_",
+ "screenSizeMediaQuery_",
+ "matches",
+ "obfuscator_",
+ "drawerToggleHandler_",
+ "type",
+ "headerTransitionEndHandler_",
+ "headerClickHandler_",
+ "tabBar",
+ "drawerButton",
+ "focusedElement",
+ "directChildren",
+ "childNodes",
+ "numChildren",
+ "c",
+ "child",
+ "persisted",
+ "overflowY",
+ "mode",
+ "drawerButtonIcon",
+ "innerHTML",
+ "firstChild",
+ "obfuscator",
+ "matchMedia",
+ "addListener",
+ "tabContainer",
+ "leftButton",
+ "leftButtonIcon",
+ "scrollLeft",
+ "rightButton",
+ "rightButtonIcon",
+ "tabUpdateHandler",
+ "scrollWidth",
+ "windowResizeHandler",
+ "resizeTimeoutId_",
+ "MaterialDataTable",
+ "DATA_TABLE",
+ "SELECTABLE",
+ "SELECT_ELEMENT",
+ "IS_SELECTED",
+ "selectRow_",
+ "checkbox",
+ "row",
+ "opt_rows",
+ "createCheckbox_",
+ "label",
+ "labelClasses",
+ "firstHeader",
+ "bodyRows",
+ "footRows",
+ "rows",
+ "concat",
+ "th",
+ "headerCheckbox",
+ "firstCell",
+ "td",
+ "nodeName",
+ "toUpperCase",
+ "rowCheckbox",
+ "MaterialRipple",
+ "INITIAL_SCALE",
+ "INITIAL_SIZE",
+ "INITIAL_OPACITY",
+ "FINAL_OPACITY",
+ "FINAL_SCALE",
+ "RIPPLE_EFFECT_IGNORE_EVENTS",
+ "downHandler_",
+ "boundHeight",
+ "boundWidth",
+ "rippleSize_",
+ "sqrt",
+ "ignoringMouseDown_",
+ "frameCount",
+ "getFrameCount",
+ "setFrameCount",
+ "x",
+ "bound",
+ "currentTarget",
+ "round",
+ "touches",
+ "setRippleXY",
+ "setRippleStyles",
+ "animFrameHandler",
+ "upHandler_",
+ "detail",
+ "recentering",
+ "frameCount_",
+ "x_",
+ "y_",
+ "boundDownHandler",
+ "boundUpHandler",
+ "fC",
+ "getRippleElement",
+ "newX",
+ "newY",
+ "transformString",
+ "scale",
+ "size",
+ "offset",
+ "webkitTransform",
+ "msTransform",
+ "transform"
+ ],
+ "mappings": ";;;;;;;wBA6GA,SAAAA,GAAAC,EAAAC,GACA,GAAAD,EAAA,CACA,GAAAC,EAAAC,SAAAC,UAAAC,SAAAH,EAAAI,YAAAC,sBAAA,CACA,GAAAC,GAAAC,SAAAC,cAAA,OACAF,GAAAJ,UAAAO,IAAAT,EAAAI,YAAAM,sBACAJ,EAAAJ,UAAAO,IAAAT,EAAAI,YAAAC,qBACA,IAAAM,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAT,EAAAI,YAAAQ,YACAN,EAAAO,YAAAF,GACAZ,EAAAc,YAAAP,GAEAP,EAAAe,iBAAA,QAAA,SAAAC,GACA,GAAA,MAAAhB,EAAAiB,aAAA,QAAAC,OAAA,GAAA,CACAF,EAAAG,gBACA,IAAAC,GAAApB,EAAAoB,KAAAC,MAAA,KAAA,GACAC,EAAArB,EAAAC,SAAAqB,cAAA,IAAAH,EACAnB,GAAAuB,iBACAvB,EAAAwB,mBACAzB,EAAAG,UAAAO,IAAAT,EAAAI,YAAAqB,cACAJ,EAAAnB,UAAAO,IAAAT,EAAAI,YAAAqB,kBCwTA,QAAAC,GAAA3B,EAAA4B,EAAAC,EAAAC,GAIA,QAAAC,KACA,GAAAX,GAAApB,EAAAoB,KAAAC,MAAA,KAAA,GACAC,EAAAQ,EAAAE,SAAAT,cAAA,IAAAH,EACAU,GAAAN,eAAAI,GACAE,EAAAL,iBAAAI,GACA7B,EAAAG,UAAAO,IAAAoB,EAAAzB,YAAA4B,WACAX,EAAAnB,UAAAO,IAAAoB,EAAAzB,YAAA4B,WAEA,GAAAH,EAAAI,QAAA/B,UAAAC,SAAA0B,EAAAzB,YAAA8B,kBAAA,CACA,GAAA5B,GAAAC,SAAAC,cAAA,OACAF,GAAAJ,UAAAO,IAAAoB,EAAAzB,YAAA+B,kBACA7B,EAAAJ,UAAAO,IAAAoB,EAAAzB,YAAA8B,iBACA,IAAAvB,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAoB,EAAAzB,YAAAgC,QACA9B,EAAAO,YAAAF,GACAZ,EAAAc,YAAAP,GAEAuB,EAAAI,QAAA/B,UAAAC,SAAA0B,EAAAzB,YAAAiC,oBACAtC,EAAAe,iBAAA,QAAA,SAAAC,GACA,MAAAhB,EAAAiB,aAAA,QAAAC,OAAA,KACAF,EAAAG,iBACAY,OAIA/B,EAAAuC,KAAAR,ECzbA,GAAAS,IAUAC,WAAA,SAAAC,EAAAC,KAQAC,eAAA,SAAAC,EAAAH,KAOAI,gBAAA,SAAAC,KAKAC,qBAAA,aAWAC,yBAAA,SAAAC,EAAAC,KAMAC,SAAA,SAAAC,KAMAC,kBAAA,SAAAC,KAGAf,GAAA,WAoBA,QAAAgB,GAAAC,EAAAC,GACA,IAAA,GAAAC,GAAA,EAAAA,EAAAC,EAAAC,OAAAF,IACA,GAAAC,EAAAD,GAAAG,YAAAL,EAIA,MAHA,mBAAAC,KACAE,EAAAD,GAAAD,GAEAE,EAAAD,EAGA,QAAA,EAUA,QAAAI,GAAAlB,GACA,GAAAmB,GAAAnB,EAAA5B,aAAA,gBAEA,OAAA,QAAA+C,GAAA,IAAAA,EAAA3C,MAAA,KAYA,QAAA4C,GAAApB,EAAAK,GACA,GAAAgB,GAAAH,EAAAlB,EACA,OAAAqB,GAAAC,QAAAjB,MAAA,EAWA,QAAAkB,GAAAC,EAAAC,EAAAC,GACA,GAAA,eAAAC,SAAA,kBAAAA,QAAAC,YACA,MAAA,IAAAA,aAAAJ,GACAC,QAAAA,EACAC,WAAAA,GAGA,IAAAG,GAAAlE,SAAAmE,YAAA,SAEA,OADAD,GAAAE,UAAAP,EAAAC,EAAAC,GACAG,EAaA,QAAAG,GAAAnC,EAAAC,GACA,GAAA,mBAAAD,IACA,mBAAAC,GACA,IAAA,GAAAgB,GAAA,EAAAA,EAAAC,EAAAC,OAAAF,IACAkB,EAAAjB,EAAAD,GAAAG,UACAF,EAAAD,GAAAmB,cAEA,CACA,GAAA5B,GAAA,CACA,IAAA,mBAAAP,GAAA,CACA,GAAAoC,GAAAvB,EAAAN,EACA6B,KACApC,EAAAoC,EAAAD,UAKA,IAAA,GADA/B,GAAAvC,SAAAwE,iBAAA,IAAArC,GACAsC,EAAA,EAAAA,EAAAlC,EAAAc,OAAAoB,IACAC,EAAAnC,EAAAkC,GAAA/B,IAYA,QAAAgC,GAAArC,EAAAH,GAEA,KAAA,gBAAAG,IAAAA,YAAAsC,UACA,KAAA,IAAAC,OAAA,oDAGA,IAAAC,GAAAjB,EAAA,0BAAA,GAAA,EAEA,IADAvB,EAAAyC,cAAAD,IACAA,EAAAE,iBAAA,CAIA,GAAArB,GAAAH,EAAAlB,GACA2C,IAGA,IAAA9C,EAUAuB,EAAApB,EAAAH,IACA8C,EAAAC,KAAAjC,EAAAd,QAXA,CACA,GAAAvC,GAAA0C,EAAA1C,SACAyD,GAAA8B,QAAA,SAAAC,GAEAxF,EAAAC,SAAAuF,EAAAb,WACAU,EAAArB,QAAAwB,MAAA,IACA1B,EAAApB,EAAA8C,EAAA7B,YACA0B,EAAAC,KAAAE,KAQA,IAAA,GAAAZ,GAAApB,EAAA,EAAAsB,EAAAO,EAAA3B,OAAAF,EAAAsB,EAAAtB,IAAA,CAEA,GADAoB,EAAAS,EAAA7B,IACAoB,EAiBA,KAAA,IAAAK,OACA,6DAhBAlB,GAAAuB,KAAAV,EAAAjB,WACAjB,EAAA+C,aAAA,gBAAA1B,EAAA2B,KAAA,KACA,IAAAC,GAAA,GAAAf,GAAAgB,iBAAAlD,EACAiD,GAAAE,GAAAjB,EACAkB,EAAAR,KAAAK,EAEA,KAAA,GAAAI,GAAA,EAAAC,EAAApB,EAAAqB,UAAAvC,OAAAqC,EAAAC,EAAAD,IACAnB,EAAAqB,UAAAF,GAAArD,EAGAkC,GAAAsB,SAEAxD,EAAAkC,EAAAjB,WAAAgC,EAOA,IAAAQ,GAAAlC,EAAA,yBAAA,GAAA,EACAvB,GAAAyC,cAAAgB,KAUA,QAAAC,GAAAxD,GACAyD,MAAAC,QAAA1D,KAEAA,EADAA,YAAAoC,UACApC,GAEAyD,MAAAE,UAAAC,MAAAC,KAAA7D,GAGA,KAAA,GAAAF,GAAAc,EAAA,EAAAsB,EAAAlC,EAAAc,OAAAF,EAAAsB,EAAAtB,IACAd,EAAAE,EAAAY,GACAd,YAAAgE,eACA3B,EAAArC,GACAA,EAAAiE,SAAAjD,OAAA,GACA0C,EAAA1D,EAAAiE,WAWA,QAAAC,GAAA1D,GAKA,GAAA2D,GAAA,mBAAA3D,GAAAgD,QACA,mBAAAhD,GAAA,OACAgD,GAAA,CAEAW,KACAX,EAAAhD,EAAAgD,QAAAhD,EAAA,OAGA,IAAA4D,IACAlB,iBAAA1C,EAAA6D,aAAA7D,EAAA,YACAS,UAAAT,EAAA8D,eAAA9D,EAAA,cACAyB,SAAAzB,EAAAyB,UAAAzB,EAAA,SACAgD,OAAAA,EACAD,aAYA,IATAxC,EAAA8B,QAAA,SAAA0B,GACA,GAAAA,EAAAtC,WAAAmC,EAAAnC,SACA,KAAA,IAAAM,OAAA,sDAAAgC,EAAAtC,SAEA,IAAAsC,EAAAtD,YAAAmD,EAAAnD,UACA,KAAA,IAAAsB,OAAA,wDAIA/B,EAAA6D,YAAAR,UACAW,eAAArB,GACA,KAAA,IAAAZ,OACA,uCAAAY,EACA,0BAGA,IAAAsB,GAAA9D,EAAAH,EAAA8D,cAAAF,EAEAK,IACA1D,EAAA6B,KAAAwB,GAcA,QAAAM,GAAArE,EAAAC,GACA,GAAAqE,GAAAhE,EAAAN,EACAsE,IACAA,EAAApB,UAAAX,KAAAtC,GAQA,QAAAsE,KACA,IAAA,GAAAxC,GAAA,EAAAA,EAAArB,EAAAC,OAAAoB,IACAJ,EAAAjB,EAAAqB,GAAAnB,WAWA,QAAA4D,GAAA/B,GACA,GAAAA,EAAA,CACA,GAAAgC,GAAA1B,EAAA9B,QAAAwB,EACAM,GAAA2B,OAAAD,EAAA,EAEA,IAAAE,GAAAlC,EAAAzF,SAAAe,aAAA,iBAAAI,MAAA,KACAyG,EAAAD,EAAA1D,QAAAwB,EAAAK,GAAAmB,cACAU,GAAAD,OAAAE,EAAA,GACAnC,EAAAzF,SAAA0F,aAAA,gBAAAiC,EAAAhC,KAAA,KAEA,IAAAnB,GAAAN,EAAA,2BAAA,GAAA,EACAuB,GAAAzF,SAAAoF,cAAAZ,IASA,QAAAqD,GAAAxE,GAKA,GAAAyE,GAAA,SAAAC,GACAhC,EAAAiC,OAAA,SAAAd,GACA,MAAAA,GAAAlH,WAAA+H,IACAvC,QAAAgC,GAEA,IAAAnE,YAAAiD,QAAAjD,YAAA4E,UACA,IAAA,GAAAlD,GAAA,EAAAA,EAAA1B,EAAAM,OAAAoB,IACA+C,EAAAzE,EAAA0B,QAEA,CAAA,KAAA1B,YAAA6E,OAGA,KAAA,IAAAhD,OAAA,oDAFA4C,GAAAzE,IA7TA,GAAAK,MAGAqC,KAEAD,EAAA,6BAgUA,QACAvD,WAAAoC,EACAjC,eAAAsC,EACApC,gBAAAyD,EACAvD,qBAAAyE,EACAxE,yBAAAsE,EACAnE,SAAA2D,EACAzD,kBAAAyE,MAeAvF,EAAA6F,sBAcA7F,EAAA8F,gBAcA9F,EAAA+F,UAIA/F,EAAA,WAAAA,EAAAC,WACAD,EAAA,eAAAA,EAAAI,eACAJ,EAAA,gBAAAA,EAAAM,gBACAN,EAAA,qBACAA,EAAAQ,qBACAR,EAAA,yBACAA,EAAAS,yBACAT,EAAA,SAAAA,EAAAY,SACAZ,EAAA,kBAAAA,EAAAc,kBACAkB,OAAAhC,iBAAAA,EACAgC,OAAA,iBAAAhC,EAEAgC,OAAAzD,iBAAA,OAAA,WAQA,aAAAP,UAAAC,cAAA,QACA,iBAAAD,WACA,oBAAAgE,SAAAgC,MAAAE,UAAAhB,SACAlF,SAAAgI,gBAAArI,UAAAO,IAAA,UACA8B,EAAAQ,yBAKAR,EAAAI,eAAA,aAIAJ,EAAAY,SAAA,gBC7eAqF,KAAAC,MAKAD,KAAAC,IAAA,WACA,OAAA,GAAAD,OAAAE,WAEAF,KAAA,IAAAA,KAAAC,IAMA,KAAA,GAJAE,IACA,SACA,OAEAjF,EAAA,EAAAA,EAAAiF,EAAA/E,SAAAW,OAAAqE,wBAAAlF,EAAA,CACA,GAAAmF,GAAAF,EAAAjF,EACAa,QAAAqE,sBAAArE,OAAAsE,EAAA,yBACAtE,OAAAuE,qBAAAvE,OAAAsE,EAAA,yBAAAtE,OAAAsE,EAAA,+BACAtE,OAAA,sBAAAA,OAAAqE,sBACArE,OAAA,qBAAAA,OAAAuE,qBAEA,GAAA,uBAAAC,KAAAxE,OAAAyE,UAAAC,aAAA1E,OAAAqE,wBAAArE,OAAAuE,qBAAA,CACA,GAAAI,GAAA,CAKA3E,QAAAqE,sBAAA,SAAA1F,GACA,GAAAuF,GAAAD,KAAAC,MACAU,EAAAC,KAAAC,IAAAH,EAAA,GAAAT,EACA,OAAAa,YAAA,WACApG,EAAAgG,EAAAC,IACAA,EAAAV,IAEAlE,OAAAuE,qBAAAS,aACAhF,OAAA,sBAAAA,OAAAqE,sBACArE,OAAA,qBAAAA,OAAAuE,qBCpBA,GAAAU,GAAA,SAAA5G,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,eAAAiF,EAOAA,EAAA/C,UAAAkD,aASAH,EAAA/C,UAAArG,aACAwJ,cAAA,uBACAzH,iBAAA,+BACAC,OAAA,cAQAoH,EAAA/C,UAAAoD,aAAA,SAAAC,GACAA,GACAL,KAAAxJ,SAAA8J,QASAP,EAAA/C,UAAAuD,QAAA,WACAP,KAAAxJ,SAAAgK,UAAA,GAEAT,EAAA/C,UAAA,QAAA+C,EAAA/C,UAAAuD,QAMAR,EAAA/C,UAAAyD,OAAA,WACAT,KAAAxJ,SAAAgK,UAAA,GAEAT,EAAA/C,UAAA,OAAA+C,EAAA/C,UAAAyD,OAIAV,EAAA/C,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAAwJ,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwJ,eAAA,CACA,GAAAtJ,GAAAC,SAAAC,cAAA,OACAF,GAAAJ,UAAAO,IAAAgJ,KAAArJ,YAAA+B,kBACAsH,KAAAU,eAAA5J,SAAAC,cAAA,QACAiJ,KAAAU,eAAAjK,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACA9B,EAAAO,YAAA4I,KAAAU,gBACAV,KAAAW,uBAAAX,KAAAI,aAAAQ,KAAAZ,MACAA,KAAAU,eAAArJ,iBAAA,UAAA2I,KAAAW,wBACAX,KAAAxJ,SAAAY,YAAAP,GAEAmJ,KAAAa,uBAAAb,KAAAI,aAAAQ,KAAAZ,MACAA,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAa,wBACAb,KAAAxJ,SAAAa,iBAAA,aAAA2I,KAAAa,0BAKA/H,EAAAY,UACA8D,YAAAuC,EACAtC,cAAA,iBACArC,SAAA,gBACAuB,QAAA,GCjFA,IAAAmE,GAAA,SAAA3H,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,iBAAAgG,EAOAA,EAAA9D,UAAAkD,WAAAa,aAAA,MASAD,EAAA9D,UAAArG,aACAqK,MAAA,sBACAC,YAAA,4BACAC,aAAA,6BACAC,aAAA,6BACAhB,cAAA,uBACAiB,qBAAA,sCACA1I,iBAAA,iCACA2I,cAAA,qBACA1I,OAAA,aACA2I,WAAA,aACAC,YAAA,cACAC,WAAA,aACAC,YAAA,eAQAX,EAAA9D,UAAA0E,UAAA,SAAArB,GACAL,KAAA2B,kBAQAb,EAAA9D,UAAA4E,SAAA,SAAAvB,GACAL,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,aAQAR,EAAA9D,UAAA6E,QAAA,SAAAxB,GACAL,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAQAR,EAAA9D,UAAA+E,WAAA,SAAA1B,GACAL,KAAAgC,SAOAlB,EAAA9D,UAAA2E,eAAA,WACA3B,KAAAiC,gBACAjC,KAAAkC,oBAOApB,EAAA9D,UAAAgF,MAAA,WAGAlH,OAAA+E,WAAA,WACAG,KAAAmC,cAAA7B,QACAM,KAAAZ,MAAAA,KAAAE,UAAAa,eAQAD,EAAA9D,UAAAkF,iBAAA,WACAlC,KAAAmC,cAAAC,QACApC,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA6K,YAEAxB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA6K,aAGAV,EAAA9D,UAAA,iBAAA8D,EAAA9D,UAAAkF,iBAMApB,EAAA9D,UAAAiF,cAAA,WACAjC,KAAAmC,cAAA3B,SACAR,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4K,aAEAvB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4K,cAGAT,EAAA9D,UAAA,cAAA8D,EAAA9D,UAAAiF,cAMAnB,EAAA9D,UAAAuD,QAAA,WACAP,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAb,EAAA9D,UAAA,QAAA8D,EAAA9D,UAAAuD,QAMAO,EAAA9D,UAAAyD,OAAA,WACAT,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAb,EAAA9D,UAAA,OAAA8D,EAAA9D,UAAAyD,OAMAK,EAAA9D,UAAAqF,MAAA,WACArC,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAb,EAAA9D,UAAA,MAAA8D,EAAA9D,UAAAqF,MAMAvB,EAAA9D,UAAAsF,QAAA,WACAtC,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAb,EAAA9D,UAAA,QAAA8D,EAAA9D,UAAAsF,QAIAxB,EAAA9D,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACAwJ,KAAAmC,cAAAnC,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAAqK,MACA,IAAAuB,GAAAzL,SAAAC,cAAA,OACAwL,GAAA9L,UAAAO,IAAAgJ,KAAArJ,YAAAsK,YACA,IAAAuB,GAAA1L,SAAAC,cAAA,OACAyL,GAAA/L,UAAAO,IAAAgJ,KAAArJ,YAAAuK,aACA,IAAAuB,GAAA3L,SAAAC,cAAA,OAKA,IAJA0L,EAAAhM,UAAAO,IAAAgJ,KAAArJ,YAAAwK,cACAoB,EAAAnL,YAAAqL,GACAzC,KAAAxJ,SAAAY,YAAAoL,GACAxC,KAAAxJ,SAAAY,YAAAmL,GACAvC,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwJ,eAAA,CACAH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAyK,sBACApB,KAAA0C,wBAAA5L,SAAAC,cAAA,QACAiJ,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA+B,kBACAsH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAAwJ,eACAH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA0K,eACArB,KAAA2C,mBAAA3C,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAA0C,wBAAArL,iBAAA,UAAA2I,KAAA2C,mBACA,IAAAzL,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACAqH,KAAA0C,wBAAAtL,YAAAF,GACA8I,KAAAxJ,SAAAY,YAAA4I,KAAA0C,yBAEA1C,KAAA4C,mBAAA5C,KAAA0B,UAAAd,KAAAZ,MACAA,KAAA6C,kBAAA7C,KAAA4B,SAAAhB,KAAAZ,MACAA,KAAA8C,iBAAA9C,KAAA6B,QAAAjB,KAAAZ,MACAA,KAAA+C,oBAAA/C,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAAmC,cAAA9K,iBAAA,SAAA2I,KAAA4C,oBACA5C,KAAAmC,cAAA9K,iBAAA,QAAA2I,KAAA6C,mBACA7C,KAAAmC,cAAA9K,iBAAA,OAAA2I,KAAA8C,kBACA9C,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAA+C,qBACA/C,KAAA2B,iBACA3B,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,eAKA3I,EAAAY,UACA8D,YAAAsD,EACArD,cAAA,mBACArC,SAAA,kBACAuB,QAAA,GC9MA,IAAAqG,GAAA,SAAA7J,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,mBAAAkI,EAOAA,EAAAhG,UAAAkD,WAAAa,aAAA,MASAiC,EAAAhG,UAAArG,aACAqK,MAAA,yBACAvI,iBAAA,uBACA2I,qBAAA,sCACA1I,iBAAA,oCACA2I,cAAA,qBACA1I,OAAA,aACA2I,WAAA,aACAC,YAAA,cACAC,WAAA,cAQAwB,EAAAhG,UAAA0E,UAAA,SAAArB,GACAL,KAAA2B,kBAQAqB,EAAAhG,UAAA4E,SAAA,SAAAvB,GACAL,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,aAQA0B,EAAAhG,UAAA6E,QAAA,SAAAxB,GACAL,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAQA0B,EAAAhG,UAAA+E,WAAA,SAAA1B,GACAL,KAAAgC,SAOAgB,EAAAhG,UAAA2E,eAAA,WACA3B,KAAAiC,gBACAjC,KAAAkC,oBAOAc,EAAAhG,UAAAgF,MAAA,WAGAlH,OAAA+E,WAAA,WACAG,KAAAmC,cAAA7B,QACAM,KAAAZ,MAAAA,KAAAE,UAAAa,eAQAiC,EAAAhG,UAAAkF,iBAAA,WACAlC,KAAAmC,cAAAC,QACApC,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA6K,YAEAxB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA6K,aAGAwB,EAAAhG,UAAA,iBAAAgG,EAAAhG,UAAAkF,iBAMAc,EAAAhG,UAAAiF,cAAA,WACAjC,KAAAmC,cAAA3B,SACAR,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4K,aAEAvB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4K,cAGAyB,EAAAhG,UAAA,cAAAgG,EAAAhG,UAAAiF,cAMAe,EAAAhG,UAAAuD,QAAA,WACAP,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAqB,EAAAhG,UAAA,QAAAgG,EAAAhG,UAAAuD,QAMAyC,EAAAhG,UAAAyD,OAAA,WACAT,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAqB,EAAAhG,UAAA,OAAAgG,EAAAhG,UAAAyD,OAMAuC,EAAAhG,UAAAqF,MAAA,WACArC,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAqB,EAAAhG,UAAA,MAAAgG,EAAAhG,UAAAqF,MAMAW,EAAAhG,UAAAsF,QAAA,WACAtC,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAqB,EAAAhG,UAAA,QAAAgG,EAAAhG,UAAAsF,QAIAU,EAAAhG,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CAEA,GADAwJ,KAAAmC,cAAAnC,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAAqK,OACAhB,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA8B,kBAAA,CACAuH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAyK,sBACApB,KAAA0C,wBAAA5L,SAAAC,cAAA,QACAiJ,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA+B,kBACAsH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA8B,kBACAuH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA0K,eACArB,KAAA2C,mBAAA3C,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAA0C,wBAAArL,iBAAA,UAAA2I,KAAA2C,mBACA,IAAAzL,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACAqH,KAAA0C,wBAAAtL,YAAAF,GACA8I,KAAAxJ,SAAAY,YAAA4I,KAAA0C,yBAEA1C,KAAA4C,mBAAA5C,KAAA0B,UAAAd,KAAAZ,MACAA,KAAA6C,kBAAA7C,KAAA4B,SAAAhB,KAAAZ,MACAA,KAAA8C,iBAAA9C,KAAA6B,QAAAjB,KAAAZ,MACAA,KAAAiD,sBAAAjD,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAAmC,cAAA9K,iBAAA,SAAA2I,KAAA4C,oBACA5C,KAAAmC,cAAA9K,iBAAA,QAAA2I,KAAA6C,mBACA7C,KAAAmC,cAAA9K,iBAAA,OAAA2I,KAAA8C,kBACA9C,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAiD,uBACAjD,KAAA2B,iBACA3B,KAAAxJ,SAAAC,UAAAO,IAAA,iBAKA8B,EAAAY,UACA8D,YAAAwF,EACAvF,cAAA,qBACArC,SAAA,qBACAuB,QAAA,GCjMA,IAAAuG,GAAA,SAAA/J,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,aAAAoI,EAOAA,EAAAlG,UAAAkD,WAEAiD,4BAAA,GAEAC,6BAAA,GAGAC,cAAA,KAQAH,EAAAlG,UAAAsG,WACAC,MAAA,GACAC,OAAA,GACAC,MAAA,GACAC,SAAA,GACAC,WAAA,IAUAT,EAAAlG,UAAArG,aACAiN,UAAA,sBACAC,QAAA,oBACAC,KAAA,iBACAC,sBAAA,kCACA5D,cAAA,uBACAiB,qBAAA,sCACAzI,OAAA,aAEA8I,YAAA,cACAuC,WAAA,aACAC,aAAA,eAEAC,YAAA,wBAEAC,aAAA,yBACAC,SAAA,qBACAC,UAAA,sBACAC,UAAA,uBAKApB,EAAAlG,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CAEA,GAAA+N,GAAAzN,SAAAC,cAAA,MACAwN,GAAA9N,UAAAO,IAAAgJ,KAAArJ,YAAAiN,WACA5D,KAAAxJ,SAAAgO,cAAAC,aAAAF,EAAAvE,KAAAxJ,UACAwJ,KAAAxJ,SAAAgO,cAAAE,YAAA1E,KAAAxJ,UACA+N,EAAAnN,YAAA4I,KAAAxJ,UACAwJ,KAAA2E,WAAAJ,CAEA,IAAAK,GAAA9N,SAAAC,cAAA,MACA6N,GAAAnO,UAAAO,IAAAgJ,KAAArJ,YAAAkN,SACA7D,KAAA6E,SAAAD,EACAL,EAAAE,aAAAG,EAAA5E,KAAAxJ,SAEA,IAAAsO,GAAA9E,KAAAxJ,SAAAe,aAAA,QAAAyI,KAAAxJ,SAAAe,aAAA,gBACAwN,EAAA,IACAD,KACAC,EAAAjO,SAAAkO,eAAAF,GACAC,IACA/E,KAAAiF,YAAAF,EACAA,EAAA1N,iBAAA,QAAA2I,KAAAkF,gBAAAtE,KAAAZ,OACA+E,EAAA1N,iBAAA,UAAA2I,KAAAmF,wBAAAvE,KAAAZ,QAGA,IAAAoF,GAAApF,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAmN,KACA9D,MAAAqF,kBAAArF,KAAAsF,yBAAA1E,KAAAZ,MACAA,KAAAuF,gBAAAvF,KAAAwF,iBAAA5E,KAAAZ,KACA,KAAA,GAAA/F,GAAA,EAAAA,EAAAmL,EAAAjL,OAAAF,IAEAmL,EAAAnL,GAAA5C,iBAAA,QAAA2I,KAAAuF,iBAEAH,EAAAnL,GAAAwL,SAAA,KAEAL,EAAAnL,GAAA5C,iBAAA,UAAA2I,KAAAqF,kBAGA,IAAArF,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwJ,eAEA,IADAH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAyK,sBACAnH,EAAA,EAAAA,EAAAmL,EAAAjL,OAAAF,IAAA,CACA,GAAAyD,GAAA0H,EAAAnL,GACApD,EAAAC,SAAAC,cAAA,OACAF,GAAAJ,UAAAO,IAAAgJ,KAAArJ,YAAAoN,sBACA,IAAA7M,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACA9B,EAAAO,YAAAF,GACAwG,EAAAtG,YAAAP,GACA6G,EAAAjH,UAAAO,IAAAgJ,KAAArJ,YAAAwJ,eAIAH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAuN,cACAlE,KAAA6E,SAAApO,UAAAO,IAAAgJ,KAAArJ,YAAAuN,aAEAlE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwN,eACAnE,KAAA6E,SAAApO,UAAAO,IAAAgJ,KAAArJ,YAAAwN,cAEAnE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAyN,WACApE,KAAA6E,SAAApO,UAAAO,IAAAgJ,KAAArJ,YAAAyN,UAEApE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA0N,YACArE,KAAA6E,SAAApO,UAAAO,IAAAgJ,KAAArJ,YAAA0N,WAEArE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA2N,YACAtE,KAAA6E,SAAApO,UAAAO,IAAAgJ,KAAArJ,YAAA2N,WAEAC,EAAA9N,UAAAO,IAAAgJ,KAAArJ,YAAA8K,eAUAyB,EAAAlG,UAAAkI,gBAAA,SAAAQ,GACA,GAAA1F,KAAAxJ,UAAAwJ,KAAAiF,YAAA,CACA,GAAAU,GAAA3F,KAAAiF,YAAAW,wBACAC,EAAA7F,KAAAiF,YAAAT,cAAAoB,uBACA5F,MAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA2N,aACAtE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwN,eAEAnE,KAAA2E,WAAAmB,MAAAC,MAAAF,EAAAE,MAAAJ,EAAAI,MAAA,KACA/F,KAAA2E,WAAAmB,MAAAE,IAAAhG,KAAAiF,YAAAgB,UAAAjG,KAAAiF,YAAAiB,aAAA,MACAlG,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAyN,WAEApE,KAAA2E,WAAAmB,MAAAK,KAAAnG,KAAAiF,YAAAmB,WAAA,KACApG,KAAA2E,WAAAmB,MAAAO,OAAAR,EAAAQ,OAAAV,EAAAK,IAAA,MACAhG,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA0N,YAEArE,KAAA2E,WAAAmB,MAAAC,MAAAF,EAAAE,MAAAJ,EAAAI,MAAA,KACA/F,KAAA2E,WAAAmB,MAAAO,OAAAR,EAAAQ,OAAAV,EAAAK,IAAA,OAGAhG,KAAA2E,WAAAmB,MAAAK,KAAAnG,KAAAiF,YAAAmB,WAAA,KACApG,KAAA2E,WAAAmB,MAAAE,IAAAhG,KAAAiF,YAAAgB,UAAAjG,KAAAiF,YAAAiB,aAAA,OAGAlG,KAAAsG,OAAAZ,IAQAxC,EAAAlG,UAAAmI,wBAAA,SAAAO,GACA,GAAA1F,KAAAxJ,UAAAwJ,KAAA2E,YAAA3E,KAAAiF,YAAA,CACA,GAAAG,GAAApF,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAmN,KAAA,mBACAsB,IAAAA,EAAAjL,OAAA,GAAA6F,KAAA2E,WAAAlO,UAAAC,SAAAsJ,KAAArJ,YAAAqN,cACA0B,EAAAa,UAAAvG,KAAAsD,UAAAI,UACAgC,EAAAjO,iBACA2N,EAAAA,EAAAjL,OAAA,GAAAqM,SACAd,EAAAa,UAAAvG,KAAAsD,UAAAK,aACA+B,EAAAjO,iBACA2N,EAAA,GAAAoB,YAWAtD,EAAAlG,UAAAsI,yBAAA,SAAAI,GACA,GAAA1F,KAAAxJ,UAAAwJ,KAAA2E,WAAA,CACA,GAAAS,GAAApF,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAmN,KAAA,mBACA,IAAAsB,GAAAA,EAAAjL,OAAA,GAAA6F,KAAA2E,WAAAlO,UAAAC,SAAAsJ,KAAArJ,YAAAqN,YAAA,CACA,GAAAyC,GAAA3J,MAAAE,UAAAC,MAAAC,KAAAkI,GAAA3K,QAAAiL,EAAAgB,OACA,IAAAhB,EAAAa,UAAAvG,KAAAsD,UAAAI,SACAgC,EAAAjO,iBACAgP,EAAA,EACArB,EAAAqB,EAAA,GAAAD,QAEApB,EAAAA,EAAAjL,OAAA,GAAAqM,YAEA,IAAAd,EAAAa,UAAAvG,KAAAsD,UAAAK,WACA+B,EAAAjO,iBACA2N,EAAAjL,OAAAsM,EAAA,EACArB,EAAAqB,EAAA,GAAAD,QAEApB,EAAA,GAAAoB,YAEA,IAAAd,EAAAa,UAAAvG,KAAAsD,UAAAG,OAAAiC,EAAAa,UAAAvG,KAAAsD,UAAAC,MAAA,CACAmC,EAAAjO,gBAEA,IAAAH,GAAA,GAAAqP,YAAA,YACAjB,GAAAgB,OAAA9K,cAAAtE,GACAA,EAAA,GAAAqP,YAAA,WACAjB,EAAAgB,OAAA9K,cAAAtE,GAEAoO,EAAAgB,OAAAE,YACAlB,GAAAa,UAAAvG,KAAAsD,UAAAE,SACAkC,EAAAjO,iBACAuI,KAAA6G,WAWA3D,EAAAlG,UAAAwI,iBAAA,SAAAE,GACAA,EAAAgB,OAAAI,aAAA,YACApB,EAAAqB,mBAGA/G,KAAAgH,UAAA,EACAlM,OAAA+E,WAAA,SAAA6F,GACA1F,KAAA6G,OACA7G,KAAAgH,UAAA,GACApG,KAAAZ,MAAAA,KAAAE,UAAAmD,iBAYAH,EAAAlG,UAAAiK,WAAA,SAAAC,EAAAC,GACAnH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA2N,WAEAtE,KAAAxJ,SAAAsP,MAAAsB,KAAA,GACApH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwN,cAEAnE,KAAAxJ,SAAAsP,MAAAsB,KAAA,UAAAD,EAAA,QAAAA,EAAA,MACAnH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAyN,UAEApE,KAAAxJ,SAAAsP,MAAAsB,KAAA,QAAAF,EAAA,QAAAA,EAAA,QACAlH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA0N,WAEArE,KAAAxJ,SAAAsP,MAAAsB,KAAA,QAAAF,EAAA,MAAAC,EAAA,MAAAD,EAAA,MAAAC,EAAA,MAGAnH,KAAAxJ,SAAAsP,MAAAsB,KAAA,IASAlE,EAAAlG,UAAAqK,4BAAA,SAAA3B,GACAA,EAAAgB,OAAAjQ,UAAAqL,OAAAoB,EAAAlG,UAAArG,YAAAsN,eAOAf,EAAAlG,UAAAsK,yBAAA,WACAtH,KAAAxJ,SAAAa,iBAAA,gBAAA2I,KAAAqH,6BACArH,KAAAxJ,SAAAa,iBAAA,sBAAA2I,KAAAqH,8BAOAnE,EAAAlG,UAAAnE,KAAA,SAAA6M,GACA,GAAA1F,KAAAxJ,UAAAwJ,KAAA2E,YAAA3E,KAAA6E,SAAA,CAEA,GAAAqC,GAAAlH,KAAAxJ,SAAAoP,wBAAAsB,OACAC,EAAAnH,KAAAxJ,SAAAoP,wBAAAuB,KAEAnH,MAAA2E,WAAAmB,MAAAqB,MAAAA,EAAA,KACAnH,KAAA2E,WAAAmB,MAAAoB,OAAAA,EAAA,KACAlH,KAAA6E,SAAAiB,MAAAqB,MAAAA,EAAA,KACAnH,KAAA6E,SAAAiB,MAAAoB,OAAAA,EAAA,IAKA,KAAA,GAJAK,GAAAvH,KAAAE,UAAAiD,4BAAAnD,KAAAE,UAAAkD,6BAGAgC,EAAApF,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAmN,MACA7J,EAAA,EAAAA,EAAAmL,EAAAjL,OAAAF,IAAA,CACA,GAAAuN,GAAA,IAEAA,GADAxH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAyN,WAAApE,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA0N,YACA6C,EAAA9B,EAAAnL,GAAAgM,UAAAb,EAAAnL,GAAAiM,cAAAgB,EAAAK,EAAA,IAEAnC,EAAAnL,GAAAgM,UAAAiB,EAAAK,EAAA,IAEAnC,EAAAnL,GAAA6L,MAAA2B,gBAAAD,EAGAxH,KAAAiH,WAAAC,EAAAC,GAGArM,OAAAqE,sBAAA,WACAa,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAsN,cACAjE,KAAAxJ,SAAAsP,MAAAsB,KAAA,UAAAD,EAAA,MAAAD,EAAA,QACAlH,KAAA2E,WAAAlO,UAAAO,IAAAgJ,KAAArJ,YAAAqN,aACApD,KAAAZ,OAEAA,KAAAsH,0BAEA,IAAA7N,GAAA,SAAAnC,GAOAA,IAAAoO,GAAA1F,KAAAgH,UAAA1P,EAAAoP,OAAAgB,aAAA1H,KAAAxJ,WACAM,SAAA6Q,oBAAA,QAAAlO,GACAuG,KAAA6G,SAEAjG,KAAAZ,KACAlJ,UAAAO,iBAAA,QAAAoC,KAGAyJ,EAAAlG,UAAA,KAAAkG,EAAAlG,UAAAnE,KAMAqK,EAAAlG,UAAA6J,KAAA,WACA,GAAA7G,KAAAxJ,UAAAwJ,KAAA2E,YAAA3E,KAAA6E,SAAA,CAGA,IAAA,GAFAO,GAAApF,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAmN,MAEA7J,EAAA,EAAAA,EAAAmL,EAAAjL,OAAAF,IACAmL,EAAAnL,GAAA6L,MAAA8B,eAAA,mBAGA,IAAAjC,GAAA3F,KAAAxJ,SAAAoP,wBACAsB,EAAAvB,EAAAuB,OACAC,EAAAxB,EAAAwB,KAGAnH,MAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAsN,cACAjE,KAAAiH,WAAAC,EAAAC,GACAnH,KAAA2E,WAAAlO,UAAAqL,OAAA9B,KAAArJ,YAAAqN,YAEAhE,KAAAsH,6BAGApE,EAAAlG,UAAA,KAAAkG,EAAAlG,UAAA6J,KAMA3D,EAAAlG,UAAAsJ,OAAA,SAAAZ,GACA1F,KAAA2E,WAAAlO,UAAAC,SAAAsJ,KAAArJ,YAAAqN,YACAhE,KAAA6G,OAEA7G,KAAAnH,KAAA6M,IAGAxC,EAAAlG,UAAA,OAAAkG,EAAAlG,UAAAsJ,OAGAxN,EAAAY,UACA8D,YAAA0F,EACAzF,cAAA,eACArC,SAAA,cACAuB,QAAA,GCvYA,IAAAkL,GAAA,SAAA1O,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,iBAAA+M,EAOAA,EAAA7K,UAAAkD,aASA2H,EAAA7K,UAAArG,aAAAmR,oBAAA,+BAOAD,EAAA7K,UAAA+K,YAAA,SAAAC,GACAhI,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAmR,uBAGA9H,KAAAiI,aAAAnC,MAAAqB,MAAAa,EAAA,MAEAH,EAAA7K,UAAA,YAAA6K,EAAA7K,UAAA+K,YAOAF,EAAA7K,UAAAkL,UAAA,SAAAF,GACAhI,KAAAmI,WAAArC,MAAAqB,MAAAa,EAAA,IACAhI,KAAAoI,QAAAtC,MAAAqB,MAAA,IAAAa,EAAA,KAEAH,EAAA7K,UAAA,UAAA6K,EAAA7K,UAAAkL,UAIAL,EAAA7K,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAA6R,GAAAvR,SAAAC,cAAA,MACAsR,GAAAjO,UAAA,uBACA4F,KAAAxJ,SAAAY,YAAAiR,GACArI,KAAAiI,aAAAI,EACAA,EAAAvR,SAAAC,cAAA,OACAsR,EAAAjO,UAAA,qBACA4F,KAAAxJ,SAAAY,YAAAiR,GACArI,KAAAmI,WAAAE,EACAA,EAAAvR,SAAAC,cAAA,OACAsR,EAAAjO,UAAA,kBACA4F,KAAAxJ,SAAAY,YAAAiR,GACArI,KAAAoI,QAAAC,EACArI,KAAAiI,aAAAnC,MAAAqB,MAAA,KACAnH,KAAAmI,WAAArC,MAAAqB,MAAA,OACAnH,KAAAoI,QAAAtC,MAAAqB,MAAA,KACAnH,KAAAxJ,SAAAC,UAAAO,IAAA,iBAKA8B,EAAAY,UACA8D,YAAAqK,EACApK,cAAA,mBACArC,SAAA,kBACAuB,QAAA,GC3EA,IAAA2L,GAAA,SAAAnP,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,cAAAwN,EAOAA,EAAAtL,UAAAkD,WAAAa,aAAA,MASAuH,EAAAtL,UAAArG,aACA2K,WAAA,aACAC,YAAA,cACAC,WAAA,aACAC,YAAA,cACA8G,SAAA,eACAC,UAAA,oBACAC,mBAAA,0BACAC,mBAAA,0BACAvI,cAAA,uBACAiB,qBAAA,sCACA1I,iBAAA,8BACA2I,cAAA,qBACA1I,OAAA,cAQA2P,EAAAtL,UAAA0E,UAAA,SAAArB,GAIA,IAAA,GADAsI,GAAA7R,SAAA8R,uBAAA5I,KAAArJ,YAAA4R,UACAtO,EAAA,EAAAA,EAAA0O,EAAAxO,OAAAF,IAAA,CACA,GAAA4O,GAAAF,EAAA1O,GAAApC,cAAA,IAAAmI,KAAArJ,YAAA6R,UAEAK,GAAAtR,aAAA,UAAAyI,KAAA8I,YAAAvR,aAAA,SACA,mBAAAoR,GAAA1O,GAAA,eACA0O,EAAA1O,GAAA,cAAA0H,mBAWA2G,EAAAtL,UAAA4E,SAAA,SAAAvB,GACAL,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,aAQAgH,EAAAtL,UAAA6E,QAAA,SAAAxB,GACAL,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAQAgH,EAAAtL,UAAA+L,WAAA,SAAA1I,GACAL,KAAAgC,SAOAsG,EAAAtL,UAAA2E,eAAA,WACA3B,KAAAiC,gBACAjC,KAAAkC,oBAOAoG,EAAAtL,UAAAgF,MAAA,WAGAlH,OAAA+E,WAAA,WACAG,KAAA8I,YAAAxI,QACAM,KAAAZ,MAAAA,KAAAE,UAAAa,eAQAuH,EAAAtL,UAAAiF,cAAA,WACAjC,KAAA8I,YAAAtI,SACAR,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4K,aAEAvB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4K,cAGA+G,EAAAtL,UAAA,cAAAsL,EAAAtL,UAAAiF,cAMAqG,EAAAtL,UAAAkF,iBAAA,WACAlC,KAAA8I,YAAA1G,QACApC,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA6K,YAEAxB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA6K,aAGA8G,EAAAtL,UAAA,iBAAAsL,EAAAtL,UAAAkF,iBAMAoG,EAAAtL,UAAAuD,QAAA,WACAP,KAAA8I,YAAAtI,UAAA,EACAR,KAAA2B,kBAEA2G,EAAAtL,UAAA,QAAAsL,EAAAtL,UAAAuD,QAMA+H,EAAAtL,UAAAyD,OAAA,WACAT,KAAA8I,YAAAtI,UAAA,EACAR,KAAA2B,kBAEA2G,EAAAtL,UAAA,OAAAsL,EAAAtL,UAAAyD,OAMA6H,EAAAtL,UAAAqF,MAAA,WACArC,KAAA8I,YAAA1G,SAAA,EACApC,KAAA0B,UAAA,OAEA4G,EAAAtL,UAAA,MAAAsL,EAAAtL,UAAAqF,MAMAiG,EAAAtL,UAAAsF,QAAA,WACAtC,KAAA8I,YAAA1G,SAAA,EACApC,KAAA0B,UAAA,OAEA4G,EAAAtL,UAAA,QAAAsL,EAAAtL,UAAAsF,QAIAgG,EAAAtL,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACAwJ,KAAA8I,YAAA9I,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAA6R,WACAxI,KAAAgJ,oBAAAhJ,KAAA0B,UAAAd,KAAAZ,MACAA,KAAAiJ,mBAAAjJ,KAAA0B,UAAAd,KAAAZ,MACAA,KAAAkJ,kBAAAlJ,KAAA6B,QAAAjB,KAAAZ,MACAA,KAAAmJ,qBAAAnJ,KAAA+I,WAAAnI,KAAAZ,KACA,IAAAoJ,GAAAtS,SAAAC,cAAA,OACAqS,GAAA3S,UAAAO,IAAAgJ,KAAArJ,YAAA8R,mBACA,IAAAY,GAAAvS,SAAAC,cAAA,OACAsS,GAAA5S,UAAAO,IAAAgJ,KAAArJ,YAAA+R,oBACA1I,KAAAxJ,SAAAY,YAAAgS,GACApJ,KAAAxJ,SAAAY,YAAAiS,EACA,IAAAxS,EACA,IAAAmJ,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwJ,eAAA,CACAH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAyK,sBACAvK,EAAAC,SAAAC,cAAA,QACAF,EAAAJ,UAAAO,IAAAgJ,KAAArJ,YAAA+B,kBACA7B,EAAAJ,UAAAO,IAAAgJ,KAAArJ,YAAAwJ,eACAtJ,EAAAJ,UAAAO,IAAAgJ,KAAArJ,YAAA0K,eACAxK,EAAAQ,iBAAA,UAAA2I,KAAAmJ,qBACA,IAAAjS,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACA9B,EAAAO,YAAAF,GACA8I,KAAAxJ,SAAAY,YAAAP,GAEAmJ,KAAA8I,YAAAzR,iBAAA,SAAA2I,KAAAgJ,qBACAhJ,KAAA8I,YAAAzR,iBAAA,QAAA2I,KAAAiJ,oBACAjJ,KAAA8I,YAAAzR,iBAAA,OAAA2I,KAAAkJ,mBACAlJ,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAmJ,sBACAnJ,KAAA2B,iBACA3B,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,eAKA3I,EAAAY,UACA8D,YAAA8K,EACA7K,cAAA,gBACArC,SAAA,eACAuB,QAAA,GCtNA,IAAA2M,GAAA,SAAAnQ,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAuJ,MAAAzO,OAAAyE,UAAAiK,iBAEAxJ,KAAAC,OAEAnF,QAAA,eAAAwO,EAOAA,EAAAtM,UAAAkD,aASAoJ,EAAAtM,UAAArG,aACA8S,aAAA,2BACAC,iBAAA,wBACAC,gBAAA,8BACAC,iBAAA,+BACAC,iBAAA,+BACAC,gBAAA,kBACArI,YAAA,eAQA6H,EAAAtM,UAAA+M,SAAA,SAAA1J,GACAL,KAAAgK,sBAQAV,EAAAtM,UAAA0E,UAAA,SAAArB,GACAL,KAAAgK,sBAQAV,EAAAtM,UAAA+E,WAAA,SAAA1B,GACAA,EAAAqG,OAAApG,QAYAgJ,EAAAtM,UAAAiN,sBAAA,SAAA5J,GAGA,GAAAA,EAAAqG,SAAA1G,KAAAxJ,SAAAgO,cAAA,CAKAnE,EAAA5I,gBACA,IAAAyS,GAAA,GAAAvD,YAAA,aACAD,OAAArG,EAAAqG,OACAyD,QAAA9J,EAAA8J,QACAC,QAAA/J,EAAA+J,QACAC,QAAArK,KAAAxJ,SAAAoP,wBAAA0E,GAEAtK,MAAAxJ,SAAAoF,cAAAsO,KAOAZ,EAAAtM,UAAAgN,mBAAA,WAEA,GAAAO,IAAAvK,KAAAxJ,SAAAgU,MAAAxK,KAAAxJ,SAAAiU,MAAAzK,KAAAxJ,SAAAoJ,IAAAI,KAAAxJ,SAAAiU,IACA,KAAAF,EACAvK,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAmT,iBAEA9J,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAAmT,iBAEA9J,KAAAuJ,QACAvJ,KAAA0K,iBAAA5E,MAAA6E,KAAAJ,EACAvK,KAAA0K,iBAAA5E,MAAA8E,WAAAL,EACAvK,KAAA6K,iBAAA/E,MAAA6E,KAAA,EAAAJ,EACAvK,KAAA6K,iBAAA/E,MAAA8E,WAAA,EAAAL,IASAjB,EAAAtM,UAAAuD,QAAA,WACAP,KAAAxJ,SAAAgK,UAAA,GAEA8I,EAAAtM,UAAA,QAAAsM,EAAAtM,UAAAuD,QAMA+I,EAAAtM,UAAAyD,OAAA,WACAT,KAAAxJ,SAAAgK,UAAA,GAEA8I,EAAAtM,UAAA,OAAAsM,EAAAtM,UAAAyD,OAOA6I,EAAAtM,UAAA8N,OAAA,SAAAN,GACA,mBAAAA,KACAxK,KAAAxJ,SAAAgU,MAAAA,GAEAxK,KAAAgK,sBAEAV,EAAAtM,UAAA,OAAAsM,EAAAtM,UAAA8N,OAIAxB,EAAAtM,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAAwJ,KAAAuJ,MAAA,CAIA,GAAAwB,GAAAjU,SAAAC,cAAA,MACAgU,GAAAtU,UAAAO,IAAAgJ,KAAArJ,YAAA8S,cACAzJ,KAAAxJ,SAAAgO,cAAAC,aAAAsG,EAAA/K,KAAAxJ,UACAwJ,KAAAxJ,SAAAgO,cAAAE,YAAA1E,KAAAxJ,UACAuU,EAAA3T,YAAA4I,KAAAxJ,cACA,CAIA,GAAA+N,GAAAzN,SAAAC,cAAA,MACAwN,GAAA9N,UAAAO,IAAAgJ,KAAArJ,YAAA+S,kBACA1J,KAAAxJ,SAAAgO,cAAAC,aAAAF,EAAAvE,KAAAxJ,UACAwJ,KAAAxJ,SAAAgO,cAAAE,YAAA1E,KAAAxJ,UACA+N,EAAAnN,YAAA4I,KAAAxJ,SACA,IAAAwU,GAAAlU,SAAAC,cAAA,MACAiU,GAAAvU,UAAAO,IAAAgJ,KAAArJ,YAAAgT,iBACApF,EAAAnN,YAAA4T,GACAhL,KAAA0K,iBAAA5T,SAAAC,cAAA,OACAiJ,KAAA0K,iBAAAjU,UAAAO,IAAAgJ,KAAArJ,YAAAiT,kBACAoB,EAAA5T,YAAA4I,KAAA0K,kBACA1K,KAAA6K,iBAAA/T,SAAAC,cAAA,OACAiJ,KAAA6K,iBAAApU,UAAAO,IAAAgJ,KAAArJ,YAAAkT,kBACAmB,EAAA5T,YAAA4I,KAAA6K,kBAEA7K,KAAAiL,kBAAAjL,KAAA+J,SAAAnJ,KAAAZ,MACAA,KAAAkL,mBAAAlL,KAAA0B,UAAAd,KAAAZ,MACAA,KAAAmL,oBAAAnL,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAAoL,+BAAApL,KAAAiK,sBAAArJ,KAAAZ,MACAA,KAAAxJ,SAAAa,iBAAA,QAAA2I,KAAAiL,mBACAjL,KAAAxJ,SAAAa,iBAAA,SAAA2I,KAAAkL,oBACAlL,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAmL,qBACAnL,KAAAxJ,SAAAgO,cAAAnN,iBAAA,YAAA2I,KAAAoL,gCACApL,KAAAgK,qBACAhK,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,eAKA3I,EAAAY,UACA8D,YAAA8L,EACA7L,cAAA,iBACArC,SAAA,gBACAuB,QAAA,GC9LA,IAAA0O,GAAA,SAAAlS,GAIA,GAHA6G,KAAAxJ,SAAA2C,EACA6G,KAAAsL,aAAAtL,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAAuL,YAAAC,SACAxL,KAAAyL,eAAAzL,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAAuL,YAAAG,SACA1L,KAAAsL,aACA,KAAA,IAAA5P,OAAA,kDAEA,KAAAsE,KAAAyL,eACA,KAAA,IAAA/P,OAAA,kDAEAsE,MAAA2L,QAAA,EACA3L,KAAA4L,eAAAC,OACA7L,KAAA8L,SAAAD,OACA7L,KAAA+L,YAAAF,OACA7L,KAAAgM,wBACAhM,KAAAiM,kBAAA,GAEAnR,QAAA,iBAAAuQ,EAOAA,EAAArO,UAAAkD,WAEAgM,iBAAA,KAUAb,EAAArO,UAAAuO,aACAY,SAAA,eACAX,QAAA,qBACAE,OAAA,uBACAU,OAAA,wBAOAf,EAAArO,UAAAqP,iBAAA,WACArM,KAAAxJ,SAAA0F,aAAA,cAAA;AACA8D,KAAA4L,iBACA5L,KAAAyL,eAAAa,YAAAtM,KAAA+L,YACA/L,KAAAyL,eAAApU,iBAAA,QAAA2I,KAAA4L,gBACA5L,KAAAiM,kBAAA,IAEAjM,KAAAsL,aAAAgB,YAAAtM,KAAA8L,SACA9L,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAAuL,YAAAa,QACApM,KAAAxJ,SAAA0F,aAAA,cAAA,SACA2D,WAAAG,KAAAuM,SAAA3L,KAAAZ,MAAAA,KAAAwM,WAQAnB,EAAArO,UAAAyP,aAAA,SAAAC,GACA,GAAAb,SAAAa,EACA,KAAA,IAAAhR,OAAA,mEAEA,IAAAmQ,SAAAa,EAAA,QACA,KAAA,IAAAhR,OAAA,4CAEA,IAAAgR,EAAA,gBAAAA,EAAA,WACA,KAAA,IAAAhR,OAAA,+CAEAsE,MAAA2L,OACA3L,KAAAgM,qBAAAjQ,KAAA2Q,IAEA1M,KAAA2L,QAAA,EACA3L,KAAA8L,SAAAY,EAAA,QACAA,EAAA,QACA1M,KAAAwM,SAAAE,EAAA,QAEA1M,KAAAwM,SAAA,KAEAE,EAAA,gBACA1M,KAAA4L,eAAAc,EAAA,eAEAA,EAAA,aACA1M,KAAA+L,YAAAW,EAAA,YAEA1M,KAAAqM,qBAGAhB,EAAArO,UAAA,aAAAqO,EAAArO,UAAAyP,aAOApB,EAAArO,UAAA2P,YAAA,WACA3M,KAAAgM,qBAAA7R,OAAA,GACA6F,KAAAyM,aAAAzM,KAAAgM,qBAAAY,UAQAvB,EAAArO,UAAAuP,SAAA,WACAvM,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAAuL,YAAAa,QACAvM,WAAA,WACAG,KAAAxJ,SAAA0F,aAAA,cAAA,QACA8D,KAAAsL,aAAAgB,YAAA,GACAO,QAAA7M,KAAAyL,eAAAlU,aAAA,kBACAyI,KAAAiM,kBAAA,GACAjM,KAAAyL,eAAAa,YAAA,GACAtM,KAAAyL,eAAA9D,oBAAA,QAAA3H,KAAA4L,iBAEA5L,KAAA4L,eAAAC,OACA7L,KAAA8L,SAAAD,OACA7L,KAAA+L,YAAAF,OACA7L,KAAA2L,QAAA,EACA3L,KAAA2M,eACA/L,KAAAZ,MAAAA,KAAAE,UAAAgM,mBAQAb,EAAArO,UAAAiP,iBAAA,SAAAzB,GACAA,EACAxK,KAAAyL,eAAAvP,aAAA,cAAA,QAEA8D,KAAAyL,eAAAqB,gBAAA,gBAKAhU,EAAAY,UACA8D,YAAA6N,EACA5N,cAAA,mBACArC,SAAA,kBACAuB,QAAA,GClJA,IAAAoQ,GAAA,SAAA5T,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,gBAAAiS,EAOAA,EAAA/P,UAAAkD,WAAA8M,wBAAA,GASAD,EAAA/P,UAAArG,aACAsW,kBAAA,qBACAC,2BAAA,8BACAC,mBAAA,sBACAC,sBAAA,yBACAC,iBAAA,oBACAC,kBAAA,sBAQAP,EAAA/P,UAAAuQ,YAAA,SAAAC,GACA,GAAAC,GAAA3W,SAAAC,cAAA,MACA0W,GAAAhX,UAAAO,IAAAgJ,KAAArJ,YAAAsW,mBACAQ,EAAAhX,UAAAO,IAAAgJ,KAAArJ,YAAAsW,kBAAA,IAAAO,EACA,IAAAE,GAAA5W,SAAAC,cAAA,MACA2W,GAAAjX,UAAAO,IAAAgJ,KAAArJ,YAAAuW,4BACAQ,EAAAjX,UAAAO,IAAAgJ,KAAArJ,YAAA0W,iBACA,IAAAM,GAAA7W,SAAAC,cAAA,MACA4W,GAAAlX,UAAAO,IAAAgJ,KAAArJ,YAAAyW,sBACA,IAAAQ,GAAA9W,SAAAC,cAAA,MACA6W,GAAAnX,UAAAO,IAAAgJ,KAAArJ,YAAAuW,4BACAU,EAAAnX,UAAAO,IAAAgJ,KAAArJ,YAAA2W,kBAMA,KAAA,GALAO,IACAH,EACAC,EACAC,GAEA3T,EAAA,EAAAA,EAAA4T,EAAA1T,OAAAF,IAAA,CACA,GAAA6T,GAAAhX,SAAAC,cAAA,MACA+W,GAAArX,UAAAO,IAAAgJ,KAAArJ,YAAAwW,oBACAU,EAAA5T,GAAA7C,YAAA0W,GAEAL,EAAArW,YAAAsW,GACAD,EAAArW,YAAAuW,GACAF,EAAArW,YAAAwW,GACA5N,KAAAxJ,SAAAY,YAAAqW,IAEAV,EAAA/P,UAAA,YAAA+P,EAAA/P,UAAAuQ,YAOAR,EAAA/P,UAAA+Q,KAAA,WACA/N,KAAAxJ,SAAAC,UAAAqL,OAAA,cAEAiL,EAAA/P,UAAA,KAAA+P,EAAA/P,UAAA+Q,KAQAhB,EAAA/P,UAAAgR,MAAA,WACAhO,KAAAxJ,SAAAC,UAAAO,IAAA,cAEA+V,EAAA/P,UAAA,MAAA+P,EAAA/P,UAAAgR,MAIAjB,EAAA/P,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,IAAA,GAAAyD,GAAA,EAAAA,GAAA+F,KAAAE,UAAA8M,wBAAA/S,IACA+F,KAAAuN,YAAAtT,EAEA+F,MAAAxJ,SAAAC,UAAAO,IAAA,iBAKA8B,EAAAY,UACA8D,YAAAuP,EACAtP,cAAA,kBACArC,SAAA,iBACAuB,QAAA,GCrGA,IAAAsR,GAAA,SAAA9U,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,eAAAmT,EAOAA,EAAAjR,UAAAkD,WAAAa,aAAA,MASAkN,EAAAjR,UAAArG,aACAqK,MAAA,oBACAkN,MAAA,oBACAC,MAAA,oBACAjN,aAAA,2BACAf,cAAA,uBACAiB,qBAAA,sCACA1I,iBAAA,+BACA2I,cAAA,qBACA1I,OAAA,aACA2I,WAAA,aACAC,YAAA,cACAC,WAAA,cAQAyM,EAAAjR,UAAA0E,UAAA,SAAArB,GACAL,KAAA2B,kBAQAsM,EAAAjR,UAAA4E,SAAA,SAAAvB,GACAL,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,aAQA2M,EAAAjR,UAAA6E,QAAA,SAAAxB,GACAL,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAQA2M,EAAAjR,UAAA+E,WAAA,SAAA1B,GACAL,KAAAgC,SAOAiM,EAAAjR,UAAA2E,eAAA,WACA3B,KAAAiC,gBACAjC,KAAAkC,oBAOA+L,EAAAjR,UAAAgF,MAAA,WAGAlH,OAAA+E,WAAA,WACAG,KAAAmC,cAAA7B,QACAM,KAAAZ,MAAAA,KAAAE,UAAAa,eAQAkN,EAAAjR,UAAAiF,cAAA,WACAjC,KAAAmC,cAAA3B,SACAR,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4K,aAEAvB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4K,cAGA0M,EAAAjR,UAAA,cAAAiR,EAAAjR,UAAAiF,cAMAgM,EAAAjR,UAAAkF,iBAAA,WACAlC,KAAAmC,cAAAC,QACApC,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA6K,YAEAxB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA6K,aAGAyM,EAAAjR,UAAA,iBAAAiR,EAAAjR,UAAAkF,iBAMA+L,EAAAjR,UAAAuD,QAAA,WACAP,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAsM,EAAAjR,UAAA,QAAAiR,EAAAjR,UAAAuD,QAMA0N,EAAAjR,UAAAyD,OAAA,WACAT,KAAAmC,cAAA3B,UAAA,EACAR,KAAA2B,kBAEAsM,EAAAjR,UAAA,OAAAiR,EAAAjR,UAAAyD,OAMAwN,EAAAjR,UAAAoR,GAAA,WACApO,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAsM,EAAAjR,UAAA,GAAAiR,EAAAjR,UAAAoR,GAMAH,EAAAjR,UAAAqR,IAAA,WACArO,KAAAmC,cAAAC,SAAA,EACApC,KAAA2B,kBAEAsM,EAAAjR,UAAA,IAAAiR,EAAAjR,UAAAqR,IAIAJ,EAAAjR,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACAwJ,KAAAmC,cAAAnC,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAAqK,MACA,IAAAsN,GAAAxX,SAAAC,cAAA,MACAuX,GAAA7X,UAAAO,IAAAgJ,KAAArJ,YAAAuX,MACA,IAAAK,GAAAzX,SAAAC,cAAA,MACAwX,GAAA9X,UAAAO,IAAAgJ,KAAArJ,YAAAwX,MACA,IAAAK,GAAA1X,SAAAC,cAAA,OAMA,IALAyX,EAAA/X,UAAAO,IAAAgJ,KAAArJ,YAAAuK,cACAqN,EAAAnX,YAAAoX,GACAxO,KAAAxJ,SAAAY,YAAAkX,GACAtO,KAAAxJ,SAAAY,YAAAmX,GACAvO,KAAAmL,oBAAAnL,KAAA+B,WAAAnB,KAAAZ,MACAA,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAwJ,eAAA,CACAH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAyK,sBACApB,KAAA0C,wBAAA5L,SAAAC,cAAA,QACAiJ,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA+B,kBACAsH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAAwJ,eACAH,KAAA0C,wBAAAjM,UAAAO,IAAAgJ,KAAArJ,YAAA0K,eACArB,KAAA0C,wBAAArL,iBAAA,UAAA2I,KAAAmL,oBACA,IAAAjU,GAAAJ,SAAAC,cAAA,OACAG,GAAAT,UAAAO,IAAAgJ,KAAArJ,YAAAgC,QACAqH,KAAA0C,wBAAAtL,YAAAF,GACA8I,KAAAxJ,SAAAY,YAAA4I,KAAA0C,yBAEA1C,KAAAkL,mBAAAlL,KAAA0B,UAAAd,KAAAZ,MACAA,KAAAyO,kBAAAzO,KAAA4B,SAAAhB,KAAAZ,MACAA,KAAA0O,iBAAA1O,KAAA6B,QAAAjB,KAAAZ,MACAA,KAAAmC,cAAA9K,iBAAA,SAAA2I,KAAAkL,oBACAlL,KAAAmC,cAAA9K,iBAAA,QAAA2I,KAAAyO,mBACAzO,KAAAmC,cAAA9K,iBAAA,OAAA2I,KAAA0O,kBACA1O,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAmL,qBACAnL,KAAA2B,iBACA3B,KAAAxJ,SAAAC,UAAAO,IAAA,iBAKA8B,EAAAY,UACA8D,YAAAyQ,EACAxQ,cAAA,iBACArC,SAAA,gBACAuB,QAAA,Gb5MA,IAAAgS,GAAA,SAAAxV,GAEA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,aAAA6T,EAOAA,EAAA3R,UAAAkD,aASAyO,EAAA3R,UAAArG,aACAiY,UAAA,gBACAC,YAAA,kBACA7W,aAAA,YACA8W,eAAA,cACAlY,qBAAA,uBACAK,qBAAA,6BACAE,WAAA,aACA4X,mCAAA,uCAOAJ,EAAA3R,UAAAgS,UAAA,WACAhP,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAC,uBACAoJ,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAoY,oCAGA/O,KAAAiP,MAAAjP,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAiY,WACA5O,KAAAkP,QAAAlP,KAAAxJ,SAAA8E,iBAAA,IAAA0E,KAAArJ,YAAAkY,YAEA,KAAA,GAAA5U,GAAA,EAAAA,EAAA+F,KAAAiP,MAAA9U,OAAAF,IACA,GAAA5D,GAAA2J,KAAAiP,MAAAhV,GAAA+F,KAEAA,MAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAmY,iBAOAH,EAAA3R,UAAAlF,eAAA,WACA,IAAA,GAAAqX,GAAA,EAAAA,EAAAnP,KAAAiP,MAAA9U,OAAAgV,IACAnP,KAAAiP,MAAAE,GAAA1Y,UAAAqL,OAAA9B,KAAArJ,YAAAqB,eAQA2W,EAAA3R,UAAAjF,iBAAA,WACA,IAAA,GAAAyE,GAAA,EAAAA,EAAAwD,KAAAkP,QAAA/U,OAAAqC,IACAwD,KAAAkP,QAAA1S,GAAA/F,UAAAqL,OAAA9B,KAAArJ,YAAAqB,eAMA2W,EAAA3R,UAAAiD,KAAA,WACAD,KAAAxJ,UACAwJ,KAAAgP,aAoCAlW,EAAAY,UACA8D,YAAAmR,EACAlR,cAAA,eACArC,SAAA,eclHA,IAAAgU,GAAA,SAAAjW,GACA6G,KAAAxJ,SAAA2C,EACA6G,KAAAqP,QAAArP,KAAAE,UAAAoP,YAEAtP,KAAAC,OAEAnF,QAAA,kBAAAsU,EAOAA,EAAApS,UAAAkD,WACAoP,aAAA,EACAC,mBAAA,WAUAH,EAAApS,UAAArG,aACA6Y,MAAA,uBACAxO,MAAA,uBACAyO,SAAA,WACAnO,WAAA,aACAC,YAAA,cACAmO,WAAA,aACAjO,YAAA,cACAkO,gBAAA,mBAQAP,EAAApS,UAAA4S,WAAA,SAAAvP,GACA,GAAAwP,GAAAxP,EAAAqG,OAAA8D,MAAA7S,MAAA,MAAAwC,MACA,MAAAkG,EAAAkG,SACAsJ,GAAA7P,KAAAqP,SACAhP,EAAA5I,kBAUA2X,EAAApS,UAAA4E,SAAA,SAAAvB,GACAL,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,aAQA8N,EAAApS,UAAA6E,QAAA,SAAAxB,GACAL,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAQA8N,EAAApS,UAAA8S,SAAA,SAAAzP,GACAL,KAAA2B,kBAOAyN,EAAApS,UAAA2E,eAAA,WACA3B,KAAAiC,gBACAjC,KAAA+P,gBACA/P,KAAAgQ,aACAhQ,KAAAiQ,cAQAb,EAAApS,UAAAiF,cAAA,WACAjC,KAAAkQ,OAAA1P,SACAR,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4K,aAEAvB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4K,cAGA6N,EAAApS,UAAA,cAAAoS,EAAApS,UAAAiF,cAMAmN,EAAApS,UAAAiT,WAAA,WACApD,QAAA7M,KAAAxJ,SAAAqB,cAAA,WACAmI,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2K,YAEAtB,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA2K,aAGA8N,EAAApS,UAAA,WAAAoS,EAAApS,UAAAiT,WAMAb,EAAApS,UAAA+S,cAAA,WACA/P,KAAAkQ,OAAAC,WACAnQ,KAAAkQ,OAAAC,SAAAC,MACApQ,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA+Y,YAEA1P,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA+Y,cAIAN,EAAApS,UAAA,cAAAoS,EAAApS,UAAA+S,cAMAX,EAAApS,UAAAgT,WAAA,WACAhQ,KAAAkQ,OAAA1F,OAAAxK,KAAAkQ,OAAA1F,MAAArQ,OAAA,EACA6F,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8Y,UAEAzP,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA8Y,WAGAL,EAAApS,UAAA,WAAAoS,EAAApS,UAAAgT,WAMAZ,EAAApS,UAAAuD,QAAA,WACAP,KAAAkQ,OAAA1P,UAAA,EACAR,KAAA2B,kBAEAyN,EAAApS,UAAA,QAAAoS,EAAApS,UAAAuD,QAMA6O,EAAApS,UAAAyD,OAAA,WACAT,KAAAkQ,OAAA1P,UAAA,EACAR,KAAA2B,kBAEAyN,EAAApS,UAAA,OAAAoS,EAAApS,UAAAyD,OAOA2O,EAAApS,UAAA8N,OAAA,SAAAN,GACAxK,KAAAkQ,OAAA1F,MAAAA,GAAA,GACAxK,KAAA2B,kBAEAyN,EAAApS,UAAA,OAAAoS,EAAApS,UAAA8N,OAIAsE,EAAApS,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,WACAwJ,KAAAqQ,OAAArQ,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAA6Y,OACAxP,KAAAkQ,OAAAlQ,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAAqK,OACAhB,KAAAkQ,QAAA,CACAlQ,KAAAkQ,OAAApJ,aAAA9G,KAAAE,UAAAqP,sBACAvP,KAAAqP,QAAAiB,SAAAtQ,KAAAkQ,OAAA3Y,aAAAyI,KAAAE,UAAAqP,oBAAA,IACAgB,MAAAvQ,KAAAqP,WACArP,KAAAqP,QAAArP,KAAAE,UAAAoP,cAGAtP,KAAAkQ,OAAApJ,aAAA,gBACA9G,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAgZ,iBAEA3P,KAAAwQ,0BAAAxQ,KAAA2B,eAAAf,KAAAZ,MACAA,KAAAyO,kBAAAzO,KAAA4B,SAAAhB,KAAAZ,MACAA,KAAA0O,iBAAA1O,KAAA6B,QAAAjB,KAAAZ,MACAA,KAAAyQ,kBAAAzQ,KAAA8P,SAAAlP,KAAAZ,MACAA,KAAAkQ,OAAA7Y,iBAAA,QAAA2I,KAAAwQ,2BACAxQ,KAAAkQ,OAAA7Y,iBAAA,QAAA2I,KAAAyO,mBACAzO,KAAAkQ,OAAA7Y,iBAAA,OAAA2I,KAAA0O,kBACA1O,KAAAkQ,OAAA7Y,iBAAA,QAAA2I,KAAAyQ,mBACAzQ,KAAAqP,UAAArP,KAAAE,UAAAoP,cAGAtP,KAAA0Q,oBAAA1Q,KAAA4P,WAAAhP,KAAAZ,MACAA,KAAAkQ,OAAA7Y,iBAAA,UAAA2I,KAAA0Q,qBAEA,IAAAC,GAAA3Q,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA+Y,WACA1P,MAAA2B,iBACA3B,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,aACAkP,GACA3Q,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA+Y,YAEA1P,KAAAkQ,OAAApJ,aAAA,eACA9G,KAAAxJ,SAAAgQ,QACAxG,KAAAiQ,gBAOAnX,EAAAY,UACA8D,YAAA4R,EACA3R,cAAA,oBACArC,SAAA,mBACAuB,QAAA,GC/NA,IAAAiU,GAAA,SAAAzX,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,gBAAA8V,EAOAA,EAAA5T,UAAAkD,aASA0Q,EAAA5T,UAAArG,aACA4B,UAAA,YACAsY,OAAA,sBACAC,KAAA,oBACAC,MAAA,qBACAC,IAAA,oBAQAJ,EAAA5T,UAAAiU,kBAAA,SAAA5Q,GACA,GAAA6Q,GAAA7Q,EAAAqG,OAAAd,wBACAO,EAAA+K,EAAA/K,KAAA+K,EAAA/J,MAAA,EACAnB,EAAAkL,EAAAlL,IAAAkL,EAAAhK,OAAA,EACAiK,GAAA,GAAAnR,KAAAxJ,SAAA4a,YAAA,GACAC,GAAA,GAAArR,KAAAxJ,SAAA0P,aAAA,EACAlG,MAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAma,OAAA9Q,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAoa,QACA5K,EAAA+K,EAAA/J,MAAA,EACAnB,EAAAqL,EAAA,GACArR,KAAAxJ,SAAAsP,MAAAE,IAAA,IACAhG,KAAAxJ,SAAAsP,MAAAuL,UAAA,MAEArR,KAAAxJ,SAAAsP,MAAAE,IAAAA,EAAA,KACAhG,KAAAxJ,SAAAsP,MAAAuL,UAAAA,EAAA,OAGAlL,EAAAgL,EAAA,GACAnR,KAAAxJ,SAAAsP,MAAAK,KAAA,IACAnG,KAAAxJ,SAAAsP,MAAAqL,WAAA,MAEAnR,KAAAxJ,SAAAsP,MAAAK,KAAAA,EAAA,KACAnG,KAAAxJ,SAAAsP,MAAAqL,WAAAA,EAAA,MAGAnR,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAqa,KACAhR,KAAAxJ,SAAAsP,MAAAE,IAAAkL,EAAAlL,IAAAhG,KAAAxJ,SAAA0P,aAAA,GAAA,KACAlG,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAoa,OACA/Q,KAAAxJ,SAAAsP,MAAAK,KAAA+K,EAAA/K,KAAA+K,EAAA/J,MAAA,GAAA,KACAnH,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAma,MACA9Q,KAAAxJ,SAAAsP,MAAAK,KAAA+K,EAAA/K,KAAAnG,KAAAxJ,SAAA4a,YAAA,GAAA,KAEApR,KAAAxJ,SAAAsP,MAAAE,IAAAkL,EAAAlL,IAAAkL,EAAAhK,OAAA,GAAA,KAEAlH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4B,YAOAqY,EAAA5T,UAAAsU,aAAA,WACAtR,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAA4B,YAKAqY,EAAA5T,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAAsO,GAAA9E,KAAAxJ,SAAAe,aAAA,QAAAyI,KAAAxJ,SAAAe,aAAA,eACAuN,KACA9E,KAAAiF,YAAAnO,SAAAkO,eAAAF,IAEA9E,KAAAiF,cAEAjF,KAAAiF,YAAA6B,aAAA,aACA9G,KAAAiF,YAAA/I,aAAA,WAAA,KAEA8D,KAAAuR,uBAAAvR,KAAAiR,kBAAArQ,KAAAZ,MACAA,KAAAwR,gCAAAxR,KAAAsR,aAAA1Q,KAAAZ,MACAA,KAAAiF,YAAA5N,iBAAA,aAAA2I,KAAAuR,wBAAA,GACAvR,KAAAiF,YAAA5N,iBAAA,WAAA2I,KAAAuR,wBAAA,GACAvR,KAAAiF,YAAA5N,iBAAA,aAAA2I,KAAAwR,iCAAA,GACA1W,OAAAzD,iBAAA,SAAA2I,KAAAwR,iCAAA,GACA1W,OAAAzD,iBAAA,aAAA2I,KAAAwR,oCAMA1Y,EAAAY,UACA8D,YAAAoT,EACAnT,cAAA,kBACArC,SAAA,ed1GA,IAAAqW,GAAA,SAAAtY,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,eAAA2W,EAOAA,EAAAzU,UAAAkD,WACAwR,UAAA,sBACAC,kBAAA,IACAC,eAAA,IACAC,UAAA,WACAC,aAAA,eACAC,cAAA,iBAQAN,EAAAzU,UAAAsG,WACAC,MAAA,GACAC,OAAA,GACAC,MAAA,IAQAgO,EAAAzU,UAAAgV,OACAC,SAAA,EACAC,OAAA,EACAC,UAAA,EACAC,OAAA,GAUAX,EAAAzU,UAAArG,aACAiN,UAAA,wBACAyO,OAAA,qBACAC,OAAA,qBACAC,QAAA,sBACAC,WAAA,4BACAC,KAAA,iBACAha,iBAAA,uBACAC,iBAAA,mCACAC,OAAA,aACAyI,qBAAA,sCACAsR,cAAA,6BACAC,iBAAA,gCACAC,cAAA,6BACAC,aAAA,2BACAC,WAAA,yBACAC,QAAA,sBACAC,cAAA,gCACAC,IAAA,kBACAC,eAAA,6BACAC,oBAAA,kCACAC,qBAAA,mCACAxa,kBAAA,gCACAya,MAAA,wBACAC,WAAA,aACAC,SAAA,WACAC,qBAAA,uBACAC,eAAA,oBACAC,WAAA,aACAC,gBAAA,kBACAC,eAAA,aACArb,UAAA,YACAkJ,YAAA,cACAwC,aAAA,eACA4P,gBAAA,gCACAC,gBAAA,iCAOArC,EAAAzU,UAAA+W,sBAAA,WACA,IAAA/T,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAAsN,cAAA,CAGA,GAAAgQ,IAAAjU,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAgd,kBAAA3T,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAkc,aACA7S,MAAA1H,SAAA4b,UAAA,IAAAlU,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAA+c,aACA1T,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAA8c,gBACAzT,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAA+c,YACAO,GACAjU,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAAsN,eAEAjE,KAAA1H,SAAA4b,WAAA,GAAAlU,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAA+c,cACA1T,KAAAgU,QAAAvd,UAAAqL,OAAA9B,KAAArJ,YAAA8c,gBACAzT,KAAAgU,QAAAvd,UAAAqL,OAAA9B,KAAArJ,YAAA+c,YACAO,GACAjU,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAAsN,iBAUAwN,EAAAzU,UAAAmX,sBAAA,SAAAzO,GAEAA,EAAAa,UAAAvG,KAAAsD,UAAAE,QAAAxD,KAAAoU,QAAA3d,UAAAC,SAAAsJ,KAAArJ,YAAAid,iBACA5T,KAAAqU,gBAQA5C,EAAAzU,UAAAsX,mBAAA,WACAtU,KAAAuU,sBAAAC,QACAxU,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAAgd,kBAEA3T,KAAAxJ,SAAAC,UAAAqL,OAAA9B,KAAArJ,YAAAgd,iBAEA3T,KAAAoU,UACApU,KAAAoU,QAAA3d,UAAAqL,OAAA9B,KAAArJ,YAAAid,gBACA5T,KAAAyU,YAAAhe,UAAAqL,OAAA9B,KAAArJ,YAAAid,mBAUAnC,EAAAzU,UAAA0X,qBAAA,SAAAhP,GACA,GAAAA,GAAA,YAAAA,EAAAiP,KAAA,CACA,GAAAjP,EAAAa,UAAAvG,KAAAsD,UAAAG,OAAAiC,EAAAa,UAAAvG,KAAAsD,UAAAC,MAKA,MAHAmC,GAAAjO,iBAMAuI,KAAAqU,gBAOA5C,EAAAzU,UAAA4X,4BAAA,WACA5U,KAAAgU,QAAAvd,UAAAqL,OAAA9B,KAAArJ,YAAAsN,eAOAwN,EAAAzU,UAAA6X,oBAAA,WACA7U,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAA+c,cACA1T,KAAAgU,QAAAvd,UAAAqL,OAAA9B,KAAArJ,YAAA+c,YACA1T,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAAsN,gBAQAwN,EAAAzU,UAAAlF,eAAA,SAAAgd,GACA,IAAA,GAAA3F,GAAA,EAAAA,EAAA2F,EAAA3a,OAAAgV,IACA2F,EAAA3F,GAAA1Y,UAAAqL,OAAA9B,KAAArJ,YAAA4B,YAQAkZ,EAAAzU,UAAAjF,iBAAA,SAAAI,GACA,IAAA,GAAAqE,GAAA,EAAAA,EAAArE,EAAAgC,OAAAqC,IACArE,EAAAqE,GAAA/F,UAAAqL,OAAA9B,KAAArJ,YAAA4B,YAQAkZ,EAAAzU,UAAAqX,aAAA,WACA,GAAAU,GAAA/U,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAA6b,WACAxS,MAAAoU,QAAA3d,UAAA6P,OAAAtG,KAAArJ,YAAAid,gBACA5T,KAAAyU,YAAAhe,UAAA6P,OAAAtG,KAAArJ,YAAAid,gBAEA5T,KAAAoU,QAAA3d,UAAAC,SAAAsJ,KAAArJ,YAAAid,iBACA5T,KAAAoU,QAAAlY,aAAA,cAAA,SACA6Y,EAAA7Y,aAAA,gBAAA,UAEA8D,KAAAoU,QAAAlY,aAAA,cAAA,QACA6Y,EAAA7Y,aAAA,gBAAA,WAGAuV,EAAAzU,UAAA,aAAAyU,EAAAzU,UAAAqX,aAIA5C,EAAAzU,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAA+N,GAAAzN,SAAAC,cAAA,MACAwN,GAAA9N,UAAAO,IAAAgJ,KAAArJ,YAAAiN,UACA,IAAAoR,GAAAhV,KAAAxJ,SAAAqB,cAAA,SACAmI,MAAAxJ,SAAAgO,cAAAC,aAAAF,EAAAvE,KAAAxJ,UACAwJ,KAAAxJ,SAAAgO,cAAAE,YAAA1E,KAAAxJ,UACA+N,EAAAnN,YAAA4I,KAAAxJ,UACAwe,GACAA,EAAAxO,OAIA,KAAA,GAFAyO,GAAAjV,KAAAxJ,SAAA0e,WACAC,EAAAF,EAAA9a,OACAib,EAAA,EAAAA,EAAAD,EAAAC,IAAA,CACA,GAAAC,GAAAJ,EAAAG,EACAC,GAAA5e,WAAA4e,EAAA5e,UAAAC,SAAAsJ,KAAArJ,YAAA0b,UACArS,KAAAgU,QAAAqB,GAEAA,EAAA5e,WAAA4e,EAAA5e,UAAAC,SAAAsJ,KAAArJ,YAAA2b,UACAtS,KAAAoU,QAAAiB,GAEAA,EAAA5e,WAAA4e,EAAA5e,UAAAC,SAAAsJ,KAAArJ,YAAA4b,WACAvS,KAAA1H,SAAA+c,GAGAva,OAAAzD,iBAAA,WAAA,SAAAC,GACAA,EAAAge,YAGAtV,KAAAxJ,SAAAsP,MAAAyP,UAAA,SACApW,sBAAA,WACAa,KAAAxJ,SAAAsP,MAAAyP,UAAA,IACA3U,KAAAZ,SAEAY,KAAAZ,OAAA,GACAA,KAAAgU,UACAhU,KAAAxH,QAAAwH,KAAAgU,QAAAnc,cAAA,IAAAmI,KAAArJ,YAAAoc,SAEA,IAAAyC,GAAAxV,KAAAgS,MAAAC,QA+BA,IA9BAjS,KAAAgU,UACAhU,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAA+b,eACA8C,EAAAxV,KAAAgS,MAAAE,OACAlS,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAAgc,mBACA6C,EAAAxV,KAAAgS,MAAAG,UACAnS,KAAAgU,QAAA3c,iBAAA,gBAAA2I,KAAA4U,4BAAAhU,KAAAZ,OACAA,KAAAgU,QAAA3c,iBAAA,QAAA2I,KAAA6U,oBAAAjU,KAAAZ,QACAA,KAAAgU,QAAAvd,UAAAC,SAAAsJ,KAAArJ,YAAAic,iBACA4C,EAAAxV,KAAAgS,MAAAI,OACA7N,EAAA9N,UAAAO,IAAAgJ,KAAArJ,YAAA6c,uBAEAgC,IAAAxV,KAAAgS,MAAAC,UACAjS,KAAAgU,QAAAvd,UAAAO,IAAAgJ,KAAArJ,YAAA8c,gBACAzT,KAAAxH,SACAwH,KAAAxH,QAAA/B,UAAAO,IAAAgJ,KAAArJ,YAAA8c,iBAEA+B,IAAAxV,KAAAgS,MAAAE,QAAAsD,IAAAxV,KAAAgS,MAAAI,QACApS,KAAAgU,QAAAvd,UAAAqL,OAAA9B,KAAArJ,YAAA8c,gBACAzT,KAAAxH,SACAwH,KAAAxH,QAAA/B,UAAAqL,OAAA9B,KAAArJ,YAAA8c,iBAEA+B,IAAAxV,KAAAgS,MAAAG,YAIAnS,KAAA1H,SAAAjB,iBAAA,SAAA2I,KAAA+T,sBAAAnT,KAAAZ,OACAA,KAAA+T,0BAIA/T,KAAAoU,QAAA,CACA,GAAAW,GAAA/U,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAA6b,WACA,KAAAuC,EAAA,CACAA,EAAAje,SAAAC,cAAA,OACAge,EAAA7Y,aAAA,gBAAA,SACA6Y,EAAA7Y,aAAA,OAAA,UACA6Y,EAAA7Y,aAAA,WAAA,KACA6Y,EAAAte,UAAAO,IAAAgJ,KAAArJ,YAAA6b,WACA,IAAAiD,GAAA3e,SAAAC,cAAA,IACA0e,GAAAhf,UAAAO,IAAAgJ,KAAArJ,YAAA8b,MACAgD,EAAAC,UAAA1V,KAAAE,UAAA2R,UACAkD,EAAA3d,YAAAqe,GAEAzV,KAAAoU,QAAA3d,UAAAC,SAAAsJ,KAAArJ,YAAAkd,iBAEAkB,EAAAte,UAAAO,IAAAgJ,KAAArJ,YAAAkd,iBACA7T,KAAAoU,QAAA3d,UAAAC,SAAAsJ,KAAArJ,YAAAmd,kBAEAiB,EAAAte,UAAAO,IAAAgJ,KAAArJ,YAAAmd,iBAEAiB,EAAA1d,iBAAA,QAAA2I,KAAA0U,qBAAA9T,KAAAZ,OACA+U,EAAA1d,iBAAA,UAAA2I,KAAA0U,qBAAA9T,KAAAZ,OAIAA,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA2c,YAGAtT,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAkc,cACA7S,KAAAgU,QAAAvP,aAAAsQ,EAAA/U,KAAAgU,QAAA2B,YAEA3V,KAAAxJ,SAAAiO,aAAAsQ,EAAA/U,KAAA1H,SAEA,IAAAsd,GAAA9e,SAAAC,cAAA,MACA6e,GAAAnf,UAAAO,IAAAgJ,KAAArJ,YAAAmc,YACA9S,KAAAxJ,SAAAY,YAAAwe,GACAA,EAAAve,iBAAA,QAAA2I,KAAA0U,qBAAA9T,KAAAZ,OACAA,KAAAyU,YAAAmB,EACA5V,KAAAoU,QAAA/c,iBAAA,UAAA2I,KAAAmU,sBAAAvT,KAAAZ,OACAA,KAAAoU,QAAAlY,aAAA,cAAA,QAQA,GAJA8D,KAAAuU,sBAAAzZ,OAAA+a,WAAA7V,KAAAE,UAAAwR,WACA1R,KAAAuU,sBAAAuB,YAAA9V,KAAAsU,mBAAA1T,KAAAZ,OACAA,KAAAsU,qBAEAtU,KAAAgU,SAAAhU,KAAAxH,QAAA,CACAwH,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA4c,SACA,IAAAwC,GAAAjf,SAAAC,cAAA,MACAgf,GAAAtf,UAAAO,IAAAgJ,KAAArJ,YAAAqc,eACAhT,KAAAgU,QAAAvP,aAAAsR,EAAA/V,KAAAxH,SACAwH,KAAAgU,QAAAtP,YAAA1E,KAAAxH,QACA,IAAAwd,GAAAlf,SAAAC,cAAA,MACAif,GAAAvf,UAAAO,IAAAgJ,KAAArJ,YAAAuc,gBACA8C,EAAAvf,UAAAO,IAAAgJ,KAAArJ,YAAAwc,oBACA,IAAA8C,GAAAnf,SAAAC,cAAA,IACAkf,GAAAxf,UAAAO,IAAAgJ,KAAArJ,YAAA8b,MACAwD,EAAA3J,YAAAtM,KAAAE,UAAA4R,aACAkE,EAAA5e,YAAA6e,GACAD,EAAA3e,iBAAA,QAAA,WACA2I,KAAAxH,QAAA0d,YAAAlW,KAAAE,UAAAyR,mBACA/Q,KAAAZ,MACA,IAAAmW,GAAArf,SAAAC,cAAA,MACAof,GAAA1f,UAAAO,IAAAgJ,KAAArJ,YAAAuc,gBACAiD,EAAA1f,UAAAO,IAAAgJ,KAAArJ,YAAAyc,qBACA,IAAAgD,GAAAtf,SAAAC,cAAA,IACAqf,GAAA3f,UAAAO,IAAAgJ,KAAArJ,YAAA8b,MACA2D,EAAA9J,YAAAtM,KAAAE,UAAA6R,cACAoE,EAAA/e,YAAAgf,GACAD,EAAA9e,iBAAA,QAAA,WACA2I,KAAAxH,QAAA0d,YAAAlW,KAAAE,UAAAyR,mBACA/Q,KAAAZ,OACA+V,EAAA3e,YAAA4e,GACAD,EAAA3e,YAAA4I,KAAAxH,SACAud,EAAA3e,YAAA+e,EAGA,IAAAE,GAAA,WACArW,KAAAxH,QAAA0d,WAAA,EACAF,EAAAvf,UAAAO,IAAAgJ,KAAArJ,YAAA4B,WAEAyd,EAAAvf,UAAAqL,OAAA9B,KAAArJ,YAAA4B,WAEAyH,KAAAxH,QAAA0d,WAAAlW,KAAAxH,QAAA8d,YAAAtW,KAAAxH,QAAA4Y,YACA+E,EAAA1f,UAAAO,IAAAgJ,KAAArJ,YAAA4B,WAEA4d,EAAA1f,UAAAqL,OAAA9B,KAAArJ,YAAA4B,YAEAqI,KAAAZ,KACAA,MAAAxH,QAAAnB,iBAAA,SAAAgf,GACAA,GAEA,IAAAE,GAAA,WAEAvW,KAAAwW,kBACA1W,aAAAE,KAAAwW,kBAEAxW,KAAAwW,iBAAA3W,WAAA,WACAwW,IACArW,KAAAwW,iBAAA,MACA5V,KAAAZ,MAAAA,KAAAE,UAAA0R,iBACAhR,KAAAZ,KACAlF,QAAAzD,iBAAA,SAAAkf,GACAvW,KAAAxH,QAAA/B,UAAAC,SAAAsJ,KAAArJ,YAAA8B,mBACAuH,KAAAxH,QAAA/B,UAAAO,IAAAgJ,KAAArJ,YAAAyK,qBAMA,KAAA,GAHAlJ,GAAA8H,KAAAxH,QAAA8C,iBAAA,IAAA0E,KAAArJ,YAAAsc,KACA9a,EAAA6H,KAAA1H,SAAAgD,iBAAA,IAAA0E,KAAArJ,YAAA0c,OAEApZ,EAAA,EAAAA,EAAA/B,EAAAiC,OAAAF,IACA,GAAAhC,GAAAC,EAAA+B,GAAA/B,EAAAC,EAAA6H,MAGAA,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,eA2CA3G,OAAA,kBAAA7C,EAGAa,EAAAY,UACA8D,YAAAiU,EACAhU,cAAA,iBACArC,SAAA,iBercA,IAAAqb,GAAA,SAAAtd,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,kBAAA2b,EAOAA,EAAAzZ,UAAAkD,aASAuW,EAAAzZ,UAAArG,aACA+f,WAAA,iBACAC,WAAA,6BACAC,eAAA,yBACAC,YAAA,cACApV,YAAA,eAWAgV,EAAAzZ,UAAA8Z,WAAA,SAAAC,EAAAC,EAAAC,GACA,MAAAD,GACA,WACAD,EAAA3U,QACA4U,EAAAvgB,UAAAO,IAAAgJ,KAAArJ,YAAAkgB,aAEAG,EAAAvgB,UAAAqL,OAAA9B,KAAArJ,YAAAkgB,cAEAjW,KAAAZ,MAEAiX,EACA,WACA,GAAAhd,GACAoO,CACA,IAAA0O,EAAA3U,QACA,IAAAnI,EAAA,EAAAA,EAAAgd,EAAA9c,OAAAF,IACAoO,EAAA4O,EAAAhd,GAAApC,cAAA,MAAAA,cAAA,iBACAwQ,EAAA,iBAAAhG,QACA4U,EAAAhd,GAAAxD,UAAAO,IAAAgJ,KAAArJ,YAAAkgB,iBAGA,KAAA5c,EAAA,EAAAA,EAAAgd,EAAA9c,OAAAF,IACAoO,EAAA4O,EAAAhd,GAAApC,cAAA,MAAAA,cAAA,iBACAwQ,EAAA,iBAAA/F,UACA2U,EAAAhd,GAAAxD,UAAAqL,OAAA9B,KAAArJ,YAAAkgB,cAGAjW,KAAAZ,MAjBA,QA4BAyW,EAAAzZ,UAAAka,gBAAA,SAAAF,EAAAC,GACA,GAAAE,GAAArgB,SAAAC,cAAA,SACAqgB,GACA,eACA,kBACA,uBACApX,KAAArJ,YAAAigB,eAEAO,GAAA/c,UAAAgd,EAAAjb,KAAA,IACA,IAAA4a,GAAAjgB,SAAAC,cAAA,QAWA,OAVAggB,GAAApC,KAAA,WACAoC,EAAAtgB,UAAAO,IAAA,uBACAggB,GACAD,EAAA3U,QAAA4U,EAAAvgB,UAAAC,SAAAsJ,KAAArJ,YAAAkgB,aACAE,EAAA1f,iBAAA,SAAA2I,KAAA8W,WAAAC,EAAAC,KACAC,GACAF,EAAA1f,iBAAA,SAAA2I,KAAA8W,WAAAC,EAAA,KAAAE,IAEAE,EAAA/f,YAAA2f,GACAje,EAAAI,eAAAie,EAAA,oBACAA,GAKAV,EAAAzZ,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAA6gB,GAAArX,KAAAxJ,SAAAqB,cAAA,MACAyf,EAAAxa,MAAAE,UAAAC,MAAAC,KAAA8C,KAAAxJ,SAAA8E,iBAAA,aACAic,EAAAza,MAAAE,UAAAC,MAAAC,KAAA8C,KAAAxJ,SAAA8E,iBAAA,aACAkc,EAAAF,EAAAG,OAAAF,EACA,IAAAvX,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAAggB,YAAA,CACA,GAAAe,GAAA5gB,SAAAC,cAAA,MACA4gB,EAAA3X,KAAAkX,gBAAA,KAAAM,EACAE,GAAAtgB,YAAAugB,GACAN,EAAA7S,cAAAC,aAAAiT,EAAAL,EACA,KAAA,GAAApd,GAAA,EAAAA,EAAAud,EAAArd,OAAAF,IAAA,CACA,GAAA2d,GAAAJ,EAAAvd,GAAApC,cAAA,KACA,IAAA+f,EAAA,CACA,GAAAC,GAAA/gB,SAAAC,cAAA,KACA,IAAA,UAAAygB,EAAAvd,GAAAyN,WAAAoQ,SAAAC,cAAA,CACA,GAAAC,GAAAhY,KAAAkX,gBAAAM,EAAAvd,GACA4d,GAAAzgB,YAAA4gB,GAEAR,EAAAvd,GAAAwK,aAAAoT,EAAAD,IAGA5X,KAAAxJ,SAAAC,UAAAO,IAAAgJ,KAAArJ,YAAA8K,gBAMA3I,EAAAY,UACA8D,YAAAiZ,EACAhZ,cAAA,oBACArC,SAAA,qBCnIA,IAAA6c,GAAA,SAAA9e,GACA6G,KAAAxJ,SAAA2C,EAEA6G,KAAAC,OAEAnF,QAAA,eAAAmd,EAOAA,EAAAjb,UAAAkD,WACAgY,cAAA,wBACAC,aAAA,MACAC,gBAAA,MACAC,cAAA,IACAC,YAAA,IAUAL,EAAAjb,UAAArG,aACA0K,cAAA,qBACAkX,4BAAA,sCACA5f,OAAA,aACAsL,aAAA,eACAD,WAAA,cAQAiU,EAAAjb,UAAAwb,aAAA,SAAAnY,GACA,IAAAL,KAAAU,eAAAoF,MAAAqB,QAAAnH,KAAAU,eAAAoF,MAAAoB,OAAA,CACA,GAAAvB,GAAA3F,KAAAxJ,SAAAoP,uBACA5F,MAAAyY,YAAA9S,EAAAuB,OACAlH,KAAA0Y,WAAA/S,EAAAwB,MACAnH,KAAA2Y,YAAA,EAAAhZ,KAAAiZ,KAAAjT,EAAAwB,MAAAxB,EAAAwB,MAAAxB,EAAAuB,OAAAvB,EAAAuB,QAAA,EACAlH,KAAAU,eAAAoF,MAAAqB,MAAAnH,KAAA2Y,YAAA,KACA3Y,KAAAU,eAAAoF,MAAAoB,OAAAlH,KAAA2Y,YAAA,KAGA,GADA3Y,KAAAU,eAAAjK,UAAAO,IAAAgJ,KAAArJ,YAAAqN,YACA,cAAA3D,EAAAsU,MAAA3U,KAAA6Y,mBACA7Y,KAAA6Y,oBAAA,MACA,CACA,eAAAxY,EAAAsU,OACA3U,KAAA6Y,oBAAA,EAEA,IAAAC,GAAA9Y,KAAA+Y,eACA,IAAAD,EAAA,EACA,MAEA9Y,MAAAgZ,cAAA,EACA,IACAC,GACA3O,EAFA4O,EAAA7Y,EAAA8Y,cAAAvT,uBAIA,IAAA,IAAAvF,EAAA+J,SAAA,IAAA/J,EAAAgK,QACA4O,EAAAtZ,KAAAyZ,MAAAF,EAAA/R,MAAA,GACAmD,EAAA3K,KAAAyZ,MAAAF,EAAAhS,OAAA,OACA,CACA,GAAAkD,GAAAyB,SAAAxL,EAAA+J,QAAA/J,EAAA+J,QAAA/J,EAAAgZ,QAAA,GAAAjP,QACAC,EAAAwB,SAAAxL,EAAAgK,QAAAhK,EAAAgK,QAAAhK,EAAAgZ,QAAA,GAAAhP,OACA4O,GAAAtZ,KAAAyZ,MAAAhP,EAAA8O,EAAA/S,MACAmE,EAAA3K,KAAAyZ,MAAA/O,EAAA6O,EAAAlT,KAEAhG,KAAAsZ,YAAAL,EAAA3O,GACAtK,KAAAuZ,iBAAA,GACAze,OAAAqE,sBAAAa,KAAAwZ,iBAAA5Y,KAAAZ,SASAiY,EAAAjb,UAAAyc,WAAA,SAAApZ,GAEAA,GAAA,IAAAA,EAAAqZ,QAIA5e,OAAA+E,WAAA,WACAG,KAAAU,eAAAjK,UAAAqL,OAAA9B,KAAArJ,YAAAqN,aACApD,KAAAZ,MAAA,IAMAiY,EAAAjb,UAAAiD,KAAA,WACA,GAAAD,KAAAxJ,SAAA,CACA,GAAAmjB,GAAA3Z,KAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA0K,cACArB,MAAAxJ,SAAAC,UAAAC,SAAAsJ,KAAArJ,YAAA4hB,+BACAvY,KAAAU,eAAAV,KAAAxJ,SAAAqB,cAAA,IAAAmI,KAAArJ,YAAAgC,QACAqH,KAAA4Z,YAAA,EACA5Z,KAAA2Y,YAAA,EACA3Y,KAAA6Z,GAAA,EACA7Z,KAAA8Z,GAAA,EAIA9Z,KAAA6Y,oBAAA,EACA7Y,KAAA+Z,iBAAA/Z,KAAAwY,aAAA5X,KAAAZ,MACAA,KAAAxJ,SAAAa,iBAAA,YAAA2I,KAAA+Z,kBACA/Z,KAAAxJ,SAAAa,iBAAA,aAAA2I,KAAA+Z,kBACA/Z,KAAAga,eAAAha,KAAAyZ,WAAA7Y,KAAAZ,MACAA,KAAAxJ,SAAAa,iBAAA,UAAA2I,KAAAga,gBACAha,KAAAxJ,SAAAa,iBAAA,aAAA2I,KAAAga,gBACAha,KAAAxJ,SAAAa,iBAAA,WAAA2I,KAAAga,gBACAha,KAAAxJ,SAAAa,iBAAA,OAAA2I,KAAAga,gBAKAha,KAAA+Y,cAAA,WACA,MAAA/Y,MAAA4Z,aAMA5Z,KAAAgZ,cAAA,SAAAiB,GACAja,KAAA4Z,YAAAK,GAMAja,KAAAka,iBAAA,WACA,MAAAla,MAAAU,gBAOAV,KAAAsZ,YAAA,SAAAa,EAAAC,GACApa,KAAA6Z,GAAAM,EACAna,KAAA8Z,GAAAM,GAMApa,KAAAuZ,gBAAA,SAAAvL,GACA,GAAA,OAAAhO,KAAAU,eAAA,CACA,GAAA2Z,GACAC,EACAC,EACAC,EAAA,aAAAxa,KAAA6Z,GAAA,OAAA7Z,KAAA8Z,GAAA,KACA9L,IACAsM,EAAAta,KAAAE,UAAAgY,cACAqC,EAAAva,KAAAE,UAAAiY,eAEAmC,EAAAta,KAAAE,UAAAoY,YACAiC,EAAAva,KAAA2Y,YAAA,KACAgB,IACAa,EAAA,aAAAxa,KAAA0Y,WAAA,EAAA,OAAA1Y,KAAAyY,YAAA,EAAA,QAGA4B,EAAA,yBAAAG,EAAAF,EACAta,KAAAU,eAAAoF,MAAA2U,gBAAAJ,EACAra,KAAAU,eAAAoF,MAAA4U,YAAAL,EACAra,KAAAU,eAAAoF,MAAA6U,UAAAN,EACArM,EACAhO,KAAAU,eAAAjK,UAAAqL,OAAA9B,KAAArJ,YAAAsN,cAEAjE,KAAAU,eAAAjK,UAAAO,IAAAgJ,KAAArJ,YAAAsN,gBAOAjE,KAAAwZ,iBAAA,WACAxZ,KAAA4Z,eAAA,EACA9e,OAAAqE,sBAAAa,KAAAwZ,iBAAA5Y,KAAAZ,OAEAA,KAAAuZ,iBAAA,OAQAzgB,EAAAY,UACA8D,YAAAya,EACAxa,cAAA,iBACArC,SAAA,uBACAuB,QAAA",
+ "file": "material.min.js",
+ "sourcesContent": [
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Tabs MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {Element} element The element that will be upgraded.\n */\nvar MaterialTabs = function MaterialTabs(element) {\n // Stores the HTML element.\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialTabs'] = MaterialTabs;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string}\n * @private\n */\nMaterialTabs.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialTabs.prototype.CssClasses_ = {\n TAB_CLASS: 'mdl-tabs__tab',\n PANEL_CLASS: 'mdl-tabs__panel',\n ACTIVE_CLASS: 'is-active',\n UPGRADED_CLASS: 'is-upgraded',\n MDL_JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n MDL_RIPPLE_CONTAINER: 'mdl-tabs__ripple-container',\n MDL_RIPPLE: 'mdl-ripple',\n MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'\n};\n/**\n * Handle clicks to a tabs component\n *\n * @private\n */\nMaterialTabs.prototype.initTabs_ = function () {\n if (this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS);\n }\n // Select element tabs, document panels\n this.tabs_ = this.element_.querySelectorAll('.' + this.CssClasses_.TAB_CLASS);\n this.panels_ = this.element_.querySelectorAll('.' + this.CssClasses_.PANEL_CLASS);\n // Create new tabs for each tab element\n for (var i = 0; i < this.tabs_.length; i++) {\n new MaterialTab(this.tabs_[i], this);\n }\n this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS);\n};\n/**\n * Reset tab state, dropping active classes\n *\n * @private\n */\nMaterialTabs.prototype.resetTabState_ = function () {\n for (var k = 0; k < this.tabs_.length; k++) {\n this.tabs_[k].classList.remove(this.CssClasses_.ACTIVE_CLASS);\n }\n};\n/**\n * Reset panel state, droping active classes\n *\n * @private\n */\nMaterialTabs.prototype.resetPanelState_ = function () {\n for (var j = 0; j < this.panels_.length; j++) {\n this.panels_[j].classList.remove(this.CssClasses_.ACTIVE_CLASS);\n }\n};\n/**\n * Initialize element.\n */\nMaterialTabs.prototype.init = function () {\n if (this.element_) {\n this.initTabs_();\n }\n};\n/**\n * Constructor for an individual tab.\n *\n * @constructor\n * @param {Element} tab The HTML element for the tab.\n * @param {MaterialTabs} ctx The MaterialTabs object that owns the tab.\n */\nfunction MaterialTab(tab, ctx) {\n if (tab) {\n if (ctx.element_.classList.contains(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {\n var rippleContainer = document.createElement('span');\n rippleContainer.classList.add(ctx.CssClasses_.MDL_RIPPLE_CONTAINER);\n rippleContainer.classList.add(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT);\n var ripple = document.createElement('span');\n ripple.classList.add(ctx.CssClasses_.MDL_RIPPLE);\n rippleContainer.appendChild(ripple);\n tab.appendChild(rippleContainer);\n }\n tab.addEventListener('click', function (e) {\n if (tab.getAttribute('href').charAt(0) === '#') {\n e.preventDefault();\n var href = tab.href.split('#')[1];\n var panel = ctx.element_.querySelector('#' + href);\n ctx.resetTabState_();\n ctx.resetPanelState_();\n tab.classList.add(ctx.CssClasses_.ACTIVE_CLASS);\n panel.classList.add(ctx.CssClasses_.ACTIVE_CLASS);\n }\n });\n }\n}\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialTabs,\n classAsString: 'MaterialTabs',\n cssClass: 'mdl-js-tabs'\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Layout MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialLayout = function MaterialLayout(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialLayout'] = MaterialLayout;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialLayout.prototype.Constant_ = {\n MAX_WIDTH: '(max-width: 1024px)',\n TAB_SCROLL_PIXELS: 100,\n RESIZE_TIMEOUT: 100,\n MENU_ICON: '',\n CHEVRON_LEFT: 'chevron_left',\n CHEVRON_RIGHT: 'chevron_right'\n};\n/**\n * Keycodes, for code readability.\n *\n * @enum {number}\n * @private\n */\nMaterialLayout.prototype.Keycodes_ = {\n ENTER: 13,\n ESCAPE: 27,\n SPACE: 32\n};\n/**\n * Modes.\n *\n * @enum {number}\n * @private\n */\nMaterialLayout.prototype.Mode_ = {\n STANDARD: 0,\n SEAMED: 1,\n WATERFALL: 2,\n SCROLL: 3\n};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialLayout.prototype.CssClasses_ = {\n CONTAINER: 'mdl-layout__container',\n HEADER: 'mdl-layout__header',\n DRAWER: 'mdl-layout__drawer',\n CONTENT: 'mdl-layout__content',\n DRAWER_BTN: 'mdl-layout__drawer-button',\n ICON: 'material-icons',\n JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_CONTAINER: 'mdl-layout__tab-ripple-container',\n RIPPLE: 'mdl-ripple',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n HEADER_SEAMED: 'mdl-layout__header--seamed',\n HEADER_WATERFALL: 'mdl-layout__header--waterfall',\n HEADER_SCROLL: 'mdl-layout__header--scroll',\n FIXED_HEADER: 'mdl-layout--fixed-header',\n OBFUSCATOR: 'mdl-layout__obfuscator',\n TAB_BAR: 'mdl-layout__tab-bar',\n TAB_CONTAINER: 'mdl-layout__tab-bar-container',\n TAB: 'mdl-layout__tab',\n TAB_BAR_BUTTON: 'mdl-layout__tab-bar-button',\n TAB_BAR_LEFT_BUTTON: 'mdl-layout__tab-bar-left-button',\n TAB_BAR_RIGHT_BUTTON: 'mdl-layout__tab-bar-right-button',\n TAB_MANUAL_SWITCH: 'mdl-layout__tab-manual-switch',\n PANEL: 'mdl-layout__tab-panel',\n HAS_DRAWER: 'has-drawer',\n HAS_TABS: 'has-tabs',\n HAS_SCROLLING_HEADER: 'has-scrolling-header',\n CASTING_SHADOW: 'is-casting-shadow',\n IS_COMPACT: 'is-compact',\n IS_SMALL_SCREEN: 'is-small-screen',\n IS_DRAWER_OPEN: 'is-visible',\n IS_ACTIVE: 'is-active',\n IS_UPGRADED: 'is-upgraded',\n IS_ANIMATING: 'is-animating',\n ON_LARGE_SCREEN: 'mdl-layout--large-screen-only',\n ON_SMALL_SCREEN: 'mdl-layout--small-screen-only'\n};\n/**\n * Handles scrolling on the content.\n *\n * @private\n */\nMaterialLayout.prototype.contentScrollHandler_ = function () {\n if (this.header_.classList.contains(this.CssClasses_.IS_ANIMATING)) {\n return;\n }\n var headerVisible = !this.element_.classList.contains(this.CssClasses_.IS_SMALL_SCREEN) || this.element_.classList.contains(this.CssClasses_.FIXED_HEADER);\n if (this.content_.scrollTop > 0 && !this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {\n this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);\n this.header_.classList.add(this.CssClasses_.IS_COMPACT);\n if (headerVisible) {\n this.header_.classList.add(this.CssClasses_.IS_ANIMATING);\n }\n } else if (this.content_.scrollTop <= 0 && this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {\n this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);\n this.header_.classList.remove(this.CssClasses_.IS_COMPACT);\n if (headerVisible) {\n this.header_.classList.add(this.CssClasses_.IS_ANIMATING);\n }\n }\n};\n/**\n * Handles a keyboard event on the drawer.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialLayout.prototype.keyboardEventHandler_ = function (evt) {\n // Only react when the drawer is open.\n if (evt.keyCode === this.Keycodes_.ESCAPE && this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {\n this.toggleDrawer();\n }\n};\n/**\n * Handles changes in screen size.\n *\n * @private\n */\nMaterialLayout.prototype.screenSizeHandler_ = function () {\n if (this.screenSizeMediaQuery_.matches) {\n this.element_.classList.add(this.CssClasses_.IS_SMALL_SCREEN);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_SMALL_SCREEN);\n // Collapse drawer (if any) when moving to a large screen size.\n if (this.drawer_) {\n this.drawer_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);\n this.obfuscator_.classList.remove(this.CssClasses_.IS_DRAWER_OPEN);\n }\n }\n};\n/**\n * Handles events of drawer button.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialLayout.prototype.drawerToggleHandler_ = function (evt) {\n if (evt && evt.type === 'keydown') {\n if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {\n // prevent scrolling in drawer nav\n evt.preventDefault();\n } else {\n // prevent other keys\n return;\n }\n }\n this.toggleDrawer();\n};\n/**\n * Handles (un)setting the `is-animating` class\n *\n * @private\n */\nMaterialLayout.prototype.headerTransitionEndHandler_ = function () {\n this.header_.classList.remove(this.CssClasses_.IS_ANIMATING);\n};\n/**\n * Handles expanding the header on click\n *\n * @private\n */\nMaterialLayout.prototype.headerClickHandler_ = function () {\n if (this.header_.classList.contains(this.CssClasses_.IS_COMPACT)) {\n this.header_.classList.remove(this.CssClasses_.IS_COMPACT);\n this.header_.classList.add(this.CssClasses_.IS_ANIMATING);\n }\n};\n/**\n * Reset tab state, dropping active classes\n *\n * @private\n */\nMaterialLayout.prototype.resetTabState_ = function (tabBar) {\n for (var k = 0; k < tabBar.length; k++) {\n tabBar[k].classList.remove(this.CssClasses_.IS_ACTIVE);\n }\n};\n/**\n * Reset panel state, droping active classes\n *\n * @private\n */\nMaterialLayout.prototype.resetPanelState_ = function (panels) {\n for (var j = 0; j < panels.length; j++) {\n panels[j].classList.remove(this.CssClasses_.IS_ACTIVE);\n }\n};\n/**\n * Toggle drawer state\n *\n * @public\n */\nMaterialLayout.prototype.toggleDrawer = function () {\n var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);\n this.drawer_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);\n this.obfuscator_.classList.toggle(this.CssClasses_.IS_DRAWER_OPEN);\n // Set accessibility properties.\n if (this.drawer_.classList.contains(this.CssClasses_.IS_DRAWER_OPEN)) {\n this.drawer_.setAttribute('aria-hidden', 'false');\n drawerButton.setAttribute('aria-expanded', 'true');\n } else {\n this.drawer_.setAttribute('aria-hidden', 'true');\n drawerButton.setAttribute('aria-expanded', 'false');\n }\n};\nMaterialLayout.prototype['toggleDrawer'] = MaterialLayout.prototype.toggleDrawer;\n/**\n * Initialize element.\n */\nMaterialLayout.prototype.init = function () {\n if (this.element_) {\n var container = document.createElement('div');\n container.classList.add(this.CssClasses_.CONTAINER);\n var focusedElement = this.element_.querySelector(':focus');\n this.element_.parentElement.insertBefore(container, this.element_);\n this.element_.parentElement.removeChild(this.element_);\n container.appendChild(this.element_);\n if (focusedElement) {\n focusedElement.focus();\n }\n var directChildren = this.element_.childNodes;\n var numChildren = directChildren.length;\n for (var c = 0; c < numChildren; c++) {\n var child = directChildren[c];\n if (child.classList && child.classList.contains(this.CssClasses_.HEADER)) {\n this.header_ = child;\n }\n if (child.classList && child.classList.contains(this.CssClasses_.DRAWER)) {\n this.drawer_ = child;\n }\n if (child.classList && child.classList.contains(this.CssClasses_.CONTENT)) {\n this.content_ = child;\n }\n }\n window.addEventListener('pageshow', function (e) {\n if (e.persisted) {\n // when page is loaded from back/forward cache\n // trigger repaint to let layout scroll in safari\n this.element_.style.overflowY = 'hidden';\n requestAnimationFrame(function () {\n this.element_.style.overflowY = '';\n }.bind(this));\n }\n }.bind(this), false);\n if (this.header_) {\n this.tabBar_ = this.header_.querySelector('.' + this.CssClasses_.TAB_BAR);\n }\n var mode = this.Mode_.STANDARD;\n if (this.header_) {\n if (this.header_.classList.contains(this.CssClasses_.HEADER_SEAMED)) {\n mode = this.Mode_.SEAMED;\n } else if (this.header_.classList.contains(this.CssClasses_.HEADER_WATERFALL)) {\n mode = this.Mode_.WATERFALL;\n this.header_.addEventListener('transitionend', this.headerTransitionEndHandler_.bind(this));\n this.header_.addEventListener('click', this.headerClickHandler_.bind(this));\n } else if (this.header_.classList.contains(this.CssClasses_.HEADER_SCROLL)) {\n mode = this.Mode_.SCROLL;\n container.classList.add(this.CssClasses_.HAS_SCROLLING_HEADER);\n }\n if (mode === this.Mode_.STANDARD) {\n this.header_.classList.add(this.CssClasses_.CASTING_SHADOW);\n if (this.tabBar_) {\n this.tabBar_.classList.add(this.CssClasses_.CASTING_SHADOW);\n }\n } else if (mode === this.Mode_.SEAMED || mode === this.Mode_.SCROLL) {\n this.header_.classList.remove(this.CssClasses_.CASTING_SHADOW);\n if (this.tabBar_) {\n this.tabBar_.classList.remove(this.CssClasses_.CASTING_SHADOW);\n }\n } else if (mode === this.Mode_.WATERFALL) {\n // Add and remove shadows depending on scroll position.\n // Also add/remove auxiliary class for styling of the compact version of\n // the header.\n this.content_.addEventListener('scroll', this.contentScrollHandler_.bind(this));\n this.contentScrollHandler_();\n }\n }\n // Add drawer toggling button to our layout, if we have an openable drawer.\n if (this.drawer_) {\n var drawerButton = this.element_.querySelector('.' + this.CssClasses_.DRAWER_BTN);\n if (!drawerButton) {\n drawerButton = document.createElement('div');\n drawerButton.setAttribute('aria-expanded', 'false');\n drawerButton.setAttribute('role', 'button');\n drawerButton.setAttribute('tabindex', '0');\n drawerButton.classList.add(this.CssClasses_.DRAWER_BTN);\n var drawerButtonIcon = document.createElement('i');\n drawerButtonIcon.classList.add(this.CssClasses_.ICON);\n drawerButtonIcon.innerHTML = this.Constant_.MENU_ICON;\n drawerButton.appendChild(drawerButtonIcon);\n }\n if (this.drawer_.classList.contains(this.CssClasses_.ON_LARGE_SCREEN)) {\n //If drawer has ON_LARGE_SCREEN class then add it to the drawer toggle button as well.\n drawerButton.classList.add(this.CssClasses_.ON_LARGE_SCREEN);\n } else if (this.drawer_.classList.contains(this.CssClasses_.ON_SMALL_SCREEN)) {\n //If drawer has ON_SMALL_SCREEN class then add it to the drawer toggle button as well.\n drawerButton.classList.add(this.CssClasses_.ON_SMALL_SCREEN);\n }\n drawerButton.addEventListener('click', this.drawerToggleHandler_.bind(this));\n drawerButton.addEventListener('keydown', this.drawerToggleHandler_.bind(this));\n // Add a class if the layout has a drawer, for altering the left padding.\n // Adds the HAS_DRAWER to the elements since this.header_ may or may\n // not be present.\n this.element_.classList.add(this.CssClasses_.HAS_DRAWER);\n // If we have a fixed header, add the button to the header rather than\n // the layout.\n if (this.element_.classList.contains(this.CssClasses_.FIXED_HEADER)) {\n this.header_.insertBefore(drawerButton, this.header_.firstChild);\n } else {\n this.element_.insertBefore(drawerButton, this.content_);\n }\n var obfuscator = document.createElement('div');\n obfuscator.classList.add(this.CssClasses_.OBFUSCATOR);\n this.element_.appendChild(obfuscator);\n obfuscator.addEventListener('click', this.drawerToggleHandler_.bind(this));\n this.obfuscator_ = obfuscator;\n this.drawer_.addEventListener('keydown', this.keyboardEventHandler_.bind(this));\n this.drawer_.setAttribute('aria-hidden', 'true');\n }\n // Keep an eye on screen size, and add/remove auxiliary class for styling\n // of small screens.\n this.screenSizeMediaQuery_ = window.matchMedia(this.Constant_.MAX_WIDTH);\n this.screenSizeMediaQuery_.addListener(this.screenSizeHandler_.bind(this));\n this.screenSizeHandler_();\n // Initialize tabs, if any.\n if (this.header_ && this.tabBar_) {\n this.element_.classList.add(this.CssClasses_.HAS_TABS);\n var tabContainer = document.createElement('div');\n tabContainer.classList.add(this.CssClasses_.TAB_CONTAINER);\n this.header_.insertBefore(tabContainer, this.tabBar_);\n this.header_.removeChild(this.tabBar_);\n var leftButton = document.createElement('div');\n leftButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);\n leftButton.classList.add(this.CssClasses_.TAB_BAR_LEFT_BUTTON);\n var leftButtonIcon = document.createElement('i');\n leftButtonIcon.classList.add(this.CssClasses_.ICON);\n leftButtonIcon.textContent = this.Constant_.CHEVRON_LEFT;\n leftButton.appendChild(leftButtonIcon);\n leftButton.addEventListener('click', function () {\n this.tabBar_.scrollLeft -= this.Constant_.TAB_SCROLL_PIXELS;\n }.bind(this));\n var rightButton = document.createElement('div');\n rightButton.classList.add(this.CssClasses_.TAB_BAR_BUTTON);\n rightButton.classList.add(this.CssClasses_.TAB_BAR_RIGHT_BUTTON);\n var rightButtonIcon = document.createElement('i');\n rightButtonIcon.classList.add(this.CssClasses_.ICON);\n rightButtonIcon.textContent = this.Constant_.CHEVRON_RIGHT;\n rightButton.appendChild(rightButtonIcon);\n rightButton.addEventListener('click', function () {\n this.tabBar_.scrollLeft += this.Constant_.TAB_SCROLL_PIXELS;\n }.bind(this));\n tabContainer.appendChild(leftButton);\n tabContainer.appendChild(this.tabBar_);\n tabContainer.appendChild(rightButton);\n // Add and remove tab buttons depending on scroll position and total\n // window size.\n var tabUpdateHandler = function () {\n if (this.tabBar_.scrollLeft > 0) {\n leftButton.classList.add(this.CssClasses_.IS_ACTIVE);\n } else {\n leftButton.classList.remove(this.CssClasses_.IS_ACTIVE);\n }\n if (this.tabBar_.scrollLeft < this.tabBar_.scrollWidth - this.tabBar_.offsetWidth) {\n rightButton.classList.add(this.CssClasses_.IS_ACTIVE);\n } else {\n rightButton.classList.remove(this.CssClasses_.IS_ACTIVE);\n }\n }.bind(this);\n this.tabBar_.addEventListener('scroll', tabUpdateHandler);\n tabUpdateHandler();\n // Update tabs when the window resizes.\n var windowResizeHandler = function () {\n // Use timeouts to make sure it doesn't happen too often.\n if (this.resizeTimeoutId_) {\n clearTimeout(this.resizeTimeoutId_);\n }\n this.resizeTimeoutId_ = setTimeout(function () {\n tabUpdateHandler();\n this.resizeTimeoutId_ = null;\n }.bind(this), this.Constant_.RESIZE_TIMEOUT);\n }.bind(this);\n window.addEventListener('resize', windowResizeHandler);\n if (this.tabBar_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {\n this.tabBar_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n }\n // Select element tabs, document panels\n var tabs = this.tabBar_.querySelectorAll('.' + this.CssClasses_.TAB);\n var panels = this.content_.querySelectorAll('.' + this.CssClasses_.PANEL);\n // Create new tabs for each tab element\n for (var i = 0; i < tabs.length; i++) {\n new MaterialLayoutTab(tabs[i], tabs, panels, this);\n }\n }\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n};\n/**\n * Constructor for an individual tab.\n *\n * @constructor\n * @param {HTMLElement} tab The HTML element for the tab.\n * @param {!Array<HTMLElement>} tabs Array with HTML elements for all tabs.\n * @param {!Array<HTMLElement>} panels Array with HTML elements for all panels.\n * @param {MaterialLayout} layout The MaterialLayout object that owns the tab.\n */\nfunction MaterialLayoutTab(tab, tabs, panels, layout) {\n /**\n * Auxiliary method to programmatically select a tab in the UI.\n */\n function selectTab() {\n var href = tab.href.split('#')[1];\n var panel = layout.content_.querySelector('#' + href);\n layout.resetTabState_(tabs);\n layout.resetPanelState_(panels);\n tab.classList.add(layout.CssClasses_.IS_ACTIVE);\n panel.classList.add(layout.CssClasses_.IS_ACTIVE);\n }\n if (layout.tabBar_.classList.contains(layout.CssClasses_.JS_RIPPLE_EFFECT)) {\n var rippleContainer = document.createElement('span');\n rippleContainer.classList.add(layout.CssClasses_.RIPPLE_CONTAINER);\n rippleContainer.classList.add(layout.CssClasses_.JS_RIPPLE_EFFECT);\n var ripple = document.createElement('span');\n ripple.classList.add(layout.CssClasses_.RIPPLE);\n rippleContainer.appendChild(ripple);\n tab.appendChild(rippleContainer);\n }\n if (!layout.tabBar_.classList.contains(layout.CssClasses_.TAB_MANUAL_SWITCH)) {\n tab.addEventListener('click', function (e) {\n if (tab.getAttribute('href').charAt(0) === '#') {\n e.preventDefault();\n selectTab();\n }\n });\n }\n tab.show = selectTab;\n}\nwindow['MaterialLayoutTab'] = MaterialLayoutTab;\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialLayout,\n classAsString: 'MaterialLayout',\n cssClass: 'mdl-js-layout'\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * A component handler interface using the revealing module design pattern.\n * More details on this design pattern here:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @author Jason Mayes.\n */\n/* exported componentHandler */\n\n// Pre-defining the componentHandler interface, for closure documentation and\n// static verification.\nvar componentHandler = {\n /**\n * Searches existing DOM for elements of our component type and upgrades them\n * if they have not already been upgraded.\n *\n * @param {string=} optJsClass the programatic name of the element class we\n * need to create a new instance of.\n * @param {string=} optCssClass the name of the CSS class elements of this\n * type will have.\n */\n upgradeDom: function(optJsClass, optCssClass) {},\n /**\n * Upgrades a specific element rather than all in the DOM.\n *\n * @param {!Element} element The element we wish to upgrade.\n * @param {string=} optJsClass Optional name of the class we want to upgrade\n * the element to.\n */\n upgradeElement: function(element, optJsClass) {},\n /**\n * Upgrades a specific list of elements rather than all in the DOM.\n *\n * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements\n * The elements we wish to upgrade.\n */\n upgradeElements: function(elements) {},\n /**\n * Upgrades all registered components found in the current DOM. This is\n * automatically called on window load.\n */\n upgradeAllRegistered: function() {},\n /**\n * Allows user to be alerted to any upgrades that are performed for a given\n * component type\n *\n * @param {string} jsClass The class name of the MDL component we wish\n * to hook into for any upgrades performed.\n * @param {function(!HTMLElement)} callback The function to call upon an\n * upgrade. This function should expect 1 parameter - the HTMLElement which\n * got upgraded.\n */\n registerUpgradedCallback: function(jsClass, callback) {},\n /**\n * Registers a class for future use and attempts to upgrade existing DOM.\n *\n * @param {componentHandler.ComponentConfigPublic} config the registration configuration\n */\n register: function(config) {},\n /**\n * Downgrade either a given node, an array of nodes, or a NodeList.\n *\n * @param {!Node|!Array<!Node>|!NodeList} nodes\n */\n downgradeElements: function(nodes) {}\n};\n\ncomponentHandler = (function() {\n 'use strict';\n\n /** @type {!Array<componentHandler.ComponentConfig>} */\n var registeredComponents_ = [];\n\n /** @type {!Array<componentHandler.Component>} */\n var createdComponents_ = [];\n\n var componentConfigProperty_ = 'mdlComponentConfigInternal_';\n\n /**\n * Searches registered components for a class we are interested in using.\n * Optionally replaces a match with passed object if specified.\n *\n * @param {string} name The name of a class we want to use.\n * @param {componentHandler.ComponentConfig=} optReplace Optional object to replace match with.\n * @return {!Object|boolean}\n * @private\n */\n function findRegisteredClass_(name, optReplace) {\n for (var i = 0; i < registeredComponents_.length; i++) {\n if (registeredComponents_[i].className === name) {\n if (typeof optReplace !== 'undefined') {\n registeredComponents_[i] = optReplace;\n }\n return registeredComponents_[i];\n }\n }\n return false;\n }\n\n /**\n * Returns an array of the classNames of the upgraded classes on the element.\n *\n * @param {!Element} element The element to fetch data from.\n * @return {!Array<string>}\n * @private\n */\n function getUpgradedListOfElement_(element) {\n var dataUpgraded = element.getAttribute('data-upgraded');\n // Use `['']` as default value to conform the `,name,name...` style.\n return dataUpgraded === null ? [''] : dataUpgraded.split(',');\n }\n\n /**\n * Returns true if the given element has already been upgraded for the given\n * class.\n *\n * @param {!Element} element The element we want to check.\n * @param {string} jsClass The class to check for.\n * @returns {boolean}\n * @private\n */\n function isElementUpgraded_(element, jsClass) {\n var upgradedList = getUpgradedListOfElement_(element);\n return upgradedList.indexOf(jsClass) !== -1;\n }\n\n /**\n * Create an event object.\n *\n * @param {string} eventType The type name of the event.\n * @param {boolean} bubbles Whether the event should bubble up the DOM.\n * @param {boolean} cancelable Whether the event can be canceled.\n * @returns {!Event}\n */\n function createEvent_(eventType, bubbles, cancelable) {\n if ('CustomEvent' in window && typeof window.CustomEvent === 'function') {\n return new CustomEvent(eventType, {\n bubbles: bubbles,\n cancelable: cancelable\n });\n } else {\n var ev = document.createEvent('Events');\n ev.initEvent(eventType, bubbles, cancelable);\n return ev;\n }\n }\n\n /**\n * Searches existing DOM for elements of our component type and upgrades them\n * if they have not already been upgraded.\n *\n * @param {string=} optJsClass the programatic name of the element class we\n * need to create a new instance of.\n * @param {string=} optCssClass the name of the CSS class elements of this\n * type will have.\n */\n function upgradeDomInternal(optJsClass, optCssClass) {\n if (typeof optJsClass === 'undefined' &&\n typeof optCssClass === 'undefined') {\n for (var i = 0; i < registeredComponents_.length; i++) {\n upgradeDomInternal(registeredComponents_[i].className,\n registeredComponents_[i].cssClass);\n }\n } else {\n var jsClass = /** @type {string} */ (optJsClass);\n if (typeof optCssClass === 'undefined') {\n var registeredClass = findRegisteredClass_(jsClass);\n if (registeredClass) {\n optCssClass = registeredClass.cssClass;\n }\n }\n\n var elements = document.querySelectorAll('.' + optCssClass);\n for (var n = 0; n < elements.length; n++) {\n upgradeElementInternal(elements[n], jsClass);\n }\n }\n }\n\n /**\n * Upgrades a specific element rather than all in the DOM.\n *\n * @param {!Element} element The element we wish to upgrade.\n * @param {string=} optJsClass Optional name of the class we want to upgrade\n * the element to.\n */\n function upgradeElementInternal(element, optJsClass) {\n // Verify argument type.\n if (!(typeof element === 'object' && element instanceof Element)) {\n throw new Error('Invalid argument provided to upgrade MDL element.');\n }\n // Allow upgrade to be canceled by canceling emitted event.\n var upgradingEv = createEvent_('mdl-componentupgrading', true, true);\n element.dispatchEvent(upgradingEv);\n if (upgradingEv.defaultPrevented) {\n return;\n }\n\n var upgradedList = getUpgradedListOfElement_(element);\n var classesToUpgrade = [];\n // If jsClass is not provided scan the registered components to find the\n // ones matching the element's CSS classList.\n if (!optJsClass) {\n var classList = element.classList;\n registeredComponents_.forEach(function(component) {\n // Match CSS & Not to be upgraded & Not upgraded.\n if (classList.contains(component.cssClass) &&\n classesToUpgrade.indexOf(component) === -1 &&\n !isElementUpgraded_(element, component.className)) {\n classesToUpgrade.push(component);\n }\n });\n } else if (!isElementUpgraded_(element, optJsClass)) {\n classesToUpgrade.push(findRegisteredClass_(optJsClass));\n }\n\n // Upgrade the element for each classes.\n for (var i = 0, n = classesToUpgrade.length, registeredClass; i < n; i++) {\n registeredClass = classesToUpgrade[i];\n if (registeredClass) {\n // Mark element as upgraded.\n upgradedList.push(registeredClass.className);\n element.setAttribute('data-upgraded', upgradedList.join(','));\n var instance = new registeredClass.classConstructor(element);\n instance[componentConfigProperty_] = registeredClass;\n createdComponents_.push(instance);\n // Call any callbacks the user has registered with this component type.\n for (var j = 0, m = registeredClass.callbacks.length; j < m; j++) {\n registeredClass.callbacks[j](element);\n }\n\n if (registeredClass.widget) {\n // Assign per element instance for control over API\n element[registeredClass.className] = instance;\n }\n } else {\n throw new Error(\n 'Unable to find a registered component for the given class.');\n }\n\n var upgradedEv = createEvent_('mdl-componentupgraded', true, false);\n element.dispatchEvent(upgradedEv);\n }\n }\n\n /**\n * Upgrades a specific list of elements rather than all in the DOM.\n *\n * @param {!Element|!Array<!Element>|!NodeList|!HTMLCollection} elements\n * The elements we wish to upgrade.\n */\n function upgradeElementsInternal(elements) {\n if (!Array.isArray(elements)) {\n if (elements instanceof Element) {\n elements = [elements];\n } else {\n elements = Array.prototype.slice.call(elements);\n }\n }\n for (var i = 0, n = elements.length, element; i < n; i++) {\n element = elements[i];\n if (element instanceof HTMLElement) {\n upgradeElementInternal(element);\n if (element.children.length > 0) {\n upgradeElementsInternal(element.children);\n }\n }\n }\n }\n\n /**\n * Registers a class for future use and attempts to upgrade existing DOM.\n *\n * @param {componentHandler.ComponentConfigPublic} config\n */\n function registerInternal(config) {\n // In order to support both Closure-compiled and uncompiled code accessing\n // this method, we need to allow for both the dot and array syntax for\n // property access. You'll therefore see the `foo.bar || foo['bar']`\n // pattern repeated across this method.\n var widgetMissing = (typeof config.widget === 'undefined' &&\n typeof config['widget'] === 'undefined');\n var widget = true;\n\n if (!widgetMissing) {\n widget = config.widget || config['widget'];\n }\n\n var newConfig = /** @type {componentHandler.ComponentConfig} */ ({\n classConstructor: config.constructor || config['constructor'],\n className: config.classAsString || config['classAsString'],\n cssClass: config.cssClass || config['cssClass'],\n widget: widget,\n callbacks: []\n });\n\n registeredComponents_.forEach(function(item) {\n if (item.cssClass === newConfig.cssClass) {\n throw new Error('The provided cssClass has already been registered: ' + item.cssClass);\n }\n if (item.className === newConfig.className) {\n throw new Error('The provided className has already been registered');\n }\n });\n\n if (config.constructor.prototype\n .hasOwnProperty(componentConfigProperty_)) {\n throw new Error(\n 'MDL component classes must not have ' + componentConfigProperty_ +\n ' defined as a property.');\n }\n\n var found = findRegisteredClass_(config.classAsString, newConfig);\n\n if (!found) {\n registeredComponents_.push(newConfig);\n }\n }\n\n /**\n * Allows user to be alerted to any upgrades that are performed for a given\n * component type\n *\n * @param {string} jsClass The class name of the MDL component we wish\n * to hook into for any upgrades performed.\n * @param {function(!HTMLElement)} callback The function to call upon an\n * upgrade. This function should expect 1 parameter - the HTMLElement which\n * got upgraded.\n */\n function registerUpgradedCallbackInternal(jsClass, callback) {\n var regClass = findRegisteredClass_(jsClass);\n if (regClass) {\n regClass.callbacks.push(callback);\n }\n }\n\n /**\n * Upgrades all registered components found in the current DOM. This is\n * automatically called on window load.\n */\n function upgradeAllRegisteredInternal() {\n for (var n = 0; n < registeredComponents_.length; n++) {\n upgradeDomInternal(registeredComponents_[n].className);\n }\n }\n\n /**\n * Check the component for the downgrade method.\n * Execute if found.\n * Remove component from createdComponents list.\n *\n * @param {?componentHandler.Component} component\n */\n function deconstructComponentInternal(component) {\n if (component) {\n var componentIndex = createdComponents_.indexOf(component);\n createdComponents_.splice(componentIndex, 1);\n\n var upgrades = component.element_.getAttribute('data-upgraded').split(',');\n var componentPlace = upgrades.indexOf(component[componentConfigProperty_].classAsString);\n upgrades.splice(componentPlace, 1);\n component.element_.setAttribute('data-upgraded', upgrades.join(','));\n\n var ev = createEvent_('mdl-componentdowngraded', true, false);\n component.element_.dispatchEvent(ev);\n }\n }\n\n /**\n * Downgrade either a given node, an array of nodes, or a NodeList.\n *\n * @param {!Node|!Array<!Node>|!NodeList} nodes\n */\n function downgradeNodesInternal(nodes) {\n /**\n * Auxiliary function to downgrade a single node.\n * @param {!Node} node the node to be downgraded\n */\n var downgradeNode = function(node) {\n createdComponents_.filter(function(item) {\n return item.element_ === node;\n }).forEach(deconstructComponentInternal);\n };\n if (nodes instanceof Array || nodes instanceof NodeList) {\n for (var n = 0; n < nodes.length; n++) {\n downgradeNode(nodes[n]);\n }\n } else if (nodes instanceof Node) {\n downgradeNode(nodes);\n } else {\n throw new Error('Invalid argument provided to downgrade MDL nodes.');\n }\n }\n\n // Now return the functions that should be made public with their publicly\n // facing names...\n return {\n upgradeDom: upgradeDomInternal,\n upgradeElement: upgradeElementInternal,\n upgradeElements: upgradeElementsInternal,\n upgradeAllRegistered: upgradeAllRegisteredInternal,\n registerUpgradedCallback: registerUpgradedCallbackInternal,\n register: registerInternal,\n downgradeElements: downgradeNodesInternal\n };\n})();\n\n/**\n * Describes the type of a registered component type managed by\n * componentHandler. Provided for benefit of the Closure compiler.\n *\n * @typedef {{\n * constructor: Function,\n * classAsString: string,\n * cssClass: string,\n * widget: (string|boolean|undefined)\n * }}\n */\ncomponentHandler.ComponentConfigPublic; // jshint ignore:line\n\n/**\n * Describes the type of a registered component type managed by\n * componentHandler. Provided for benefit of the Closure compiler.\n *\n * @typedef {{\n * constructor: !Function,\n * className: string,\n * cssClass: string,\n * widget: (string|boolean),\n * callbacks: !Array<function(!HTMLElement)>\n * }}\n */\ncomponentHandler.ComponentConfig; // jshint ignore:line\n\n/**\n * Created component (i.e., upgraded element) type as managed by\n * componentHandler. Provided for benefit of the Closure compiler.\n *\n * @typedef {{\n * element_: !HTMLElement,\n * className: string,\n * classAsString: string,\n * cssClass: string,\n * widget: string\n * }}\n */\ncomponentHandler.Component; // jshint ignore:line\n\n// Export all symbols, for the benefit of Closure compiler.\n// No effect on uncompiled code.\ncomponentHandler['upgradeDom'] = componentHandler.upgradeDom;\ncomponentHandler['upgradeElement'] = componentHandler.upgradeElement;\ncomponentHandler['upgradeElements'] = componentHandler.upgradeElements;\ncomponentHandler['upgradeAllRegistered'] =\n componentHandler.upgradeAllRegistered;\ncomponentHandler['registerUpgradedCallback'] =\n componentHandler.registerUpgradedCallback;\ncomponentHandler['register'] = componentHandler.register;\ncomponentHandler['downgradeElements'] = componentHandler.downgradeElements;\nwindow.componentHandler = componentHandler;\nwindow['componentHandler'] = componentHandler;\n\nwindow.addEventListener('load', function() {\n 'use strict';\n\n /**\n * Performs a \"Cutting the mustard\" test. If the browser supports the features\n * tested, adds a mdl-js class to the <html> element. It then upgrades all MDL\n * components requiring JavaScript.\n */\n if ('classList' in document.createElement('div') &&\n 'querySelector' in document &&\n 'addEventListener' in window && Array.prototype.forEach) {\n document.documentElement.classList.add('mdl-js');\n componentHandler.upgradeAllRegistered();\n } else {\n /**\n * Dummy function to avoid JS errors.\n */\n componentHandler.upgradeElement = function() {};\n /**\n * Dummy function to avoid JS errors.\n */\n componentHandler.register = function() {};\n }\n});\n",
+ "// Source: https://github.com/darius/requestAnimationFrame/blob/master/requestAnimationFrame.js\n// Adapted from https://gist.github.com/paulirish/1579671 which derived from\n// http://paulirish.com/2011/requestanimationframe-for-smart-animating/\n// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating\n// requestAnimationFrame polyfill by Erik Möller.\n// Fixes from Paul Irish, Tino Zijdel, Andrew Mao, Klemen Slavič, Darius Bacon\n// MIT license\nif (!Date.now) {\n /**\n * Date.now polyfill.\n * @return {number} the current Date\n */\n Date.now = function () {\n return new Date().getTime();\n };\n Date['now'] = Date.now;\n}\nvar vendors = [\n 'webkit',\n 'moz'\n];\nfor (var i = 0; i < vendors.length && !window.requestAnimationFrame; ++i) {\n var vp = vendors[i];\n window.requestAnimationFrame = window[vp + 'RequestAnimationFrame'];\n window.cancelAnimationFrame = window[vp + 'CancelAnimationFrame'] || window[vp + 'CancelRequestAnimationFrame'];\n window['requestAnimationFrame'] = window.requestAnimationFrame;\n window['cancelAnimationFrame'] = window.cancelAnimationFrame;\n}\nif (/iP(ad|hone|od).*OS 6/.test(window.navigator.userAgent) || !window.requestAnimationFrame || !window.cancelAnimationFrame) {\n var lastTime = 0;\n /**\n * requestAnimationFrame polyfill.\n * @param {!Function} callback the callback function.\n */\n window.requestAnimationFrame = function (callback) {\n var now = Date.now();\n var nextTime = Math.max(lastTime + 16, now);\n return setTimeout(function () {\n callback(lastTime = nextTime);\n }, nextTime - now);\n };\n window.cancelAnimationFrame = clearTimeout;\n window['requestAnimationFrame'] = window.requestAnimationFrame;\n window['cancelAnimationFrame'] = window.cancelAnimationFrame;\n}",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Button MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialButton = function MaterialButton(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialButton'] = MaterialButton;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialButton.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialButton.prototype.CssClasses_ = {\n RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_CONTAINER: 'mdl-button__ripple-container',\n RIPPLE: 'mdl-ripple'\n};\n/**\n * Handle blur of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialButton.prototype.blurHandler_ = function (event) {\n if (event) {\n this.element_.blur();\n }\n};\n// Public methods.\n/**\n * Disable button.\n *\n * @public\n */\nMaterialButton.prototype.disable = function () {\n this.element_.disabled = true;\n};\nMaterialButton.prototype['disable'] = MaterialButton.prototype.disable;\n/**\n * Enable button.\n *\n * @public\n */\nMaterialButton.prototype.enable = function () {\n this.element_.disabled = false;\n};\nMaterialButton.prototype['enable'] = MaterialButton.prototype.enable;\n/**\n * Initialize element.\n */\nMaterialButton.prototype.init = function () {\n if (this.element_) {\n if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {\n var rippleContainer = document.createElement('span');\n rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);\n this.rippleElement_ = document.createElement('span');\n this.rippleElement_.classList.add(this.CssClasses_.RIPPLE);\n rippleContainer.appendChild(this.rippleElement_);\n this.boundRippleBlurHandler = this.blurHandler_.bind(this);\n this.rippleElement_.addEventListener('mouseup', this.boundRippleBlurHandler);\n this.element_.appendChild(rippleContainer);\n }\n this.boundButtonBlurHandler = this.blurHandler_.bind(this);\n this.element_.addEventListener('mouseup', this.boundButtonBlurHandler);\n this.element_.addEventListener('mouseleave', this.boundButtonBlurHandler);\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialButton,\n classAsString: 'MaterialButton',\n cssClass: 'mdl-js-button',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Checkbox MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialCheckbox = function MaterialCheckbox(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialCheckbox'] = MaterialCheckbox;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialCheckbox.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialCheckbox.prototype.CssClasses_ = {\n INPUT: 'mdl-checkbox__input',\n BOX_OUTLINE: 'mdl-checkbox__box-outline',\n FOCUS_HELPER: 'mdl-checkbox__focus-helper',\n TICK_OUTLINE: 'mdl-checkbox__tick-outline',\n RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE_CONTAINER: 'mdl-checkbox__ripple-container',\n RIPPLE_CENTER: 'mdl-ripple--center',\n RIPPLE: 'mdl-ripple',\n IS_FOCUSED: 'is-focused',\n IS_DISABLED: 'is-disabled',\n IS_CHECKED: 'is-checked',\n IS_UPGRADED: 'is-upgraded'\n};\n/**\n * Handle change of state.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialCheckbox.prototype.onChange_ = function (event) {\n this.updateClasses_();\n};\n/**\n * Handle focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialCheckbox.prototype.onFocus_ = function (event) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle lost focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialCheckbox.prototype.onBlur_ = function (event) {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle mouseup.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialCheckbox.prototype.onMouseUp_ = function (event) {\n this.blur_();\n};\n/**\n * Handle class updates.\n *\n * @private\n */\nMaterialCheckbox.prototype.updateClasses_ = function () {\n this.checkDisabled();\n this.checkToggleState();\n};\n/**\n * Add blur.\n *\n * @private\n */\nMaterialCheckbox.prototype.blur_ = function () {\n // TODO: figure out why there's a focus event being fired after our blur,\n // so that we can avoid this hack.\n window.setTimeout(function () {\n this.inputElement_.blur();\n }.bind(this), this.Constant_.TINY_TIMEOUT);\n};\n// Public methods.\n/**\n * Check the inputs toggle state and update display.\n *\n * @public\n */\nMaterialCheckbox.prototype.checkToggleState = function () {\n if (this.inputElement_.checked) {\n this.element_.classList.add(this.CssClasses_.IS_CHECKED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_CHECKED);\n }\n};\nMaterialCheckbox.prototype['checkToggleState'] = MaterialCheckbox.prototype.checkToggleState;\n/**\n * Check the inputs disabled state and update display.\n *\n * @public\n */\nMaterialCheckbox.prototype.checkDisabled = function () {\n if (this.inputElement_.disabled) {\n this.element_.classList.add(this.CssClasses_.IS_DISABLED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DISABLED);\n }\n};\nMaterialCheckbox.prototype['checkDisabled'] = MaterialCheckbox.prototype.checkDisabled;\n/**\n * Disable checkbox.\n *\n * @public\n */\nMaterialCheckbox.prototype.disable = function () {\n this.inputElement_.disabled = true;\n this.updateClasses_();\n};\nMaterialCheckbox.prototype['disable'] = MaterialCheckbox.prototype.disable;\n/**\n * Enable checkbox.\n *\n * @public\n */\nMaterialCheckbox.prototype.enable = function () {\n this.inputElement_.disabled = false;\n this.updateClasses_();\n};\nMaterialCheckbox.prototype['enable'] = MaterialCheckbox.prototype.enable;\n/**\n * Check checkbox.\n *\n * @public\n */\nMaterialCheckbox.prototype.check = function () {\n this.inputElement_.checked = true;\n this.updateClasses_();\n};\nMaterialCheckbox.prototype['check'] = MaterialCheckbox.prototype.check;\n/**\n * Uncheck checkbox.\n *\n * @public\n */\nMaterialCheckbox.prototype.uncheck = function () {\n this.inputElement_.checked = false;\n this.updateClasses_();\n};\nMaterialCheckbox.prototype['uncheck'] = MaterialCheckbox.prototype.uncheck;\n/**\n * Initialize element.\n */\nMaterialCheckbox.prototype.init = function () {\n if (this.element_) {\n this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);\n var boxOutline = document.createElement('span');\n boxOutline.classList.add(this.CssClasses_.BOX_OUTLINE);\n var tickContainer = document.createElement('span');\n tickContainer.classList.add(this.CssClasses_.FOCUS_HELPER);\n var tickOutline = document.createElement('span');\n tickOutline.classList.add(this.CssClasses_.TICK_OUTLINE);\n boxOutline.appendChild(tickOutline);\n this.element_.appendChild(tickContainer);\n this.element_.appendChild(boxOutline);\n if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n this.rippleContainerElement_ = document.createElement('span');\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);\n this.boundRippleMouseUp = this.onMouseUp_.bind(this);\n this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);\n var ripple = document.createElement('span');\n ripple.classList.add(this.CssClasses_.RIPPLE);\n this.rippleContainerElement_.appendChild(ripple);\n this.element_.appendChild(this.rippleContainerElement_);\n }\n this.boundInputOnChange = this.onChange_.bind(this);\n this.boundInputOnFocus = this.onFocus_.bind(this);\n this.boundInputOnBlur = this.onBlur_.bind(this);\n this.boundElementMouseUp = this.onMouseUp_.bind(this);\n this.inputElement_.addEventListener('change', this.boundInputOnChange);\n this.inputElement_.addEventListener('focus', this.boundInputOnFocus);\n this.inputElement_.addEventListener('blur', this.boundInputOnBlur);\n this.element_.addEventListener('mouseup', this.boundElementMouseUp);\n this.updateClasses_();\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialCheckbox,\n classAsString: 'MaterialCheckbox',\n cssClass: 'mdl-js-checkbox',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for icon toggle MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialIconToggle = function MaterialIconToggle(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialIconToggle'] = MaterialIconToggle;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialIconToggle.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialIconToggle.prototype.CssClasses_ = {\n INPUT: 'mdl-icon-toggle__input',\n JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE_CONTAINER: 'mdl-icon-toggle__ripple-container',\n RIPPLE_CENTER: 'mdl-ripple--center',\n RIPPLE: 'mdl-ripple',\n IS_FOCUSED: 'is-focused',\n IS_DISABLED: 'is-disabled',\n IS_CHECKED: 'is-checked'\n};\n/**\n * Handle change of state.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialIconToggle.prototype.onChange_ = function (event) {\n this.updateClasses_();\n};\n/**\n * Handle focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialIconToggle.prototype.onFocus_ = function (event) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle lost focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialIconToggle.prototype.onBlur_ = function (event) {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle mouseup.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialIconToggle.prototype.onMouseUp_ = function (event) {\n this.blur_();\n};\n/**\n * Handle class updates.\n *\n * @private\n */\nMaterialIconToggle.prototype.updateClasses_ = function () {\n this.checkDisabled();\n this.checkToggleState();\n};\n/**\n * Add blur.\n *\n * @private\n */\nMaterialIconToggle.prototype.blur_ = function () {\n // TODO: figure out why there's a focus event being fired after our blur,\n // so that we can avoid this hack.\n window.setTimeout(function () {\n this.inputElement_.blur();\n }.bind(this), this.Constant_.TINY_TIMEOUT);\n};\n// Public methods.\n/**\n * Check the inputs toggle state and update display.\n *\n * @public\n */\nMaterialIconToggle.prototype.checkToggleState = function () {\n if (this.inputElement_.checked) {\n this.element_.classList.add(this.CssClasses_.IS_CHECKED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_CHECKED);\n }\n};\nMaterialIconToggle.prototype['checkToggleState'] = MaterialIconToggle.prototype.checkToggleState;\n/**\n * Check the inputs disabled state and update display.\n *\n * @public\n */\nMaterialIconToggle.prototype.checkDisabled = function () {\n if (this.inputElement_.disabled) {\n this.element_.classList.add(this.CssClasses_.IS_DISABLED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DISABLED);\n }\n};\nMaterialIconToggle.prototype['checkDisabled'] = MaterialIconToggle.prototype.checkDisabled;\n/**\n * Disable icon toggle.\n *\n * @public\n */\nMaterialIconToggle.prototype.disable = function () {\n this.inputElement_.disabled = true;\n this.updateClasses_();\n};\nMaterialIconToggle.prototype['disable'] = MaterialIconToggle.prototype.disable;\n/**\n * Enable icon toggle.\n *\n * @public\n */\nMaterialIconToggle.prototype.enable = function () {\n this.inputElement_.disabled = false;\n this.updateClasses_();\n};\nMaterialIconToggle.prototype['enable'] = MaterialIconToggle.prototype.enable;\n/**\n * Check icon toggle.\n *\n * @public\n */\nMaterialIconToggle.prototype.check = function () {\n this.inputElement_.checked = true;\n this.updateClasses_();\n};\nMaterialIconToggle.prototype['check'] = MaterialIconToggle.prototype.check;\n/**\n * Uncheck icon toggle.\n *\n * @public\n */\nMaterialIconToggle.prototype.uncheck = function () {\n this.inputElement_.checked = false;\n this.updateClasses_();\n};\nMaterialIconToggle.prototype['uncheck'] = MaterialIconToggle.prototype.uncheck;\n/**\n * Initialize element.\n */\nMaterialIconToggle.prototype.init = function () {\n if (this.element_) {\n this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);\n if (this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n this.rippleContainerElement_ = document.createElement('span');\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);\n this.rippleContainerElement_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT);\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);\n this.boundRippleMouseUp = this.onMouseUp_.bind(this);\n this.rippleContainerElement_.addEventListener('mouseup', this.boundRippleMouseUp);\n var ripple = document.createElement('span');\n ripple.classList.add(this.CssClasses_.RIPPLE);\n this.rippleContainerElement_.appendChild(ripple);\n this.element_.appendChild(this.rippleContainerElement_);\n }\n this.boundInputOnChange = this.onChange_.bind(this);\n this.boundInputOnFocus = this.onFocus_.bind(this);\n this.boundInputOnBlur = this.onBlur_.bind(this);\n this.boundElementOnMouseUp = this.onMouseUp_.bind(this);\n this.inputElement_.addEventListener('change', this.boundInputOnChange);\n this.inputElement_.addEventListener('focus', this.boundInputOnFocus);\n this.inputElement_.addEventListener('blur', this.boundInputOnBlur);\n this.element_.addEventListener('mouseup', this.boundElementOnMouseUp);\n this.updateClasses_();\n this.element_.classList.add('is-upgraded');\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialIconToggle,\n classAsString: 'MaterialIconToggle',\n cssClass: 'mdl-js-icon-toggle',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for dropdown MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialMenu = function MaterialMenu(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialMenu'] = MaterialMenu;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialMenu.prototype.Constant_ = {\n // Total duration of the menu animation.\n TRANSITION_DURATION_SECONDS: 0.3,\n // The fraction of the total duration we want to use for menu item animations.\n TRANSITION_DURATION_FRACTION: 0.8,\n // How long the menu stays open after choosing an option (so the user can see\n // the ripple).\n CLOSE_TIMEOUT: 150\n};\n/**\n * Keycodes, for code readability.\n *\n * @enum {number}\n * @private\n */\nMaterialMenu.prototype.Keycodes_ = {\n ENTER: 13,\n ESCAPE: 27,\n SPACE: 32,\n UP_ARROW: 38,\n DOWN_ARROW: 40\n};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialMenu.prototype.CssClasses_ = {\n CONTAINER: 'mdl-menu__container',\n OUTLINE: 'mdl-menu__outline',\n ITEM: 'mdl-menu__item',\n ITEM_RIPPLE_CONTAINER: 'mdl-menu__item-ripple-container',\n RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE: 'mdl-ripple',\n // Statuses\n IS_UPGRADED: 'is-upgraded',\n IS_VISIBLE: 'is-visible',\n IS_ANIMATING: 'is-animating',\n // Alignment options\n BOTTOM_LEFT: 'mdl-menu--bottom-left',\n // This is the default.\n BOTTOM_RIGHT: 'mdl-menu--bottom-right',\n TOP_LEFT: 'mdl-menu--top-left',\n TOP_RIGHT: 'mdl-menu--top-right',\n UNALIGNED: 'mdl-menu--unaligned'\n};\n/**\n * Initialize element.\n */\nMaterialMenu.prototype.init = function () {\n if (this.element_) {\n // Create container for the menu.\n var container = document.createElement('div');\n container.classList.add(this.CssClasses_.CONTAINER);\n this.element_.parentElement.insertBefore(container, this.element_);\n this.element_.parentElement.removeChild(this.element_);\n container.appendChild(this.element_);\n this.container_ = container;\n // Create outline for the menu (shadow and background).\n var outline = document.createElement('div');\n outline.classList.add(this.CssClasses_.OUTLINE);\n this.outline_ = outline;\n container.insertBefore(outline, this.element_);\n // Find the \"for\" element and bind events to it.\n var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');\n var forEl = null;\n if (forElId) {\n forEl = document.getElementById(forElId);\n if (forEl) {\n this.forElement_ = forEl;\n forEl.addEventListener('click', this.handleForClick_.bind(this));\n forEl.addEventListener('keydown', this.handleForKeyboardEvent_.bind(this));\n }\n }\n var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);\n this.boundItemKeydown_ = this.handleItemKeyboardEvent_.bind(this);\n this.boundItemClick_ = this.handleItemClick_.bind(this);\n for (var i = 0; i < items.length; i++) {\n // Add a listener to each menu item.\n items[i].addEventListener('click', this.boundItemClick_);\n // Add a tab index to each menu item.\n items[i].tabIndex = '-1';\n // Add a keyboard listener to each menu item.\n items[i].addEventListener('keydown', this.boundItemKeydown_);\n }\n // Add ripple classes to each item, if the user has enabled ripples.\n if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n for (i = 0; i < items.length; i++) {\n var item = items[i];\n var rippleContainer = document.createElement('span');\n rippleContainer.classList.add(this.CssClasses_.ITEM_RIPPLE_CONTAINER);\n var ripple = document.createElement('span');\n ripple.classList.add(this.CssClasses_.RIPPLE);\n rippleContainer.appendChild(ripple);\n item.appendChild(rippleContainer);\n item.classList.add(this.CssClasses_.RIPPLE_EFFECT);\n }\n }\n // Copy alignment classes to the container, so the outline can use them.\n if (this.element_.classList.contains(this.CssClasses_.BOTTOM_LEFT)) {\n this.outline_.classList.add(this.CssClasses_.BOTTOM_LEFT);\n }\n if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {\n this.outline_.classList.add(this.CssClasses_.BOTTOM_RIGHT);\n }\n if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {\n this.outline_.classList.add(this.CssClasses_.TOP_LEFT);\n }\n if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {\n this.outline_.classList.add(this.CssClasses_.TOP_RIGHT);\n }\n if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {\n this.outline_.classList.add(this.CssClasses_.UNALIGNED);\n }\n container.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n};\n/**\n * Handles a click on the \"for\" element, by positioning the menu and then\n * toggling it.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialMenu.prototype.handleForClick_ = function (evt) {\n if (this.element_ && this.forElement_) {\n var rect = this.forElement_.getBoundingClientRect();\n var forRect = this.forElement_.parentElement.getBoundingClientRect();\n if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {\n } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {\n // Position below the \"for\" element, aligned to its right.\n this.container_.style.right = forRect.right - rect.right + 'px';\n this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';\n } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {\n // Position above the \"for\" element, aligned to its left.\n this.container_.style.left = this.forElement_.offsetLeft + 'px';\n this.container_.style.bottom = forRect.bottom - rect.top + 'px';\n } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {\n // Position above the \"for\" element, aligned to its right.\n this.container_.style.right = forRect.right - rect.right + 'px';\n this.container_.style.bottom = forRect.bottom - rect.top + 'px';\n } else {\n // Default: position below the \"for\" element, aligned to its left.\n this.container_.style.left = this.forElement_.offsetLeft + 'px';\n this.container_.style.top = this.forElement_.offsetTop + this.forElement_.offsetHeight + 'px';\n }\n }\n this.toggle(evt);\n};\n/**\n * Handles a keyboard event on the \"for\" element.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialMenu.prototype.handleForKeyboardEvent_ = function (evt) {\n if (this.element_ && this.container_ && this.forElement_) {\n var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');\n if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {\n if (evt.keyCode === this.Keycodes_.UP_ARROW) {\n evt.preventDefault();\n items[items.length - 1].focus();\n } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {\n evt.preventDefault();\n items[0].focus();\n }\n }\n }\n};\n/**\n * Handles a keyboard event on an item.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialMenu.prototype.handleItemKeyboardEvent_ = function (evt) {\n if (this.element_ && this.container_) {\n var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM + ':not([disabled])');\n if (items && items.length > 0 && this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {\n var currentIndex = Array.prototype.slice.call(items).indexOf(evt.target);\n if (evt.keyCode === this.Keycodes_.UP_ARROW) {\n evt.preventDefault();\n if (currentIndex > 0) {\n items[currentIndex - 1].focus();\n } else {\n items[items.length - 1].focus();\n }\n } else if (evt.keyCode === this.Keycodes_.DOWN_ARROW) {\n evt.preventDefault();\n if (items.length > currentIndex + 1) {\n items[currentIndex + 1].focus();\n } else {\n items[0].focus();\n }\n } else if (evt.keyCode === this.Keycodes_.SPACE || evt.keyCode === this.Keycodes_.ENTER) {\n evt.preventDefault();\n // Send mousedown and mouseup to trigger ripple.\n var e = new MouseEvent('mousedown');\n evt.target.dispatchEvent(e);\n e = new MouseEvent('mouseup');\n evt.target.dispatchEvent(e);\n // Send click.\n evt.target.click();\n } else if (evt.keyCode === this.Keycodes_.ESCAPE) {\n evt.preventDefault();\n this.hide();\n }\n }\n }\n};\n/**\n * Handles a click event on an item.\n *\n * @param {Event} evt The event that fired.\n * @private\n */\nMaterialMenu.prototype.handleItemClick_ = function (evt) {\n if (evt.target.hasAttribute('disabled')) {\n evt.stopPropagation();\n } else {\n // Wait some time before closing menu, so the user can see the ripple.\n this.closing_ = true;\n window.setTimeout(function (evt) {\n this.hide();\n this.closing_ = false;\n }.bind(this), this.Constant_.CLOSE_TIMEOUT);\n }\n};\n/**\n * Calculates the initial clip (for opening the menu) or final clip (for closing\n * it), and applies it. This allows us to animate from or to the correct point,\n * that is, the point it's aligned to in the \"for\" element.\n *\n * @param {number} height Height of the clip rectangle\n * @param {number} width Width of the clip rectangle\n * @private\n */\nMaterialMenu.prototype.applyClip_ = function (height, width) {\n if (this.element_.classList.contains(this.CssClasses_.UNALIGNED)) {\n // Do not clip.\n this.element_.style.clip = '';\n } else if (this.element_.classList.contains(this.CssClasses_.BOTTOM_RIGHT)) {\n // Clip to the top right corner of the menu.\n this.element_.style.clip = 'rect(0 ' + width + 'px ' + '0 ' + width + 'px)';\n } else if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT)) {\n // Clip to the bottom left corner of the menu.\n this.element_.style.clip = 'rect(' + height + 'px 0 ' + height + 'px 0)';\n } else if (this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {\n // Clip to the bottom right corner of the menu.\n this.element_.style.clip = 'rect(' + height + 'px ' + width + 'px ' + height + 'px ' + width + 'px)';\n } else {\n // Default: do not clip (same as clipping to the top left corner).\n this.element_.style.clip = '';\n }\n};\n/**\n * Cleanup function to remove animation listeners.\n *\n * @param {Event} evt\n * @private\n */\nMaterialMenu.prototype.removeAnimationEndListener_ = function (evt) {\n evt.target.classList.remove(MaterialMenu.prototype.CssClasses_.IS_ANIMATING);\n};\n/**\n * Adds an event listener to clean up after the animation ends.\n *\n * @private\n */\nMaterialMenu.prototype.addAnimationEndListener_ = function () {\n this.element_.addEventListener('transitionend', this.removeAnimationEndListener_);\n this.element_.addEventListener('webkitTransitionEnd', this.removeAnimationEndListener_);\n};\n/**\n * Displays the menu.\n *\n * @public\n */\nMaterialMenu.prototype.show = function (evt) {\n if (this.element_ && this.container_ && this.outline_) {\n // Measure the inner element.\n var height = this.element_.getBoundingClientRect().height;\n var width = this.element_.getBoundingClientRect().width;\n // Apply the inner element's size to the container and outline.\n this.container_.style.width = width + 'px';\n this.container_.style.height = height + 'px';\n this.outline_.style.width = width + 'px';\n this.outline_.style.height = height + 'px';\n var transitionDuration = this.Constant_.TRANSITION_DURATION_SECONDS * this.Constant_.TRANSITION_DURATION_FRACTION;\n // Calculate transition delays for individual menu items, so that they fade\n // in one at a time.\n var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);\n for (var i = 0; i < items.length; i++) {\n var itemDelay = null;\n if (this.element_.classList.contains(this.CssClasses_.TOP_LEFT) || this.element_.classList.contains(this.CssClasses_.TOP_RIGHT)) {\n itemDelay = (height - items[i].offsetTop - items[i].offsetHeight) / height * transitionDuration + 's';\n } else {\n itemDelay = items[i].offsetTop / height * transitionDuration + 's';\n }\n items[i].style.transitionDelay = itemDelay;\n }\n // Apply the initial clip to the text before we start animating.\n this.applyClip_(height, width);\n // Wait for the next frame, turn on animation, and apply the final clip.\n // Also make it visible. This triggers the transitions.\n window.requestAnimationFrame(function () {\n this.element_.classList.add(this.CssClasses_.IS_ANIMATING);\n this.element_.style.clip = 'rect(0 ' + width + 'px ' + height + 'px 0)';\n this.container_.classList.add(this.CssClasses_.IS_VISIBLE);\n }.bind(this));\n // Clean up after the animation is complete.\n this.addAnimationEndListener_();\n // Add a click listener to the document, to close the menu.\n var callback = function (e) {\n // Check to see if the document is processing the same event that\n // displayed the menu in the first place. If so, do nothing.\n // Also check to see if the menu is in the process of closing itself, and\n // do nothing in that case.\n // Also check if the clicked element is a menu item\n // if so, do nothing.\n if (e !== evt && !this.closing_ && e.target.parentNode !== this.element_) {\n document.removeEventListener('click', callback);\n this.hide();\n }\n }.bind(this);\n document.addEventListener('click', callback);\n }\n};\nMaterialMenu.prototype['show'] = MaterialMenu.prototype.show;\n/**\n * Hides the menu.\n *\n * @public\n */\nMaterialMenu.prototype.hide = function () {\n if (this.element_ && this.container_ && this.outline_) {\n var items = this.element_.querySelectorAll('.' + this.CssClasses_.ITEM);\n // Remove all transition delays; menu items fade out concurrently.\n for (var i = 0; i < items.length; i++) {\n items[i].style.removeProperty('transition-delay');\n }\n // Measure the inner element.\n var rect = this.element_.getBoundingClientRect();\n var height = rect.height;\n var width = rect.width;\n // Turn on animation, and apply the final clip. Also make invisible.\n // This triggers the transitions.\n this.element_.classList.add(this.CssClasses_.IS_ANIMATING);\n this.applyClip_(height, width);\n this.container_.classList.remove(this.CssClasses_.IS_VISIBLE);\n // Clean up after the animation is complete.\n this.addAnimationEndListener_();\n }\n};\nMaterialMenu.prototype['hide'] = MaterialMenu.prototype.hide;\n/**\n * Displays or hides the menu, depending on current state.\n *\n * @public\n */\nMaterialMenu.prototype.toggle = function (evt) {\n if (this.container_.classList.contains(this.CssClasses_.IS_VISIBLE)) {\n this.hide();\n } else {\n this.show(evt);\n }\n};\nMaterialMenu.prototype['toggle'] = MaterialMenu.prototype.toggle;\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialMenu,\n classAsString: 'MaterialMenu',\n cssClass: 'mdl-js-menu',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Progress MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialProgress = function MaterialProgress(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialProgress'] = MaterialProgress;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialProgress.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialProgress.prototype.CssClasses_ = { INDETERMINATE_CLASS: 'mdl-progress__indeterminate' };\n/**\n * Set the current progress of the progressbar.\n *\n * @param {number} p Percentage of the progress (0-100)\n * @public\n */\nMaterialProgress.prototype.setProgress = function (p) {\n if (this.element_.classList.contains(this.CssClasses_.INDETERMINATE_CLASS)) {\n return;\n }\n this.progressbar_.style.width = p + '%';\n};\nMaterialProgress.prototype['setProgress'] = MaterialProgress.prototype.setProgress;\n/**\n * Set the current progress of the buffer.\n *\n * @param {number} p Percentage of the buffer (0-100)\n * @public\n */\nMaterialProgress.prototype.setBuffer = function (p) {\n this.bufferbar_.style.width = p + '%';\n this.auxbar_.style.width = 100 - p + '%';\n};\nMaterialProgress.prototype['setBuffer'] = MaterialProgress.prototype.setBuffer;\n/**\n * Initialize element.\n */\nMaterialProgress.prototype.init = function () {\n if (this.element_) {\n var el = document.createElement('div');\n el.className = 'progressbar bar bar1';\n this.element_.appendChild(el);\n this.progressbar_ = el;\n el = document.createElement('div');\n el.className = 'bufferbar bar bar2';\n this.element_.appendChild(el);\n this.bufferbar_ = el;\n el = document.createElement('div');\n el.className = 'auxbar bar bar3';\n this.element_.appendChild(el);\n this.auxbar_ = el;\n this.progressbar_.style.width = '0%';\n this.bufferbar_.style.width = '100%';\n this.auxbar_.style.width = '0%';\n this.element_.classList.add('is-upgraded');\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialProgress,\n classAsString: 'MaterialProgress',\n cssClass: 'mdl-js-progress',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Radio MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialRadio = function MaterialRadio(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialRadio'] = MaterialRadio;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialRadio.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialRadio.prototype.CssClasses_ = {\n IS_FOCUSED: 'is-focused',\n IS_DISABLED: 'is-disabled',\n IS_CHECKED: 'is-checked',\n IS_UPGRADED: 'is-upgraded',\n JS_RADIO: 'mdl-js-radio',\n RADIO_BTN: 'mdl-radio__button',\n RADIO_OUTER_CIRCLE: 'mdl-radio__outer-circle',\n RADIO_INNER_CIRCLE: 'mdl-radio__inner-circle',\n RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE_CONTAINER: 'mdl-radio__ripple-container',\n RIPPLE_CENTER: 'mdl-ripple--center',\n RIPPLE: 'mdl-ripple'\n};\n/**\n * Handle change of state.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRadio.prototype.onChange_ = function (event) {\n // Since other radio buttons don't get change events, we need to look for\n // them to update their classes.\n var radios = document.getElementsByClassName(this.CssClasses_.JS_RADIO);\n for (var i = 0; i < radios.length; i++) {\n var button = radios[i].querySelector('.' + this.CssClasses_.RADIO_BTN);\n // Different name == different group, so no point updating those.\n if (button.getAttribute('name') === this.btnElement_.getAttribute('name')) {\n if (typeof radios[i]['MaterialRadio'] !== 'undefined') {\n radios[i]['MaterialRadio'].updateClasses_();\n }\n }\n }\n};\n/**\n * Handle focus.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRadio.prototype.onFocus_ = function (event) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle lost focus.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRadio.prototype.onBlur_ = function (event) {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle mouseup.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRadio.prototype.onMouseup_ = function (event) {\n this.blur_();\n};\n/**\n * Update classes.\n *\n * @private\n */\nMaterialRadio.prototype.updateClasses_ = function () {\n this.checkDisabled();\n this.checkToggleState();\n};\n/**\n * Add blur.\n *\n * @private\n */\nMaterialRadio.prototype.blur_ = function () {\n // TODO: figure out why there's a focus event being fired after our blur,\n // so that we can avoid this hack.\n window.setTimeout(function () {\n this.btnElement_.blur();\n }.bind(this), this.Constant_.TINY_TIMEOUT);\n};\n// Public methods.\n/**\n * Check the components disabled state.\n *\n * @public\n */\nMaterialRadio.prototype.checkDisabled = function () {\n if (this.btnElement_.disabled) {\n this.element_.classList.add(this.CssClasses_.IS_DISABLED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DISABLED);\n }\n};\nMaterialRadio.prototype['checkDisabled'] = MaterialRadio.prototype.checkDisabled;\n/**\n * Check the components toggled state.\n *\n * @public\n */\nMaterialRadio.prototype.checkToggleState = function () {\n if (this.btnElement_.checked) {\n this.element_.classList.add(this.CssClasses_.IS_CHECKED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_CHECKED);\n }\n};\nMaterialRadio.prototype['checkToggleState'] = MaterialRadio.prototype.checkToggleState;\n/**\n * Disable radio.\n *\n * @public\n */\nMaterialRadio.prototype.disable = function () {\n this.btnElement_.disabled = true;\n this.updateClasses_();\n};\nMaterialRadio.prototype['disable'] = MaterialRadio.prototype.disable;\n/**\n * Enable radio.\n *\n * @public\n */\nMaterialRadio.prototype.enable = function () {\n this.btnElement_.disabled = false;\n this.updateClasses_();\n};\nMaterialRadio.prototype['enable'] = MaterialRadio.prototype.enable;\n/**\n * Check radio.\n *\n * @public\n */\nMaterialRadio.prototype.check = function () {\n this.btnElement_.checked = true;\n this.onChange_(null);\n};\nMaterialRadio.prototype['check'] = MaterialRadio.prototype.check;\n/**\n * Uncheck radio.\n *\n * @public\n */\nMaterialRadio.prototype.uncheck = function () {\n this.btnElement_.checked = false;\n this.onChange_(null);\n};\nMaterialRadio.prototype['uncheck'] = MaterialRadio.prototype.uncheck;\n/**\n * Initialize element.\n */\nMaterialRadio.prototype.init = function () {\n if (this.element_) {\n this.btnElement_ = this.element_.querySelector('.' + this.CssClasses_.RADIO_BTN);\n this.boundChangeHandler_ = this.onChange_.bind(this);\n this.boundFocusHandler_ = this.onChange_.bind(this);\n this.boundBlurHandler_ = this.onBlur_.bind(this);\n this.boundMouseUpHandler_ = this.onMouseup_.bind(this);\n var outerCircle = document.createElement('span');\n outerCircle.classList.add(this.CssClasses_.RADIO_OUTER_CIRCLE);\n var innerCircle = document.createElement('span');\n innerCircle.classList.add(this.CssClasses_.RADIO_INNER_CIRCLE);\n this.element_.appendChild(outerCircle);\n this.element_.appendChild(innerCircle);\n var rippleContainer;\n if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n rippleContainer = document.createElement('span');\n rippleContainer.classList.add(this.CssClasses_.RIPPLE_CONTAINER);\n rippleContainer.classList.add(this.CssClasses_.RIPPLE_EFFECT);\n rippleContainer.classList.add(this.CssClasses_.RIPPLE_CENTER);\n rippleContainer.addEventListener('mouseup', this.boundMouseUpHandler_);\n var ripple = document.createElement('span');\n ripple.classList.add(this.CssClasses_.RIPPLE);\n rippleContainer.appendChild(ripple);\n this.element_.appendChild(rippleContainer);\n }\n this.btnElement_.addEventListener('change', this.boundChangeHandler_);\n this.btnElement_.addEventListener('focus', this.boundFocusHandler_);\n this.btnElement_.addEventListener('blur', this.boundBlurHandler_);\n this.element_.addEventListener('mouseup', this.boundMouseUpHandler_);\n this.updateClasses_();\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialRadio,\n classAsString: 'MaterialRadio',\n cssClass: 'mdl-js-radio',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Slider MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialSlider = function MaterialSlider(element) {\n this.element_ = element;\n // Browser feature detection.\n this.isIE_ = window.navigator.msPointerEnabled;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialSlider'] = MaterialSlider;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialSlider.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialSlider.prototype.CssClasses_ = {\n IE_CONTAINER: 'mdl-slider__ie-container',\n SLIDER_CONTAINER: 'mdl-slider__container',\n BACKGROUND_FLEX: 'mdl-slider__background-flex',\n BACKGROUND_LOWER: 'mdl-slider__background-lower',\n BACKGROUND_UPPER: 'mdl-slider__background-upper',\n IS_LOWEST_VALUE: 'is-lowest-value',\n IS_UPGRADED: 'is-upgraded'\n};\n/**\n * Handle input on element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSlider.prototype.onInput_ = function (event) {\n this.updateValueStyles_();\n};\n/**\n * Handle change on element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSlider.prototype.onChange_ = function (event) {\n this.updateValueStyles_();\n};\n/**\n * Handle mouseup on element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSlider.prototype.onMouseUp_ = function (event) {\n event.target.blur();\n};\n/**\n * Handle mousedown on container element.\n * This handler is purpose is to not require the use to click\n * exactly on the 2px slider element, as FireFox seems to be very\n * strict about this.\n *\n * @param {Event} event The event that fired.\n * @private\n * @suppress {missingProperties}\n */\nMaterialSlider.prototype.onContainerMouseDown_ = function (event) {\n // If this click is not on the parent element (but rather some child)\n // ignore. It may still bubble up.\n if (event.target !== this.element_.parentElement) {\n return;\n }\n // Discard the original event and create a new event that\n // is on the slider element.\n event.preventDefault();\n var newEvent = new MouseEvent('mousedown', {\n target: event.target,\n buttons: event.buttons,\n clientX: event.clientX,\n clientY: this.element_.getBoundingClientRect().y\n });\n this.element_.dispatchEvent(newEvent);\n};\n/**\n * Handle updating of values.\n *\n * @private\n */\nMaterialSlider.prototype.updateValueStyles_ = function () {\n // Calculate and apply percentages to div structure behind slider.\n var fraction = (this.element_.value - this.element_.min) / (this.element_.max - this.element_.min);\n if (fraction === 0) {\n this.element_.classList.add(this.CssClasses_.IS_LOWEST_VALUE);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_LOWEST_VALUE);\n }\n if (!this.isIE_) {\n this.backgroundLower_.style.flex = fraction;\n this.backgroundLower_.style.webkitFlex = fraction;\n this.backgroundUpper_.style.flex = 1 - fraction;\n this.backgroundUpper_.style.webkitFlex = 1 - fraction;\n }\n};\n// Public methods.\n/**\n * Disable slider.\n *\n * @public\n */\nMaterialSlider.prototype.disable = function () {\n this.element_.disabled = true;\n};\nMaterialSlider.prototype['disable'] = MaterialSlider.prototype.disable;\n/**\n * Enable slider.\n *\n * @public\n */\nMaterialSlider.prototype.enable = function () {\n this.element_.disabled = false;\n};\nMaterialSlider.prototype['enable'] = MaterialSlider.prototype.enable;\n/**\n * Update slider value.\n *\n * @param {number} value The value to which to set the control (optional).\n * @public\n */\nMaterialSlider.prototype.change = function (value) {\n if (typeof value !== 'undefined') {\n this.element_.value = value;\n }\n this.updateValueStyles_();\n};\nMaterialSlider.prototype['change'] = MaterialSlider.prototype.change;\n/**\n * Initialize element.\n */\nMaterialSlider.prototype.init = function () {\n if (this.element_) {\n if (this.isIE_) {\n // Since we need to specify a very large height in IE due to\n // implementation limitations, we add a parent here that trims it down to\n // a reasonable size.\n var containerIE = document.createElement('div');\n containerIE.classList.add(this.CssClasses_.IE_CONTAINER);\n this.element_.parentElement.insertBefore(containerIE, this.element_);\n this.element_.parentElement.removeChild(this.element_);\n containerIE.appendChild(this.element_);\n } else {\n // For non-IE browsers, we need a div structure that sits behind the\n // slider and allows us to style the left and right sides of it with\n // different colors.\n var container = document.createElement('div');\n container.classList.add(this.CssClasses_.SLIDER_CONTAINER);\n this.element_.parentElement.insertBefore(container, this.element_);\n this.element_.parentElement.removeChild(this.element_);\n container.appendChild(this.element_);\n var backgroundFlex = document.createElement('div');\n backgroundFlex.classList.add(this.CssClasses_.BACKGROUND_FLEX);\n container.appendChild(backgroundFlex);\n this.backgroundLower_ = document.createElement('div');\n this.backgroundLower_.classList.add(this.CssClasses_.BACKGROUND_LOWER);\n backgroundFlex.appendChild(this.backgroundLower_);\n this.backgroundUpper_ = document.createElement('div');\n this.backgroundUpper_.classList.add(this.CssClasses_.BACKGROUND_UPPER);\n backgroundFlex.appendChild(this.backgroundUpper_);\n }\n this.boundInputHandler = this.onInput_.bind(this);\n this.boundChangeHandler = this.onChange_.bind(this);\n this.boundMouseUpHandler = this.onMouseUp_.bind(this);\n this.boundContainerMouseDownHandler = this.onContainerMouseDown_.bind(this);\n this.element_.addEventListener('input', this.boundInputHandler);\n this.element_.addEventListener('change', this.boundChangeHandler);\n this.element_.addEventListener('mouseup', this.boundMouseUpHandler);\n this.element_.parentElement.addEventListener('mousedown', this.boundContainerMouseDownHandler);\n this.updateValueStyles_();\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialSlider,\n classAsString: 'MaterialSlider',\n cssClass: 'mdl-js-slider',\n widget: true\n});",
+ "/**\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Snackbar MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialSnackbar = function MaterialSnackbar(element) {\n this.element_ = element;\n this.textElement_ = this.element_.querySelector('.' + this.cssClasses_.MESSAGE);\n this.actionElement_ = this.element_.querySelector('.' + this.cssClasses_.ACTION);\n if (!this.textElement_) {\n throw new Error('There must be a message element for a snackbar.');\n }\n if (!this.actionElement_) {\n throw new Error('There must be an action element for a snackbar.');\n }\n this.active = false;\n this.actionHandler_ = undefined;\n this.message_ = undefined;\n this.actionText_ = undefined;\n this.queuedNotifications_ = [];\n this.setActionHidden_(true);\n};\nwindow['MaterialSnackbar'] = MaterialSnackbar;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialSnackbar.prototype.Constant_ = {\n // The duration of the snackbar show/hide animation, in ms.\n ANIMATION_LENGTH: 250\n};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialSnackbar.prototype.cssClasses_ = {\n SNACKBAR: 'mdl-snackbar',\n MESSAGE: 'mdl-snackbar__text',\n ACTION: 'mdl-snackbar__action',\n ACTIVE: 'mdl-snackbar--active'\n};\n/**\n * Display the snackbar.\n *\n * @private\n */\nMaterialSnackbar.prototype.displaySnackbar_ = function () {\n this.element_.setAttribute('aria-hidden', 'true');\n if (this.actionHandler_) {\n this.actionElement_.textContent = this.actionText_;\n this.actionElement_.addEventListener('click', this.actionHandler_);\n this.setActionHidden_(false);\n }\n this.textElement_.textContent = this.message_;\n this.element_.classList.add(this.cssClasses_.ACTIVE);\n this.element_.setAttribute('aria-hidden', 'false');\n setTimeout(this.cleanup_.bind(this), this.timeout_);\n};\n/**\n * Show the snackbar.\n *\n * @param {Object} data The data for the notification.\n * @public\n */\nMaterialSnackbar.prototype.showSnackbar = function (data) {\n if (data === undefined) {\n throw new Error('Please provide a data object with at least a message to display.');\n }\n if (data['message'] === undefined) {\n throw new Error('Please provide a message to be displayed.');\n }\n if (data['actionHandler'] && !data['actionText']) {\n throw new Error('Please provide action text with the handler.');\n }\n if (this.active) {\n this.queuedNotifications_.push(data);\n } else {\n this.active = true;\n this.message_ = data['message'];\n if (data['timeout']) {\n this.timeout_ = data['timeout'];\n } else {\n this.timeout_ = 2750;\n }\n if (data['actionHandler']) {\n this.actionHandler_ = data['actionHandler'];\n }\n if (data['actionText']) {\n this.actionText_ = data['actionText'];\n }\n this.displaySnackbar_();\n }\n};\nMaterialSnackbar.prototype['showSnackbar'] = MaterialSnackbar.prototype.showSnackbar;\n/**\n * Check if the queue has items within it.\n * If it does, display the next entry.\n *\n * @private\n */\nMaterialSnackbar.prototype.checkQueue_ = function () {\n if (this.queuedNotifications_.length > 0) {\n this.showSnackbar(this.queuedNotifications_.shift());\n }\n};\n/**\n * Cleanup the snackbar event listeners and accessiblity attributes.\n *\n * @private\n */\nMaterialSnackbar.prototype.cleanup_ = function () {\n this.element_.classList.remove(this.cssClasses_.ACTIVE);\n setTimeout(function () {\n this.element_.setAttribute('aria-hidden', 'true');\n this.textElement_.textContent = '';\n if (!Boolean(this.actionElement_.getAttribute('aria-hidden'))) {\n this.setActionHidden_(true);\n this.actionElement_.textContent = '';\n this.actionElement_.removeEventListener('click', this.actionHandler_);\n }\n this.actionHandler_ = undefined;\n this.message_ = undefined;\n this.actionText_ = undefined;\n this.active = false;\n this.checkQueue_();\n }.bind(this), this.Constant_.ANIMATION_LENGTH);\n};\n/**\n * Set the action handler hidden state.\n *\n * @param {boolean} value\n * @private\n */\nMaterialSnackbar.prototype.setActionHidden_ = function (value) {\n if (value) {\n this.actionElement_.setAttribute('aria-hidden', 'true');\n } else {\n this.actionElement_.removeAttribute('aria-hidden');\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialSnackbar,\n classAsString: 'MaterialSnackbar',\n cssClass: 'mdl-js-snackbar',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Spinner MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @param {HTMLElement} element The element that will be upgraded.\n * @constructor\n */\nvar MaterialSpinner = function MaterialSpinner(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialSpinner'] = MaterialSpinner;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialSpinner.prototype.Constant_ = { MDL_SPINNER_LAYER_COUNT: 4 };\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialSpinner.prototype.CssClasses_ = {\n MDL_SPINNER_LAYER: 'mdl-spinner__layer',\n MDL_SPINNER_CIRCLE_CLIPPER: 'mdl-spinner__circle-clipper',\n MDL_SPINNER_CIRCLE: 'mdl-spinner__circle',\n MDL_SPINNER_GAP_PATCH: 'mdl-spinner__gap-patch',\n MDL_SPINNER_LEFT: 'mdl-spinner__left',\n MDL_SPINNER_RIGHT: 'mdl-spinner__right'\n};\n/**\n * Auxiliary method to create a spinner layer.\n *\n * @param {number} index Index of the layer to be created.\n * @public\n */\nMaterialSpinner.prototype.createLayer = function (index) {\n var layer = document.createElement('div');\n layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER);\n layer.classList.add(this.CssClasses_.MDL_SPINNER_LAYER + '-' + index);\n var leftClipper = document.createElement('div');\n leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);\n leftClipper.classList.add(this.CssClasses_.MDL_SPINNER_LEFT);\n var gapPatch = document.createElement('div');\n gapPatch.classList.add(this.CssClasses_.MDL_SPINNER_GAP_PATCH);\n var rightClipper = document.createElement('div');\n rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE_CLIPPER);\n rightClipper.classList.add(this.CssClasses_.MDL_SPINNER_RIGHT);\n var circleOwners = [\n leftClipper,\n gapPatch,\n rightClipper\n ];\n for (var i = 0; i < circleOwners.length; i++) {\n var circle = document.createElement('div');\n circle.classList.add(this.CssClasses_.MDL_SPINNER_CIRCLE);\n circleOwners[i].appendChild(circle);\n }\n layer.appendChild(leftClipper);\n layer.appendChild(gapPatch);\n layer.appendChild(rightClipper);\n this.element_.appendChild(layer);\n};\nMaterialSpinner.prototype['createLayer'] = MaterialSpinner.prototype.createLayer;\n/**\n * Stops the spinner animation.\n * Public method for users who need to stop the spinner for any reason.\n *\n * @public\n */\nMaterialSpinner.prototype.stop = function () {\n this.element_.classList.remove('is-active');\n};\nMaterialSpinner.prototype['stop'] = MaterialSpinner.prototype.stop;\n/**\n * Starts the spinner animation.\n * Public method for users who need to manually start the spinner for any reason\n * (instead of just adding the 'is-active' class to their markup).\n *\n * @public\n */\nMaterialSpinner.prototype.start = function () {\n this.element_.classList.add('is-active');\n};\nMaterialSpinner.prototype['start'] = MaterialSpinner.prototype.start;\n/**\n * Initialize element.\n */\nMaterialSpinner.prototype.init = function () {\n if (this.element_) {\n for (var i = 1; i <= this.Constant_.MDL_SPINNER_LAYER_COUNT; i++) {\n this.createLayer(i);\n }\n this.element_.classList.add('is-upgraded');\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialSpinner,\n classAsString: 'MaterialSpinner',\n cssClass: 'mdl-js-spinner',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Checkbox MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialSwitch = function MaterialSwitch(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialSwitch'] = MaterialSwitch;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialSwitch.prototype.Constant_ = { TINY_TIMEOUT: 0.001 };\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialSwitch.prototype.CssClasses_ = {\n INPUT: 'mdl-switch__input',\n TRACK: 'mdl-switch__track',\n THUMB: 'mdl-switch__thumb',\n FOCUS_HELPER: 'mdl-switch__focus-helper',\n RIPPLE_EFFECT: 'mdl-js-ripple-effect',\n RIPPLE_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE_CONTAINER: 'mdl-switch__ripple-container',\n RIPPLE_CENTER: 'mdl-ripple--center',\n RIPPLE: 'mdl-ripple',\n IS_FOCUSED: 'is-focused',\n IS_DISABLED: 'is-disabled',\n IS_CHECKED: 'is-checked'\n};\n/**\n * Handle change of state.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSwitch.prototype.onChange_ = function (event) {\n this.updateClasses_();\n};\n/**\n * Handle focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSwitch.prototype.onFocus_ = function (event) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle lost focus of element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSwitch.prototype.onBlur_ = function (event) {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle mouseup.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialSwitch.prototype.onMouseUp_ = function (event) {\n this.blur_();\n};\n/**\n * Handle class updates.\n *\n * @private\n */\nMaterialSwitch.prototype.updateClasses_ = function () {\n this.checkDisabled();\n this.checkToggleState();\n};\n/**\n * Add blur.\n *\n * @private\n */\nMaterialSwitch.prototype.blur_ = function () {\n // TODO: figure out why there's a focus event being fired after our blur,\n // so that we can avoid this hack.\n window.setTimeout(function () {\n this.inputElement_.blur();\n }.bind(this), this.Constant_.TINY_TIMEOUT);\n};\n// Public methods.\n/**\n * Check the components disabled state.\n *\n * @public\n */\nMaterialSwitch.prototype.checkDisabled = function () {\n if (this.inputElement_.disabled) {\n this.element_.classList.add(this.CssClasses_.IS_DISABLED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DISABLED);\n }\n};\nMaterialSwitch.prototype['checkDisabled'] = MaterialSwitch.prototype.checkDisabled;\n/**\n * Check the components toggled state.\n *\n * @public\n */\nMaterialSwitch.prototype.checkToggleState = function () {\n if (this.inputElement_.checked) {\n this.element_.classList.add(this.CssClasses_.IS_CHECKED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_CHECKED);\n }\n};\nMaterialSwitch.prototype['checkToggleState'] = MaterialSwitch.prototype.checkToggleState;\n/**\n * Disable switch.\n *\n * @public\n */\nMaterialSwitch.prototype.disable = function () {\n this.inputElement_.disabled = true;\n this.updateClasses_();\n};\nMaterialSwitch.prototype['disable'] = MaterialSwitch.prototype.disable;\n/**\n * Enable switch.\n *\n * @public\n */\nMaterialSwitch.prototype.enable = function () {\n this.inputElement_.disabled = false;\n this.updateClasses_();\n};\nMaterialSwitch.prototype['enable'] = MaterialSwitch.prototype.enable;\n/**\n * Activate switch.\n *\n * @public\n */\nMaterialSwitch.prototype.on = function () {\n this.inputElement_.checked = true;\n this.updateClasses_();\n};\nMaterialSwitch.prototype['on'] = MaterialSwitch.prototype.on;\n/**\n * Deactivate switch.\n *\n * @public\n */\nMaterialSwitch.prototype.off = function () {\n this.inputElement_.checked = false;\n this.updateClasses_();\n};\nMaterialSwitch.prototype['off'] = MaterialSwitch.prototype.off;\n/**\n * Initialize element.\n */\nMaterialSwitch.prototype.init = function () {\n if (this.element_) {\n this.inputElement_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);\n var track = document.createElement('div');\n track.classList.add(this.CssClasses_.TRACK);\n var thumb = document.createElement('div');\n thumb.classList.add(this.CssClasses_.THUMB);\n var focusHelper = document.createElement('span');\n focusHelper.classList.add(this.CssClasses_.FOCUS_HELPER);\n thumb.appendChild(focusHelper);\n this.element_.appendChild(track);\n this.element_.appendChild(thumb);\n this.boundMouseUpHandler = this.onMouseUp_.bind(this);\n if (this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT)) {\n this.element_.classList.add(this.CssClasses_.RIPPLE_IGNORE_EVENTS);\n this.rippleContainerElement_ = document.createElement('span');\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CONTAINER);\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_EFFECT);\n this.rippleContainerElement_.classList.add(this.CssClasses_.RIPPLE_CENTER);\n this.rippleContainerElement_.addEventListener('mouseup', this.boundMouseUpHandler);\n var ripple = document.createElement('span');\n ripple.classList.add(this.CssClasses_.RIPPLE);\n this.rippleContainerElement_.appendChild(ripple);\n this.element_.appendChild(this.rippleContainerElement_);\n }\n this.boundChangeHandler = this.onChange_.bind(this);\n this.boundFocusHandler = this.onFocus_.bind(this);\n this.boundBlurHandler = this.onBlur_.bind(this);\n this.inputElement_.addEventListener('change', this.boundChangeHandler);\n this.inputElement_.addEventListener('focus', this.boundFocusHandler);\n this.inputElement_.addEventListener('blur', this.boundBlurHandler);\n this.element_.addEventListener('mouseup', this.boundMouseUpHandler);\n this.updateClasses_();\n this.element_.classList.add('is-upgraded');\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialSwitch,\n classAsString: 'MaterialSwitch',\n cssClass: 'mdl-js-switch',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Textfield MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialTextfield = function MaterialTextfield(element) {\n this.element_ = element;\n this.maxRows = this.Constant_.NO_MAX_ROWS;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialTextfield'] = MaterialTextfield;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialTextfield.prototype.Constant_ = {\n NO_MAX_ROWS: -1,\n MAX_ROWS_ATTRIBUTE: 'maxrows'\n};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialTextfield.prototype.CssClasses_ = {\n LABEL: 'mdl-textfield__label',\n INPUT: 'mdl-textfield__input',\n IS_DIRTY: 'is-dirty',\n IS_FOCUSED: 'is-focused',\n IS_DISABLED: 'is-disabled',\n IS_INVALID: 'is-invalid',\n IS_UPGRADED: 'is-upgraded',\n HAS_PLACEHOLDER: 'has-placeholder'\n};\n/**\n * Handle input being entered.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialTextfield.prototype.onKeyDown_ = function (event) {\n var currentRowCount = event.target.value.split('\\n').length;\n if (event.keyCode === 13) {\n if (currentRowCount >= this.maxRows) {\n event.preventDefault();\n }\n }\n};\n/**\n * Handle focus.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialTextfield.prototype.onFocus_ = function (event) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle lost focus.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialTextfield.prototype.onBlur_ = function (event) {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n};\n/**\n * Handle reset event from out side.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialTextfield.prototype.onReset_ = function (event) {\n this.updateClasses_();\n};\n/**\n * Handle class updates.\n *\n * @private\n */\nMaterialTextfield.prototype.updateClasses_ = function () {\n this.checkDisabled();\n this.checkValidity();\n this.checkDirty();\n this.checkFocus();\n};\n// Public methods.\n/**\n * Check the disabled state and update field accordingly.\n *\n * @public\n */\nMaterialTextfield.prototype.checkDisabled = function () {\n if (this.input_.disabled) {\n this.element_.classList.add(this.CssClasses_.IS_DISABLED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DISABLED);\n }\n};\nMaterialTextfield.prototype['checkDisabled'] = MaterialTextfield.prototype.checkDisabled;\n/**\n * Check the focus state and update field accordingly.\n *\n * @public\n */\nMaterialTextfield.prototype.checkFocus = function () {\n if (Boolean(this.element_.querySelector(':focus'))) {\n this.element_.classList.add(this.CssClasses_.IS_FOCUSED);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_FOCUSED);\n }\n};\nMaterialTextfield.prototype['checkFocus'] = MaterialTextfield.prototype.checkFocus;\n/**\n * Check the validity state and update field accordingly.\n *\n * @public\n */\nMaterialTextfield.prototype.checkValidity = function () {\n if (this.input_.validity) {\n if (this.input_.validity.valid) {\n this.element_.classList.remove(this.CssClasses_.IS_INVALID);\n } else {\n this.element_.classList.add(this.CssClasses_.IS_INVALID);\n }\n }\n};\nMaterialTextfield.prototype['checkValidity'] = MaterialTextfield.prototype.checkValidity;\n/**\n * Check the dirty state and update field accordingly.\n *\n * @public\n */\nMaterialTextfield.prototype.checkDirty = function () {\n if (this.input_.value && this.input_.value.length > 0) {\n this.element_.classList.add(this.CssClasses_.IS_DIRTY);\n } else {\n this.element_.classList.remove(this.CssClasses_.IS_DIRTY);\n }\n};\nMaterialTextfield.prototype['checkDirty'] = MaterialTextfield.prototype.checkDirty;\n/**\n * Disable text field.\n *\n * @public\n */\nMaterialTextfield.prototype.disable = function () {\n this.input_.disabled = true;\n this.updateClasses_();\n};\nMaterialTextfield.prototype['disable'] = MaterialTextfield.prototype.disable;\n/**\n * Enable text field.\n *\n * @public\n */\nMaterialTextfield.prototype.enable = function () {\n this.input_.disabled = false;\n this.updateClasses_();\n};\nMaterialTextfield.prototype['enable'] = MaterialTextfield.prototype.enable;\n/**\n * Update text field value.\n *\n * @param {string} value The value to which to set the control (optional).\n * @public\n */\nMaterialTextfield.prototype.change = function (value) {\n this.input_.value = value || '';\n this.updateClasses_();\n};\nMaterialTextfield.prototype['change'] = MaterialTextfield.prototype.change;\n/**\n * Initialize element.\n */\nMaterialTextfield.prototype.init = function () {\n if (this.element_) {\n this.label_ = this.element_.querySelector('.' + this.CssClasses_.LABEL);\n this.input_ = this.element_.querySelector('.' + this.CssClasses_.INPUT);\n if (this.input_) {\n if (this.input_.hasAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE)) {\n this.maxRows = parseInt(this.input_.getAttribute(this.Constant_.MAX_ROWS_ATTRIBUTE), 10);\n if (isNaN(this.maxRows)) {\n this.maxRows = this.Constant_.NO_MAX_ROWS;\n }\n }\n if (this.input_.hasAttribute('placeholder')) {\n this.element_.classList.add(this.CssClasses_.HAS_PLACEHOLDER);\n }\n this.boundUpdateClassesHandler = this.updateClasses_.bind(this);\n this.boundFocusHandler = this.onFocus_.bind(this);\n this.boundBlurHandler = this.onBlur_.bind(this);\n this.boundResetHandler = this.onReset_.bind(this);\n this.input_.addEventListener('input', this.boundUpdateClassesHandler);\n this.input_.addEventListener('focus', this.boundFocusHandler);\n this.input_.addEventListener('blur', this.boundBlurHandler);\n this.input_.addEventListener('reset', this.boundResetHandler);\n if (this.maxRows !== this.Constant_.NO_MAX_ROWS) {\n // TODO: This should handle pasting multi line text.\n // Currently doesn't.\n this.boundKeyDownHandler = this.onKeyDown_.bind(this);\n this.input_.addEventListener('keydown', this.boundKeyDownHandler);\n }\n var invalid = this.element_.classList.contains(this.CssClasses_.IS_INVALID);\n this.updateClasses_();\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n if (invalid) {\n this.element_.classList.add(this.CssClasses_.IS_INVALID);\n }\n if (this.input_.hasAttribute('autofocus')) {\n this.element_.focus();\n this.checkFocus();\n }\n }\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialTextfield,\n classAsString: 'MaterialTextfield',\n cssClass: 'mdl-js-textfield',\n widget: true\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Tooltip MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialTooltip = function MaterialTooltip(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialTooltip'] = MaterialTooltip;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialTooltip.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialTooltip.prototype.CssClasses_ = {\n IS_ACTIVE: 'is-active',\n BOTTOM: 'mdl-tooltip--bottom',\n LEFT: 'mdl-tooltip--left',\n RIGHT: 'mdl-tooltip--right',\n TOP: 'mdl-tooltip--top'\n};\n/**\n * Handle mouseenter for tooltip.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialTooltip.prototype.handleMouseEnter_ = function (event) {\n var props = event.target.getBoundingClientRect();\n var left = props.left + props.width / 2;\n var top = props.top + props.height / 2;\n var marginLeft = -1 * (this.element_.offsetWidth / 2);\n var marginTop = -1 * (this.element_.offsetHeight / 2);\n if (this.element_.classList.contains(this.CssClasses_.LEFT) || this.element_.classList.contains(this.CssClasses_.RIGHT)) {\n left = props.width / 2;\n if (top + marginTop < 0) {\n this.element_.style.top = '0';\n this.element_.style.marginTop = '0';\n } else {\n this.element_.style.top = top + 'px';\n this.element_.style.marginTop = marginTop + 'px';\n }\n } else {\n if (left + marginLeft < 0) {\n this.element_.style.left = '0';\n this.element_.style.marginLeft = '0';\n } else {\n this.element_.style.left = left + 'px';\n this.element_.style.marginLeft = marginLeft + 'px';\n }\n }\n if (this.element_.classList.contains(this.CssClasses_.TOP)) {\n this.element_.style.top = props.top - this.element_.offsetHeight - 10 + 'px';\n } else if (this.element_.classList.contains(this.CssClasses_.RIGHT)) {\n this.element_.style.left = props.left + props.width + 10 + 'px';\n } else if (this.element_.classList.contains(this.CssClasses_.LEFT)) {\n this.element_.style.left = props.left - this.element_.offsetWidth - 10 + 'px';\n } else {\n this.element_.style.top = props.top + props.height + 10 + 'px';\n }\n this.element_.classList.add(this.CssClasses_.IS_ACTIVE);\n};\n/**\n * Hide tooltip on mouseleave or scroll\n *\n * @private\n */\nMaterialTooltip.prototype.hideTooltip_ = function () {\n this.element_.classList.remove(this.CssClasses_.IS_ACTIVE);\n};\n/**\n * Initialize element.\n */\nMaterialTooltip.prototype.init = function () {\n if (this.element_) {\n var forElId = this.element_.getAttribute('for') || this.element_.getAttribute('data-mdl-for');\n if (forElId) {\n this.forElement_ = document.getElementById(forElId);\n }\n if (this.forElement_) {\n // It's left here because it prevents accidental text selection on Android\n if (!this.forElement_.hasAttribute('tabindex')) {\n this.forElement_.setAttribute('tabindex', '0');\n }\n this.boundMouseEnterHandler = this.handleMouseEnter_.bind(this);\n this.boundMouseLeaveAndScrollHandler = this.hideTooltip_.bind(this);\n this.forElement_.addEventListener('mouseenter', this.boundMouseEnterHandler, false);\n this.forElement_.addEventListener('touchend', this.boundMouseEnterHandler, false);\n this.forElement_.addEventListener('mouseleave', this.boundMouseLeaveAndScrollHandler, false);\n window.addEventListener('scroll', this.boundMouseLeaveAndScrollHandler, true);\n window.addEventListener('touchstart', this.boundMouseLeaveAndScrollHandler);\n }\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialTooltip,\n classAsString: 'MaterialTooltip',\n cssClass: 'mdl-tooltip'\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Data Table Card MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {Element} element The element that will be upgraded.\n */\nvar MaterialDataTable = function MaterialDataTable(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialDataTable'] = MaterialDataTable;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialDataTable.prototype.Constant_ = {};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialDataTable.prototype.CssClasses_ = {\n DATA_TABLE: 'mdl-data-table',\n SELECTABLE: 'mdl-data-table--selectable',\n SELECT_ELEMENT: 'mdl-data-table__select',\n IS_SELECTED: 'is-selected',\n IS_UPGRADED: 'is-upgraded'\n};\n/**\n * Generates and returns a function that toggles the selection state of a\n * single row (or multiple rows).\n *\n * @param {Element} checkbox Checkbox that toggles the selection state.\n * @param {Element} row Row to toggle when checkbox changes.\n * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.\n * @private\n */\nMaterialDataTable.prototype.selectRow_ = function (checkbox, row, opt_rows) {\n if (row) {\n return function () {\n if (checkbox.checked) {\n row.classList.add(this.CssClasses_.IS_SELECTED);\n } else {\n row.classList.remove(this.CssClasses_.IS_SELECTED);\n }\n }.bind(this);\n }\n if (opt_rows) {\n return function () {\n var i;\n var el;\n if (checkbox.checked) {\n for (i = 0; i < opt_rows.length; i++) {\n el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');\n el['MaterialCheckbox'].check();\n opt_rows[i].classList.add(this.CssClasses_.IS_SELECTED);\n }\n } else {\n for (i = 0; i < opt_rows.length; i++) {\n el = opt_rows[i].querySelector('td').querySelector('.mdl-checkbox');\n el['MaterialCheckbox'].uncheck();\n opt_rows[i].classList.remove(this.CssClasses_.IS_SELECTED);\n }\n }\n }.bind(this);\n }\n};\n/**\n * Creates a checkbox for a single or or multiple rows and hooks up the\n * event handling.\n *\n * @param {Element} row Row to toggle when checkbox changes.\n * @param {(Array<Object>|NodeList)=} opt_rows Rows to toggle when checkbox changes.\n * @private\n */\nMaterialDataTable.prototype.createCheckbox_ = function (row, opt_rows) {\n var label = document.createElement('label');\n var labelClasses = [\n 'mdl-checkbox',\n 'mdl-js-checkbox',\n 'mdl-js-ripple-effect',\n this.CssClasses_.SELECT_ELEMENT\n ];\n label.className = labelClasses.join(' ');\n var checkbox = document.createElement('input');\n checkbox.type = 'checkbox';\n checkbox.classList.add('mdl-checkbox__input');\n if (row) {\n checkbox.checked = row.classList.contains(this.CssClasses_.IS_SELECTED);\n checkbox.addEventListener('change', this.selectRow_(checkbox, row));\n } else if (opt_rows) {\n checkbox.addEventListener('change', this.selectRow_(checkbox, null, opt_rows));\n }\n label.appendChild(checkbox);\n componentHandler.upgradeElement(label, 'MaterialCheckbox');\n return label;\n};\n/**\n * Initialize element.\n */\nMaterialDataTable.prototype.init = function () {\n if (this.element_) {\n var firstHeader = this.element_.querySelector('th');\n var bodyRows = Array.prototype.slice.call(this.element_.querySelectorAll('tbody tr'));\n var footRows = Array.prototype.slice.call(this.element_.querySelectorAll('tfoot tr'));\n var rows = bodyRows.concat(footRows);\n if (this.element_.classList.contains(this.CssClasses_.SELECTABLE)) {\n var th = document.createElement('th');\n var headerCheckbox = this.createCheckbox_(null, rows);\n th.appendChild(headerCheckbox);\n firstHeader.parentElement.insertBefore(th, firstHeader);\n for (var i = 0; i < rows.length; i++) {\n var firstCell = rows[i].querySelector('td');\n if (firstCell) {\n var td = document.createElement('td');\n if (rows[i].parentNode.nodeName.toUpperCase() === 'TBODY') {\n var rowCheckbox = this.createCheckbox_(rows[i]);\n td.appendChild(rowCheckbox);\n }\n rows[i].insertBefore(td, firstCell);\n }\n }\n this.element_.classList.add(this.CssClasses_.IS_UPGRADED);\n }\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialDataTable,\n classAsString: 'MaterialDataTable',\n cssClass: 'mdl-js-data-table'\n});",
+ "/**\n * @license\n * Copyright 2015 Google Inc. All Rights Reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/**\n * Class constructor for Ripple MDL component.\n * Implements MDL component design pattern defined at:\n * https://github.com/jasonmayes/mdl-component-design-pattern\n *\n * @constructor\n * @param {HTMLElement} element The element that will be upgraded.\n */\nvar MaterialRipple = function MaterialRipple(element) {\n this.element_ = element;\n // Initialize instance.\n this.init();\n};\nwindow['MaterialRipple'] = MaterialRipple;\n/**\n * Store constants in one place so they can be updated easily.\n *\n * @enum {string | number}\n * @private\n */\nMaterialRipple.prototype.Constant_ = {\n INITIAL_SCALE: 'scale(0.0001, 0.0001)',\n INITIAL_SIZE: '1px',\n INITIAL_OPACITY: '0.4',\n FINAL_OPACITY: '0',\n FINAL_SCALE: ''\n};\n/**\n * Store strings for class names defined by this component that are used in\n * JavaScript. This allows us to simply change it in one place should we\n * decide to modify at a later date.\n *\n * @enum {string}\n * @private\n */\nMaterialRipple.prototype.CssClasses_ = {\n RIPPLE_CENTER: 'mdl-ripple--center',\n RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events',\n RIPPLE: 'mdl-ripple',\n IS_ANIMATING: 'is-animating',\n IS_VISIBLE: 'is-visible'\n};\n/**\n * Handle mouse / finger down on element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRipple.prototype.downHandler_ = function (event) {\n if (!this.rippleElement_.style.width && !this.rippleElement_.style.height) {\n var rect = this.element_.getBoundingClientRect();\n this.boundHeight = rect.height;\n this.boundWidth = rect.width;\n this.rippleSize_ = Math.sqrt(rect.width * rect.width + rect.height * rect.height) * 2 + 2;\n this.rippleElement_.style.width = this.rippleSize_ + 'px';\n this.rippleElement_.style.height = this.rippleSize_ + 'px';\n }\n this.rippleElement_.classList.add(this.CssClasses_.IS_VISIBLE);\n if (event.type === 'mousedown' && this.ignoringMouseDown_) {\n this.ignoringMouseDown_ = false;\n } else {\n if (event.type === 'touchstart') {\n this.ignoringMouseDown_ = true;\n }\n var frameCount = this.getFrameCount();\n if (frameCount > 0) {\n return;\n }\n this.setFrameCount(1);\n var bound = event.currentTarget.getBoundingClientRect();\n var x;\n var y;\n // Check if we are handling a keyboard click.\n if (event.clientX === 0 && event.clientY === 0) {\n x = Math.round(bound.width / 2);\n y = Math.round(bound.height / 2);\n } else {\n var clientX = event.clientX !== undefined ? event.clientX : event.touches[0].clientX;\n var clientY = event.clientY !== undefined ? event.clientY : event.touches[0].clientY;\n x = Math.round(clientX - bound.left);\n y = Math.round(clientY - bound.top);\n }\n this.setRippleXY(x, y);\n this.setRippleStyles(true);\n window.requestAnimationFrame(this.animFrameHandler.bind(this));\n }\n};\n/**\n * Handle mouse / finger up on element.\n *\n * @param {Event} event The event that fired.\n * @private\n */\nMaterialRipple.prototype.upHandler_ = function (event) {\n // Don't fire for the artificial \"mouseup\" generated by a double-click.\n if (event && event.detail !== 2) {\n // Allow a repaint to occur before removing this class, so the animation\n // shows for tap events, which seem to trigger a mouseup too soon after\n // mousedown.\n window.setTimeout(function () {\n this.rippleElement_.classList.remove(this.CssClasses_.IS_VISIBLE);\n }.bind(this), 0);\n }\n};\n/**\n * Initialize element.\n */\nMaterialRipple.prototype.init = function () {\n if (this.element_) {\n var recentering = this.element_.classList.contains(this.CssClasses_.RIPPLE_CENTER);\n if (!this.element_.classList.contains(this.CssClasses_.RIPPLE_EFFECT_IGNORE_EVENTS)) {\n this.rippleElement_ = this.element_.querySelector('.' + this.CssClasses_.RIPPLE);\n this.frameCount_ = 0;\n this.rippleSize_ = 0;\n this.x_ = 0;\n this.y_ = 0;\n // Touch start produces a compat mouse down event, which would cause a\n // second ripples. To avoid that, we use this property to ignore the first\n // mouse down after a touch start.\n this.ignoringMouseDown_ = false;\n this.boundDownHandler = this.downHandler_.bind(this);\n this.element_.addEventListener('mousedown', this.boundDownHandler);\n this.element_.addEventListener('touchstart', this.boundDownHandler);\n this.boundUpHandler = this.upHandler_.bind(this);\n this.element_.addEventListener('mouseup', this.boundUpHandler);\n this.element_.addEventListener('mouseleave', this.boundUpHandler);\n this.element_.addEventListener('touchend', this.boundUpHandler);\n this.element_.addEventListener('blur', this.boundUpHandler);\n /**\n * Getter for frameCount_.\n * @return {number} the frame count.\n */\n this.getFrameCount = function () {\n return this.frameCount_;\n };\n /**\n * Setter for frameCount_.\n * @param {number} fC the frame count.\n */\n this.setFrameCount = function (fC) {\n this.frameCount_ = fC;\n };\n /**\n * Getter for rippleElement_.\n * @return {Element} the ripple element.\n */\n this.getRippleElement = function () {\n return this.rippleElement_;\n };\n /**\n * Sets the ripple X and Y coordinates.\n * @param {number} newX the new X coordinate\n * @param {number} newY the new Y coordinate\n */\n this.setRippleXY = function (newX, newY) {\n this.x_ = newX;\n this.y_ = newY;\n };\n /**\n * Sets the ripple styles.\n * @param {boolean} start whether or not this is the start frame.\n */\n this.setRippleStyles = function (start) {\n if (this.rippleElement_ !== null) {\n var transformString;\n var scale;\n var size;\n var offset = 'translate(' + this.x_ + 'px, ' + this.y_ + 'px)';\n if (start) {\n scale = this.Constant_.INITIAL_SCALE;\n size = this.Constant_.INITIAL_SIZE;\n } else {\n scale = this.Constant_.FINAL_SCALE;\n size = this.rippleSize_ + 'px';\n if (recentering) {\n offset = 'translate(' + this.boundWidth / 2 + 'px, ' + this.boundHeight / 2 + 'px)';\n }\n }\n transformString = 'translate(-50%, -50%) ' + offset + scale;\n this.rippleElement_.style.webkitTransform = transformString;\n this.rippleElement_.style.msTransform = transformString;\n this.rippleElement_.style.transform = transformString;\n if (start) {\n this.rippleElement_.classList.remove(this.CssClasses_.IS_ANIMATING);\n } else {\n this.rippleElement_.classList.add(this.CssClasses_.IS_ANIMATING);\n }\n }\n };\n /**\n * Handles an animation frame.\n */\n this.animFrameHandler = function () {\n if (this.frameCount_-- > 0) {\n window.requestAnimationFrame(this.animFrameHandler.bind(this));\n } else {\n this.setRippleStyles(false);\n }\n };\n }\n }\n};\n// The component registers itself. It can assume componentHandler is available\n// in the global scope.\ncomponentHandler.register({\n constructor: MaterialRipple,\n classAsString: 'MaterialRipple',\n cssClass: 'mdl-js-ripple-effect',\n widget: false\n});"
+ ]
+}
\ No newline at end of file
diff --git a/src/polyfills.ts b/src/polyfills.ts
new file mode 100644
index 0000000..d8f92c1
--- /dev/null
+++ b/src/polyfills.ts
@@ -0,0 +1,61 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/**
+ * This file includes polyfills needed by Angular and is loaded before the app.
+ * You can add your own extra polyfills to this file.
+ *
+ * This file is divided into 2 sections:
+ * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ * 2. Application imports. Files imported after ZoneJS that should be loaded before your main
+ * file.
+ *
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
+ * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
+ * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
+ *
+ * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
+ */
+
+/***************************************************************************************************
+ * BROWSER POLYFILLS
+ */
+
+/** IE9, IE10 and IE11 requires all of the following polyfills. **/
+import 'core-js/es6/symbol';
+import 'core-js/es6/object';
+import 'core-js/es6/function';
+import 'core-js/es6/parse-int';
+import 'core-js/es6/parse-float';
+import 'core-js/es6/number';
+import 'core-js/es6/math';
+import 'core-js/es6/string';
+import 'core-js/es6/date';
+import 'core-js/es6/array';
+import 'core-js/es6/regexp';
+import 'core-js/es6/map';
+import 'core-js/es6/weak-map';
+import 'core-js/es6/set';
+import 'core-js/es6/reflect';
+import 'core-js/es7/reflect';
+import 'zone.js/dist/zone'; // Included with Angular CLI.
diff --git a/src/styles.css b/src/styles.css
new file mode 100644
index 0000000..57ba1f2
--- /dev/null
+++ b/src/styles.css
@@ -0,0 +1,591 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+
+input[type=text],
+input[type=password],
+input[type=email],
+input[type=url],
+input[type=time],
+input[type=date],
+input[type=datetime-local],
+input[type=tel],
+input[type=number],
+input[type=search-md],
+input[type=search],
+textarea.md-textarea {
+ font-family: 'Roboto';
+ background-color: transparent;
+ border: 1px solid;
+ border-bottom: 1px solid;
+ border-color: grey;
+ border-radius: 5px;
+ outline: none;
+ height: 37px;
+ width: 100%;
+ font-size: 1rem;
+ box-shadow: none;
+ box-sizing: inherit;
+ padding: 8px;
+}
+
+select.form-control {
+ border-radius: 5px;
+ border: 1px solid;
+ padding-left: 10px;
+ border-color: grey;
+ font-family: 'Roboto';
+}
+
+input[type=text]:disabled {
+ background: #e0dada;
+ font-family: 'Roboto';
+}
+
+body {
+ background: white;
+ font-family: 'Roboto';
+}
+
+body {
+ margin: 0;
+}
+
+/* Disable ugly boxes around images in IE10 */
+
+a img {
+ border: 0px;
+}
+
+::-moz-selection {
+ background-color: #6ab344;
+ color: #fff;
+}
+
+::selection {
+ background-color: #6ab344;
+ color: #fff;
+}
+
+.android-search-box .mdl-textfield__input {
+ color: rgba(0, 0, 0, 0.87);
+}
+
+.android-header .mdl-menu__container {
+ z-index: 50;
+ margin: 0 !important;
+}
+
+.mdl-textfield--expandable {
+ width: auto;
+}
+
+.android-fab {
+ position: absolute;
+ right: 20%;
+ bottom: -26px;
+ z-index: 3;
+ background: #64ffda !important;
+ color: black !important;
+}
+
+.android-mobile-title {
+ display: none !important;
+}
+
+.android-logo-image {
+ height: 28px;
+ width: 140px;
+}
+
+.warningMarker {
+ position: absolute;
+ background: orange;
+ color: red;
+ z-index: 20
+}
+
+.col-lg-12-ln {
+ margin-left: 41px;
+ margin-top: 2px;
+ position: centre;
+}
+
+.col-lg-12-ln1 {
+ margin-left: 30px;
+ margin-top: 2px;
+ position: centre;
+}
+
+.col-lg-12-ln2 {
+ margin-left: 370px;
+ margin-top: 15px;
+ position: centre;
+}
+
+.keyedMarker {
+ position: absolute;
+ background: green;
+ z-index: 20
+}
+
+.noKeyedMarker {
+ position: absolute;
+ background: orange;
+ z-index: 20
+}
+
+.defaultMarker {
+ position: absolute;
+ background: lightgreen;
+ z-index: 20;
+}
+
+.android-header {
+ overflow: visible;
+ background-color: white;
+}
+
+.android-header .material-icons {
+ color: #767777 !important;
+}
+
+.android-header .mdl-layout__drawer-button {
+ background: transparent;
+ color: #767777;
+}
+
+.android-header .mdl-navigation__link {
+ color: #757575;
+ font-weight: 700;
+ font-size: 14px;
+}
+
+.android-navigation-container {
+ /* Simple hack to make the overflow happen to the left instead... */
+ direction: rtl;
+ -webkit-order: 1;
+ -ms-flex-order: 1;
+ order: 1;
+ width: 500px;
+ transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), width 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.android-navigation {
+ /* ... and now make sure the content is actually LTR */
+ direction: ltr;
+ -webkit-justify-content: flex-end;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+ width: 800px;
+}
+
+.android-search-box.is-focused + .android-navigation-container {
+ opacity: 0;
+ width: 100px;
+}
+
+.android-navigation .mdl-navigation__link {
+ display: inline-block;
+ height: 60px;
+ line-height: 68px;
+ background-color: transparent !important;
+ border-bottom: 4px solid transparent;
+}
+
+.android-navigation .mdl-navigation__link:hover {
+ border-bottom: 4px solid #6ab344;
+}
+
+.android-search-box {
+ -webkit-order: 2;
+ -ms-flex-order: 2;
+ order: 2;
+ margin-left: 16px;
+ margin-right: 16px;
+}
+
+.android-more-button {
+ -webkit-order: 3;
+ -ms-flex-order: 3;
+ order: 3;
+}
+
+.android-drawer {
+ border-right: none;
+}
+
+.android-drawer-separator {
+ height: 1px;
+ background-color: #dcdcdc;
+ margin: 8px 0;
+}
+
+.android-drawer .mdl-navigation__link.mdl-navigation__link {
+ font-size: 14px;
+ color: #757575;
+}
+
+.android-drawer span.mdl-navigation__link.mdl-navigation__link {
+ color: #6ab344;
+}
+
+.android-drawer .mdl-layout-title {
+ position: relative;
+ background: #6ab344;
+ height: 160px;
+}
+
+.android-drawer .android-logo-image {
+ position: absolute;
+ bottom: 16px;
+}
+
+.logo-font {
+ font-family: 'Roboto';
+ line-height: 1;
+ color: #767777;
+ font-weight: 500;
+}
+
+.android-slogan {
+ font-size: 60px;
+ padding-top: 160px;
+}
+
+.android-sub-slogan {
+ font-size: 21px;
+ padding-top: 24px;
+}
+
+.android-create-character {
+ font-size: 21px;
+ padding-top: 400px;
+}
+
+.android-create-character a {
+ text-decoration: none;
+ color: #767777;
+ font-weight: 300;
+}
+
+.android-screen-section {
+ position: relative;
+ padding-top: 60px;
+ padding-bottom: 80px;
+}
+
+.android-screens {
+ text-align: right;
+ width: 100%;
+ white-space: nowrap;
+ overflow-x: auto;
+}
+
+.android-screen {
+ text-align: center;
+}
+
+.android-screen .android-link {
+ margin-top: 16px;
+ display: block;
+ z-index: 2;
+}
+
+.android-image-link {
+ text-decoration: none;
+}
+
+.android-wear {
+ display: inline-block;
+ width: 160px;
+ margin-right: 32px;
+}
+
+.android-wear .android-screen-image {
+ width: 40%;
+ z-index: 1;
+}
+
+.android-phone {
+ display: inline-block;
+ width: 64px;
+ margin-right: 48px;
+}
+
+.android-phone .android-screen-image {
+ width: 100%;
+ z-index: 1;
+}
+
+.android-tablet {
+ display: inline-block;
+ width: 110px;
+ margin-right: 64px;
+}
+
+.android-tablet .android-screen-image {
+ width: 100%;
+ z-index: 1;
+}
+
+.android-tablet .android-link {
+ display: block;
+ z-index: 2;
+}
+
+.android-tv {
+ display: inline-block;
+ width: 300px;
+ margin-right: 80px;
+}
+
+.android-tv .android-screen-image {
+ width: 100%;
+ z-index: 1;
+}
+
+.android-auto {
+ display: inline-block;
+ width: 300px;
+ overflow: hidden;
+}
+
+.android-auto .android-screen-image {
+ display: block;
+ height: 300px;
+ z-index: 1;
+}
+
+.android-wear-band-text p {
+ padding-top: 8px;
+}
+
+.android-link {
+ text-decoration: none;
+ color: #6ab344 !important;
+}
+
+.android-link:hover {
+ color: #6ab344 !important;
+}
+
+.android-link .material-icons {
+ position: relative;
+ top: -1px;
+ vertical-align: middle;
+}
+
+.android-alt-link {
+ text-decoration: none;
+ color: #64ffda !important;
+ font-size: 16px;
+}
+
+.android-alt-link:hover {
+ color: #00bfa5 !important;
+}
+
+.android-alt-link .material-icons {
+ position: relative;
+ top: 6px;
+}
+
+.android-customized-section {
+ text-align: center;
+}
+
+.android-customized-section-text {
+ max-width: 500px;
+ margin-left: auto;
+ margin-right: auto;
+ padding: 80px 16px 0 16px;
+}
+
+.android-customized-section-text p {
+ padding-top: 16px;
+}
+
+.android-more-section {
+ padding: 80px 0;
+ max-width: 1044px;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.android-more-section .android-section-title {
+ margin-left: 12px;
+ padding-bottom: 24px;
+}
+
+.android-card-container {
+}
+
+.android-card-container .mdl-card__media {
+ overflow: hidden;
+ background: transparent;
+}
+
+.android-card-container .mdl-card__media img {
+ width: 100%;
+}
+
+.android-card-container .mdl-card__title {
+ background: transparent;
+ height: auto;
+}
+
+.android-card-container .mdl-card__title-text {
+ color: black;
+ height: auto;
+}
+
+.android-card-container .mdl-card__supporting-text {
+ height: auto;
+ color: black;
+ padding-bottom: 56px;
+}
+
+.android-card-container .mdl-card__actions {
+ position: absolute;
+ bottom: 0;
+}
+
+.android-card-container .mdl-card__actions a {
+ border-top: none;
+ font-size: 16px;
+}
+
+.android-footer {
+ background-color: #fafafa;
+ position: relative;
+}
+
+.android-footer a:hover {
+ color: #8bc34a;
+}
+
+.android-footer .mdl-mega-footer--top-section::after {
+ border-bottom: none;
+}
+
+.android-footer .mdl-mega-footer--middle-section::after {
+ border-bottom: none;
+}
+
+.android-footer .mdl-mega-footer--bottom-section {
+ position: relative;
+}
+
+.android-footer .mdl-mega-footer--bottom-section a {
+ margin-right: 2em;
+}
+
+.android-footer .mdl-mega-footer--right-section a .material-icons {
+ position: relative;
+ top: 6px;
+}
+
+.android-link-menu:hover {
+ cursor: pointer;
+}
+
+/**** Mobile layout ****/
+
+@media (max-width: 900px) {
+ .android-navigation-container {
+ display: none;
+ }
+
+ .android-title {
+ display: none !important;
+ }
+
+ .android-mobile-title {
+ display: block !important;
+ position: absolute;
+ left: calc(50% - 70px);
+ top: 12px;
+ transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+ }
+
+ /* WebViews in iOS 9 break the "~" operator, and WebViews in OS X 10.10 break
+ consecutive "+" operators in some cases. Therefore, we need to use both
+ here to cover all the bases. */
+ .android.android-search-box.is-focused ~ .android-mobile-title,
+ .android-search-box.is-focused + .android-navigation-container + .android-mobile-title {
+ opacity: 0;
+ }
+
+ .android-more-button {
+ display: none;
+ }
+
+ .android-search-box.is-focused {
+ width: calc(100% - 48px);
+ }
+
+ .android-search-box .mdl-textfield__expandable-holder {
+ width: 100%;
+ }
+
+ .android-be-together-section {
+ height: 350px;
+ }
+
+ .android-slogan {
+ font-size: 26px;
+ margin: 0 16px;
+ padding-top: 24px;
+ }
+
+ .android-sub-slogan {
+ font-size: 16px;
+ margin: 0 16px;
+ padding-top: 8px;
+ }
+
+ .android-create-character {
+ padding-top: 200px;
+ font-size: 16px;
+ }
+
+ .android-create-character img {
+ height: 12px;
+ }
+
+ .android-fab {
+ display: none;
+ }
+
+ .android-wear-band-text {
+ margin-left: 0;
+ padding: 16px;
+ }
+
+ .android-footer .mdl-mega-footer--bottom-section {
+ display: none;
+ }
+}
+
+input[type=text]:readonly {
+ background: #e0dada;
+}
\ No newline at end of file
diff --git a/src/test.ts b/src/test.ts
new file mode 100644
index 0000000..e5cdb59
--- /dev/null
+++ b/src/test.ts
@@ -0,0 +1,54 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import 'zone.js/dist/long-stack-trace-zone';
+import 'zone.js/dist/proxy.js';
+import 'zone.js/dist/sync-test';
+import 'zone.js/dist/jasmine-patch';
+import 'zone.js/dist/async-test';
+import 'zone.js/dist/fake-async-test';
+
+import {BrowserDynamicTestingModule, platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing';
+
+import {getTestBed} from '@angular/core/testing';
+
+// Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
+declare const __karma__: any;
+declare const require: any;
+
+// Prevent Karma from running prematurely.
+__karma__.loaded = function () {
+};
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+ BrowserDynamicTestingModule,
+ platformBrowserDynamicTesting()
+);
+// Then we find all the tests.
+const context = require.context('./app', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);
+// Finally, start Karma to run the tests.
+__karma__.start();
diff --git a/src/test/java/org/openecom/appc/cdt/cdt/AppTest.java b/src/test/java/org/openecom/appc/cdt/cdt/AppTest.java
new file mode 100644
index 0000000..bdf1f4b
--- /dev/null
+++ b/src/test/java/org/openecom/appc/cdt/cdt/AppTest.java
@@ -0,0 +1,59 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+package org.openecom.appc.cdt.cdt;
+
+import junit.framework.Test;
+import junit.framework.TestCase;
+import junit.framework.TestSuite;
+
+/**
+ * Unit test for simple App.
+ */
+public class AppTest
+ extends TestCase
+{
+ /**
+ * Create the test case
+ *
+ * @param testName name of the test case
+ */
+ public AppTest( String testName )
+ {
+ super( testName );
+ }
+
+ /**
+ * @return the suite of tests being tested
+ */
+ public static Test suite()
+ {
+ return new TestSuite( AppTest.class );
+ }
+
+ /**
+ * Rigourous Test :-)
+ */
+ public void testApp()
+ {
+ assertTrue( true );
+ }
+}
diff --git a/src/tsconfig.app.json b/src/tsconfig.app.json
new file mode 100644
index 0000000..4993ee1
--- /dev/null
+++ b/src/tsconfig.app.json
@@ -0,0 +1,18 @@
+{
+ "extends": "../tsconfig.json",
+ "compilerOptions": {
+ "outDir": "../out-tsc/app",
+ "baseUrl": "./",
+ "module": "es2015",
+ "types": [
+ "node"
+ ],
+ "typeRoots": [
+ "../node_modules/@types"
+ ]
+ },
+ "exclude": [
+ "test.ts",
+ "**/*.spec.ts"
+ ]
+}
\ No newline at end of file
diff --git a/src/tsconfig.spec.json b/src/tsconfig.spec.json
new file mode 100644
index 0000000..f32f968
--- /dev/null
+++ b/src/tsconfig.spec.json
@@ -0,0 +1,20 @@
+{
+ "extends": "../tsconfig.json",
+ "compilerOptions": {
+ "outDir": "../out-tsc/spec",
+ "baseUrl": "./",
+ "module": "commonjs",
+ "target": "es5",
+ "types": [
+ "jasmine",
+ "node"
+ ]
+ },
+ "files": [
+ "test.ts"
+ ],
+ "include": [
+ "**/*.spec.ts",
+ "**/*.d.ts"
+ ]
+}
\ No newline at end of file
diff --git a/src/typings.d.ts b/src/typings.d.ts
new file mode 100644
index 0000000..c681441
--- /dev/null
+++ b/src/typings.d.ts
@@ -0,0 +1,28 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================ */
+
+/* SystemJS module definition */
+declare var module: NodeModule;
+
+interface NodeModule {
+ id: string;
+}
