Added simpleLevel

public/core/css/core.css

@@ -295,6 +295,8 @@ button.button, a.button {
 .fill-me {
   display: flex;
   flex-direction: column; }
+  .fill-me.vertical {
+    flex-direction: row; }
   .fill-me .grow {
     flex: 1; }
 

public/core/css/foundation.css

@@ -671,32 +671,32 @@ textarea {
   padding-left: 0; }
 
 .small-1 {
-  width: 8.33333%; }
+  width: 8.3333333333%; }
 
 .small-push-1 {
   position: relative;
-  left: 8.33333%; }
+  left: 8.3333333333%; }
 
 .small-pull-1 {
   position: relative;
-  left: -8.33333%; }
+  left: -8.3333333333%; }
 
 .small-offset-0 {
   margin-left: 0%; }
 
 .small-2 {
-  width: 16.66667%; }
+  width: 16.6666666667%; }
 
 .small-push-2 {
   position: relative;
-  left: 16.66667%; }
+  left: 16.6666666667%; }
 
 .small-pull-2 {
   position: relative;
-  left: -16.66667%; }
+  left: -16.6666666667%; }
 
 .small-offset-1 {
-  margin-left: 8.33333%; }
+  margin-left: 8.3333333333%; }
 
 .small-3 {
   width: 25%; }
@@ -710,35 +710,35 @@ textarea {
   left: -25%; }
 
 .small-offset-2 {
-  margin-left: 16.66667%; }
+  margin-left: 16.6666666667%; }
 
 .small-4 {
-  width: 33.33333%; }
+  width: 33.3333333333%; }
 
 .small-push-4 {
   position: relative;
-  left: 33.33333%; }
+  left: 33.3333333333%; }
 
 .small-pull-4 {
   position: relative;
-  left: -33.33333%; }
+  left: -33.3333333333%; }
 
 .small-offset-3 {
   margin-left: 25%; }
 
 .small-5 {
-  width: 41.66667%; }
+  width: 41.6666666667%; }
 
 .small-push-5 {
   position: relative;
-  left: 41.66667%; }
+  left: 41.6666666667%; }
 
 .small-pull-5 {
   position: relative;
-  left: -41.66667%; }
+  left: -41.6666666667%; }
 
 .small-offset-4 {
-  margin-left: 33.33333%; }
+  margin-left: 33.3333333333%; }
 
 .small-6 {
   width: 50%; }
@@ -752,35 +752,35 @@ textarea {
   left: -50%; }
 
 .small-offset-5 {
-  margin-left: 41.66667%; }
+  margin-left: 41.6666666667%; }
 
 .small-7 {
-  width: 58.33333%; }
+  width: 58.3333333333%; }
 
 .small-push-7 {
   position: relative;
-  left: 58.33333%; }
+  left: 58.3333333333%; }
 
 .small-pull-7 {
   position: relative;
-  left: -58.33333%; }
+  left: -58.3333333333%; }
 
 .small-offset-6 {
   margin-left: 50%; }
 
 .small-8 {
-  width: 66.66667%; }
+  width: 66.6666666667%; }
 
 .small-push-8 {
   position: relative;
-  left: 66.66667%; }
+  left: 66.6666666667%; }
 
 .small-pull-8 {
   position: relative;
-  left: -66.66667%; }
+  left: -66.6666666667%; }
 
 .small-offset-7 {
-  margin-left: 58.33333%; }
+  margin-left: 58.3333333333%; }
 
 .small-9 {
   width: 75%; }
@@ -794,41 +794,41 @@ textarea {
   left: -75%; }
 
 .small-offset-8 {
-  margin-left: 66.66667%; }
+  margin-left: 66.6666666667%; }
 
 .small-10 {
-  width: 83.33333%; }
+  width: 83.3333333333%; }
 
 .small-push-10 {
   position: relative;
-  left: 83.33333%; }
+  left: 83.3333333333%; }
 
 .small-pull-10 {
   position: relative;
-  left: -83.33333%; }
+  left: -83.3333333333%; }
 
 .small-offset-9 {
   margin-left: 75%; }
 
 .small-11 {
-  width: 91.66667%; }
+  width: 91.6666666667%; }
 
 .small-push-11 {
   position: relative;
-  left: 91.66667%; }
+  left: 91.6666666667%; }
 
 .small-pull-11 {
   position: relative;
-  left: -91.66667%; }
+  left: -91.6666666667%; }
 
 .small-offset-10 {
-  margin-left: 83.33333%; }
+  margin-left: 83.3333333333%; }
 
 .small-12 {
   width: 100%; }
 
 .small-offset-11 {
-  margin-left: 91.66667%; }
+  margin-left: 91.6666666667%; }
 
 .small-up-1 > .column, .small-up-1 > .columns {
   float: left;
@@ -852,7 +852,7 @@ textarea {
 
 .small-up-3 > .column, .small-up-3 > .columns {
   float: left;
-  width: 33.33333%; }
+  width: 33.3333333333%; }
   .small-up-3 > .column:nth-of-type(1n), .small-up-3 > .columns:nth-of-type(1n) {
     clear: none; }
   .small-up-3 > .column:nth-of-type(3n+1), .small-up-3 > .columns:nth-of-type(3n+1) {
@@ -882,7 +882,7 @@ textarea {
 
 .small-up-6 > .column, .small-up-6 > .columns {
   float: left;
-  width: 16.66667%; }
+  width: 16.6666666667%; }
   .small-up-6 > .column:nth-of-type(1n), .small-up-6 > .columns:nth-of-type(1n) {
     clear: none; }
   .small-up-6 > .column:nth-of-type(6n+1), .small-up-6 > .columns:nth-of-type(6n+1) {
@@ -892,7 +892,7 @@ textarea {
 
 .small-up-7 > .column, .small-up-7 > .columns {
   float: left;
-  width: 14.28571%; }
+  width: 14.2857142857%; }
   .small-up-7 > .column:nth-of-type(1n), .small-up-7 > .columns:nth-of-type(1n) {
     clear: none; }
   .small-up-7 > .column:nth-of-type(7n+1), .small-up-7 > .columns:nth-of-type(7n+1) {
@@ -942,32 +942,32 @@ textarea {
 
 @media screen and (min-width: 25em) {
   .smedium-1 {
-    width: 8.33333%; }
+    width: 8.3333333333%; }
 
   .smedium-push-1 {
     position: relative;
-    left: 8.33333%; }
+    left: 8.3333333333%; }
 
   .smedium-pull-1 {
     position: relative;
-    left: -8.33333%; }
+    left: -8.3333333333%; }
 
   .smedium-offset-0 {
     margin-left: 0%; }
 
   .smedium-2 {
-    width: 16.66667%; }
+    width: 16.6666666667%; }
 
   .smedium-push-2 {
     position: relative;
-    left: 16.66667%; }
+    left: 16.6666666667%; }
 
   .smedium-pull-2 {
     position: relative;
-    left: -16.66667%; }
+    left: -16.6666666667%; }
 
   .smedium-offset-1 {
-    margin-left: 8.33333%; }
+    margin-left: 8.3333333333%; }
 
   .smedium-3 {
     width: 25%; }
