more refactor

src/app/components/modal/modals/settings/settings.component.ts

@@ -9,14 +9,13 @@ import { Page } from '../../../../model/page';
   styleUrls: ['./settings.component.scss']
 })
 export class SettingsComponent implements OnInit {
+  page: Page;
   constructor(public modalService: ModalService, public dataService: DataService) {}
 
   ngOnInit() {
     this.modalService.active.input.subscribe(p => (this.page = p));
   }
 
-  page: Page;
-
   async deletePage() {
     try {
       await this.modalService.showRemovePage(this.page.name);

src/app/components/pages/page/tower/tower.component.ts

@@ -41,7 +41,7 @@ export class TowerComponent implements OnInit {
         this.blocks = value.coloredBlocks
           .filter(b => b.isDone)
           .map(b => {
-            let classedBlock = b as StyledBlock;
+            const classedBlock = b as StyledBlock;
             classedBlock.shouldDraw = true;
             classedBlock.style = { transform: 'translateY(0)', opacity: '1' };
             classedBlock.cssClass = '';
@@ -52,7 +52,7 @@ export class TowerComponent implements OnInit {
           console.log(this.tower, this.tower.latestVersion, value);
         }
         if (this.tower && this.tower.latestVersion === value) {
-          let difference = this.tower.blocks.map((b, index) => {
+          const difference = this.tower.blocks.map((b, index) => {
             return b === value.blocks[index];
           });
 

src/app/components/shared/double-slider/double-slider.component.ts

@@ -93,7 +93,7 @@ export class DoubleSliderComponent {
   }
 
   private emitValue() {
-    const range = {
+    this.range.emit({
       from:
         this.oneValue < this.otherValue
           ? this.values[this.indexFromValue(this.oneValue)]
@@ -102,7 +102,6 @@ export class DoubleSliderComponent {
         this.oneValue < this.otherValue
           ? this.values[this.indexFromValue(this.otherValue)]
           : this.values[this.indexFromValue(this.oneValue)]
-    };
+    });
-    this.range.emit(range);
   }
 }

src/app/model/block.ts

@@ -1,6 +1,5 @@
 import { Serializable } from './serializable';
 import { IBlock } from '../interfaces/persistance/block';
-import { Node } from '../store/node';
 import { InnerNodeState } from '../store/inner-node';
 
 export interface BlockState extends IBlock, InnerNodeState {}
@@ -12,7 +11,6 @@ export class Block extends Serializable implements IBlock, BlockState {
   readonly tag: string;
 
   constructor(props: IBlock) {
-    console.log('b');
     if (props.created.constructor.name !== 'Date') {
       props.created = new Date(props.created);
     }

src/app/model/page.ts

@@ -1,7 +1,7 @@
 import { Serializable } from './serializable';
 import { IPage } from '../interfaces/persistance/page';
 import { Tower } from './tower';
-import { InnerNodeState } from '../store/inner-node';
+import { InnerNode, InnerNodeState } from '../store/inner-node';
 
 export interface PageState extends InnerNodeState, IPage {}
 
@@ -17,7 +17,7 @@ export class Page extends Serializable implements IPage, PageState {
   };
 
   constructor(props: IPage) {
-    super(props, 'Page');
+    super(props, 'Page', props.towers.map(t => new Tower(t)));
   }
 
   get towers(): Array<Tower> {

src/app/model/serializable.ts

@@ -12,8 +12,8 @@ export class Serializable extends InnerNode {
   private static propertyList: any = {};
   protected type: string;
 
-  protected constructor(properties: any, type: string) {
+  protected constructor(properties: any, type: string, children?: Array<InnerNode>) {
-    super();
+    super(children);
 
     const compiledType = this.constructor.name;
     if (!Serializable.propertyList.hasOwnProperty(compiledType)) {
@@ -21,19 +21,7 @@ export class Serializable extends InnerNode {
     }
     for (const property in properties) {
       if (properties.hasOwnProperty(property)) {
-        const propertyValue = properties[property];
+        if (property !== Serializable.childrenMap[type].childrenListName) {
-        // This should be ran after the original constructor has finished.
-        if (property === Serializable.childrenMap[type].childrenListName) {
-          new Promise(r => r()).then(() => {
-            const children = propertyValue.map(
-              c =>
-                new Serializable.childrenMap[type].childrenConstructor(c, Serializable.childrenMap[type].childrenType)
-            );
-            console.log(type, 'created');
-            this.addChildren(children);
-            console.log(type, 'added');
-          });
-        } else {
           this[property] = properties[property];
         }
 

src/app/model/tower.ts

@@ -4,7 +4,7 @@ import { Block } from './block';
 import { Serializable } from './serializable';
 import { hash } from '../utils/hash';
 import { IColor } from '../interfaces/color';
-import { InnerNodeState } from '../store/inner-node';
+import { InnerNode, InnerNodeState } from '../store/inner-node';
 
 export type ColoredBlock = Block & { color: IColor };
 
@@ -23,7 +23,8 @@ export class Tower extends Serializable implements ITower, TowerState {
   readonly baseColor: IColor;
 
   constructor(props: ITower) {
-    super(props, 'Tower');
+    super(props, 'Tower', props.blocks.map(b => new Block(b)));
+    this.onAfterClone();
   }
 
   protected onAfterClone() {

src/app/services/data.service.ts

@@ -13,9 +13,6 @@ import { Observable } from 'rxjs/internal/Observable';
   providedIn: 'root'
 })
 export class DataService extends Root<Page> {
-  private readonly _safeChildren: BehaviorSubject<Array<Page>> = new BehaviorSubject(null);
-  readonly safeChildren$: Observable<Array<Page>> = this._safeChildren.asObservable();
-
   constructor(private storeService: StoreService<Array<IPage>>) {
     super();
     this.init().catch();
@@ -66,13 +63,9 @@ export class DataService extends Root<Page> {
     };
     this.children$.subscribe(value => {
       this.log();
+      this.save(0);
     });
 
     this.addChildren(pages.map(p => new Page(p)));
-
-    this.children$.subscribe(value => {
-      this._safeChildren.next(value);
-      this.save(0);
-    });
   }
 }

src/app/store/inner-node.ts

@@ -10,8 +10,9 @@ export class InnerNode extends Node implements InnerNodeState {
   private nextVersion: this = null;
   readonly children: Array<InnerNode> = [];
 
-  constructor() {
+  constructor(children?: Array<InnerNode>) {
     super();
+    this.children = children ? children : [];
   }
 
   get latestVersion(): this {
@@ -22,12 +23,12 @@ export class InnerNode extends Node implements InnerNodeState {
     return version;
   }
 
-  addChildren(children: Array<InnerNode>) {
+  addChildren(children: Array<InnerNode>): this {
-    super.addChildren.call(this.latestVersion, children);
+    return super.addChildren.call(this.latestVersion, children);
   }
 
-  replaceChild(update: { oldValue: InnerNode; newValue: InnerNode }) {
+  replaceChild(update: { oldValue: InnerNode; newValue: InnerNode }): this {
-    super.replaceChild.call(this.latestVersion, update);
+    return super.replaceChild.call(this.latestVersion, update);
   }
 
   changeKeys<T extends NodeState>(props: Partial<T>): this {

src/app/store/node.ts

@@ -9,25 +9,28 @@ export abstract class Node extends Unique implements NodeState {
   protected copyCount = 1;
   abstract readonly children: Array<InnerNode>;
 
+  protected constructor() {
+    super();
+  }
   protected abstract changeKeys<T extends NodeState>(props: Partial<T>): this;
 
   protected initiate() {
     super.initiate();
-    ++this.copyCount;
+    this.copyCount++;
   }
 
-  addChildren(children: Array<InnerNode>) {
+  addChildren(children: Array<InnerNode>): this {
-    this.changeKeys<NodeState>({
+    return this.changeKeys<NodeState>({
       children: [...this.children, ...children]
     });
   }
 
-  replaceChild({ oldValue, newValue }: { oldValue: InnerNode; newValue: InnerNode }) {
+  replaceChild({ oldValue, newValue }: { oldValue: InnerNode; newValue: InnerNode }): this {
     if (oldValue === newValue) {
-      return;
+      return this;
     }
 
-    this.changeKeys<NodeState>({
+    return this.changeKeys<NodeState>({
       children: this.children.map(c => (c === oldValue ? newValue : c))
     });
   }

src/app/store/root.ts

@@ -4,11 +4,13 @@ import { Node, NodeState } from './node';
 import { InnerNode } from './inner-node';
 
 export class Root<T extends InnerNode> extends Node {
-  private readonly _children: BehaviorSubject<Array<T>> = new BehaviorSubject([]);
+  readonly children$: Observable<Array<T>>;
-  readonly children$: Observable<Array<T>> = this._children.asObservable();
+  private readonly _children: BehaviorSubject<Array<T>>;
 
-  constructor() {
+  constructor(children?: Array<T>) {
     super();
+    this._children = new BehaviorSubject(children ? children : []);
+    this.children$ = this._children.asObservable();
   }
 
   get children(): Array<T> {
@@ -16,6 +18,7 @@ export class Root<T extends InnerNode> extends Node {
   }
 
   set children(value: Array<T>) {
+    console.log(value);
     this._children.next(value);
   }
 

src/app/utils/hash.ts

@@ -4,8 +4,7 @@ export const hash = (text: string): number => {
     return 0;
   }
   const hashValue = Array.prototype.reduce.call(
-    // tslint:disable-next-line:no-bitwise
+    text, // tslint:disable-next-line:no-bitwise
-    text,
     (value, char) => ((value << 5) - value + (char.charCodeAt(0) as number)) | 0,
     7
   );