Added simpleLevel

src/module/Application/pwa/html/application/level.html

@@ -1,5 +1,5 @@
 <div>
-    <div id = 'segment-leaf-template' class = 'segment'>
+    <div id = 'segment-leaf-template' class = 'segment segment-leaf'>
         <div class = 'leaf-element'></div>
     </div>
     <div id = 'segment-parent-template' class = 'segment segment-parent'>

src/module/Application/pwa/js/wordrotator/Level/Level.js

@@ -11,7 +11,10 @@ export class Level {
 
     setWords(words)
     {
-        this.words = words;
+        this.words = [];
+        for (let i = 0, n = words.length; i < n; i++) {
+            this.words.push(words[i].toUpperCase());
+        }
     }
 
     setStartRotations(rotations)

src/module/Application/pwa/js/wordrotator/Segment/ParentSegment.js

@@ -10,15 +10,14 @@ export class ParentSegment extends Segment {
     rotate() {
         this.rotation += 90;
         this.rotation %= 360;
-        
+
         this._updateRotationClass()
     }
 
-    applyRotations(rotations)
-    {
+    applyRotations(rotations) {
         // debugger;
         this.rotation = rotations[0];
-        rotations.splice(0,1);
+        rotations.splice(0, 1);
         for (let i = 0, n = this.children.length; i < n; i++) {
             rotations = this.children[i].applyRotations(rotations);
         }
@@ -46,22 +45,42 @@ export class ParentSegment extends Segment {
         this._updateElement();
     }
 
-    _updateRotationClass(){
+    _updateRotationClass() {
+        // this.style.transform = "rotate("+this.rotation+"deg)";
         this.element.classList.remove(this.class);
         this.class = "rotate-" + this.rotation;
+        if (this.class === "rotate-0")
+        {
+            this.class = "rotate-360";
+        }
         this.element.classList.add(this.class);
+
+        // if (this.rotation === 0) {
+        //     const self = this;
+        //             self.element.classList.add("no-transition");
+        //
+        //     setTimeout(() => {
+        //         if (self.class === "rotate-0") {
+        //             requestAnimationFrame(()=>{
+        //
+        //             self.element.classList.remove("rotate-0");
+        //             self.element.classList.remove("no-transition");
+        //             });
+        //         }
+        //     }, 250);
+        // }
     }
 
     _updateElement() {
         const childContainer = this.element.querySelector(".child-container");
         childContainer.removeAllChildren();
 
-        this._updateRotationClass()
+        this._updateRotationClass();
 
         const self = this;
         this.element.onclick = function () {
             self.rotate();
-        }
+        };
 
         for (let i = 0, n = this.children.length; i < n; i++) {
             this.children[i]._updateElement();

src/module/Application/pwa/js/wordrotator/Segment/Segment.js

@@ -7,7 +7,7 @@ export class Segment{
     }
 
     isSolved(){
-        return this.rotation === 0;
+        return (this.rotation === 0);
     }
     
     rotate(){};