@@ -981,35 +981,35 @@ textarea {
     left: -25%; }
 
   .smedium-offset-2 {
-    margin-left: 16.66667%; }
+    margin-left: 16.6666666667%; }
 
   .smedium-4 {
-    width: 33.33333%; }
+    width: 33.3333333333%; }
 
   .smedium-push-4 {
     position: relative;
-    left: 33.33333%; }
+    left: 33.3333333333%; }
 
   .smedium-pull-4 {
     position: relative;
-    left: -33.33333%; }
+    left: -33.3333333333%; }
 
   .smedium-offset-3 {
     margin-left: 25%; }
 
   .smedium-5 {
-    width: 41.66667%; }
+    width: 41.6666666667%; }
 
   .smedium-push-5 {
     position: relative;
-    left: 41.66667%; }
+    left: 41.6666666667%; }
 
   .smedium-pull-5 {
     position: relative;
-    left: -41.66667%; }
+    left: -41.6666666667%; }
 
   .smedium-offset-4 {
-    margin-left: 33.33333%; }
+    margin-left: 33.3333333333%; }
 
   .smedium-6 {
     width: 50%; }
@@ -1023,35 +1023,35 @@ textarea {
     left: -50%; }
 
   .smedium-offset-5 {
-    margin-left: 41.66667%; }
+    margin-left: 41.6666666667%; }
 
   .smedium-7 {
-    width: 58.33333%; }
+    width: 58.3333333333%; }
 
   .smedium-push-7 {
     position: relative;
-    left: 58.33333%; }
+    left: 58.3333333333%; }
 
   .smedium-pull-7 {
     position: relative;
-    left: -58.33333%; }
+    left: -58.3333333333%; }
 
   .smedium-offset-6 {
     margin-left: 50%; }
 
   .smedium-8 {
-    width: 66.66667%; }
+    width: 66.6666666667%; }
 
   .smedium-push-8 {
     position: relative;
-    left: 66.66667%; }
+    left: 66.6666666667%; }
 
   .smedium-pull-8 {
     position: relative;
-    left: -66.66667%; }
+    left: -66.6666666667%; }
 
   .smedium-offset-7 {
-    margin-left: 58.33333%; }
+    margin-left: 58.3333333333%; }
 
   .smedium-9 {
     width: 75%; }
