From 7f357306ebf9033cfb0611af047108267bce1ad5 Mon Sep 17 00:00:00 2001 From: Sercan Yemen Date: Sun, 12 Nov 2017 22:36:14 +0300 Subject: [PATCH] Angular 5.0.1 & Angular Material 5.0.0-rc0 compatibility (wip) --- package-lock.json | 92 +++++++++---------- package.json | 32 +++---- .../material-color-picker.component.html | 2 +- .../shortcuts/shortcuts.component.html | 2 +- .../shortcuts/shortcuts.component.ts | 4 +- .../scss/partials/_angular-material-fix.scss | 5 + .../sidenavs/left/chats/chats.component.html | 8 +- .../sidenavs/left/user/user.component.html | 5 +- .../right/contact/contact.component.html | 10 +- .../contact-form/contact-form.component.html | 4 +- .../contact-list/contact-list.component.ts | 51 ++++++---- .../e-commerce/product/product.component.html | 4 +- .../board/dialogs/card/card.component.html | 2 +- .../board/dialogs/card/card.component.scss | 4 + .../todo-details/todo-details.component.ts | 32 ++++--- .../todo-list-item.component.html | 2 +- .../dialogs/article/article.component.html | 4 +- .../content/ui/colors/colors.component.html | 2 +- 18 files changed, 148 insertions(+), 117 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5279f641..0f7492fd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "fuse2", - "version": "1.2.0", + "version": "1.2.1", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -43,17 +43,17 @@ } }, "@angular/animations": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-5.0.0.tgz", - "integrity": "sha1-ta0ZnGf5P3WVREd+/+ZnnhVJkfs=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-5.0.1.tgz", + "integrity": "sha1-qSsrGGpuWjGp8VhJEd1qp+FsXeE=", "requires": { "tslib": "1.8.0" } }, "@angular/cdk": { - "version": "2.0.0-beta.12", - "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-2.0.0-beta.12.tgz", - "integrity": "sha1-OiQ8tiuT9OA5EgunD5ANyeI1Yi4=", + "version": "5.0.0-rc0", + "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-5.0.0-rc0.tgz", + "integrity": "sha512-wZg/mzHisiTieVt7Q/YNPB+r07PHvjoAT3+0mwyIP7wuC00W8BJLPhTZd/tIM5q7Nd69kuA1HSx1qLkcmlCZkw==", "requires": { "tslib": "1.8.0" } @@ -124,25 +124,25 @@ } }, "@angular/common": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/common/-/common-5.0.0.tgz", - "integrity": "sha1-+W1mpRe5ldG6mygwnxXC41lnWCU=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/common/-/common-5.0.1.tgz", + "integrity": "sha1-QwBas8i4/68Xaq+zuGupMcPkvfk=", "requires": { "tslib": "1.8.0" } }, "@angular/compiler": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-5.0.0.tgz", - "integrity": "sha1-uf+/GMijnYt9rOxHMZOpDiTMK8k=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-5.0.1.tgz", + "integrity": "sha1-f9TH+ku770wUaWL6lGuCczCmyO0=", "requires": { "tslib": "1.8.0" } }, "@angular/compiler-cli": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-5.0.0.tgz", - "integrity": "sha1-Dsu5N9hKT43ZTwwqR7B9LkaUyFM=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-5.0.1.tgz", + "integrity": "sha1-Um3BuzlPsWrZFmAe6pqgDrRLT/8=", "dev": true, "requires": { "chokidar": "1.7.0", @@ -152,9 +152,9 @@ } }, "@angular/core": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/core/-/core-5.0.0.tgz", - "integrity": "sha1-T5dqIl993fNJkvLK2CTJVDpG9Mg=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/core/-/core-5.0.1.tgz", + "integrity": "sha1-pKdK/H4gWNMLgmPrbWbarOn0J7o=", "requires": { "tslib": "1.8.0" } @@ -168,55 +168,55 @@ } }, "@angular/forms": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-5.0.0.tgz", - "integrity": "sha1-x/3fo1OWdZrphSkgowzdqMQe0d4=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-5.0.1.tgz", + "integrity": "sha1-afMDxME9o8qg3mNDdYg4i2rWKyE=", "requires": { "tslib": "1.8.0" } }, "@angular/http": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/http/-/http-5.0.0.tgz", - "integrity": "sha1-Byiivgz7sHhyfF64fUyF1T/smlE=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/http/-/http-5.0.1.tgz", + "integrity": "sha1-NQy99jz6yJOWE9dT/wce1YpgVhs=", "requires": { "tslib": "1.8.0" } }, "@angular/language-service": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-5.0.0.tgz", - "integrity": "sha1-bMu2n0dXJw3QTsWFfTdjSy8CxAw=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-5.0.1.tgz", + "integrity": "sha1-hp4J29bj2VwRfAYtId0f2SCtRNY=", "dev": true }, "@angular/material": { - "version": "2.0.0-beta.12", - "resolved": "https://registry.npmjs.org/@angular/material/-/material-2.0.0-beta.12.tgz", - "integrity": "sha1-cbbQt7AhiR5dDjaIwdS9eMdFf1g=", + "version": "5.0.0-rc0", + "resolved": "https://registry.npmjs.org/@angular/material/-/material-5.0.0-rc0.tgz", + "integrity": "sha512-ZW9gy3c8l2NbFfX9DRYSW+i67pPoL9DZoMCb16STQlhdDfwwAWNpjGF0etXkXw30hDnRCMGVVJVU+45cNXJspA==", "requires": { "tslib": "1.8.0" } }, "@angular/platform-browser": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.0.0.tgz", - "integrity": "sha1-xwOPfN6AcFtiAUiXIx4YLuyXb+0=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.0.1.tgz", + "integrity": "sha1-FIld0w7Sow7nuZx2t2R0j0bBqGI=", "requires": { "tslib": "1.8.0" } }, "@angular/platform-browser-dynamic": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-5.0.0.tgz", - "integrity": "sha1-iH4QbIsQOwQVz2FWpCXabYP0yJ0=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-5.0.1.tgz", + "integrity": "sha1-Fttn1S1FMVY6sVQpxr3+GLwb7cg=", "requires": { "tslib": "1.8.0" } }, "@angular/router": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@angular/router/-/router-5.0.0.tgz", - "integrity": "sha1-/ktSGmc4QIvOMPk6U0mRQMk6T3Y=", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@angular/router/-/router-5.0.1.tgz", + "integrity": "sha1-msCPKTAu9gzf08eBDZbCZd7EY9Y=", "requires": { "tslib": "1.8.0" } @@ -268,9 +268,9 @@ "integrity": "sha512-918ksaRl8RvGWGOjpUCywTS1MnLTqHki53XXibyhZkmHGSP5yLkcArBAFhFLvtQTTbuX8KSz2WFKxwaJ3JuJFw==" }, "@swimlane/ngx-datatable": { - "version": "10.4.0", - "resolved": "https://registry.npmjs.org/@swimlane/ngx-datatable/-/ngx-datatable-10.4.0.tgz", - "integrity": "sha512-wTV/64vEGPFlcpE+ezTN18baOsNXyfLLvdmhEoaDQt2OJtTKtNxJkze24w71utoJxutQRrfHJUVSkAF4CLNckA==" + "version": "11.0.3", + "resolved": "https://registry.npmjs.org/@swimlane/ngx-datatable/-/ngx-datatable-11.0.3.tgz", + "integrity": "sha512-feJ9Ep0xddgC1IuNEqxWcTnoSPc3drzY+Bn27RFq+ztXYf3mHsLMxerMqFyVaLPnMrZKttZ7MX48gXzOkSVavw==" }, "@types/jasmine": { "version": "2.5.54", @@ -6425,9 +6425,9 @@ } }, "moment": { - "version": "2.19.1", - "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.1.tgz", - "integrity": "sha1-VtoaLRy/AdOLfhr8McELz6GSkWc=" + "version": "2.19.2", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.2.tgz", + "integrity": "sha512-Rf6jiHPEfxp9+dlzxPTmRHbvoFXsh2L/U8hOupUMpnuecHQmI6cF6lUbJl3QqKPko1u6ujO+FxtcajLVfLpAtA==" }, "move-concurrently": { "version": "1.0.1", diff --git a/package.json b/package.json index 5be767e7..2002adad 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fuse2", - "version": "1.2.0", + "version": "1.2.1", "license": "", "scripts": { "ng": "ng", @@ -16,21 +16,21 @@ "private": true, "dependencies": { "@agm/core": "1.0.0-beta.2", - "@angular/animations": "5.0.0", - "@angular/cdk": "2.0.0-beta.12", - "@angular/common": "5.0.0", - "@angular/compiler": "5.0.0", - "@angular/core": "5.0.0", + "@angular/animations": "5.0.1", + "@angular/cdk": "5.0.0-rc0", + "@angular/common": "5.0.1", + "@angular/compiler": "5.0.1", + "@angular/core": "5.0.1", "@angular/flex-layout": "2.0.0-beta.10", - "@angular/forms": "5.0.0", - "@angular/http": "5.0.0", - "@angular/material": "2.0.0-beta.12", - "@angular/platform-browser": "5.0.0", - "@angular/platform-browser-dynamic": "5.0.0", - "@angular/router": "5.0.0", + "@angular/forms": "5.0.1", + "@angular/http": "5.0.1", + "@angular/material": "5.0.0-rc0", + "@angular/platform-browser": "5.0.1", + "@angular/platform-browser-dynamic": "5.0.1", + "@angular/router": "5.0.1", "@ngx-translate/core": "8.0.0", "@swimlane/ngx-charts": "6.1.0", - "@swimlane/ngx-datatable": "10.4.0", + "@swimlane/ngx-datatable": "11.0.3", "@withinpixels/ngx-dnd": "3.1.0", "angular-calendar": "0.21.3", "angular-in-memory-web-api": "0.5.1", @@ -41,7 +41,7 @@ "hammerjs": "2.0.8", "highlight.js": "9.12.0", "intl": "1.2.5", - "moment": "2.19.1", + "moment": "2.19.2", "ngx-color-picker": "4.4.0", "ngx-cookie-service": "1.0.9", "perfect-scrollbar": "1.0.3", @@ -51,8 +51,8 @@ }, "devDependencies": { "@angular/cli": "1.5.0", - "@angular/compiler-cli": "5.0.0", - "@angular/language-service": "5.0.0", + "@angular/compiler-cli": "5.0.1", + "@angular/language-service": "5.0.1", "@angularclass/hmr": "2.1.3", "@types/jasmine": "2.5.54", "@types/jasminewd2": "2.0.3", diff --git a/src/app/core/components/material-color-picker/material-color-picker.component.html b/src/app/core/components/material-color-picker/material-color-picker.component.html index a1209174..447939ca 100644 --- a/src/app/core/components/material-color-picker/material-color-picker.component.html +++ b/src/app/core/components/material-color-picker/material-color-picker.component.html @@ -2,7 +2,7 @@ type="button" class="mat-elevation-z1" [matMenuTriggerFor]="colorMenu" - (onMenuOpen)="onMenuOpen()" + (menuOpened)="onMenuOpen()" [ngClass]="'mat-'+selectedPalette+'-'+selectedHue+'-bg'"> palette diff --git a/src/app/core/components/shortcuts/shortcuts.component.html b/src/app/core/components/shortcuts/shortcuts.component.html index 109418ca..28e2cb91 100644 --- a/src/app/core/components/shortcuts/shortcuts.component.html +++ b/src/app/core/components/shortcuts/shortcuts.component.html @@ -26,7 +26,7 @@ diff --git a/src/app/core/components/shortcuts/shortcuts.component.ts b/src/app/core/components/shortcuts/shortcuts.component.ts index fd6f9652..a1479f1d 100644 --- a/src/app/core/components/shortcuts/shortcuts.component.ts +++ b/src/app/core/components/shortcuts/shortcuts.component.ts @@ -149,7 +149,9 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy onMenuOpen() { - this.searchInputField.nativeElement.focus(); + setTimeout(() => { + this.searchInputField.nativeElement.focus(); + }); } showMobileShortcutsPanel() diff --git a/src/app/core/scss/partials/_angular-material-fix.scss b/src/app/core/scss/partials/_angular-material-fix.scss index 45cc656e..b2905936 100644 --- a/src/app/core/scss/partials/_angular-material-fix.scss +++ b/src/app/core/scss/partials/_angular-material-fix.scss @@ -59,3 +59,8 @@ mat-sidenav-container { width: 14px; height: 7px; } + +// Fix: "Input underlines has wrong color opacity value" +.mat-form-field-underline { + background-color: rgba(0, 0, 0, 0.12); +} diff --git a/src/app/main/content/apps/chat/sidenavs/left/chats/chats.component.html b/src/app/main/content/apps/chat/sidenavs/left/chats/chats.component.html index af3a7af4..3bfbe1de 100644 --- a/src/app/main/content/apps/chat/sidenavs/left/chats/chats.component.html +++ b/src/app/main/content/apps/chat/sidenavs/left/chats/chats.component.html @@ -4,7 +4,7 @@ -
+
@@ -16,7 +16,8 @@ alt="{{user.name}}"/> - + @@ -69,7 +70,8 @@
-
+ + diff --git a/src/app/main/content/apps/chat/sidenavs/left/user/user.component.html b/src/app/main/content/apps/chat/sidenavs/left/user/user.component.html index a5143176..d5d5c4e2 100644 --- a/src/app/main/content/apps/chat/sidenavs/left/user/user.component.html +++ b/src/app/main/content/apps/chat/sidenavs/left/user/user.component.html @@ -5,20 +5,19 @@ -
+ -
+ {{user.name}} -
{{user.name}}
 diff --git a/src/app/main/content/apps/chat/sidenavs/right/contact/contact.component.html b/src/app/main/content/apps/chat/sidenavs/right/contact/contact.component.html index 2aadbfca..5a15f6c9 100644 --- a/src/app/main/content/apps/chat/sidenavs/right/contact/contact.component.html +++ b/src/app/main/content/apps/chat/sidenavs/right/contact/contact.component.html @@ -5,7 +5,7 @@ -
+
Contact Info
@@ -13,7 +13,7 @@ close -
+ @@ -37,9 +37,9 @@ - + diff --git a/src/app/main/content/apps/contacts/contact-form/contact-form.component.html b/src/app/main/content/apps/contacts/contact-form/contact-form.component.html index d0bb4b12..ada9a9ff 100644 --- a/src/app/main/content/apps/contacts/contact-form/contact-form.component.html +++ b/src/app/main/content/apps/contacts/contact-form/contact-form.component.html @@ -1,13 +1,13 @@
-
+ {{dialogTitle}} -
+ ; @@ -25,6 +26,10 @@ export class FuseContactsContactListComponent implements OnInit selectedContacts: any[]; checkboxes: {}; + onContactsChangedSubscription: Subscription; + onSelectedContactsChangedSubscription: Subscription; + onUserDataChangedSubscription: Subscription; + dialogRef: any; confirmDialogRef: MatDialogRef; @@ -34,27 +39,30 @@ export class FuseContactsContactListComponent implements OnInit public dialog: MatDialog ) { - this.contactsService.onContactsChanged.subscribe(contacts => { + this.onContactsChangedSubscription = + this.contactsService.onContactsChanged.subscribe(contacts => { - this.contacts = contacts; + this.contacts = contacts; - this.checkboxes = {}; - contacts.map(contact => { - this.checkboxes[contact.id] = false; + this.checkboxes = {}; + contacts.map(contact => { + this.checkboxes[contact.id] = false; + }); }); - }); - this.contactsService.onSelectedContactsChanged.subscribe(selectedContacts => { - for ( const id in this.checkboxes ) - { - this.checkboxes[id] = selectedContacts.includes(id); - } - this.selectedContacts = selectedContacts; - }); + this.onSelectedContactsChangedSubscription = + this.contactsService.onSelectedContactsChanged.subscribe(selectedContacts => { + for ( const id in this.checkboxes ) + { + this.checkboxes[id] = selectedContacts.includes(id); + } + this.selectedContacts = selectedContacts; + }); - this.contactsService.onUserDataChanged.subscribe(user => { - this.user = user; - }); + this.onUserDataChangedSubscription = + this.contactsService.onUserDataChanged.subscribe(user => { + this.user = user; + }); } @@ -63,6 +71,13 @@ export class FuseContactsContactListComponent implements OnInit this.dataSource = new FilesDataSource(this.contactsService); } + ngOnDestroy() + { + this.onContactsChangedSubscription.unsubscribe(); + this.onSelectedContactsChangedSubscription.unsubscribe(); + this.onUserDataChangedSubscription.unsubscribe(); + } + editContact(contact) { this.dialogRef = this.dialog.open(FuseContactsContactFormDialogComponent, { diff --git a/src/app/main/content/apps/e-commerce/product/product.component.html b/src/app/main/content/apps/e-commerce/product/product.component.html index b8aaabb9..8272e994 100644 --- a/src/app/main/content/apps/e-commerce/product/product.component.html +++ b/src/app/main/content/apps/e-commerce/product/product.component.html @@ -90,7 +90,7 @@ formControlName="categories"> + removable="true" (removed)="product.removeCategory(category)"> {{category}} cancel @@ -109,7 +109,7 @@ formControlName="tags"> + removable="true" (removed)="product.removeTag(tag)"> {{tag}} cancel diff --git a/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html b/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html index 9d3fba0e..3aae2b7d 100644 --- a/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html +++ b/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html @@ -71,7 +71,7 @@
- diff --git a/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.scss b/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.scss index 24f0a2fa..9f1c36b9 100644 --- a/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.scss +++ b/src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.scss @@ -20,6 +20,10 @@ .mat-form-field-flex { align-items: center; + .mat-form-field-infix { + display: none; + } + .mat-input-element { display: none; } diff --git a/src/app/main/content/apps/todo/todo-details/todo-details.component.ts b/src/app/main/content/apps/todo/todo-details/todo-details.component.ts index 1a82ca19..07e150c1 100644 --- a/src/app/main/content/apps/todo/todo-details/todo-details.component.ts +++ b/src/app/main/content/apps/todo/todo-details/todo-details.component.ts @@ -48,12 +48,13 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy this.todoForm = this.createTodoForm(); - this.onFormChange = this.todoForm.valueChanges - .debounceTime(500) - .distinctUntilChanged() - .subscribe(data => { - this.todoService.updateTodo(data); - }); + this.onFormChange = + this.todoForm.valueChanges + .debounceTime(500) + .distinctUntilChanged() + .subscribe(data => { + this.todoService.updateTodo(data); + }); } }); @@ -65,15 +66,16 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy }); // Subscribe to update on tag change - this.onNewTodoClicked = this.todoService.onNewTodoClicked - .subscribe(() => { - this.todo = new Todo({}); - this.todo.id = FuseUtils.generateGUID(); - this.formType = 'new'; - this.todoForm = this.createTodoForm(); - this.focusTitleField(); - this.todoService.onCurrentTodoChanged.next([this.todo, 'new']); - }); + this.onNewTodoClicked = + this.todoService.onNewTodoClicked + .subscribe(() => { + this.todo = new Todo({}); + this.todo.id = FuseUtils.generateGUID(); + this.formType = 'new'; + this.todoForm = this.createTodoForm(); + this.focusTitleField(); + this.todoService.onCurrentTodoChanged.next([this.todo, 'new']); + }); } focusTitleField() diff --git a/src/app/main/content/apps/todo/todo-list/todo-list-item/todo-list-item.component.html b/src/app/main/content/apps/todo/todo-list/todo-list-item/todo-list-item.component.html index c0020501..5bc16197 100644 --- a/src/app/main/content/apps/todo/todo-list/todo-list-item/todo-list-item.component.html +++ b/src/app/main/content/apps/todo/todo-list/todo-list-item/todo-list-item.component.html @@ -5,7 +5,7 @@ + class="mr-16" fxFlex="0 1 auto" (click)="$event.stopPropagation()">
diff --git a/src/app/main/content/pages/knowledge-base/dialogs/article/article.component.html b/src/app/main/content/pages/knowledge-base/dialogs/article/article.component.html index e276fbd2..ea2f2006 100644 --- a/src/app/main/content/pages/knowledge-base/dialogs/article/article.component.html +++ b/src/app/main/content/pages/knowledge-base/dialogs/article/article.component.html @@ -1,7 +1,9 @@
- {{data.article.title}} + + {{data.article.title}} +
diff --git a/src/app/main/content/ui/colors/colors.component.html b/src/app/main/content/ui/colors/colors.component.html index ba0d558c..50e848a4 100644 --- a/src/app/main/content/ui/colors/colors.component.html +++ b/src/app/main/content/ui/colors/colors.component.html @@ -25,7 +25,7 @@
- +