Skip to content

Commit 901f11b

Browse files
committed
Merge pull request #30 from dkamburov/master
Fix issue with content widgets
2 parents 36d3944 + 234656c commit 901f11b

File tree

5 files changed

+113
-108
lines changed

5 files changed

+113
-108
lines changed

samples/igDialog/igDialog.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,17 @@
66
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
77
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet" />
88
<!-- 1. Load libraries -->
9-
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
9+
<script src="http://code.jquery.com/jquery-1.12.3.js"></script>
1010
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
11-
<!-- IE required polyfills, in this exact order -->
11+
<!-- IE required polyfills, in this exact order -->
1212
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
1313
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
14-
<script src="https://npmcdn.com/[email protected].0/es6/dev/src/testing/shims_for_IE.js"></script>
15-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
14+
<script src="https://npmcdn.com/[email protected].14/es6/dev/src/testing/shims_for_IE.js"></script>
15+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2-polyfills.js"></script>
1616
<script src="https://code.angularjs.org/tools/system.js"></script>
1717
<script src="https://code.angularjs.org/tools/typescript.js"></script>
18-
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
19-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>
18+
<script src="https://code.angularjs.org/2.0.0-beta.14/Rx.js"></script>
19+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2.dev.js"></script>
2020
<!-- Ignite UI Required Combined JavaScript Files -->
2121
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
2222
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>

samples/igHtmlEditor/igHtmlEditor.html

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,21 @@
33
<head>
44
<title>HTML Editor - Ignite UI integration with AngularJS</title>
55
<!-- Ignite UI Required Combined CSS Files -->
6+
<!-- Ignite UI Required Combined CSS Files -->
67
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
78
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet" />
89
<!-- 1. Load libraries -->
9-
10-
11-
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
12-
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
10+
<script src="http://code.jquery.com/jquery-1.12.3.js"></script>
11+
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
1312
<!-- IE required polyfills, in this exact order -->
1413
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
1514
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
16-
<script src="https://npmcdn.com/[email protected]/es6/dev/src/testing/shims_for_IE.js"></script>
17-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
15+
<script src="https://npmcdn.com/[email protected]/es6/dev/src/testing/shims_for_IE.js"></script>
16+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2-polyfills.js"></script>
1817
<script src="https://code.angularjs.org/tools/system.js"></script>
1918
<script src="https://code.angularjs.org/tools/typescript.js"></script>
20-
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
21-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>
19+
<script src="https://code.angularjs.org/2.0.0-beta.14/Rx.js"></script>
20+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2.dev.js"></script>
2221
<!-- Ignite UI Required Combined JavaScript Files -->
2322
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
2423
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>

samples/igLayoutManager/igLayoutManager.html

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,17 @@
66
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
77
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet" />
88
<!-- 1. Load libraries -->
9-
10-
11-
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
12-
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
9+
<script src="http://code.jquery.com/jquery-1.12.3.js"></script>
10+
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
1311
<!-- IE required polyfills, in this exact order -->
1412
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.0/es6-shim.min.js"></script>
1513
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.20/system-polyfills.js"></script>
16-
<script src="https://npmcdn.com/[email protected].0/es6/dev/src/testing/shims_for_IE.js"></script>
17-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
14+
<script src="https://npmcdn.com/[email protected].14/es6/dev/src/testing/shims_for_IE.js"></script>
15+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2-polyfills.js"></script>
1816
<script src="https://code.angularjs.org/tools/system.js"></script>
1917
<script src="https://code.angularjs.org/tools/typescript.js"></script>
20-
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.js"></script>
21-
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2.dev.js"></script>
18+
<script src="https://code.angularjs.org/2.0.0-beta.14/Rx.js"></script>
19+
<script src="https://code.angularjs.org/2.0.0-beta.14/angular2.dev.js"></script>
2220
<!-- Ignite UI Required Combined JavaScript Files -->
2321
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
2422
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>

src/igniteui.angular2.ts