@@ -1065,41 +1065,41 @@ textarea {
     left: -75%; }
 
   .smedium-offset-8 {
-    margin-left: 66.66667%; }
+    margin-left: 66.6666666667%; }
 
   .smedium-10 {
-    width: 83.33333%; }
+    width: 83.3333333333%; }
 
   .smedium-push-10 {
     position: relative;
-    left: 83.33333%; }
+    left: 83.3333333333%; }
 
   .smedium-pull-10 {
     position: relative;
-    left: -83.33333%; }
+    left: -83.3333333333%; }
 
   .smedium-offset-9 {
     margin-left: 75%; }
 
   .smedium-11 {
-    width: 91.66667%; }
+    width: 91.6666666667%; }
 
   .smedium-push-11 {
     position: relative;
-    left: 91.66667%; }
+    left: 91.6666666667%; }
 
   .smedium-pull-11 {
     position: relative;
-    left: -91.66667%; }
+    left: -91.6666666667%; }
 
   .smedium-offset-10 {
-    margin-left: 83.33333%; }
+    margin-left: 83.3333333333%; }
 
   .smedium-12 {
     width: 100%; }
 
   .smedium-offset-11 {
-    margin-left: 91.66667%; }
+    margin-left: 91.6666666667%; }
 
   .smedium-up-1 > .column, .smedium-up-1 > .columns {
     float: left;
@@ -1123,7 +1123,7 @@ textarea {
 
   .smedium-up-3 > .column, .smedium-up-3 > .columns {
     float: left;
-    width: 33.33333%; }
+    width: 33.3333333333%; }
     .smedium-up-3 > .column:nth-of-type(1n), .smedium-up-3 > .columns:nth-of-type(1n) {
       clear: none; }
     .smedium-up-3 > .column:nth-of-type(3n+1), .smedium-up-3 > .columns:nth-of-type(3n+1) {
@@ -1153,7 +1153,7 @@ textarea {
 
   .smedium-up-6 > .column, .smedium-up-6 > .columns {
     float: left;
-    width: 16.66667%; }
+    width: 16.6666666667%; }
     .smedium-up-6 > .column:nth-of-type(1n), .smedium-up-6 > .columns:nth-of-type(1n) {
       clear: none; }
     .smedium-up-6 > .column:nth-of-type(6n+1), .smedium-up-6 > .columns:nth-of-type(6n+1) {
@@ -1163,7 +1163,7 @@ textarea {
 
   .smedium-up-7 > .column, .smedium-up-7 > .columns {
     float: left;
-    width: 14.28571%; }
+    width: 14.2857142857%; }
     .smedium-up-7 > .column:nth-of-type(1n), .smedium-up-7 > .columns:nth-of-type(1n) {
       clear: none; }
     .smedium-up-7 > .column:nth-of-type(7n+1), .smedium-up-7 > .columns:nth-of-type(7n+1) {
@@ -1212,32 +1212,32 @@ textarea {
     margin-left: 0; } }
 @media print, screen and (min-width: 40em) {
   .medium-1 {
-    width: 8.33333%; }
+    width: 8.3333333333%; }
 
   .medium-push-1 {
     position: relative;
-    left: 8.33333%; }
+    left: 8.3333333333%; }
 
   .medium-pull-1 {
     position: relative;
-    left: -8.33333%; }
+    left: -8.3333333333%; }
 
   .medium-offset-0 {
     margin-left: 0%; }
 
   .medium-2 {
-    width: 16.66667%; }
+    width: 16.6666666667%; }
 
   .medium-push-2 {
     position: relative;
-    left: 16.66667%; }
+    left: 16.6666666667%; }
 
   .medium-pull-2 {
     position: relative;
-    left: -16.66667%; }
+    left: -16.6666666667%; }
 
   .medium-offset-1 {
-    margin-left: 8.33333%; }
+    margin-left: 8.3333333333%; }
 
   .medium-3 {
     width: 25%; }
@@ -1251,35 +1251,35 @@ textarea {
     left: -25%; }
 
   .medium-offset-2 {
-    margin-left: 16.66667%; }
+    margin-left: 16.6666666667%; }
 
   .medium-4 {
-    width: 33.33333%; }
+    width: 33.3333333333%; }
 
   .medium-push-4 {
     position: relative;
-    left: 33.33333%; }
+    left: 33.3333333333%; }
 
   .medium-pull-4 {
     position: relative;
-    left: -33.33333%; }
+    left: -33.3333333333%; }
 
   .medium-offset-3 {
     margin-left: 25%; }
 
   .medium-5 {
-    width: 41.66667%; }
+    width: 41.6666666667%; }
 
   .medium-push-5 {
     position: relative;
-    left: 41.66667%; }
+    left: 41.6666666667%; }
 
   .medium-pull-5 {
     position: relative;
-    left: -41.66667%; }
+    left: -41.6666666667%; }
 
   .medium-offset-4 {
-    margin-left: 33.33333%; }
+    margin-left: 33.3333333333%; }
 
   .medium-6 {
     width: 50%; }
@@ -1293,35 +1293,35 @@ textarea {
     left: -50%; }
 
   .medium-offset-5 {
-    margin-left: 41.66667%; }
+    margin-left: 41.6666666667%; }
 
   .medium-7 {
-    width: 58.33333%; }
+    width: 58.3333333333%; }
 
   .medium-push-7 {
     position: relative;
-    left: 58.33333%; }
+    left: 58.3333333333%; }
 
   .medium-pull-7 {
     position: relative;
-    left: -58.33333%; }
+    left: -58.3333333333%; }
 
   .medium-offset-6 {
     margin-left: 50%; }
 
   .medium-8 {
-    width: 66.66667%; }
+    width: 66.6666666667%; }
 
   .medium-push-8 {
     position: relative;
-    left: 66.66667%; }
+    left: 66.6666666667%; }
 
   .medium-pull-8 {
     position: relative;
-    left: -66.66667%; }
+    left: -66.6666666667%; }
 
   .medium-offset-7 {
-    margin-left: 58.33333%; }
+    margin-left: 58.3333333333%; }
 
   .medium-9 {
     width: 75%; }
