Commit d66a3febfe31418346b7b1c915dce0016917b9f3
1 parent
9eec8c0b
Improve widget initialization logic.
Showing
2 changed files
with
62 additions
and
39 deletions
... | ... | @@ -353,28 +353,30 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
353 | 353 | } |
354 | 354 | |
355 | 355 | private onDestroy() { |
356 | - for (const id of Object.keys(this.widgetContext.subscriptions)) { | |
357 | - const subscription = this.widgetContext.subscriptions[id]; | |
358 | - subscription.destroy(); | |
359 | - } | |
360 | - this.subscriptionInited = false; | |
361 | - this.widgetContext.subscriptions = {}; | |
362 | - if (this.widgetContext.inited) { | |
363 | - this.widgetContext.inited = false; | |
364 | - for (const cafId of Object.keys(this.cafs)) { | |
365 | - if (this.cafs[cafId]) { | |
366 | - this.cafs[cafId](); | |
367 | - this.cafs[cafId] = null; | |
368 | - } | |
356 | + if (this.widgetContext) { | |
357 | + for (const id of Object.keys(this.widgetContext.subscriptions)) { | |
358 | + const subscription = this.widgetContext.subscriptions[id]; | |
359 | + subscription.destroy(); | |
369 | 360 | } |
370 | - try { | |
371 | - this.widgetTypeInstance.onDestroy(); | |
372 | - } catch (e) { | |
373 | - this.handleWidgetException(e); | |
361 | + this.subscriptionInited = false; | |
362 | + this.widgetContext.subscriptions = {}; | |
363 | + if (this.widgetContext.inited) { | |
364 | + this.widgetContext.inited = false; | |
365 | + for (const cafId of Object.keys(this.cafs)) { | |
366 | + if (this.cafs[cafId]) { | |
367 | + this.cafs[cafId](); | |
368 | + this.cafs[cafId] = null; | |
369 | + } | |
370 | + } | |
371 | + try { | |
372 | + this.widgetTypeInstance.onDestroy(); | |
373 | + } catch (e) { | |
374 | + this.handleWidgetException(e); | |
375 | + } | |
374 | 376 | } |
377 | + this.widgetContext.destroyed = true; | |
378 | + this.destroyDynamicWidgetComponent(); | |
375 | 379 | } |
376 | - this.widgetContext.destroyed = true; | |
377 | - this.destroyDynamicWidgetComponent(); | |
378 | 380 | } |
379 | 381 | |
380 | 382 | public onTimewindowChanged(timewindow: Timewindow) { |
... | ... | @@ -432,7 +434,6 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
432 | 434 | |
433 | 435 | this.initialize().subscribe( |
434 | 436 | () => { |
435 | - this.detectChanges(); | |
436 | 437 | this.onInit(); |
437 | 438 | }, |
438 | 439 | (err) => { |
... | ... | @@ -443,7 +444,11 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
443 | 444 | |
444 | 445 | private detectChanges() { |
445 | 446 | if (!this.destroyed) { |
446 | - this.cd.detectChanges(); | |
447 | + try { | |
448 | + this.cd.detectChanges(); | |
449 | + } catch (e) { | |
450 | + // console.log(e); | |
451 | + } | |
447 | 452 | } |
448 | 453 | } |
449 | 454 | |
... | ... | @@ -467,6 +472,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
467 | 472 | this.cafs.init = this.raf.raf(() => { |
468 | 473 | try { |
469 | 474 | this.widgetTypeInstance.onInit(); |
475 | + this.detectChanges(); | |
470 | 476 | } catch (e) { |
471 | 477 | this.handleWidgetException(e); |
472 | 478 | } |
... | ... | @@ -558,7 +564,6 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
558 | 564 | this.widgetContext.reset(); |
559 | 565 | this.subscriptionInited = true; |
560 | 566 | this.configureDynamicWidgetComponent(); |
561 | - this.detectChanges(); | |
562 | 567 | this.onInit(); |
563 | 568 | } |
564 | 569 | }, |
... | ... | @@ -576,7 +581,6 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
576 | 581 | this.widgetContext.reset(); |
577 | 582 | this.subscriptionInited = true; |
578 | 583 | this.configureDynamicWidgetComponent(); |
579 | - this.detectChanges(); | |
580 | 584 | this.onInit(); |
581 | 585 | } |
582 | 586 | } |
... | ... | @@ -637,12 +641,14 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
637 | 641 | } |
638 | 642 | if (this.dynamicWidgetComponentRef) { |
639 | 643 | this.dynamicWidgetComponentRef.destroy(); |
644 | + this.dynamicWidgetComponentRef = null; | |
640 | 645 | } |
641 | 646 | } |
642 | 647 | |
643 | 648 | private handleWidgetException(e) { |
644 | 649 | console.error(e); |
645 | 650 | this.widgetErrorData = this.utils.processWidgetException(e); |
651 | + this.detectChanges(); | |
646 | 652 | } |
647 | 653 | |
648 | 654 | private configureDynamicWidgetComponent() { |
... | ... | @@ -662,22 +668,31 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
662 | 668 | parent: this.injector |
663 | 669 | } |
664 | 670 | ); |
665 | - this.dynamicWidgetComponentRef = this.widgetContentContainer.createComponent(this.widgetInfo.componentFactory, 0, injector); | |
666 | - | |
667 | - this.dynamicWidgetComponent = this.dynamicWidgetComponentRef.instance; | |
668 | 671 | |
669 | 672 | const containerElement = $(this.elementRef.nativeElement.querySelector('#widget-container')); |
670 | - | |
671 | - // this.widgetContext.$container = $('> ng-component:not([id="container"])', containerElement); | |
672 | - this.widgetContext.$container = $(this.dynamicWidgetComponentRef.location.nativeElement); | |
673 | - this.widgetContext.$container.css('display', 'block'); | |
674 | - this.widgetContext.$container.css('user-select', 'none'); | |
675 | - this.widgetContext.$container.attr('id', 'container'); | |
676 | 673 | this.widgetContext.$containerParent = $(containerElement); |
677 | 674 | |
678 | - if (this.widgetSizeDetected) { | |
679 | - this.widgetContext.$container.css('height', this.widgetContext.height + 'px'); | |
680 | - this.widgetContext.$container.css('width', this.widgetContext.width + 'px'); | |
675 | + try { | |
676 | + this.dynamicWidgetComponentRef = this.widgetContentContainer.createComponent(this.widgetInfo.componentFactory, 0, injector); | |
677 | + this.cd.detectChanges(); | |
678 | + } catch (e) { | |
679 | + if (this.dynamicWidgetComponentRef) { | |
680 | + this.dynamicWidgetComponentRef.destroy(); | |
681 | + this.dynamicWidgetComponentRef = null; | |
682 | + } | |
683 | + this.widgetContentContainer.clear(); | |
684 | + } | |
685 | + | |
686 | + if (this.dynamicWidgetComponentRef) { | |
687 | + this.dynamicWidgetComponent = this.dynamicWidgetComponentRef.instance; | |
688 | + this.widgetContext.$container = $(this.dynamicWidgetComponentRef.location.nativeElement); | |
689 | + this.widgetContext.$container.css('display', 'block'); | |
690 | + this.widgetContext.$container.css('user-select', 'none'); | |
691 | + this.widgetContext.$container.attr('id', 'container'); | |
692 | + if (this.widgetSizeDetected) { | |
693 | + this.widgetContext.$container.css('height', this.widgetContext.height + 'px'); | |
694 | + this.widgetContext.$container.css('width', this.widgetContext.width + 'px'); | |
695 | + } | |
681 | 696 | } |
682 | 697 | |
683 | 698 | this.onResizeListener = this.onResize.bind(this); |
... | ... | @@ -765,7 +780,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
765 | 780 | options.units = this.widgetContext.units; |
766 | 781 | options.callbacks = { |
767 | 782 | onDataUpdated: () => { |
768 | - this.widgetTypeInstance.onDataUpdated(); | |
783 | + try { | |
784 | + this.widgetTypeInstance.onDataUpdated(); | |
785 | + } catch (e){} | |
769 | 786 | }, |
770 | 787 | onDataUpdateError: (subscription, e) => { |
771 | 788 | this.handleWidgetException(e); |
... | ... | @@ -1091,8 +1108,10 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI |
1091 | 1108 | if (!this.widgetContext.width || this.widgetContext.width !== width || |
1092 | 1109 | !this.widgetContext.height || this.widgetContext.height !== height) { |
1093 | 1110 | if (width > 0 && height > 0) { |
1094 | - this.widgetContext.$container.css('height', height + 'px'); | |
1095 | - this.widgetContext.$container.css('width', width + 'px'); | |
1111 | + if (this.widgetContext.$container) { | |
1112 | + this.widgetContext.$container.css('height', height + 'px'); | |
1113 | + this.widgetContext.$container.css('width', width + 'px'); | |
1114 | + } | |
1096 | 1115 | this.widgetContext.width = width; |
1097 | 1116 | this.widgetContext.height = height; |
1098 | 1117 | sizeChanged = true; | ... | ... |
... | ... | @@ -190,7 +190,11 @@ export class WidgetContext { |
190 | 190 | if (updateWidgetParams) { |
191 | 191 | this.dashboardWidget.updateWidgetParams(); |
192 | 192 | } |
193 | - this.changeDetectorValue.detectChanges(); | |
193 | + try { | |
194 | + this.changeDetectorValue.detectChanges(); | |
195 | + } catch (e) { | |
196 | + // console.log(e); | |
197 | + } | |
194 | 198 | } |
195 | 199 | } |
196 | 200 | ... | ... |