Lines changed: 74 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -96,8 +96,8 @@ export class IgControlBase<Model> implements DoCheck {
9696
protected _differ: any;
9797
protected _config: any;
9898
protected _events: Map<string, string>;
99-
protected _allowChangeDetection = true;
100-
99+
protected _allowChangeDetection = true;
100+
101101
@Input() set options(v: Model) {
102102
this._config = v;
103103
this._differ = this._differs.find([]).create(null);
@@ -107,7 +107,7 @@ export class IgControlBase<Model> implements DoCheck {
107107
}
108108
};
109109
@Input() widgetId: string;
110-
@Input() changeDetectionInterval:number;
110+
@Input() changeDetectionInterval:number;
111111

112112
constructor(el: ElementRef, renderer: Renderer, differs: IterableDiffers) {
113113
this._differs = differs;
@@ -117,7 +117,7 @@ export class IgControlBase<Model> implements DoCheck {
117117
for (var propt in jQuery.ui[this._widgetName].prototype.events) {
118118
this[propt] = new EventEmitter();
119119
}
120-
120+
121121
}
122122

123123
ngOnInit() {
@@ -134,24 +134,24 @@ export class IgControlBase<Model> implements DoCheck {
134134
that[that._events[evt.type]].emit({ event: evt, ui: ui });
135135
});
136136
}
137-
138-
if(this.changeDetectionInterval === undefined || this.changeDetectionInterval === null){
139-
this.changeDetectionInterval= 500;
140-
}
141-
142-
setInterval(function(){
143-
that._allowChangeDetection = true;
144-
},this.changeDetectionInterval);
137+
138+
if(this.changeDetectionInterval === undefined || this.changeDetectionInterval === null){
139+
this.changeDetectionInterval= 500;
140+
}
141+
142+
setInterval(function(){
143+
that._allowChangeDetection = true;
144+
},this.changeDetectionInterval);
145145

146146
jQuery(this._el).attr("id", this.widgetId);
147147
jQuery(this._el)[this._widgetName](this._config);
148148
}
149149

150150
ngDoCheck() {
151-
if(this._allowChangeDetection){
152-
this._allowChangeDetection = false;
153-
this.optionChange();
154-
}
151+
if(this._allowChangeDetection){
152+
this._allowChangeDetection = false;
153+
this.optionChange();
154+
}
155155
}
156156