@@ -1335,41 +1335,41 @@ textarea {
     left: -75%; }
 
   .medium-offset-8 {
-    margin-left: 66.66667%; }
+    margin-left: 66.6666666667%; }
 
   .medium-10 {
-    width: 83.33333%; }
+    width: 83.3333333333%; }
 
   .medium-push-10 {
     position: relative;
-    left: 83.33333%; }
+    left: 83.3333333333%; }
 
   .medium-pull-10 {
     position: relative;
-    left: -83.33333%; }
+    left: -83.3333333333%; }
 
   .medium-offset-9 {
     margin-left: 75%; }
 
   .medium-11 {
-    width: 91.66667%; }
+    width: 91.6666666667%; }
 
   .medium-push-11 {
     position: relative;
-    left: 91.66667%; }
+    left: 91.6666666667%; }
 
   .medium-pull-11 {
     position: relative;
-    left: -91.66667%; }
+    left: -91.6666666667%; }
 
   .medium-offset-10 {
-    margin-left: 83.33333%; }
+    margin-left: 83.3333333333%; }
 
   .medium-12 {
     width: 100%; }
 
   .medium-offset-11 {
-    margin-left: 91.66667%; }
+    margin-left: 91.6666666667%; }
 
   .medium-up-1 > .column, .medium-up-1 > .columns {
     float: left;
@@ -1393,7 +1393,7 @@ textarea {
 
   .medium-up-3 > .column, .medium-up-3 > .columns {
     float: left;
-    width: 33.33333%; }
+    width: 33.3333333333%; }
     .medium-up-3 > .column:nth-of-type(1n), .medium-up-3 > .columns:nth-of-type(1n) {
       clear: none; }
     .medium-up-3 > .column:nth-of-type(3n+1), .medium-up-3 > .columns:nth-of-type(3n+1) {
@@ -1423,7 +1423,7 @@ textarea {
 
   .medium-up-6 > .column, .medium-up-6 > .columns {
     float: left;
-    width: 16.66667%; }
+    width: 16.6666666667%; }
     .medium-up-6 > .column:nth-of-type(1n), .medium-up-6 > .columns:nth-of-type(1n) {
       clear: none; }
     .medium-up-6 > .column:nth-of-type(6n+1), .medium-up-6 > .columns:nth-of-type(6n+1) {
@@ -1433,7 +1433,7 @@ textarea {
 
   .medium-up-7 > .column, .medium-up-7 > .columns {
     float: left;
-    width: 14.28571%; }
+    width: 14.2857142857%; }
     .medium-up-7 > .column:nth-of-type(1n), .medium-up-7 > .columns:nth-of-type(1n) {
       clear: none; }
     .medium-up-7 > .column:nth-of-type(7n+1), .medium-up-7 > .columns:nth-of-type(7n+1) {
@@ -1482,32 +1482,32 @@ textarea {
     margin-left: 0; } }
 @media print, screen and (min-width: 64em) {
   .large-1 {
-    width: 8.33333%; }
+    width: 8.3333333333%; }
 
   .large-push-1 {
     position: relative;
-    left: 8.33333%; }
+    left: 8.3333333333%; }
 
   .large-pull-1 {
     position: relative;
-    left: -8.33333%; }
+    left: -8.3333333333%; }
 
   .large-offset-0 {
     margin-left: 0%; }
 
   .large-2 {
-    width: 16.66667%; }
+    width: 16.6666666667%; }
 
   .large-push-2 {
     position: relative;
-    left: 16.66667%; }
+    left: 16.6666666667%; }
 
   .large-pull-2 {
     position: relative;
-    left: -16.66667%; }
+    left: -16.6666666667%; }
 
   .large-offset-1 {
-    margin-left: 8.33333%; }
+    margin-left: 8.3333333333%; }
 
   .large-3 {
     width: 25%; }
@@ -1521,35 +1521,35 @@ textarea {
     left: -25%; }
 
   .large-offset-2 {
-    margin-left: 16.66667%; }
+    margin-left: 16.6666666667%; }
 
   .large-4 {
-    width: 33.33333%; }
+    width: 33.3333333333%; }
 
   .large-push-4 {
     position: relative;
-    left: 33.33333%; }
+    left: 33.3333333333%; }
 
   .large-pull-4 {
     position: relative;
-    left: -33.33333%; }
+    left: -33.3333333333%; }
 
   .large-offset-3 {
     margin-left: 25%; }
 
   .large-5 {
-    width: 41.66667%; }
+    width: 41.6666666667%; }
 
   .large-push-5 {
     position: relative;
-    left: 41.66667%; }
+    left: 41.6666666667%; }
 
   .large-pull-5 {
     position: relative;
-    left: -41.66667%; }
+    left: -41.6666666667%; }
 
   .large-offset-4 {
-    margin-left: 33.33333%; }
+    margin-left: 33.3333333333%; }
 
   .large-6 {
     width: 50%; }
@@ -1563,35 +1563,35 @@ textarea {
     left: -50%; }
 
   .large-offset-5 {
-    margin-left: 41.66667%; }
+    margin-left: 41.6666666667%; }
 
   .large-7 {
-    width: 58.33333%; }
+    width: 58.3333333333%; }
 
   .large-push-7 {
     position: relative;
-    left: 58.33333%; }
+    left: 58.3333333333%; }
 
   .large-pull-7 {
     position: relative;
-    left: -58.33333%; }
+    left: -58.3333333333%; }
 
   .large-offset-6 {
     margin-left: 50%; }
 
   .large-8 {
-    width: 66.66667%; }
+    width: 66.6666666667%; }
 
   .large-push-8 {
     position: relative;
-    left: 66.66667%; }
+    left: 66.6666666667%; }
 
   .large-pull-8 {
     position: relative;
-    left: -66.66667%; }
+    left: -66.6666666667%; }
 
   .large-offset-7 {
-    margin-left: 58.33333%; }
+    margin-left: 58.3333333333%; }
 
   .large-9 {
     width: 75%; }