157157
optionChange() {
@@ -276,9 +276,9 @@ export class IgControlBase<Model> implements DoCheck {
276276
export class IgGridBase<Model> extends IgControlBase<Model> {
277277
protected _dataSource: any;
278278
protected _changes: any;
279-
279+
280280
constructor(el: ElementRef, renderer: Renderer, differs: IterableDiffers) { super(el, renderer, differs); }
281-
281+
282282
ngOnInit() {
283283
super.ngOnInit();
284284
this._dataSource = JSON.parse(JSON.stringify(this._config.dataSource));
@@ -291,7 +291,7 @@ export class IgGridBase<Model> extends IgControlBase<Model> {
291291
if (tr.length > 0) {
292292
tr.remove();
293293
jQuery(this._el).data(this._widgetName).dataSource.deleteRow(id, true);
294-
jQuery(this._el).data(this._widgetName).dataSource._removeTransactionsByRecordId(id);
294+
jQuery(this._el).data(this._widgetName).dataSource._removeTransactionsByRecordId(id);
295295
}
296296
}
297297

@@ -323,14 +323,14 @@ export class IgGridBase<Model> extends IgControlBase<Model> {
323323
}
324324

325325
ngDoCheck() {
326-
if (this._differ != null && this._allowChangeDetection) {
327-
this.optionChange();
328-
this._allowChangeDetection = false;
326+
if (this._differ != null && this._allowChangeDetection) {
327+
this.optionChange();
328+
this._allowChangeDetection = false;
329329
var diff = [],
330330
element = jQuery(this._el),
331331
grid = element.data(this._widgetName),
332332
colIndex, td, i, j, pkKey = this._config.primaryKey, newFormattedVal, record, column;
333-
333+
334334
//check for changes in collection
335335
this._changes = this._differ.diff(this._config.dataSource);
336336
if (this._config.dataSource.length !== this._dataSource.length) {
@@ -379,30 +379,30 @@ export class IgTreeGridComponent extends IgGridBase<IgTreeGrid> {
379379
deleteRow(id) {
380380
var element = jQuery(this._el),
381381
tr = element.find("tr[data-id='" + id + "']"),
382-
dataLevel = tr.attr("aria-level");
382+
dataLevel = tr.attr("aria-level");
383383
if (tr.length > 0) {
384384

385385
element.data(this._widgetName).dataSource.deleteRow(id, true);
386386
element.data(this._widgetName).dataSource._removeTransactionsByRecordId(id);
387387

388388
var trs = tr.nextUntil("tr[data-level="+dataLevel+"]");
389-
if(trs.length === 0){
390-
trs = tr.nextAll("tr[data-level]");
391-
}
392-
393-
tr.remove();
394-
trs.remove();
389+
if(trs.length === 0){
390+
trs = tr.nextAll("tr[data-level]");
391+
}
392+
393+
tr.remove();
394+
trs.remove();
395395
}
396396
}
397-
ngDoCheck() {
398-
if (this._differ != null && this._allowChangeDetection) {
399-
this.optionChange();
400-
this._allowChangeDetection = false;
397+
ngDoCheck() {
398+
if (this._differ != null && this._allowChangeDetection) {
399+
this.optionChange();
400+
this._allowChangeDetection = false;
401401
var diff = [],
402402
element = jQuery(this._el),
403403
grid = element.data(this._widgetName),
404404
colIndex, td, i, j, pkKey = this._config.primaryKey, newFormattedVal, record, column;
405-
405+
406406
//check for changes in collection
407407
this._changes = this._differ.diff(this._config.dataSource);
408408
if (this._config.dataSource.length !== this._dataSource.length) {
@@ -432,9 +432,9 @@ export class IgTreeGridComponent extends IgGridBase<IgTreeGrid> {
432432
grid.dataSource.updateRow(record[pkKey], record);
433433
grid.dataSource._commitTransactionsByRowId(record[pkKey]);
434434
} else if(diff[i].txlog[j].key === this._config.childDataKey){
435-
//we have an hierarchical data source and one of the nested collections has changed.
436-
grid.dataBind();
437-
}
435+
//we have an hierarchical data source and one of the nested collections has changed.
436+
grid.dataBind();
437+
}
438438
}
439439
}
440440
}
@@ -462,7 +462,7 @@ export class IgHierarchicalGridComponent extends IgGridBase<IgHierarchicalGrid>
462462
ngDoCheck() {
463463
this.optionChange();
464464
if (this._differ != null && this._allowChangeDetection) {
465-
this._allowChangeDetection = false;
465+
this._allowChangeDetection = false;
466466
var diff = [],
467467
element = jQuery(this._el),
468468
colIndex, td, i, j, pkKey = this._config.primaryKey, newFormattedVal, record, column,
@@ -478,7 +478,7 @@ export class IgHierarchicalGridComponent extends IgGridBase<IgHierarchicalGrid>
478478
this._changes.forEachRemovedItem(r => this.deleteRow(r.item[pkKey]))
479479
}
480480
}
481-
//check for changes in data source values
481+
//check for changes in data source values
482482
if (!this.equalsDiff(this._config.dataSource, this._dataSource, diff)) {
483483
this._dataSource = JSON.parse(JSON.stringify(this._config.dataSource));
484484
for (i = 0; i < diff.length; i++) {
@@ -487,8 +487,8 @@ export class IgHierarchicalGridComponent extends IgGridBase<IgHierarchicalGrid>
487487
var parentRow = jQuery(this.element).closest('tr[data-container]').prev();
488488
var parentGridPK = parentRow.closest(".ui-iggrid-table").data("igGrid").options.primaryKey;
489489
return (this.options.childrenDataProperty === diff[i].txlog[j].key ||
490-
parentRow.next("[data-container]").find("table[role='grid']").attr("id").contains("_" + diff[i].txlog[j].key + "_"))
491-
&& parentRow.attr("data-id") == data[diff[i].index][parentGridPK];
490+
parentRow.next("[data-container]").find("table[role='grid']").attr("id").contains("_" + diff[i].txlog[j].key + "_"))
491+
&& parentRow.attr("data-id") == data[diff[i].index][parentGridPK];
492492
});
493493
if (childGrid.length > 0) {
494494
jQuery(childGrid).each(function () {
@@ -564,8 +564,8 @@ export class IgComboComponent extends IgControlBase<IgCombo> implements ControlV
564564

565565
ngDoCheck() {
566566
if (this._differ != null && this._allowChangeDetection) {
567-
this.optionChange();
568-
this._allowChangeDetection = false;
567+
this.optionChange();
568+
this._allowChangeDetection = false;
569569
var diff = [];
570570
var element = jQuery(this._el);
571571
var i, j, valKey = this._config.valueKey, record, item;
@@ -678,8 +678,8 @@ export class IgTreeComponent extends IgControlBase<IgTree> {
678678

679679
ngDoCheck() {
680680
if (this._differ != null && this._allowChangeDetection) {
681-
this.optionChange();
682-
this._allowChangeDetection = false;
681+
this.optionChange();
682+
this._allowChangeDetection = false;
683683
var diff = [];
684684
var element = jQuery(this._el);
685685
var i, j, valKey = this._config.valueKey, record, item;
@@ -703,9 +703,16 @@ export class IgTreeComponent extends IgControlBase<IgTree> {
703703
}
704704

705705
export class IgContentControlBase<Model> extends IgControlBase<Model> {
706+
private childNodes: Array<any>;
707+
706708
constructor(el: ElementRef, renderer: Renderer, differs: IterableDiffers) {
707709
super(el, renderer, differs);
708-
jQuery(this._el).append(el.nativeElement.childNodes);
710+
this.childNodes = el.nativeElement.childNodes;
711+
}
712+
713+
ngOnInit() {
714+
jQuery(this._el).append(this.childNodes);
715+
super.ngOnInit();
709716
}
710717
}
711718

@@ -723,30 +730,30 @@ export class IgTileManagerComponent extends IgContentControlBase<IgTileManager>
723730

724731
@IgComponent()
725732
export class IgHtmlEditorComponent extends IgControlBase<IgHtmlEditor> implements ControlValueAccessor {
726-
protected _model: any;
727-
protected _zone: any;
728-
constructor(el: ElementRef, renderer: Renderer, differs: IterableDiffers, @Optional() public model: NgModel, private zone:NgZone ) { super(el, renderer, differs);
729-
if (model) {
733+
protected _model: any;
734+
protected _zone: any;
735+
constructor(el: ElementRef, renderer: Renderer, differs: IterableDiffers, @Optional() public model: NgModel, private zone:NgZone ) { super(el, renderer, differs);
736+
if (model) {
730737
model.valueAccessor = this;
731-
this._zone = zone;
738+
this._zone = zone;
732739
this._model = model;
733-
}
734-
}
735-
ngOnInit() {
740+
}
741+
}
742+
ngOnInit() {
736743
super.ngOnInit();
737-
let that = this;
738-
if (this._model) {
739-
var iframe=jQuery(this._el).find("iframe")[0].contentWindow.document;
744+
let that = this;
745+
if (this._model) {
746+
var iframe=jQuery(this._el).find("iframe")[0].contentWindow.document;
740747
jQuery(iframe).find("body[contenteditable=true]").on("keyup", function (evt, ui) {
741-
that._model.viewToModelUpdate(jQuery(evt.target).html());
742-
that._zone.run(() => {
743-
that._model.viewToModelUpdate(jQuery(evt.target).html());
744-
});
748+
that._model.viewToModelUpdate(jQuery(evt.target).html());
749+
that._zone.run(() => {
750+
that._model.viewToModelUpdate(jQuery(evt.target).html());
751+
});
745752
});
746753
}
747754

748755
}
749-
writeValue(value: any) {
756+
writeValue(value: any) {
750757
if (!!jQuery(this._el).data(this._widgetName) && value !== null && value !== jQuery(this._el)[this._widgetName]("getContent","html")) {
751758
jQuery(this._el)[this._widgetName]("setContent", value, "html");
752759
}
@@ -764,7 +771,7 @@ export class IgHtmlEditorComponent extends IgControlBase<IgHtmlEditor> implement
764771
registerOnTouched(fn: () => {}): void {
765772
this.onTouched = fn;
766773
}
767-
}
774+
}
768775

769776

770777
@IgComponent()
@@ -777,7 +784,7 @@ export class IgValidatorComponent extends IgControlBase<IgValidator> {
777784
var evtName;
778785
this._el = jQuery(document).find("#" + this.widgetId);
779786
jQuery(this._el)[this._widgetName](this._config);
780-
this._events = new Map<string, string>();
787+
this._events = new Map<string, string>();
781788
//events binding
782789
let that = this;
783790
for (var propt in jQuery.ui[this._widgetName].prototype.events) {
@@ -845,7 +852,7 @@ export class IgPopoverComponent extends IgControlBase<IgPopover> {
845852
var elem = jQuery(document).find("#" + this.widgetId);
846853
if (elem.length === 1) {
847854
this._el = elem;
848-
this._events = new Map<string, string>();
855+
this._events = new Map<string, string>();
849856
//events binding
850857
let that = this;
851858
var evtName;
@@ -876,7 +883,7 @@ export class IgNotifierComponent extends IgControlBase<any> {
876883
var elem = jQuery(document).find("#" + this.widgetId);
877884
if (elem.length === 1) {
878885
this._el = elem;
879-
this._events = new Map<string, string>();
886+
this._events = new Map<string, string>();
880887
//events binding
881888
let that = this;
882889
var evtName;

0 commit comments

Comments
 (0)