@@ -1605,41 +1605,41 @@ textarea {
     left: -75%; }
 
   .large-offset-8 {
-    margin-left: 66.66667%; }
+    margin-left: 66.6666666667%; }
 
   .large-10 {
-    width: 83.33333%; }
+    width: 83.3333333333%; }
 
   .large-push-10 {
     position: relative;
-    left: 83.33333%; }
+    left: 83.3333333333%; }
 
   .large-pull-10 {
     position: relative;
-    left: -83.33333%; }
+    left: -83.3333333333%; }
 
   .large-offset-9 {
     margin-left: 75%; }
 
   .large-11 {
-    width: 91.66667%; }
+    width: 91.6666666667%; }
 
   .large-push-11 {
     position: relative;
-    left: 91.66667%; }
+    left: 91.6666666667%; }
 
   .large-pull-11 {
     position: relative;
-    left: -91.66667%; }
+    left: -91.6666666667%; }
 
   .large-offset-10 {
-    margin-left: 83.33333%; }
+    margin-left: 83.3333333333%; }
 
   .large-12 {
     width: 100%; }
 
   .large-offset-11 {
-    margin-left: 91.66667%; }
+    margin-left: 91.6666666667%; }
 
   .large-up-1 > .column, .large-up-1 > .columns {
     float: left;
@@ -1663,7 +1663,7 @@ textarea {
 
   .large-up-3 > .column, .large-up-3 > .columns {
     float: left;
-    width: 33.33333%; }
+    width: 33.3333333333%; }
     .large-up-3 > .column:nth-of-type(1n), .large-up-3 > .columns:nth-of-type(1n) {
       clear: none; }
     .large-up-3 > .column:nth-of-type(3n+1), .large-up-3 > .columns:nth-of-type(3n+1) {
@@ -1693,7 +1693,7 @@ textarea {
 
   .large-up-6 > .column, .large-up-6 > .columns {
     float: left;
-    width: 16.66667%; }
+    width: 16.6666666667%; }
     .large-up-6 > .column:nth-of-type(1n), .large-up-6 > .columns:nth-of-type(1n) {
       clear: none; }
     .large-up-6 > .column:nth-of-type(6n+1), .large-up-6 > .columns:nth-of-type(6n+1) {
@@ -1703,7 +1703,7 @@ textarea {
 
   .large-up-7 > .column, .large-up-7 > .columns {
     float: left;
-    width: 14.28571%; }
+    width: 14.2857142857%; }
     .large-up-7 > .column:nth-of-type(1n), .large-up-7 > .columns:nth-of-type(1n) {
       clear: none; }
     .large-up-7 > .column:nth-of-type(7n+1), .large-up-7 > .columns:nth-of-type(7n+1) {

public/html/application/chat.html

@@ -1 +0,0 @@
-<div class=max-height><span id=chat-title class=chat><span class=chat-img-container><img class=chat-img></span><span class=chat-name></span></span><div id=date-template><div class=date></div></div><div id=message-template class="fill-me vertical message"><div class=author-image-container><img class=author-image></div><div class=grow><div class=bubble><div class=author></div><div class=message-text></div><div class=time></div></div></div></div><div class="fill-me max-height"><div class=grow id=message-container></div><div><div id=send-container class="fill-me vertical"><div class=answer-button-container><button id=previous-button class=answer-button>&lt;</button></div><div class=grow id=answer></div><div class=answer-button-container><button id=next-button class=answer-button>&gt;</button></div></div></div></div></div>

public/html/application/editStory.html

@@ -1 +0,0 @@
-<div><div id=tabs></div></div>

public/html/application/fragment/authorOverviewFragment.html

@@ -1 +0,0 @@
-<div><div id=author-template class="author-entry fill-me vertical"><div class=author-image-container><img class=author-image></div><div class="author-name grow"></div><div class=user-flag>1</div></div><div id=author-list></div></div>

public/html/application/fragment/chatOverviewFragment.html

@@ -1 +0,0 @@
-<div>chats</div>

public/html/application/fragment/settingsFragment.html

@@ -1 +0,0 @@
-<div class="max-height fill-me"><div class="row max-width grow flex-center"><div class="columns small-centered small-12 smedium-9 medium-11 large-7"><h3 data-translation=ask-settings></h3><label class=row><span class="columns small-6" data-translation=ignore-card-always></span> <span class="columns small-6"><input type=checkbox class=setting name=ignore-card-always value=true></span></label><h5 data-translation=settings-ignore-buttons-heading></h5><p data-translation=settings-ignore-buttons-explanation><div class=row><div class="columns small-12 smedium-6"><label><input class=setting required name=ignore-button-1-text data-default=ignore-card-1 data-default-translateable=1> <span data-translation=settings-ignore-button-1-text></span></label></div><div class="columns small-12 smedium-6"><label><input type=number class=setting required name=ignore-button-1-time data-default=120> <span data-translation=settings-ignore-button-1-time></span></label></div></div><div class=row><div class="columns small-12 smedium-6"><label><input class=setting required name=ignore-button-2-text data-default=ignore-card-2 data-default-translateable=1> <span data-translation=settings-ignore-button-2-text></span></label></div><div class="columns small-12 smedium-6"><label><input type=number class=setting required name=ignore-button-2-time data-default=1440> <span data-translation=settings-ignore-button-2-time></span></label></div></div><div class=row><div class="columns small-12 smedium-6"><label><input class=setting required name=ignore-button-3-text data-default=ignore-card-3 data-default-translateable=1> <span data-translation=settings-ignore-button-3-text></span></label></div><div class="columns small-12 smedium-6"><label><input type=number class=setting required name=ignore-button-3-time data-default=7200> <span data-translation=settings-ignore-button-3-time></span></label></div></div><div class=row><div class="columns small-12 smedium-6"><label><input class=setting required name=ignore-button-4-text data-default=ignore-card-4 data-default-translateable=1> <span data-translation=settings-ignore-button-4-text></span></label></div><div class="columns small-12 smedium-6"><label><input type=number class=setting required name=ignore-button-4-time data-default=525600> <span data-translation=settings-ignore-button-4-time></span></label></div></div></div></div></div>

public/html/application/level.html

@@ -0,0 +1 @@
+<div><div id=segment-leaf-template class=segment><div class=leaf-element></div></div><div id=segment-parent-template class="segment segment-parent"><div class=child-container></div></div><div id=segment-row-template class="segment segment-row"><div class=child-container></div></div><div id=level></div></div>

public/html/application/storyOverview.html

@@ -1 +0,0 @@
-<div><div id=chat-template class="chat overview fill-me vertical"><div class=chat-img-container><img class=chat-img></div><div class=grow><div class="fill-me vertical"><div class="chat-name grow"></div><div class=unread-message-counter></div></div><div class="fill-me vertical"><div class="chat-last-message grow"></div><div class=chat-last-message-timestamp></div></div></div></div><div id=chat-container></div></div>

public/html/authorOverviewFragment.html

@@ -1 +0,0 @@
-<div><div id=author-template class="author-entry fill-me vertical"><div class=author-image-container><img class=author-image></div><div class="author-name grow"></div><div class=user-flag>1</div></div><div id=author-list></div></div>

public/html/chat.html

@@ -1 +0,0 @@
-<div class=max-height><span id=chat-title class=chat><span class=chat-img-container><img class=chat-img></span><span class=chat-name></span></span><div id=date-template><div class=date></div></div><div id=message-template class="fill-me vertical message"><div class=author-image-container><img class=author-image></div><div class=grow><div class=bubble><div class=author></div><div class=message-text></div><div class=time></div></div></div></div><div class="fill-me max-height"><div class=grow id=message-container></div><div><div id=send-container class="fill-me vertical"><div class=answer-button-container><button id=previous-button class=answer-button>&lt;</button></div><div class=grow id=answer></div><div class=answer-button-container><button id=next-button class=answer-button>&gt;</button></div></div></div></div></div>

public/html/chatOverviewFragment.html

@@ -1 +0,0 @@
-<div>chats</div>

public/html/editStory.html

@@ -1 +0,0 @@
-<div><div id=tabs></div></div>

public/index.html

@@ -39,7 +39,7 @@
     <link href="core/css/theme.css" media="screen,print" rel="stylesheet" type="text/css">
     <link href="core/css/settingsSite.css" media="screen,print" rel="stylesheet" type="text/css">
     <link href="pwaAssets/css/pwaAssets.css" media="screen,print" rel="stylesheet" type="text/css">
-    <link href="css/stories.css" media="screen,print" rel="stylesheet" type="text/css">
+    <link href="css/wordRotator.css" media="screen,print" rel="stylesheet" type="text/css">
 
 </head>
 <body class='blue'>

public/js/app.js

@@ -2755,173 +2755,273 @@ function applyPolyfills(){
     });
 }
 
-SystemSettings.setBasePath("/pwa/stories/public/");
+SystemSettings.setBasePath("/pwa/wordRotator/public/");
 Translator.supportedLanguages = ["de", "en"];
 Translator.markTranslations = false;
 
-class DataManager {
-    static load(url, isCachable, raw) {
-        isCachable = Helper.nonNull(isCachable, false);
-        raw = Helper.nonNull(raw, false);
-        let fullUrl = (isCachable) ? Helper.basePath(DataManager.cachePath + url) : Helper.basePath(DataManager.dataPath + url);
-        return fetch(fullUrl, {"credentials": "same-origin"}).then(function (res) {
-            if (raw) {
-                return res.text();
-            }
-            return res.json();
-        }).catch(function (e) {
-            console.error("error", e);
-            if (!raw) {
-                return {
-                    "success": false,
-                    "errors": [
-                        "not-online"
-                    ]
-                }
-            }
-        });
+class Segment{
+    constructor(element){
+        this.rotation = 0;
+        this.element = element;
     }
 
-    static send(url, params) {
-        let fullUrl = Helper.basePath(DataManager.dataPath + url);
+    isSolved(){
+        return this.rotation === 0;
+    }
+    
+    rotate(){};
 
-        if (!(params instanceof FormData)) {
-            let newParams = new FormData();
-            for (let k in params) {
-                newParams.append(k, params[k]);
-            }
-            params = newParams;
-        }
+    _updateElement(){};
 
-        return fetch(fullUrl, {
-            "credentials": "same-origin",
-            "method": "POST",
-            "body": params
-        }).then(function (res) {
-            return res.json();
-        }).catch(function (e) {
-            console.error("error", e);
-            return {
-                "success": false,
-                "errors": [
-                    "not-online"
-                ]
-            }
-        });
+    applyRotations(rotations){
+        return rotations;
     }
 
-    static buildQuery(values) {
-        return Helper.buildQuery(values);
+    getElement()
+    {
+        return this.element;
     }
 }
 
-DataManager.dataPath = "data/";
-DataManager.cachePath = "cached/";
-
-class SettingsSite extends AbstractSite$1 {
-    constructor(siteManager) {
-        super(siteManager, 'public/html/settings.html', "settings");
-        for (let k in SettingsSite.settingsFragments) {
-            this.addSettingsFragment(k, new SettingsSite.settingsFragments[k](this));
-        }
-        this.active = null;
+class ParentSegment extends Segment {
+    constructor(element) {
+        super(element);
+        this.children = [];
+        this.class = "rotate-0";
     }
 
-    addSettingsFragment(name, settingsFragment) {
-        this.addFragment("#settings-fragments", settingsFragment);
-        delete this.fragments["#settings-fragments"];
-        this.fragments[name] = settingsFragment;
+    rotate() {
+        this.rotation += 90;
+        this.rotation %= 360;
+        
+        this._updateRotationClass();
     }
 
-    onStart() {
-        let res = super.onStart();
-        if (Helper.isNotNull(this.active) && !this.fragments[this.active].isActive()) {
-            this.setActive(null);
+    applyRotations(rotations)
+    {
+        // debugger;
+        this.rotation = rotations[0];
+        rotations.splice(0,1);
+        for (let i = 0, n = this.children.length; i < n; i++) {
+            rotations = this.children[i].applyRotations(rotations);
         }
-
-        this.buildList();
-        return res;
+        return rotations;
     }
 
-    setActive(name) {
-        if (Helper.isNotNull(this.active)) {
-            this.fragments[this.active].inflatePromise.then(function (view) {
-                view.classList.remove("active");
-            });
-            this.findBy("#show-fragment-" + this.active).classList.remove("active");
-        }
-        this.active = name;
-        if (Helper.isNotNull(this.active)) {
-            this.fragments[this.active].inflatePromise.then(function (view) {
-                view.classList.add("active");
-            });
-            this.findBy("#show-fragment-" + this.active).classList.add("active");
-        }
-    }
-
-    buildList() {
-        let listNameElem = this.findBy("#settings-fragment-list");
-        listNameElem.removeAllChildren();
-
-        let self = this;
-        for (let k in this.fragments) {
-            if (this.fragments[k].isActive()) {
-
-                let liElement = document.createElement("li");
-                liElement.id = "show-fragment-" + k;
-                liElement.appendChild(Translator.makePersistentTranslation(k, null, "a"));
-                liElement.addEventListener("click", function () {
-                    self.setActive(k);
-                });
-                listNameElem.appendChild(liElement);
-
-                if (Helper.isNull(this.active)) {
-                    this.setActive(k);
-                }
+    isSolved() {
+        for (let i = 0, n = this.children.length; i < n; i++) {
+            if (!this.children[i].isSolved()) {
+                return false;
             }
         }
+        return super.isSolved();
     }
 
-    static addSettingsFragment(name, settingsFragment) {
-        SettingsSite.settingsFragments[name] = settingsFragment;
+    setChildren(children) {
+        this.children = [];
+        for (let i = 0, n = children.length; i < n; i++) {
+            this.addChild(children[i]);
+        }
     }
 
-    static setAddSettingsSite(addLink) {
-        SettingsSite.shouldAddSettingsSite = addLink;
+    addChild(child) {
+        this.children.push(child);
+        this._updateElement();
+    }
+
+    _updateRotationClass(){
+        this.element.classList.remove(this.class);
+        this.class = "rotate-" + this.rotation;
+        this.element.classList.add(this.class);
+    }
+
+    _updateElement() {
+        const childContainer = this.element.querySelector(".child-container");
+        childContainer.removeAllChildren();
+
+        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();
+            childContainer.appendChild(this.children[i].getElement());
+        }
     }
 }
 
-SettingsSite.settingsFragments = {};
-SettingsSite.shouldAddSettingsSite = true;
+class LeafSegment extends Segment{
 
-InitPromise.addPromise(function (app) {
-    if (SettingsSite.shouldAddSettingsSite) {
-        app.addDeepLink("settings", SettingsSite.name);
-
-        let settingsAction = new MenuAction("settings", function () {
-            app.startSite(SettingsSite.name);
-        }, MenuAction.SHOW_FOR_LARGE, 10000);
-        settingsAction.setIcon("img/settings.png");
-        app.addDefaultAction(settingsAction);
+    constructor(element, leaf) {
+        super(element);
+        this.leaf = 'A';
+        if (Helper.isNotNull(leaf))
+        {
+            this.setLeaf(leaf);
+        }
+    }
+    
+    setLeaf(leaf)
+    {
+        this.leaf = leaf;
     }
-});
 
-class ClockSite extends AbstractSite$1
-{
+    _updateElement() {
+        this.element.querySelector(".leaf-element").removeAllChildren().appendChild(document.createTextNode(this.leaf));
+    }
+}
+
+class TemplateContainer{
+    constructor(leafTemplate, parentTemplate, rowTemplate){
+        this.leafTemplate = leafTemplate;
+        this.parentTemplate = parentTemplate;
+        this.rowTemplate = rowTemplate;
+    }
+
+    copyLeafTemplate()
+    {
+        return Helper.cloneNode(this.leafTemplate);
+    }
+
+    copyParentTemplate()
+    {
+        return Helper.cloneNode(this.parentTemplate);
+    }
+
+    copyRowTemplate()
+    {
+        return Helper.cloneNode(this.rowTemplate);
+    }
+}
+
+class Level {
+    constructor(templateContainer) {
+        this.rootSegment = null;
+        this.words = [];
+        this.startRotations = [];
+        this.templateContainer = templateContainer;
+    }
+
+    setWords(words)
+    {
+        this.words = words;
+    }
+
+    setStartRotations(rotations)
+    {
+        this.startRotations = rotations;
+    }
+
+    hasWon() {
+        return this.rootSegment.isSolved();
+    }
+
+    getRootSegment(){
+        return this.rootSegment;
+    }
+
+    createSegments() {};
+
+    static _createLeafsForWord(word, leafSegmentTemplate)
+    {
+        let leafSegments = [];
+        for (let i = 0, n = word.length; i < n; i++) {
+            leafSegments.push(new LeafSegment(Helper.cloneNode(leafSegmentTemplate), word.charAt(i)));
+        }
+        return leafSegments;
+    }
+}
+
+class RowSegment extends ParentSegment{
+    rotate() {}
+
+    applyRotations(rotations)
+    {
+        for (let i = 0, n = this.children.length; i < n; i++) {
+            rotations = this.children[i].applyRotations(rotations);
+        }
+        return rotations;
+    }
+}
+
+class SimpleLevel extends Level{
+
+    createSegments() {
+        if (this.words.length >= 2 && this.words[0].length >= 6 &&this.words[1].length >= 6){
+
+            let leafsWordOne = Level._createLeafsForWord(this.words[0], this.templateContainer.copyLeafTemplate());
+            let leafsWordTwo = Level._createLeafsForWord(this.words[1], this.templateContainer.copyLeafTemplate());
+
+            let segmentOne = new ParentSegment(this.templateContainer.copyParentTemplate());
+            let segmentTwo = new ParentSegment(this.templateContainer.copyParentTemplate());
+            let segmentThree = new ParentSegment(this.templateContainer.copyParentTemplate());
+
+            segmentOne.addChild(leafsWordOne[0]);
+            segmentOne.addChild(leafsWordOne[1]);
+            segmentOne.addChild(leafsWordTwo[0]);
+            segmentOne.addChild(leafsWordTwo[1]);
+
+            segmentTwo.addChild(leafsWordOne[2]);
+            segmentTwo.addChild(leafsWordOne[3]);
+            segmentTwo.addChild(leafsWordTwo[2]);
+            segmentTwo.addChild(leafsWordTwo[3]);
+
+            segmentThree.addChild(leafsWordOne[4]);
+            segmentThree.addChild(leafsWordOne[5]);
+            segmentThree.addChild(leafsWordTwo[4]);
+            segmentThree.addChild(leafsWordTwo[5]);
+
+            this.rootSegment = new RowSegment(this.templateContainer.copyRowTemplate());
+            this.rootSegment.addChild(segmentOne);
+            this.rootSegment.addChild(segmentTwo);
+            this.rootSegment.addChild(segmentThree);
+
+            this.rootSegment.applyRotations(this.startRotations);
+        }
+    }
+}
+
+class LevelSite extends AbstractSite$1{
     constructor(siteManager) {
-        super(siteManager, "html/application/clock.html");
+        super(siteManager, "html/application/level.html", "level");
     }
 
-
     onConstruct(args) {
-        this.setTitle("clock");
+        this.setTitle("Level");
         return super.onConstruct(args);
     }
 
-    onFirstStart(){
-        DataManager.load("clock").then(function(data){
-            document.getElementById("current-time").innerText = data.result.date;
-        });
+    onFirstStart() {
+        super.onFirstStart();
+
+        let leafSegmentTemplate = this.findBy("#segment-leaf-template");
+        let parentSegmentTemplate = this.findBy("#segment-parent-template");
+        let rowSegmentTemplate = this.findBy("#segment-row-template");
+
+        leafSegmentTemplate.id = null;
+        parentSegmentTemplate.id = null;
+        rowSegmentTemplate.id = null;
+
+        leafSegmentTemplate.remove();
+        parentSegmentTemplate.remove();
+        rowSegmentTemplate.remove();
+
+        let templateContainer = new TemplateContainer(leafSegmentTemplate, parentSegmentTemplate, rowSegmentTemplate);
+
+
+        let level = new SimpleLevel(templateContainer);
+        level.setWords([
+            "Dynamo",
+            "Abhang"
+        ]);
+        level.setStartRotations([0,90,180]);
+
+        level.createSegments();
+        level.getRootSegment()._updateElement();
+        this.findBy("#level").appendChild(level.getRootSegment().getElement());
     }
 }
 
@@ -2941,7 +3041,7 @@ ShareManager.addShareButton(new TelegramShareButton('img/telegram.svg'));
 let app = new App();
 // app.addDeepLink("policy", PrivatePolicySite.name);
 app.setAddThemeAction(true);
-// app.addDefaultAction(Translator.generateChangeLanguageMenuAction());
+app.addDefaultAction(Translator.generateChangeLanguageMenuAction());
 
 //bridge für Android
 // window["ThemeManager"] = ThemeManager;
@@ -2952,6 +3052,6 @@ app.setAddThemeAction(true);
 // window["Translator"]["setLanguage"] = Translator.setLanguage;
 
 InitPromise.resolve(app).then(function(){
-    app.start(ClockSite);
+    app.start(LevelSite);
     Translator.setLanguage("de");
 });