From f4ce1d54ee43f269e1074920cb658048ac8371e9 Mon Sep 17 00:00:00 2001
From: silas <git@silas>
Date: Sun, 17 Jun 2018 20:05:09 +0200
Subject: [PATCH] update to pc

---
 .idea/php.xml                                 |   1 +
 .idea/watcherTasks.xml                        |   2 +-
 .idea/wordRotator.iml                         |   2 +
 bin/afterUpdate.sh                            |   4 +-
 bin/concatTranslator.js                       |   1 +
 bin/localLink.sh                              |   4 +-
 public/css/wordRotator.css                    |   2 +-
 public/html/application/clock.html            |   1 -
 public/html/application/level.html            |   2 +-
 public/index.html                             |   6 +-
 public/js/app.js                              | 166 +++++++++++++++---
 public/js/lang/de.json                        |   2 +-
 public/js/lang/en.json                        |   2 +-
 src/js/lib/pwa-assets.js                      |  63 ++++++-
 src/js/lib/pwa-lib.js                         | 161 +++++++----------
 .../pwa/html/application/level.html           |  29 ++-
 .../Application/pwa/js/WordRotatorDb.js       |  11 +-
 .../Application/pwa/js/site/LevelSite.js      |  53 +++++-
 .../pwa/js/wordrotator/Level/Level.js         |  24 +++
 .../pwa/js/wordrotator/Level/LevelHelper.js   |  19 +-
 .../pwa/js/wordrotator/Level/RowLevel.js      |   4 +-
 .../js/wordrotator/Segment/ParentSegment.js   |   5 +-
 .../Application/pwa/translations/de.json      |   6 +-
 .../Application/pwa/translations/en.json      |   3 +-
 src/scss/wordRotator.scss                     | 117 ++++++------
 25 files changed, 467 insertions(+), 223 deletions(-)
 delete mode 100644 public/html/application/clock.html

diff --git a/.idea/php.xml b/.idea/php.xml
index 247c14b..d3e2f37 100644
--- a/.idea/php.xml
+++ b/.idea/php.xml
@@ -73,6 +73,7 @@
       <path value="$PROJECT_DIR$/vendor/zendframework/zend-di" />
       <path value="$PROJECT_DIR$/vendor/zendframework/zend-mvc-plugin-prg" />
       <path value="$PROJECT_DIR$/vendor/zendframework/zend-permissions-acl" />
+      <path value="$PROJECT_DIR$/vendor/true/punycode" />
     </include_path>
   </component>
 </project>
\ No newline at end of file
diff --git a/.idea/watcherTasks.xml b/.idea/watcherTasks.xml
index 7401933..af6ef7f 100644
--- a/.idea/watcherTasks.xml
+++ b/.idea/watcherTasks.xml
@@ -78,7 +78,7 @@
       <option name="runOnExternalChanges" value="true" />
       <option name="scopeName" value="translator" />
       <option name="trackOnlyRoot" value="false" />
-      <option name="workingDir" value="$PROJECT_DIR$/../stories" />
+      <option name="workingDir" value="$PROJECT_DIR$" />
       <envs />
     </TaskOptions>
     <TaskOptions isEnabled="false">
diff --git a/.idea/wordRotator.iml b/.idea/wordRotator.iml
index e306653..bcf3c2f 100644
--- a/.idea/wordRotator.iml
+++ b/.idea/wordRotator.iml
@@ -3,6 +3,8 @@
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$">
       <sourceFolder url="file://$MODULE_DIR$/src/module/Application/src" isTestSource="false" packagePrefix="Application\" />
+      <sourceFolder url="file://$MODULE_DIR$/src/module/Application/pwa/html" isTestSource="false" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/true/punycode" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
diff --git a/bin/afterUpdate.sh b/bin/afterUpdate.sh
index 64fc3ad..98fa8c3 100755
--- a/bin/afterUpdate.sh
+++ b/bin/afterUpdate.sh
@@ -15,4 +15,6 @@ for d in "vendor/ainias/pwa"*/; do
 done
 #bin/jsConcat.sh src/js public/js/app 1
 
-node bin/concatTranslator.js
\ No newline at end of file
+node bin/concatTranslator.js
+
+bin/build.sh
\ No newline at end of file
diff --git a/bin/concatTranslator.js b/bin/concatTranslator.js
index d767896..5669ebc 100644
--- a/bin/concatTranslator.js
+++ b/bin/concatTranslator.js
@@ -37,6 +37,7 @@ for (var i = 0, n = moduleDirs.length; i < n; i++) {
 
 for (var lang in translations)
 {
+    console.log(translations[lang]);
     var langTranslations = JSON.stringify(translations[lang]);
     fs.writeFile(outputDir+"/"+lang+".json", langTranslations, err => {
         if (err){
diff --git a/bin/localLink.sh b/bin/localLink.sh
index d1eb5ae..abf78d3 100755
--- a/bin/localLink.sh
+++ b/bin/localLink.sh
@@ -1,3 +1,3 @@
 #!/usr/bin/env bash
-rm -rf /var/www/pwa/stories/vendor/ainias/$2
-ln -s $1 /var/www/pwa/stories/vendor/ainias/$2
+rm -rf /var/www/pwa/wordRotator/vendor/ainias/$2
+ln -s $1 /var/www/pwa/wordRotator/vendor/ainias/$2
diff --git a/public/css/wordRotator.css b/public/css/wordRotator.css
index 74f7d58..7897c8c 100644
--- a/public/css/wordRotator.css
+++ b/public/css/wordRotator.css
@@ -1 +1 @@
-@-webkit-keyframes rotate-90{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(90deg);transform:rotate(90deg)}}@keyframes rotate-90{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(90deg);transform:rotate(90deg)}}@-webkit-keyframes rotate-180{0%{-webkit-transform:rotate(90deg);transform:rotate(90deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}@keyframes rotate-180{0%{-webkit-transform:rotate(90deg);transform:rotate(90deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}@-webkit-keyframes rotate-270{0%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(270deg);transform:rotate(270deg)}}@keyframes rotate-270{0%{-webkit-transform:rotate(180deg);transform:rotate(180deg)}to{-webkit-transform:rotate(270deg);transform:rotate(270deg)}}@-webkit-keyframes rotate-360{0%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotate-360{0%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.segment:not(.segment-row).rotate-90{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment{-webkit-animation-name:rotate-360;animation-name:rotate-360;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-90{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-180{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-270{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-360{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment,.segment:not(.segment-row).rotate-180 .segment.rotate-90{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-180{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-270{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-360{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment,.segment:not(.segment-row).rotate-270 .segment.rotate-90{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-180{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-270{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-360{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360{-webkit-animation-name:rotate-360;animation-name:rotate-360;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment,.segment:not(.segment-row).rotate-360 .segment.rotate-90{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-180{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-270{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-360{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment{cursor:pointer;display:inline-block;text-align:center;position:relative;-webkit-transition:0s;transition:0s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.segment.segment-row{display:block;width:100%;-webkit-animation:none!important;animation:none!important}.segment.segment-leaf{min-width:17px;height:34px;line-height:34px}.segment.segment-parent{border:1px solid #a9a9a9;border-radius:3px}.segment.segment-parent .segment{width:50%}
\ No newline at end of file
+.height-10{height:10%}.width-10{width:10%}.height-20{height:20%}.width-20{width:20%}.height-30{height:30%}.width-30{width:30%}.height-40{height:40%}.width-40{width:40%}.height-50{height:50%}.width-50{width:50%}.height-60{height:60%}.width-60{width:60%}.height-70{height:70%}.width-70{width:70%}.height-80{height:80%}.width-80{width:80%}.height-90{height:90%}.width-90{width:90%}.height-100{height:100%}.width-100{width:100%}@-webkit-keyframes rotate-90{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:#fff;z-index:1}}@keyframes rotate-90{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:#fff;z-index:1}}@-webkit-keyframes rotate-180{0%{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:#fff;z-index:1}}@keyframes rotate-180{0%{-webkit-transform:rotate(90deg);transform:rotate(90deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:#fff;z-index:1}}@-webkit-keyframes rotate-270{0%{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:#fff;z-index:1}}@keyframes rotate-270{0%{-webkit-transform:rotate(180deg);transform:rotate(180deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:transparent;z-index:0}to{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:#fff;z-index:1}}@-webkit-keyframes rotate-360{0%{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(1turn);transform:rotate(1turn);background-color:transparent;z-index:0}to{-webkit-transform:rotate(1turn);transform:rotate(1turn);background-color:#fff;z-index:1}}@keyframes rotate-360{0%{-webkit-transform:rotate(270deg);transform:rotate(270deg);background-color:transparent;z-index:0}99%{-webkit-transform:rotate(1turn);transform:rotate(1turn);background-color:transparent;z-index:0}to{-webkit-transform:rotate(1turn);transform:rotate(1turn);background-color:#fff;z-index:1}}.segment:not(.segment-row).rotate-90{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment{-webkit-animation-name:rotate-360;animation-name:rotate-360;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-90{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-180{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-270{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-90 .segment.rotate-360{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment,.segment:not(.segment-row).rotate-180 .segment.rotate-90{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-180{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-270{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-180 .segment.rotate-360{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment,.segment:not(.segment-row).rotate-270 .segment.rotate-90{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-180{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-270{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-270 .segment.rotate-360{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360{-webkit-animation-name:rotate-360;animation-name:rotate-360;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment,.segment:not(.segment-row).rotate-360 .segment.rotate-90{-webkit-animation-name:rotate-90;animation-name:rotate-90;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-180{-webkit-animation-name:rotate-180;animation-name:rotate-180;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-270{-webkit-animation-name:rotate-270;animation-name:rotate-270;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}.segment:not(.segment-row).rotate-360 .segment.rotate-360{-webkit-animation-name:rotate-0;animation-name:rotate-0;-webkit-animation-duration:.25s;animation-duration:.25s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;animation-direction:reverse;-webkit-animation-timing-function:linear;animation-timing-function:linear}#level{white-space:nowrap;max-width:100%;overflow-y:visible}#level,#level *,.segment{-webkit-transition:none;transition:none}.segment{white-space:normal;cursor:pointer;display:inline-block;text-align:center;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:1;background-color:#fff}.segment.segment-row{display:block;width:100%;-webkit-animation:none!important;animation:none!important;white-space:nowrap}.segment.segment-leaf{min-width:1em;height:2em;line-height:2em}.segment.segment-parent{border:1px solid #a9a9a9;border-radius:3px}.segment.segment-parent .segment{width:50%}.show-when-won{visibility:hidden}.show-when-won,.show-when-won *{-webkit-transition:none;transition:none}.won .show-when-won{visibility:initial}
\ No newline at end of file
diff --git a/public/html/application/clock.html b/public/html/application/clock.html
deleted file mode 100644
index edab4af..0000000
--- a/public/html/application/clock.html
+++ /dev/null
@@ -1 +0,0 @@
-<div class=row><div class="small-12 smedium-6 columns" data-translation=current-time>Current time:</div><div class="small-12 smedium-6 columns" id=current-time>???</div></div>
\ No newline at end of file
diff --git a/public/html/application/level.html b/public/html/application/level.html
index 386d6b5..533f394 100644
--- a/public/html/application/level.html
+++ b/public/html/application/level.html
@@ -1 +1 @@
-<div><div id=segment-leaf-template class="segment segment-leaf"><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>
\ No newline at end of file
+<div class=max-height><div id=segment-leaf-template class="segment segment-leaf"><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 class=max-height><div class="show-when-won height-20 center flex-center"><b data-translation=won id=won-text></b></div><div class="flex-center height-60 overflow-hidden"><div id=level></div></div><div class="show-when-won flex-center height-20"><button class=button id=continue-button data-translation=continue></button></div></div></div>
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 595b3c6..271be21 100755
--- a/public/index.html
+++ b/public/index.html
@@ -86,13 +86,11 @@
 <div class="mainContainer">
     <div class="row">
         <div class="columns small-12" id="main-content">
-            <div id="site-content" role="main">
-                <div class='loader'>
+            <div id="site-content" role="main"><div class='loader'>
                     <svg viewBox="0 0 32 32" width="32" height="32">
                         <circle r="14" id="spinner" cx="16" cy="16" fill="none"></circle>
                     </svg>
-                </div>
-            </div>
+                </div></div>
             <div id="flashMessageContainerAbsoulte">
                 <div id="flashMessageContainer"></div>
             </div>
diff --git a/public/js/app.js b/public/js/app.js
index 72d91a5..fcf3b47 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -3037,12 +3037,57 @@ class Segment{
     }
 }
 
-class DelayPromise extends Promise{
-    constructor(delay) {
-        super((resolve) => {
-            setTimeout(resolve, delay);
+class ScaleHelper {
+    scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight) {
+        margin = Helper.nonNull(margin, 10);
+        ignoreHeight = Helper.nonNull(ignoreHeight, false);
+        ignoreWidth = Helper.nonNull(ignoreWidth, false);
+        fontWeight = Helper.nonNull(fontWeight, fontElement.innerHTML.length);
+
+        let hasNoTransitionClass = container.classList.contains("no-transition");
+        container.classList.add("no-transition");
+
+        let currentFontSize = 1;
+        let diff = 0;
+        let widthDiff = 0;
+        let heightDiff = 0;
+        let containerWidth = 0;
+        let containerHeight = 0;
+        do {
+            currentFontSize += diff / (fontWeight + 1);
+            fontElement.style.fontSize = currentFontSize + 'px';
+
+            let containerStyle = window.getComputedStyle(container);
+
+            containerWidth = containerStyle.getPropertyValue("width").replace('px', '');
+            containerHeight = containerStyle.getPropertyValue("height").replace('px', '');
+
+            widthDiff = containerWidth - fontElement.offsetWidth;
+            heightDiff = containerHeight - fontElement.offsetHeight;
+
+            let newDiff = (ignoreWidth ? heightDiff : (ignoreHeight ? widthDiff : Math.min(widthDiff, heightDiff)));
+            if (newDiff === diff) {
+                break;
+            }
+            diff = newDiff;
+        } while ((widthDiff > (1 - scale) * containerWidth || ignoreWidth) && (heightDiff > (1 - scale) * containerHeight || ignoreHeight));
+        fontElement.style.fontSize = (currentFontSize - margin) + 'px';
+
+        if (!hasNoTransitionClass) {
+            container.classList.remove("no-transition");
+        }
+
+        let self = this;
+        window.addEventListener("resize", function () {
+            setTimeout(() => {
+                self.scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight);
+            }, 255);
         });
     }
+
+    scaleToFull(fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight) {
+        return this.scaleTo(1, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight);
+    }
 }
 
 class ParentSegment extends Segment {
@@ -3061,7 +3106,10 @@ class ParentSegment extends Segment {
             this.getLevel().checkHasWon(new Promise((resolve, reject)=>{
                 this.element.addEventListener("animationend", resolve);
             }));
-            return new DelayPromise(250);
+            // return new DelayPromise(250);
+            return new Promise(function(resolve) {
+                setTimeout(resolve, 250);
+            });
         }
     }
 
@@ -3177,6 +3225,7 @@ class Level {
         this.templateContainer = templateContainer;
 
         this.hasWon = false;
+        this.id = null;
 
         this.wonResolver = null;
         this.giveUpResolver = null;
@@ -3188,6 +3237,16 @@ class Level {
         });
     }
 
+    setId(id)
+    {
+        this.id = id;
+    }
+
+    getId()
+    {
+        return this.id;
+    }
+
     getLevel()
     {
         return this;
@@ -3197,6 +3256,10 @@ class Level {
     {
         this.rootSegment = rootSegment;
         this.rootSegment.setParent(this);
+        if (this.startRotations)
+        {
+            this.applyRotations();
+        }
     }
 
     setWords(words)
@@ -3212,6 +3275,15 @@ class Level {
         this.startRotations = rotations;
     }
 
+    applyRotations(rotations)
+    {
+        if (this.rootSegment)
+        {
+            rotations = Helper.nonNull(rotations, this.startRotations);
+            this.rootSegment.applyRotations(rotations);
+        }
+    }
+
     getHasWon()
     {
         return this.hasWon;
@@ -3281,29 +3353,32 @@ class RowLevel extends Level {
                 parent.addChild(leafsWordTwo[2 * i + 1]);
                 rootSegment.addChild(parent);
             }
-
-            rootSegment.applyRotations(this.startRotations);
-
+            // rootSegment.applyRotations(this.startRotations);
             this.setRootSegment(rootSegment);
         }
     }
 }
 
-class LevelHelper{
-    static setLevelType(typeId, level)
-    {
+class LevelHelper {
+    static setLevelType(typeId, level) {
         LevelHelper.types[typeId] = level;
     }
 
-    static getLevelClass(type)
-    {
+    static getLevelClass(type) {
         return LevelHelper.types[type];
     }
 
-    static inflateLevel(jsonLevel, templateContainer)
-    {
+    static inflateLevel(jsonLevel, templateContainer) {
         let level = new (LevelHelper.types[jsonLevel["rendererType"]])(templateContainer);
         level.setWords(jsonLevel["words"]);
+        level.setId(jsonLevel["id"]);
+
+        for (let i = 0, n = jsonLevel["rotations"].length; i < n; i++) {
+            if (jsonLevel["rotations"][i] <= 4) {
+                jsonLevel["rotations"][i] = 90 * jsonLevel["rotations"][i];
+            }
+        }
+
         level.setStartRotations(jsonLevel["rotations"]);
         return level;
     }
@@ -3355,12 +3430,12 @@ class WordRotatorDb extends MyDb {
         return this.load(levelId, WordRotatorDb.OBJECT_STORE.LEVEL);
     }
 
-    async loadNextLevel() {
+    async loadNextLevel(rendererTypes) {
         const levels = await this.loadMany("difficulty", IDBKeyRange.lowerBound(0), WordRotatorDb.OBJECT_STORE.LEVEL);
 
         let newLevels = [];
         for (let i = 0, n = levels.length; i < n; i++) {
-            if (!levels[i].deleted && !levels[i].played) {
+            if (!levels[i]["deleted"] && !levels[i]["played"] && rendererTypes.indexOf(levels[i]["rendererType"]) !== -1) {
                 newLevels.push(levels[i]);
             }
         }
@@ -3371,6 +3446,13 @@ class WordRotatorDb extends MyDb {
 
         return newLevels[Math.round(Math.random() * newLevels.length) % newLevels.length];
     }
+
+    async saveLevelPlayed(levelId)
+    {
+        const level = await this.loadLevel(levelId);
+        level.played = true;
+        return await this.saveObj(level, WordRotatorDb.OBJECT_STORE.LEVEL);
+    }
 }
 
 WordRotatorDb.OBJECT_STORE = {
@@ -3383,8 +3465,21 @@ class LevelSite extends AbstractSite$1 {
         super(siteManager, "html/application/level.html", "level");
     }
 
+    createActionBarMenu(menu) {
+        menu = super.createActionBarMenu(menu);
+
+        this.levelCounterAction = new MenuAction("", function(){}, Menu.SHOW_ALWAYS, 0);
+        this.levelCounterAction.setShouldTranslate(false);
+        menu.addAction(this.levelCounterAction);
+
+        return menu;
+    }
+
     onConstruct(args) {
         this.setTitle("Level");
+
+        this.levelCounter = Helper.nonNull(localStorage.getItem("levelCounter"), 1);
+
         return super.onConstruct(args);
     }
 
@@ -3403,24 +3498,43 @@ class LevelSite extends AbstractSite$1 {
         parentSegmentTemplate.remove();
         rowSegmentTemplate.remove();
 
+        let self = this;
+        let continueButton = this.findBy("#continue-button");
+        continueButton.addEventListener("click", ()=> {
+            self.nextLevel();
+        });
+
+        let wonText = this.findBy("#won-text");
+
+        let scaleHelper = new ScaleHelper();
+        scaleHelper.scaleToFull(continueButton, continueButton.parentElement);
+        scaleHelper.scaleToFull(wonText, wonText.parentElement);
+
+        this.levelCounterAction.setTitle(this.levelCounter);
         this.templateContainer = new TemplateContainer(leafSegmentTemplate, parentSegmentTemplate, rowSegmentTemplate);
         this.nextLevel();
     }
 
     async nextLevel() {
         try {
+            this._siteContent.classList.remove('won');
+
             const db = WordRotatorDb.getInstance();
-            const nextLevelJson = await db.loadNextLevel();
+            const nextLevelJson = await db.loadNextLevel([20]);
             const level = LevelHelper.inflateLevel(nextLevelJson, this.templateContainer);
 
             const self = this;
             level.getWonPromise().then(() => {
-                self.nextLevel();
+                self.levelWon(level);
             });
 
             level.createSegments();
             level.getRootSegment()._updateElement();
-            this.findBy("#level").appendChild(level.getRootSegment().getElement());
+
+            let levelSegment = this.findBy("#level");
+            levelSegment.removeAllChildren().appendChild(level.getRootSegment().getElement());
+            let scaleHelper = new ScaleHelper();
+            scaleHelper.scaleToFull(levelSegment, levelSegment.parentElement, false, false, 2,level.words[0].length * 2);
 
             this.level = level;
         }
@@ -3428,6 +3542,18 @@ class LevelSite extends AbstractSite$1 {
             console.error(e);
         }
     }
+
+    async levelWon(level){
+        const db = WordRotatorDb.getInstance();
+        // db.saveLevelPlayed(level);
+
+        this.levelCounter++;
+        localStorage.setItem("levelCounter", this.levelCounter);
+        this.levelCounterAction.setTitle(this.levelCounter);
+        this.levelCounterAction.redraw();
+
+        this._siteContent.classList.add('won');
+    }
 }
 
 class DataManager {
diff --git a/public/js/lang/de.json b/public/js/lang/de.json
index 2e73a89..00234d0 100644
--- a/public/js/lang/de.json
+++ b/public/js/lang/de.json
@@ -1 +1 @@
-{"is-writing":"{0} schreibt...","restart":"Story neustarten...","should-restart-title":"Wirklich neustarten?","should-restart-question":"Willst du wirklich neu starten? Dein bisheriger Fortschritt geht dabei verloren!","Sunday":"Sonntag","Monday":"Montag","Tuesday":"Dienstag","Wednesday":"Mittwoch","Thursday":"Donnerstag","Friday":"Freitag","Saturday":"Samstag","January":"Januar","February":"Februar","March":"März","April":"April","May":"Mai","June":"Juni","July":"Juli","August":"August","September":"September","October":"Oktober","November":"November","December":"Dezember","Sun":"So","Mon":"Mo","Tue":"Di","Wed":"Mi","Thu":"Do","Fri":"Fr","Sat":"Sa","Jan":"Jan","Feb":"Feb","Mar":"Mär","Apr":"Apr","Jun":"Jun","Jul":"Jul","Aug":"Aug","Sep":"Sep","Oct":"Okt","Nov":"Nov","Dec":"Dez","code-not-valid":"Der angegebebe Code ist nicht gültig!","code-activated":"Der Code wurde erfolgreich aktiviert!","current-lang":"DE","en":"Englisch","de":"Deutsch","black":"Schwarz","red":"Rot","blue":"Blau","green":"Grün","pink":"Rosa","cancel-button":"ABBRECHEN","confirm-button":"OK","we-use-cookie-hint":"Diese Seite nutzt Cookies. Durch das weitere Benutzen dieser Seite geben Sie uns das Recht Cookies so zu benutzen, wie es in unserer <a href='policy' data-site-name='policy' class='link deep-link' rel='nofollow' title='Datenschutzerklärung'>Datenschutzerklärung</a> steht.","policy-heading":"Datenschutzerklärung","area-of-validity-heading":"Geltungsbereich","area-of-validity":"Diese Datenschutzerklärung klärt Nutzer über die Art, den Umfang und Zwecke der Erhebung und Verwendung personenbezogener Daten durch den verantwortlichen Anbieter Silas Günther, Langenbusch 263b - 42897 Remscheid, matrix[at]silas.link auf dieser Website (im folgenden \"Angebot\") auf.<br/><br/>Die rechtlichen Grundlagen des Datenschutzes finden sich im Bundesdatenschutzgesetz (BDSG) und dem Telemediengesetz (TMG).","logfiles-heading":"Zugriffsdaten / Server-Logfiles","logfiles":"Der Anbieter (beziehungsweise sein Webspace-Provider) erhebt Daten über jeden Zugriff auf das Angebot (so genannte Serverlogfiles). Zu den Zugriffsdaten gehören:<br/><br/>Name der abgerufenen Webseite, Datei, Datum und Uhrzeit des Abrufs, übertragene Datenmenge, Meldung über erfolgreichen Abruf, Browsertyp nebst Version, das Betriebssystem des Nutzers, Referrer URL (die zuvor besuchte Seite), IP-Adresse und der anfragende Provider.<br/><br/>Der Anbieter verwendet die Protokolldaten nur für statistische Auswertungen zum Zweck des Betriebs, der Sicherheit und der Optimierung des Angebotes. Der Anbieter behält sich jedoch vor, die Protokolldaten nachträglich zu überprüfen, wenn aufgrund konkreter Anhaltspunkte der berechtigte Verdacht einer rechtswidrigen Nutzung besteht.","contact-support-heading":"Kontaktaufnahme","contact-support":"Bei der Kontaktaufnahme mit dem Anbieter (zum Beispiel per Post oder E-Mail) werden die Angaben des Nutzers zwecks Bearbeitung der Anfrage sowie für den Fall, dass Anschlussfragen entstehen, gespeichert.","cookies-heading":"Cookies","cookies":"Cookies sind kleine Dateien, die es ermöglichen, auf dem Zugriffsgerät der Nutzer (PC, Smartphone o.ä.) spezifische, auf das Gerät bezogene Informationen zu speichern. Sie dienen zum einem der Benutzerfreundlichkeit von Webseiten und damit den Nutzern (z.B. Speicherung von Logindaten). Zum anderen dienen sie, um die statistische Daten der Webseitennutzung zu erfassen und sie zwecks Verbesserung des Angebotes analysieren zu können. Die Nutzer können auf den Einsatz der Cookies Einfluss nehmen. Die meisten Browser verfügen eine Option mit der das Speichern von Cookies eingeschränkt oder komplett verhindert wird. Allerdings wird darauf hingewiesen, dass die Nutzung und insbesondere der Nutzungskomfort ohne Cookies eingeschränkt werden.<br/><br/>Sie können viele Online-Anzeigen-Cookies von Unternehmen über die US-amerikanische Seite <a class = 'link' href='http://www.aboutads.info/choices/'>http://www.aboutads.info/choices/</a> oder die EU-Seite <a class = 'link' href='http://www.youronlinechoices.com/uk/your-ad-choices/'>http://www.youronlinechoices.com/uk/your-ad-choices/</a> verwalten.","google-analytics-heading":"Google Analytics","google-analytics":"Dieses Angebot benutzt Google Analytics, einen Webanalysedienst der Google Inc. („Google“). Google Analytics verwendet sog. „Cookies“, Textdateien, die auf Computer der Nutzer gespeichert werden und die eine Analyse der Benutzung der Website durch sie ermöglichen. Die durch den Cookie erzeugten Informationen über Benutzung dieser Website durch die Nutzer werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert.<br/><br/>Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite, wird die IP-Adresse der Nutzer von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt. Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Die IP-Anonymisierung ist auf dieser Website aktiv. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um die Nutzung der Website durch die Nutzer auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen.<br/><br/>Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt. Die Nutzer können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; Dieses Angebot weist die Nutzer jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Die Nutzer können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren: <a class = 'link' href='http://tools.google.com/dlpage/gaoptout?hl=de'>http://tools.google.com/dlpage/gaoptout?hl=de</a>.<br/><br/>Weitere Informationen zur Datennutzung zu Werbezwecken durch Google, Einstellungs- und Widerspruchsmöglichkeiten erfahren Sie auf den Webseiten von Google:<br/><a class = 'link' href='https://www.google.com/intl/de/policies/privacy/partners/'>https://www.google.com/intl/de/policies/privacy/partners/</a> („Datennutzung durch Google bei Ihrer Nutzung von Websites oder Apps unserer Partner“),<br/><a class = 'link' href='http://www.google.com/policies/technologies/ads'>http://www.google.com/policies/technologies/ads</a> („Datennutzung zu Werbezwecken“),<br/><a class = 'link' href='http://www.google.de/settings/ads'> http://www.google.de/settings/ads</a> („Informationen verwalten, die Google verwendet, um Ihnen Werbung einzublenden“) und<br/><a class = 'link' href='http://www.google.com/ads/preferences/'>http://www.google.com/ads/preferences/</a> („Bestimmen Sie, welche Werbung Google Ihnen zeigt“).","edited-hint":"Der generierte Text wurde vom Webseiteninhaber angepasst.","generated-hint":"Erstellt mit Datenschutz-Generator.de von RA Dr. Thomas Schwenke","google-play-services-heading":"Google Play Dienste","google-play-services":"Features wie die Bestenliste und Erfolge benötigen einen Login bei Google Play. Hierfür wird die Identität benötigt, um die entsprechenden Punktzahlen und Erfolge an das jeweilige Google Play-Konto zu knüpfen. Alle anderen Features sind weiterhin auch ohne Login bei Google Play nutzbar. Außerdem kann sich jederzeit in den Einstellungen von Google Play abgemeldet werden.","settings":"Einstellungen","close":"Schließen","other-apps":"Andere Apps","optimistic-locking-dialog":"Deine Änderungen können nicht gespeichert werden! Ein anderer Benutzer hat die Daten bereits verändert. Bitte lade die Daten neu und speichere danach.","optimistic-locking-dialog-title":"Nicht gespeichert!","not-online":"Du bist nicht mit dem Internet verbunden. Bitte überprüfe deine Verbindung.","search":"Suchen...","site":"Seite","HTTP-Exception (403) Forbidden":"Nicht erlaubt!","login":"Login","login-email":"E-Mail","login-password":"Passwort","login-automated-login":"Automatischer Login","login-submit":"Login","logout":"Ausloggen","username-or-password-wrong":"Entweder der Username oder das Passwort stimmt nicht!","login-success":"Willkommen zurück!","logged-out-successfully":"Tschüss!","registration":"Registrieren","registration-username":"Username","registration-email":"E-Mail","registration-password1":"Passwort","registration-password2":"Passwort wiederholen","registration-submit":"Registrieren","registration-success":"Ein Registrierungscode wurde an Ihre E-Mailadresse gesendet.","not-allowed-title":"Nicht erlaubt!","not-allowed":"Du hast keine Berechtigung für diese Seite. Wenn das ein Fehler ist, wende dich bitte an einen Admin.","forgot-password":"Passwort vergessen?","forgot-password-title":"Passwort vergessen","forgot-password-email":"E-Mail","forgot-password-submit":"Absenden","forgot-password-text":"Gib deine E-Mailadresse in das Feld ein. Ist die Adresse registriert, werden wir eine E-Mail mit einem Passwort-Resetcode senden.","no-user-found":"Es gibt keinen Benutzer mit dieser E-Mailadresse","new-password-code-send":"Es wurde ein Reset-Code an deine E-Mailadresse gesendet.","new-password":"Neues Passwort","new-password-password1":"Passwort","new-password-password2":"Passwort wiederholen","new-password-submit":"Passwort setzten","password-updated":"Das Passwort ist geupdated!","user-settings":"E-Mail & Username","user-settings-title":"E-Mail & Username","user-settings-form-username":"Username","user-settings-form-old-email":"Aktuelle E-Mail","user-settings-form-new-email":"Neue E-Mail","user-settings-form-submit":"Speichern","user-data-is-changed":"Die Daten wurden gespeichert.","email-code-send":"Ein Änderungscode wurde an die neue E-Mailadresse gesendet. Sobald der Code aktiviert wurde, werden Ihnen E-Mails an die neue Adresse gesendet.","change-email-new-automated-login":"Wenn die E-Mailadresse geändert wird, muss der automatische Login erneut aktiviert werden!","password-settings":"Passwort","change-password-title":"Passwort","change-password-new-automated-login":"Wenn das Passwort geändert wird, muss der automatische Login erneut aktiviert werden!","change-password-old-password":"Altes Passwort","change-password-new-password1":"Neues Passwort","change-password-new-password2":"Neues Passwort wiederholen","change-password-submit":"Speichern","password-changed":"Das Passwort wurde erfolgreich geändert!","registration-username-empty":"Der Username darf nicht leer sein.","registration-username-wrong-char":"Der Username darf nur aus Buchstaben, Zahlen oder den folgenden Zeichen bestehen: -_.&;()#!?$+\",","registration-username-already-taken":"Der Username ist schon vergeben. Bitte wähle einen anderen.","registration-password-empty":"Das Passwort darf nicht leer sein.","registration-password-short":"Das Passwort muss mindestens 8 Zeichen lang sein.","registration-password-not-identical":"Die Passwörter sind nicht identlisch.","registration-email-empty":"Die Email darf nicht leer sein.","registration-email-not-valid":"Die Emailadresse ist keine gültige Emailadresse.","registration-email-already-taken":"Es gibt bereits einen Account mit der Emailadresse.","change-password-old-password-wrong":"Das Passwort stimmt nicht!","user-roles-heading":"Benutzerrollen","user-roles-list":"Aktuelle Rollen:","available-roles-list":"Verfügbare Rollen:","name":"Name","description":"Beschreibung"}
\ No newline at end of file
+{"won":"Gewonnen!","continue":"Weiter","Sunday":"Sonntag","Monday":"Montag","Tuesday":"Dienstag","Wednesday":"Mittwoch","Thursday":"Donnerstag","Friday":"Freitag","Saturday":"Samstag","January":"Januar","February":"Februar","March":"März","April":"April","May":"Mai","June":"Juni","July":"Juli","August":"August","September":"September","October":"Oktober","November":"November","December":"Dezember","Sun":"So","Mon":"Mo","Tue":"Di","Wed":"Mi","Thu":"Do","Fri":"Fr","Sat":"Sa","Jan":"Jan","Feb":"Feb","Mar":"Mär","Apr":"Apr","Jun":"Jun","Jul":"Jul","Aug":"Aug","Sep":"Sep","Oct":"Okt","Nov":"Nov","Dec":"Dez","code-not-valid":"Der angegebebe Code ist nicht gültig!","code-activated":"Der Code wurde erfolgreich aktiviert!","current-lang":"DE","en":"Englisch","de":"Deutsch","black":"Schwarz","red":"Rot","blue":"Blau","green":"Grün","pink":"Rosa","cancel-button":"ABBRECHEN","confirm-button":"OK","we-use-cookie-hint":"Diese Seite nutzt Cookies. Durch das weitere Benutzen dieser Seite geben Sie uns das Recht Cookies so zu benutzen, wie es in unserer <a href='policy' data-site-name='policy' class='link deep-link' rel='nofollow' title='Datenschutzerklärung'>Datenschutzerklärung</a> steht.","policy-heading":"Datenschutzerklärung","area-of-validity-heading":"Geltungsbereich","area-of-validity":"Diese Datenschutzerklärung klärt Nutzer über die Art, den Umfang und Zwecke der Erhebung und Verwendung personenbezogener Daten durch den verantwortlichen Anbieter Silas Günther, Langenbusch 263b - 42897 Remscheid, matrix[at]silas.link auf dieser Website (im folgenden \"Angebot\") auf.<br/><br/>Die rechtlichen Grundlagen des Datenschutzes finden sich im Bundesdatenschutzgesetz (BDSG) und dem Telemediengesetz (TMG).","logfiles-heading":"Zugriffsdaten / Server-Logfiles","logfiles":"Der Anbieter (beziehungsweise sein Webspace-Provider) erhebt Daten über jeden Zugriff auf das Angebot (so genannte Serverlogfiles). Zu den Zugriffsdaten gehören:<br/><br/>Name der abgerufenen Webseite, Datei, Datum und Uhrzeit des Abrufs, übertragene Datenmenge, Meldung über erfolgreichen Abruf, Browsertyp nebst Version, das Betriebssystem des Nutzers, Referrer URL (die zuvor besuchte Seite), IP-Adresse und der anfragende Provider.<br/><br/>Der Anbieter verwendet die Protokolldaten nur für statistische Auswertungen zum Zweck des Betriebs, der Sicherheit und der Optimierung des Angebotes. Der Anbieter behält sich jedoch vor, die Protokolldaten nachträglich zu überprüfen, wenn aufgrund konkreter Anhaltspunkte der berechtigte Verdacht einer rechtswidrigen Nutzung besteht.","contact-support-heading":"Kontaktaufnahme","contact-support":"Bei der Kontaktaufnahme mit dem Anbieter (zum Beispiel per Post oder E-Mail) werden die Angaben des Nutzers zwecks Bearbeitung der Anfrage sowie für den Fall, dass Anschlussfragen entstehen, gespeichert.","cookies-heading":"Cookies","cookies":"Cookies sind kleine Dateien, die es ermöglichen, auf dem Zugriffsgerät der Nutzer (PC, Smartphone o.ä.) spezifische, auf das Gerät bezogene Informationen zu speichern. Sie dienen zum einem der Benutzerfreundlichkeit von Webseiten und damit den Nutzern (z.B. Speicherung von Logindaten). Zum anderen dienen sie, um die statistische Daten der Webseitennutzung zu erfassen und sie zwecks Verbesserung des Angebotes analysieren zu können. Die Nutzer können auf den Einsatz der Cookies Einfluss nehmen. Die meisten Browser verfügen eine Option mit der das Speichern von Cookies eingeschränkt oder komplett verhindert wird. Allerdings wird darauf hingewiesen, dass die Nutzung und insbesondere der Nutzungskomfort ohne Cookies eingeschränkt werden.<br/><br/>Sie können viele Online-Anzeigen-Cookies von Unternehmen über die US-amerikanische Seite <a class = 'link' href='http://www.aboutads.info/choices/'>http://www.aboutads.info/choices/</a> oder die EU-Seite <a class = 'link' href='http://www.youronlinechoices.com/uk/your-ad-choices/'>http://www.youronlinechoices.com/uk/your-ad-choices/</a> verwalten.","google-analytics-heading":"Google Analytics","google-analytics":"Dieses Angebot benutzt Google Analytics, einen Webanalysedienst der Google Inc. („Google“). Google Analytics verwendet sog. „Cookies“, Textdateien, die auf Computer der Nutzer gespeichert werden und die eine Analyse der Benutzung der Website durch sie ermöglichen. Die durch den Cookie erzeugten Informationen über Benutzung dieser Website durch die Nutzer werden in der Regel an einen Server von Google in den USA übertragen und dort gespeichert.<br/><br/>Im Falle der Aktivierung der IP-Anonymisierung auf dieser Webseite, wird die IP-Adresse der Nutzer von Google jedoch innerhalb von Mitgliedstaaten der Europäischen Union oder in anderen Vertragsstaaten des Abkommens über den Europäischen Wirtschaftsraum zuvor gekürzt. Nur in Ausnahmefällen wird die volle IP-Adresse an einen Server von Google in den USA übertragen und dort gekürzt. Die IP-Anonymisierung ist auf dieser Website aktiv. Im Auftrag des Betreibers dieser Website wird Google diese Informationen benutzen, um die Nutzung der Website durch die Nutzer auszuwerten, um Reports über die Websiteaktivitäten zusammenzustellen und um weitere mit der Websitenutzung und der Internetnutzung verbundene Dienstleistungen gegenüber dem Websitebetreiber zu erbringen.<br/><br/>Die im Rahmen von Google Analytics von Ihrem Browser übermittelte IP-Adresse wird nicht mit anderen Daten von Google zusammengeführt. Die Nutzer können die Speicherung der Cookies durch eine entsprechende Einstellung Ihrer Browser-Software verhindern; Dieses Angebot weist die Nutzer jedoch darauf hin, dass Sie in diesem Fall gegebenenfalls nicht sämtliche Funktionen dieser Website vollumfänglich werden nutzen können. Die Nutzer können darüber hinaus die Erfassung der durch das Cookie erzeugten und auf ihre Nutzung der Website bezogenen Daten (inkl. Ihrer IP-Adresse) an Google sowie die Verarbeitung dieser Daten durch Google verhindern, indem sie das unter dem folgenden Link verfügbare Browser-Plugin herunterladen und installieren: <a class = 'link' href='http://tools.google.com/dlpage/gaoptout?hl=de'>http://tools.google.com/dlpage/gaoptout?hl=de</a>.<br/><br/>Weitere Informationen zur Datennutzung zu Werbezwecken durch Google, Einstellungs- und Widerspruchsmöglichkeiten erfahren Sie auf den Webseiten von Google:<br/><a class = 'link' href='https://www.google.com/intl/de/policies/privacy/partners/'>https://www.google.com/intl/de/policies/privacy/partners/</a> („Datennutzung durch Google bei Ihrer Nutzung von Websites oder Apps unserer Partner“),<br/><a class = 'link' href='http://www.google.com/policies/technologies/ads'>http://www.google.com/policies/technologies/ads</a> („Datennutzung zu Werbezwecken“),<br/><a class = 'link' href='http://www.google.de/settings/ads'> http://www.google.de/settings/ads</a> („Informationen verwalten, die Google verwendet, um Ihnen Werbung einzublenden“) und<br/><a class = 'link' href='http://www.google.com/ads/preferences/'>http://www.google.com/ads/preferences/</a> („Bestimmen Sie, welche Werbung Google Ihnen zeigt“).","edited-hint":"Der generierte Text wurde vom Webseiteninhaber angepasst.","generated-hint":"Erstellt mit Datenschutz-Generator.de von RA Dr. Thomas Schwenke","google-play-services-heading":"Google Play Dienste","google-play-services":"Features wie die Bestenliste und Erfolge benötigen einen Login bei Google Play. Hierfür wird die Identität benötigt, um die entsprechenden Punktzahlen und Erfolge an das jeweilige Google Play-Konto zu knüpfen. Alle anderen Features sind weiterhin auch ohne Login bei Google Play nutzbar. Außerdem kann sich jederzeit in den Einstellungen von Google Play abgemeldet werden.","settings":"Einstellungen","close":"Schließen","other-apps":"Andere Apps","optimistic-locking-dialog":"Deine Änderungen können nicht gespeichert werden! Ein anderer Benutzer hat die Daten bereits verändert. Bitte lade die Daten neu und speichere danach.","optimistic-locking-dialog-title":"Nicht gespeichert!","not-online":"Du bist nicht mit dem Internet verbunden. Bitte überprüfe deine Verbindung.","search":"Suchen...","site":"Seite","HTTP-Exception (403) Forbidden":"Nicht erlaubt!","login":"Login","login-email":"E-Mail","login-password":"Passwort","login-automated-login":"Automatischer Login","login-submit":"Login","logout":"Ausloggen","username-or-password-wrong":"Entweder der Username oder das Passwort stimmt nicht!","login-success":"Willkommen zurück!","logged-out-successfully":"Tschüss!","registration":"Registrieren","registration-username":"Username","registration-email":"E-Mail","registration-password1":"Passwort","registration-password2":"Passwort wiederholen","registration-submit":"Registrieren","registration-success":"Ein Registrierungscode wurde an Ihre E-Mailadresse gesendet.","not-allowed-title":"Nicht erlaubt!","not-allowed":"Du hast keine Berechtigung für diese Seite. Wenn das ein Fehler ist, wende dich bitte an einen Admin.","forgot-password":"Passwort vergessen?","forgot-password-title":"Passwort vergessen","forgot-password-email":"E-Mail","forgot-password-submit":"Absenden","forgot-password-text":"Gib deine E-Mailadresse in das Feld ein. Ist die Adresse registriert, werden wir eine E-Mail mit einem Passwort-Resetcode senden.","no-user-found":"Es gibt keinen Benutzer mit dieser E-Mailadresse","new-password-code-send":"Es wurde ein Reset-Code an deine E-Mailadresse gesendet.","new-password":"Neues Passwort","new-password-password1":"Passwort","new-password-password2":"Passwort wiederholen","new-password-submit":"Passwort setzten","password-updated":"Das Passwort ist geupdated!","user-settings":"E-Mail & Username","user-settings-title":"E-Mail & Username","user-settings-form-username":"Username","user-settings-form-old-email":"Aktuelle E-Mail","user-settings-form-new-email":"Neue E-Mail","user-settings-form-submit":"Speichern","user-data-is-changed":"Die Daten wurden gespeichert.","email-code-send":"Ein Änderungscode wurde an die neue E-Mailadresse gesendet. Sobald der Code aktiviert wurde, werden Ihnen E-Mails an die neue Adresse gesendet.","change-email-new-automated-login":"Wenn die E-Mailadresse geändert wird, muss der automatische Login erneut aktiviert werden!","password-settings":"Passwort","change-password-title":"Passwort","change-password-new-automated-login":"Wenn das Passwort geändert wird, muss der automatische Login erneut aktiviert werden!","change-password-old-password":"Altes Passwort","change-password-new-password1":"Neues Passwort","change-password-new-password2":"Neues Passwort wiederholen","change-password-submit":"Speichern","password-changed":"Das Passwort wurde erfolgreich geändert!","registration-username-empty":"Der Username darf nicht leer sein.","registration-username-wrong-char":"Der Username darf nur aus Buchstaben, Zahlen oder den folgenden Zeichen bestehen: -_.&;()#!?$+\",","registration-username-already-taken":"Der Username ist schon vergeben. Bitte wähle einen anderen.","registration-password-empty":"Das Passwort darf nicht leer sein.","registration-password-short":"Das Passwort muss mindestens 8 Zeichen lang sein.","registration-password-not-identical":"Die Passwörter sind nicht identlisch.","registration-email-empty":"Die Email darf nicht leer sein.","registration-email-not-valid":"Die Emailadresse ist keine gültige Emailadresse.","registration-email-already-taken":"Es gibt bereits einen Account mit der Emailadresse.","change-password-old-password-wrong":"Das Passwort stimmt nicht!","user-roles-heading":"Benutzerrollen","user-roles-list":"Aktuelle Rollen:","available-roles-list":"Verfügbare Rollen:","name":"Name","description":"Beschreibung"}
\ No newline at end of file
diff --git a/public/js/lang/en.json b/public/js/lang/en.json
index eed1380..3edf167 100644
--- a/public/js/lang/en.json
+++ b/public/js/lang/en.json
@@ -1 +1 @@
-{"is-writing":"{0} is writing...","Sunday":"Sunday","Monday":"Monday","Tuesday":"Tuesday","Wednesday":"Wednesday","Thursday":"Thursday","Friday":"Friday","Saturday":"Saturday","January":"January","February":"February","March":"March","April":"April","May":"May","June":"June","July":"July","August":"August","September":"September","October":"October","November":"November","December":"December","Sun":"Sun","Mon":"Mon","Tue":"Tue","Wed":"Wed","Thu":"Thu","Fri":"Fri","Sat":"Sat","Jan":"Jan","Feb":"Feb","Mar":"Mar","Apr":"Apr","Jun":"Jun","Jul":"Jul","Aug":"Aug","Sep":"Sep","Oct":"Oct","Nov":"Nov","Dec":"Dec","code-not-valid":"The given code is not valid!","code-activated":"The code has been successfully activated!","current-lang":"EN","en":"English","de":"German","black":"Black","red":"Red","blue":"Blue","green":"Green","pink":"Pink","cancel-button":"CANCEL","confirm-button":"OK","we-use-cookie-hint":"Our website uses cookies. By continuing we assume your permission to deploy cookies, as detailed in our <a href='policy' data-site-name='policy' class='link deep-link' rel='nofollow' title='Privacy Policy'>privacy policy</a>.","policy-heading":"Privacy Policy","area-of-validity-heading":"Area of validity","area-of-validity":"This privacy policy clarifies the nature, extent and purpose of the collection and use of personal data by Silas Günther, Langenbusch 263b - 42897 Remscheid, matrix[at]silas.link on this website (hereinafter referred to as \"the offer\"). <br/> <br/>The legal basis of data protection can be found in the Bundesdatenschutzgesetz (BDSG) and the Telemediengesetz (TMG).","logfiles-heading":"Acess data / Server log files","logfiles":"The owner of this website (or his webspace provider) collects data about every access to the offer (so-called server log files). The access data include: <br/> <br/>the name of the retrieved web page, file, date and time of the retrieval, transmitted data volume, message of successful retrieval, browser type and version, the user's operating system, referrer URL (the previous visited site), IP address and the requesting provider. The owner uses the protocol data only for statistical evaluations for the purpose of operation, security and optimization of the offer. However, the owner reserves the right to check the log data subsequently if, due to concrete grounds, the legitimate suspicion of unlawful use exists.","contact-support-heading":"Contacting","contact-support":"When contacting the owner (for example by mail or e-mail), the user's data are stored for the purpose of processing the inquiry as well as in the event that connection questions arise.","cookies-heading":"Cookies","cookies":"Cookies are small files that allow you to store specific information related to the device on the user's access point (PC, smartphone, etc.). On the one hand they serve the user friendliness of web pages and therefore the users (for example storage of logindates). On the other hand, they are used to record the statistical data of the website and to be able to analyze them for the purpose of improving the offer. Users can influence the use of cookies. Most browsers have an option to restrict or prevent cookies from being stored. However, it is noted that the use and, in particular, the convenience of use is restricted without cookies. <br/> <br/> You can manage many online cookies from companies across the US site 'http://www.aboutads.info/choices/'>http://www.aboutads.info/choices/ </a> or the EU site <a class =' link 'href =' http: // Manage www.youronlinechoices.com/uk/your-ad-choices/'>http://www.youronlinechoices.com/uk/your-ad-choices/ code.<a/>","google-analytics-heading":"Google Analytics","google-analytics":"This offer uses Google Analytics, a web analytics service provided by Google, Inc. (\"Google\"). Google Analytics uses so-called \"cookies\", text files that are stored on users' computers and which allow an analysis of the use of the website through them. The information generated by the cookie about the use of this website by the users is usually transmitted to a Google server in the USA and stored there. <br/><br/> In the case of the activation of the IP anonymization on this website, the IP address of users of Google will be previously abridged within Member States of the European Union or in other States Parties to the Agreement on the European Economic Area. Only in exceptional cases will the full IP address be transferred to a Google server in the USA and abbreviated there. IP anonymization is active on this website. On behalf of the operator of this website, Google will use this information to evaluate the use of the website, to compile reports on the website activity and to provide other services related to the website usage and the Internet usage against the website operator. <br/><br/>The IP address transmitted by your browser as part of Google Analytics will not be merged with other Google data. Users can prevent the storage of cookies by setting their browser software accordingly; However, this offer warrants to users that in this case, you may not be able to fully utilize all the functions of this website. Users may also block Google's collection of the data (including your IP address) generated by the cookie and its use of the website (including your IP address), as well as the processing of such data by Google by using the browser plug-in available under the following link download and install: <a class ='link' href='http://tools.google.com/dlpage/gaoptout?hl=en'> http://tools.google.com/dlpage/gaoptout?hl=en</a> For further information on the use of the data for advertising purposes by Google, please refer to the websites of Google: <br/> <a class = 'link' href = 'https: //www.google.com/intl/en/policies/privacy/partners/'>https://www.google.com/intl/en/policies/privacy/partners/ </a>, <br/><a class ='link' href='http://www.google.com/policies/technologies/ads'> http://www.google.com/policies/technologies/ads </a> <br/><a class ='link' href='http://www.google.com/settings/ads'> http://www.google.com/settings/ads </a> and<br/> <a class ='link' href='http://www.google.com/ads/preferences/'>http://www.google.com/ads/preferences/</a>","edited-hint":"This text was modified and translated by the owner of this website.","generated-hint":"Created in german with Datenschutz-Generator.de from RA Dr. Thomas Schwenke","google-play-services-heading":"Google Play Services","google-play-services":"Features such as leaderboards and achievements require a login to Google Play. For this, your identity is needed in order to tie the scores and achievements to your Google Play account. All other features can still be used without logging in to Google Play. You can also logout from Google Play at any time through the settings.","settings":"Settings","close":"Close","other-apps":"Other Apps","optimistic-locking-dialog":"Your changes cannot be saved! Another user has already changed the data. Please reload the data and save it afterwards.","optimistic-locking-dialog-title":"Not saved!","not-online":"You are not connected with the Internet. Please check your connection.","search":"Search...","site":"Page","HTTP-Exception (403) Forbidden":"Not allowed!","login":"Login","login-email":"E-Mail:","login-password":"Password:","login-automated-login":"Automated Login","login-submit":"Login","logout":"Logout","username-or-password-wrong":"Either the username or the password is wrong!","login-success":"Welcome back!","logged-out-successfully":"Good Bye!","registration":"Registration","registration-username":"Username","registration-email":"E-Mail","registration-password1":"Password","registration-password2":"Re-enter password","registration-submit":"Create Account","registration-success":"A registration code was send to your E-Mail address.","not-allowed-title":"Not allowed!","not-allowed":"You do not have permission for this page. If this is a mistake, please contact an admin.","forgot-password":"Forgot your password?","forgot-password-title":"Password forgotten","forgot-password-email":"E-Mail","forgot-password-submit":"Send","forgot-password-text":"Enter your e-mail address in the field below. If the address is registered, we will send you an e-mail with a password reset code.","no-user-found":"There is no user with this e-mail address","new-password-code-send":"A reset code has been sent to your e-mail address.","new-password":"New Password","new-password-password1":"Password","new-password-password2":"Re-enter password","new-password-submit":"Set password","password-updated":"The password was updated!","user-settings":"E-Mail & Username","user-settings-title":"E-Mail & Username","user-settings-form-username":"Username","user-settings-form-old-email":"Current E-Mail","user-settings-form-new-email":"New E-Mail","user-settings-form-submit":"Save","user-data-is-changed":"The data has been saved.","email-code-send":"A code has been sent to the new e-mail address. Once the code has been activated, you will receive e-mails to the new address.","change-email-new-automated-login":"If the e-mail address is changed, the automatic login must be activated again!","password-settings":"Password","change-password-title":"Password","change-password-new-automated-login":"If the password is changed, the automatic login must be activated again!","change-password-old-password":"Old password","change-password-new-password1":"New password","change-password-new-password2":"Re-enter new password","change-password-submit":"Save","password-changed":"The password was updated!","registration-username-empty":"The username must not be empty.","registration-username-wrong-char":"The username may only consist of letters, numbers or the following characters: -_.&;()#!?$+\",","registration-username-already-taken":"The username is already assigned. Please choose another one.","registration-password-empty":"The password must not be empty.","registration-email-empty":"The email must not be empty.","registration-email-not-valid":"The email address is not a valid email address.","registration-email-already-taken":"There is already an account with the email address.","change-password-old-password-wrong":"The password is not correct!","user-roles-heading":"Roles from user","user-roles-list":"Current roles:","available-roles-list":"Available roles:","name":"Name","description":"Description"}
\ No newline at end of file
+{"won":"Won!","continue":"Continue","Sunday":"Sunday","Monday":"Monday","Tuesday":"Tuesday","Wednesday":"Wednesday","Thursday":"Thursday","Friday":"Friday","Saturday":"Saturday","January":"January","February":"February","March":"March","April":"April","May":"May","June":"June","July":"July","August":"August","September":"September","October":"October","November":"November","December":"December","Sun":"Sun","Mon":"Mon","Tue":"Tue","Wed":"Wed","Thu":"Thu","Fri":"Fri","Sat":"Sat","Jan":"Jan","Feb":"Feb","Mar":"Mar","Apr":"Apr","Jun":"Jun","Jul":"Jul","Aug":"Aug","Sep":"Sep","Oct":"Oct","Nov":"Nov","Dec":"Dec","code-not-valid":"The given code is not valid!","code-activated":"The code has been successfully activated!","current-lang":"EN","en":"English","de":"German","black":"Black","red":"Red","blue":"Blue","green":"Green","pink":"Pink","cancel-button":"CANCEL","confirm-button":"OK","we-use-cookie-hint":"Our website uses cookies. By continuing we assume your permission to deploy cookies, as detailed in our <a href='policy' data-site-name='policy' class='link deep-link' rel='nofollow' title='Privacy Policy'>privacy policy</a>.","policy-heading":"Privacy Policy","area-of-validity-heading":"Area of validity","area-of-validity":"This privacy policy clarifies the nature, extent and purpose of the collection and use of personal data by Silas Günther, Langenbusch 263b - 42897 Remscheid, matrix[at]silas.link on this website (hereinafter referred to as \"the offer\"). <br/> <br/>The legal basis of data protection can be found in the Bundesdatenschutzgesetz (BDSG) and the Telemediengesetz (TMG).","logfiles-heading":"Acess data / Server log files","logfiles":"The owner of this website (or his webspace provider) collects data about every access to the offer (so-called server log files). The access data include: <br/> <br/>the name of the retrieved web page, file, date and time of the retrieval, transmitted data volume, message of successful retrieval, browser type and version, the user's operating system, referrer URL (the previous visited site), IP address and the requesting provider. The owner uses the protocol data only for statistical evaluations for the purpose of operation, security and optimization of the offer. However, the owner reserves the right to check the log data subsequently if, due to concrete grounds, the legitimate suspicion of unlawful use exists.","contact-support-heading":"Contacting","contact-support":"When contacting the owner (for example by mail or e-mail), the user's data are stored for the purpose of processing the inquiry as well as in the event that connection questions arise.","cookies-heading":"Cookies","cookies":"Cookies are small files that allow you to store specific information related to the device on the user's access point (PC, smartphone, etc.). On the one hand they serve the user friendliness of web pages and therefore the users (for example storage of logindates). On the other hand, they are used to record the statistical data of the website and to be able to analyze them for the purpose of improving the offer. Users can influence the use of cookies. Most browsers have an option to restrict or prevent cookies from being stored. However, it is noted that the use and, in particular, the convenience of use is restricted without cookies. <br/> <br/> You can manage many online cookies from companies across the US site 'http://www.aboutads.info/choices/'>http://www.aboutads.info/choices/ </a> or the EU site <a class =' link 'href =' http: // Manage www.youronlinechoices.com/uk/your-ad-choices/'>http://www.youronlinechoices.com/uk/your-ad-choices/ code.<a/>","google-analytics-heading":"Google Analytics","google-analytics":"This offer uses Google Analytics, a web analytics service provided by Google, Inc. (\"Google\"). Google Analytics uses so-called \"cookies\", text files that are stored on users' computers and which allow an analysis of the use of the website through them. The information generated by the cookie about the use of this website by the users is usually transmitted to a Google server in the USA and stored there. <br/><br/> In the case of the activation of the IP anonymization on this website, the IP address of users of Google will be previously abridged within Member States of the European Union or in other States Parties to the Agreement on the European Economic Area. Only in exceptional cases will the full IP address be transferred to a Google server in the USA and abbreviated there. IP anonymization is active on this website. On behalf of the operator of this website, Google will use this information to evaluate the use of the website, to compile reports on the website activity and to provide other services related to the website usage and the Internet usage against the website operator. <br/><br/>The IP address transmitted by your browser as part of Google Analytics will not be merged with other Google data. Users can prevent the storage of cookies by setting their browser software accordingly; However, this offer warrants to users that in this case, you may not be able to fully utilize all the functions of this website. Users may also block Google's collection of the data (including your IP address) generated by the cookie and its use of the website (including your IP address), as well as the processing of such data by Google by using the browser plug-in available under the following link download and install: <a class ='link' href='http://tools.google.com/dlpage/gaoptout?hl=en'> http://tools.google.com/dlpage/gaoptout?hl=en</a> For further information on the use of the data for advertising purposes by Google, please refer to the websites of Google: <br/> <a class = 'link' href = 'https: //www.google.com/intl/en/policies/privacy/partners/'>https://www.google.com/intl/en/policies/privacy/partners/ </a>, <br/><a class ='link' href='http://www.google.com/policies/technologies/ads'> http://www.google.com/policies/technologies/ads </a> <br/><a class ='link' href='http://www.google.com/settings/ads'> http://www.google.com/settings/ads </a> and<br/> <a class ='link' href='http://www.google.com/ads/preferences/'>http://www.google.com/ads/preferences/</a>","edited-hint":"This text was modified and translated by the owner of this website.","generated-hint":"Created in german with Datenschutz-Generator.de from RA Dr. Thomas Schwenke","google-play-services-heading":"Google Play Services","google-play-services":"Features such as leaderboards and achievements require a login to Google Play. For this, your identity is needed in order to tie the scores and achievements to your Google Play account. All other features can still be used without logging in to Google Play. You can also logout from Google Play at any time through the settings.","settings":"Settings","close":"Close","other-apps":"Other Apps","optimistic-locking-dialog":"Your changes cannot be saved! Another user has already changed the data. Please reload the data and save it afterwards.","optimistic-locking-dialog-title":"Not saved!","not-online":"You are not connected with the Internet. Please check your connection.","search":"Search...","site":"Page","HTTP-Exception (403) Forbidden":"Not allowed!","login":"Login","login-email":"E-Mail:","login-password":"Password:","login-automated-login":"Automated Login","login-submit":"Login","logout":"Logout","username-or-password-wrong":"Either the username or the password is wrong!","login-success":"Welcome back!","logged-out-successfully":"Good Bye!","registration":"Registration","registration-username":"Username","registration-email":"E-Mail","registration-password1":"Password","registration-password2":"Re-enter password","registration-submit":"Create Account","registration-success":"A registration code was send to your E-Mail address.","not-allowed-title":"Not allowed!","not-allowed":"You do not have permission for this page. If this is a mistake, please contact an admin.","forgot-password":"Forgot your password?","forgot-password-title":"Password forgotten","forgot-password-email":"E-Mail","forgot-password-submit":"Send","forgot-password-text":"Enter your e-mail address in the field below. If the address is registered, we will send you an e-mail with a password reset code.","no-user-found":"There is no user with this e-mail address","new-password-code-send":"A reset code has been sent to your e-mail address.","new-password":"New Password","new-password-password1":"Password","new-password-password2":"Re-enter password","new-password-submit":"Set password","password-updated":"The password was updated!","user-settings":"E-Mail & Username","user-settings-title":"E-Mail & Username","user-settings-form-username":"Username","user-settings-form-old-email":"Current E-Mail","user-settings-form-new-email":"New E-Mail","user-settings-form-submit":"Save","user-data-is-changed":"The data has been saved.","email-code-send":"A code has been sent to the new e-mail address. Once the code has been activated, you will receive e-mails to the new address.","change-email-new-automated-login":"If the e-mail address is changed, the automatic login must be activated again!","password-settings":"Password","change-password-title":"Password","change-password-new-automated-login":"If the password is changed, the automatic login must be activated again!","change-password-old-password":"Old password","change-password-new-password1":"New password","change-password-new-password2":"Re-enter new password","change-password-submit":"Save","password-changed":"The password was updated!","registration-username-empty":"The username must not be empty.","registration-username-wrong-char":"The username may only consist of letters, numbers or the following characters: -_.&;()#!?$+\",","registration-username-already-taken":"The username is already assigned. Please choose another one.","registration-password-empty":"The password must not be empty.","registration-email-empty":"The email must not be empty.","registration-email-not-valid":"The email address is not a valid email address.","registration-email-already-taken":"There is already an account with the email address.","change-password-old-password-wrong":"The password is not correct!","user-roles-heading":"Roles from user","user-roles-list":"Current roles:","available-roles-list":"Available roles:","name":"Name","description":"Description"}
\ No newline at end of file
diff --git a/src/js/lib/pwa-assets.js b/src/js/lib/pwa-assets.js
index 8a0d79d..e4c3c0f 100644
--- a/src/js/lib/pwa-assets.js
+++ b/src/js/lib/pwa-assets.js
@@ -1,13 +1,66 @@
-import { Fragment, Helper, Translator } from './pwa-lib.js';
+import { Helper, Fragment, Translator } from './pwa-lib.js';
 
-class DelayPromise extends Promise{
-    constructor(delay) {
-        super((resolve) => {
+class DelayPromise extends Promise {
+    static async delay(delay) {
+        return new Promise((resolve) => {
             setTimeout(resolve, delay);
         });
     }
 }
 
+class ScaleHelper {
+    scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight) {
+        margin = Helper.nonNull(margin, 10);
+        ignoreHeight = Helper.nonNull(ignoreHeight, false);
+        ignoreWidth = Helper.nonNull(ignoreWidth, false);
+        fontWeight = Helper.nonNull(fontWeight, fontElement.innerHTML.length);
+
+        let hasNoTransitionClass = container.classList.contains("no-transition");
+        container.classList.add("no-transition");
+
+        let currentFontSize = 1;
+        let diff = 0;
+        let widthDiff = 0;
+        let heightDiff = 0;
+        let containerWidth = 0;
+        let containerHeight = 0;
+        do {
+            currentFontSize += diff / (fontWeight + 1);
+            fontElement.style.fontSize = currentFontSize + 'px';
+
+            let containerStyle = window.getComputedStyle(container);
+
+            containerWidth = containerStyle.getPropertyValue("width").replace('px', '');
+            containerHeight = containerStyle.getPropertyValue("height").replace('px', '');
+
+            widthDiff = containerWidth - fontElement.offsetWidth;
+            heightDiff = containerHeight - fontElement.offsetHeight;
+
+            let newDiff = (ignoreWidth ? heightDiff : (ignoreHeight ? widthDiff : Math.min(widthDiff, heightDiff)));
+            if (newDiff === diff) {
+                break;
+            }
+            diff = newDiff;
+        } while ((widthDiff > (1 - scale) * containerWidth || ignoreWidth) && (heightDiff > (1 - scale) * containerHeight || ignoreHeight));
+        fontElement.style.fontSize = (currentFontSize - margin) + 'px';
+
+        if (!hasNoTransitionClass) {
+            container.classList.remove("no-transition");
+        }
+
+        let self = this;
+        window.addEventListener("resize", function () {
+            setTimeout(() => {
+                self.scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight);
+            }, 255);
+        });
+    }
+
+    scaleToFull(fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight) {
+        return this.scaleTo(1, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight);
+    }
+}
+
 class TabbedFragment extends Fragment {
     constructor(site) {
         super(site, 'pwaAssets/html/fragment/tabbedFragment.html');
@@ -73,4 +126,4 @@ class TabbedFragment extends Fragment {
     }
 }
 
-export { DelayPromise, TabbedFragment };
+export { DelayPromise, ScaleHelper, TabbedFragment };
diff --git a/src/js/lib/pwa-lib.js b/src/js/lib/pwa-lib.js
index 25c6982..1592a37 100644
--- a/src/js/lib/pwa-lib.js
+++ b/src/js/lib/pwa-lib.js
@@ -2419,8 +2419,9 @@ class Dialog {
         return this;
     }
 
-    setContent(content) {
-        this.content = content;
+    async setContent(content) {
+        this.contentPromise = Promise.resolve(content);
+        this.content = await this.contentPromise;
         return this;
     }
 
@@ -2465,70 +2466,71 @@ class Dialog {
         this.buttons.push(button);
     }
 
-    show() {
+    async show() {
+
+        let titleElement = document.createElement("span");
+        titleElement.classList.add("title");
+        if (this.translatable && this.title !== "") {
+            titleElement.appendChild(Translator.makePersistentTranslation(this.title));
+        }
+        else {
+            titleElement.innerHTML = this.title;
+        }
+
+        let titleBar = document.createElement("div");
+        titleBar.appendChild(titleElement);
+
+        let contentContainer = document.createElement("div");
+        contentContainer.classList.add("content-container");
+
+        let modalDialog = document.createElement("div");
+        modalDialog.className = this.additionalClasses;
+        modalDialog.classList.add("modal");
+        modalDialog.appendChild(titleBar);
+        modalDialog.appendChild(contentContainer);
+
+        let buttonBar = document.createElement("div");
+        buttonBar.classList.add("modal-button-container");
+
+        for (let i = 0, n = this.buttons.length; i < n; i++) {
+            buttonBar.appendChild(this.buttons[i]);
+        }
+
+        await this.contentPromise;
+        if (!(this.content instanceof Node)) {
+            this.content = (this.translatable) ? Translator.makePersistentTranslation(this.content) : document.createTextNode(this.content);
+        }
+        contentContainer.appendChild(this.content);
+
+        this.backgroundElement = document.createElement("div");
+        this.backgroundElement.classList.add("background");
+        this.backgroundElement.appendChild(modalDialog);
+
+        this.backgroundElement.querySelector(".modal").appendChild(buttonBar);
+        this.backgroundElement.style.display = "block";
+
         let self = this;
-        return new Promise(function (resolve) {
-
-            if (!(self.content instanceof Node)) {
-                self.content = (self.translatable) ? Translator.makePersistentTranslation(self.content) : document.createTextNode(self.content);
-            }
-
+        if (this.cancelable) {
             let closeButton = document.createElement("span");
             closeButton.classList.add("close");
             closeButton.innerHTML = "&times;";
 
-            let titleElement = document.createElement("span");
-            titleElement.classList.add("title");
-            if (self.translatable && self.title !== "") {
-                titleElement.appendChild(Translator.makePersistentTranslation(self.title));
-            }
-            else {
-                titleElement.innerHTML = self.title;
-            }
-
-            let titlteBar = document.createElement("div");
-            titlteBar.appendChild(titleElement);
-
-            let contentContainer = document.createElement("div");
-            contentContainer.classList.add("content-container");
-            contentContainer.appendChild(self.content);
-
-            let modalDialog = document.createElement("div");
-            modalDialog.className = self.additionalClasses;
-            modalDialog.classList.add("modal");
-            modalDialog.appendChild(titlteBar);
-            modalDialog.appendChild(contentContainer);
-
-            self.backgroundElement = document.createElement("div");
-            self.backgroundElement.classList.add("background");
-            self.backgroundElement.appendChild(modalDialog);
-
-            if (self.cancelable) {
-                titlteBar.appendChild(closeButton);
-                closeButton.addEventListener("click", function () {
+            titleBar.appendChild(closeButton);
+            closeButton.addEventListener("click", function () {
+                self.close();
+            });
+            window.addEventListener("click", function (e) {
+                if (e.target === self.backgroundElement) {
                     self.close();
-                });
-                window.addEventListener("click", function (e) {
-                    if (e.target === self.backgroundElement) {
-                        self.close();
-                    }
-                });
-            }
+                }
+            });
+        }
 
-            let buttonBar = document.createElement("div");
-            buttonBar.classList.add("modal-button-container");
+        document.body.appendChild(this.backgroundElement);
+        Translator.getInstance().updateTranslations();
 
-            for (let i = 0, n = self.buttons.length; i < n; i++) {
-                buttonBar.appendChild(self.buttons[i]);
-            }
-
-            self.backgroundElement.querySelector(".modal").appendChild(buttonBar);
-
-            self.backgroundElement.style.display = "block";
-            document.body.appendChild(self.backgroundElement);
+        return new Promise(function (resolve) {
             self.resolver = resolve;
-
-            Translator.getInstance().updateTranslations();
         });
     }
 
@@ -2539,7 +2541,7 @@ class Dialog {
             this.backgroundElement = null;
         }
         if (Helper.isNotNull(this.resolver)) {
-            this.resolver();
+            this.resolver(this.result);
         }
     }
 
@@ -2551,52 +2553,13 @@ class Dialog {
 class ConfirmDialog extends Dialog {
     constructor(content, title) {
         super(content, title);
-        this.result = null;
     }
 
-    show() {
-
+    async show() {
         this.addButton("confirm-button", true);
         this.addButton("cancel-button", false);
 
-        let showPromise = super.show();
-        let self = this;
-
-        //Sorgt dafür, dass eine mögliche Exception im Promise geworfen wird
-        return new Promise(function (resolve) {
-            // let confirmButton = document.createElement("button");
-            // confirmButton.classList.add("button");
-            // confirmButton.classList.add("right");
-            // confirmButton.appendChild(Translator.makePersistentTranslation("confirm-button"));
-
-            // let cancelButton = document.createElement("button");
-            // cancelButton.classList.add("button");
-            // cancelButton.classList.add("right");
-            // cancelButton.appendChild(Translator.makePersistentTranslation("cancel-button"));
-
-            // let buttonBar = document.createElement("div");
-            // buttonBar.classList.add("modal-button-container");
-
-            // buttonBar.appendChild(confirmButton);
-            // buttonBar.appendChild(cancelButton);
-
-
-
-            // confirmButton.addEventListener("click", function(){
-            //     self.result = true;
-            //     self.close();
-            // });
-
-            // cancelButton.addEventListener("click", function(){
-            //     self.result = false;
-            //     self.close();
-            // });
-
-            // self.backgroundElement.querySelector(".modal").appendChild(buttonBar);
-            resolve(showPromise.then(function(){
-                return self.result;
-            }));
-        });
+        return super.show();
     }
 
 
diff --git a/src/module/Application/pwa/html/application/level.html b/src/module/Application/pwa/html/application/level.html
index 978d568..7ed5269 100644
--- a/src/module/Application/pwa/html/application/level.html
+++ b/src/module/Application/pwa/html/application/level.html
@@ -1,14 +1,25 @@
-<div>
-    <div id = 'segment-leaf-template' class = 'segment segment-leaf'>
-        <div class = 'leaf-element'></div>
+<div class='max-height'>
+    <!-- Templates for segments-->
+    <div id='segment-leaf-template' class='segment segment-leaf'>
+        <div class='leaf-element'></div>
     </div>
-    <div id = 'segment-parent-template' class = 'segment segment-parent'>
-        <div class = 'child-container'></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 id='segment-row-template' class='segment segment-row'>
+        <div class='child-container'></div>
     </div>
-
-    <div id = 'level'>
+    <!-- Site Content -->
+    <div class='max-height'>
+        <div class = 'show-when-won height-20 center flex-center'>
+            <b data-translation="won" id = "won-text"></b>
+        </div>
+        <div class="flex-center height-60 overflow-hidden">
+            <div id='level'>
+            </div>
+        </div>
+        <div class='show-when-won flex-center height-20'>
+            <button class='button' id='continue-button' data-translation="continue"></button>
+        </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/module/Application/pwa/js/WordRotatorDb.js b/src/module/Application/pwa/js/WordRotatorDb.js
index 69b5c45..7eb4c2c 100644
--- a/src/module/Application/pwa/js/WordRotatorDb.js
+++ b/src/module/Application/pwa/js/WordRotatorDb.js
@@ -35,12 +35,12 @@ export class WordRotatorDb extends MyDb {
         return this.load(levelId, WordRotatorDb.OBJECT_STORE.LEVEL);
     }
 
-    async loadNextLevel() {
+    async loadNextLevel(rendererTypes) {
         const levels = await this.loadMany("difficulty", IDBKeyRange.lowerBound(0), WordRotatorDb.OBJECT_STORE.LEVEL);
 
         let newLevels = [];
         for (let i = 0, n = levels.length; i < n; i++) {
-            if (!levels[i].deleted && !levels[i].played) {
+            if (!levels[i]["deleted"] && !levels[i]["played"] && rendererTypes.indexOf(levels[i]["rendererType"]) !== -1) {
                 newLevels.push(levels[i]);
             }
         }
@@ -51,6 +51,13 @@ export class WordRotatorDb extends MyDb {
 
         return newLevels[Math.round(Math.random() * newLevels.length) % newLevels.length];
     }
+
+    async saveLevelPlayed(levelId)
+    {
+        const level = await this.loadLevel(levelId);
+        level.played = true;
+        return await this.saveObj(level, WordRotatorDb.OBJECT_STORE.LEVEL);
+    }
 }
 
 WordRotatorDb.OBJECT_STORE = {
diff --git a/src/module/Application/pwa/js/site/LevelSite.js b/src/module/Application/pwa/js/site/LevelSite.js
index 082dfa3..6d61e33 100644
--- a/src/module/Application/pwa/js/site/LevelSite.js
+++ b/src/module/Application/pwa/js/site/LevelSite.js
@@ -1,18 +1,32 @@
-import {AbstractSite, Helper} from "../../../../../js/lib/pwa-lib";
+import {AbstractSite, Helper, Menu, MenuAction} from "../../../../../js/lib/pwa-lib";
 import {ParentSegment} from "../wordrotator/Segment/ParentSegment";
 import {LeafSegment} from "../wordrotator/Segment/LeafSegment";
 import {TemplateContainer} from "../wordrotator/Segment/TemplateContainer";
 import {SimpleLevel} from "../wordrotator/Level/SimpleLevel";
 import {LevelHelper} from "../wordrotator/Level/LevelHelper";
 import {WordRotatorDb} from "../WordRotatorDb";
+import {ScaleHelper} from "../../../../../js/lib/pwa-assets";
 
 export class LevelSite extends AbstractSite {
     constructor(siteManager) {
         super(siteManager, "html/application/level.html", "level");
     }
 
+    createActionBarMenu(menu) {
+        menu = super.createActionBarMenu(menu);
+
+        this.levelCounterAction = new MenuAction("", function(){}, Menu.SHOW_ALWAYS, 0);
+        this.levelCounterAction.setShouldTranslate(false);
+        menu.addAction(this.levelCounterAction);
+
+        return menu;
+    }
+
     onConstruct(args) {
         this.setTitle("Level");
+
+        this.levelCounter = Helper.nonNull(localStorage.getItem("levelCounter"), 1);
+
         return super.onConstruct(args);
     }
 
@@ -31,24 +45,43 @@ export class LevelSite extends AbstractSite {
         parentSegmentTemplate.remove();
         rowSegmentTemplate.remove();
 
+        let self = this;
+        let continueButton = this.findBy("#continue-button");
+        continueButton.addEventListener("click", ()=> {
+            self.nextLevel();
+        });
+
+        let wonText = this.findBy("#won-text");
+
+        let scaleHelper = new ScaleHelper();
+        scaleHelper.scaleToFull(continueButton, continueButton.parentElement);
+        scaleHelper.scaleToFull(wonText, wonText.parentElement);
+
+        this.levelCounterAction.setTitle(this.levelCounter);
         this.templateContainer = new TemplateContainer(leafSegmentTemplate, parentSegmentTemplate, rowSegmentTemplate);
         this.nextLevel();
     }
 
     async nextLevel() {
         try {
+            this._siteContent.classList.remove('won');
+
             const db = WordRotatorDb.getInstance();
-            const nextLevelJson = await db.loadNextLevel();
+            const nextLevelJson = await db.loadNextLevel([20]);
             const level = LevelHelper.inflateLevel(nextLevelJson, this.templateContainer);
 
             const self = this;
             level.getWonPromise().then(() => {
-                self.nextLevel();
+                self.levelWon(level);
             });
 
             level.createSegments();
             level.getRootSegment()._updateElement();
-            this.findBy("#level").appendChild(level.getRootSegment().getElement());
+
+            let levelSegment = this.findBy("#level");
+            levelSegment.removeAllChildren().appendChild(level.getRootSegment().getElement());
+            let scaleHelper = new ScaleHelper();
+            scaleHelper.scaleToFull(levelSegment, levelSegment.parentElement, false, false, 2,level.words[0].length * 2);
 
             this.level = level;
         }
@@ -56,4 +89,16 @@ export class LevelSite extends AbstractSite {
             console.error(e);
         }
     }
+
+    async levelWon(level){
+        const db = WordRotatorDb.getInstance();
+        // db.saveLevelPlayed(level);
+
+        this.levelCounter++;
+        localStorage.setItem("levelCounter", this.levelCounter);
+        this.levelCounterAction.setTitle(this.levelCounter);
+        this.levelCounterAction.redraw();
+
+        this._siteContent.classList.add('won');
+    }
 }
\ No newline at end of file
diff --git a/src/module/Application/pwa/js/wordrotator/Level/Level.js b/src/module/Application/pwa/js/wordrotator/Level/Level.js
index ca6c1a9..d16fc89 100644
--- a/src/module/Application/pwa/js/wordrotator/Level/Level.js
+++ b/src/module/Application/pwa/js/wordrotator/Level/Level.js
@@ -9,6 +9,7 @@ export class Level {
         this.templateContainer = templateContainer;
 
         this.hasWon = false;
+        this.id = null;
 
         this.wonResolver = null;
         this.giveUpResolver = null;
@@ -20,6 +21,16 @@ export class Level {
         });
     }
 
+    setId(id)
+    {
+        this.id = id;
+    }
+
+    getId()
+    {
+        return this.id;
+    }
+
     getLevel()
     {
         return this;
@@ -29,6 +40,10 @@ export class Level {
     {
         this.rootSegment = rootSegment;
         this.rootSegment.setParent(this);
+        if (this.startRotations)
+        {
+            this.applyRotations();
+        }
     }
 
     setWords(words)
@@ -44,6 +59,15 @@ export class Level {
         this.startRotations = rotations;
     }
 
+    applyRotations(rotations)
+    {
+        if (this.rootSegment)
+        {
+            rotations = Helper.nonNull(rotations, this.startRotations);
+            this.rootSegment.applyRotations(rotations);
+        }
+    }
+
     getHasWon()
     {
         return this.hasWon;
diff --git a/src/module/Application/pwa/js/wordrotator/Level/LevelHelper.js b/src/module/Application/pwa/js/wordrotator/Level/LevelHelper.js
index 6676ccc..6a866a4 100644
--- a/src/module/Application/pwa/js/wordrotator/Level/LevelHelper.js
+++ b/src/module/Application/pwa/js/wordrotator/Level/LevelHelper.js
@@ -1,18 +1,23 @@
-export class LevelHelper{
-    static setLevelType(typeId, level)
-    {
+export class LevelHelper {
+    static setLevelType(typeId, level) {
         LevelHelper.types[typeId] = level;
     }
 
-    static getLevelClass(type)
-    {
+    static getLevelClass(type) {
         return LevelHelper.types[type];
     }
 
-    static inflateLevel(jsonLevel, templateContainer)
-    {
+    static inflateLevel(jsonLevel, templateContainer) {
         let level = new (LevelHelper.types[jsonLevel["rendererType"]])(templateContainer);
         level.setWords(jsonLevel["words"]);
+        level.setId(jsonLevel["id"]);
+
+        for (let i = 0, n = jsonLevel["rotations"].length; i < n; i++) {
+            if (jsonLevel["rotations"][i] <= 4) {
+                jsonLevel["rotations"][i] = 90 * jsonLevel["rotations"][i];
+            }
+        }
+
         level.setStartRotations(jsonLevel["rotations"]);
         return level;
     }
diff --git a/src/module/Application/pwa/js/wordrotator/Level/RowLevel.js b/src/module/Application/pwa/js/wordrotator/Level/RowLevel.js
index 33783fa..c45b32c 100644
--- a/src/module/Application/pwa/js/wordrotator/Level/RowLevel.js
+++ b/src/module/Application/pwa/js/wordrotator/Level/RowLevel.js
@@ -22,9 +22,7 @@ export class RowLevel extends Level {
                 parent.addChild(leafsWordTwo[2 * i + 1]);
                 rootSegment.addChild(parent);
             }
-
-            rootSegment.applyRotations(this.startRotations);
-
+            // rootSegment.applyRotations(this.startRotations);
             this.setRootSegment(rootSegment)
         }
     }
diff --git a/src/module/Application/pwa/js/wordrotator/Segment/ParentSegment.js b/src/module/Application/pwa/js/wordrotator/Segment/ParentSegment.js
index 1d24a68..43beeea 100644
--- a/src/module/Application/pwa/js/wordrotator/Segment/ParentSegment.js
+++ b/src/module/Application/pwa/js/wordrotator/Segment/ParentSegment.js
@@ -17,7 +17,10 @@ export class ParentSegment extends Segment {
             this.getLevel().checkHasWon(new Promise((resolve, reject)=>{
                 this.element.addEventListener("animationend", resolve);
             }));
-            return new DelayPromise(250);
+            // return new DelayPromise(250);
+            return new Promise(function(resolve) {
+                setTimeout(resolve, 250);
+            });
         }
     }
 
diff --git a/src/module/Application/pwa/translations/de.json b/src/module/Application/pwa/translations/de.json
index 1082da2..e54eb45 100644
--- a/src/module/Application/pwa/translations/de.json
+++ b/src/module/Application/pwa/translations/de.json
@@ -1,6 +1,4 @@
 {
-  "is-writing":"{0} schreibt...",
-  "restart":"Story neustarten...",
-  "should-restart-title":"Wirklich neustarten?",
-  "should-restart-question":"Willst du wirklich neu starten? Dein bisheriger Fortschritt geht dabei verloren!"
+  "won":"Gewonnen!",
+  "continue":"Weiter"
 }
\ No newline at end of file
diff --git a/src/module/Application/pwa/translations/en.json b/src/module/Application/pwa/translations/en.json
index a0985b6..b60575c 100644
--- a/src/module/Application/pwa/translations/en.json
+++ b/src/module/Application/pwa/translations/en.json
@@ -1,3 +1,4 @@
 {
-  "is-writing":"{0} is writing..."
+  "won":"Won!",
+  "continue":"Continue"
 }
\ No newline at end of file
diff --git a/src/scss/wordRotator.scss b/src/scss/wordRotator.scss
index cac36e6..1a12609 100644
--- a/src/scss/wordRotator.scss
+++ b/src/scss/wordRotator.scss
@@ -1,25 +1,35 @@
 $rotationDegrees: (90 180 270 360);
 
+@for $i from 1 through 10 {
+  $value: percentage($i/10);
+  .height-#{$i}0 {
+    height: $value;
+  }
+  .width-#{$i}0 {
+    width: $value;
+  }
+}
+
 @for $i from 1 through length($rotationDegrees) {
   $startDegree: ((nth($rotationDegrees, $i)+270)%360);
 
   @keyframes rotate-#{nth($rotationDegrees, $i)} {
     0% {
-      transform: rotate(#{$startDegree}deg)
+      transform: rotate(#{$startDegree}deg);
+      background-color: transparent;
+      z-index: 0;
+    }
+    99% {
+      transform: rotate(#{nth($rotationDegrees, $i)}deg);
+      background-color: transparent;
+      z-index: 0;
     }
     100% {
-      transform: rotate(#{nth($rotationDegrees, $i)}deg)
+      transform: rotate(#{nth($rotationDegrees, $i)}deg);
+      background-color: white;
+      z-index: 1;
     }
   }
-
-  //@keyframes rotate-minus-#{nth($rotationDegrees, $i)} {
-  //  0% {
-  //    transform: rotate(#{nth($rotationDegrees, $i)}deg)
-  //  }
-  //  100% {
-  //    transform: rotate(calc(90 - #{nth($rotationDegrees, $i)}) deg)
-  //  }
-  //}
 }
 
 .segment:not(.segment-row) {
@@ -52,24 +62,39 @@ $rotationDegrees: (90 180 270 360);
   }
 }
 
+#level {
+  white-space: nowrap;
+  transition: none;
+  max-width: 100%;
+
+  * {
+    transition: none;
+  }
+  overflow-y: visible;
+}
+
 .segment {
+  white-space: initial;
   cursor: pointer;
   display: inline-block;
   text-align: center;
   position: relative;
-  transition: .0s;
+  transition: none;
   user-select: none;
+  z-index: 1;
+  background-color: white;
 
   &.segment-row {
     display: block;
     width: 100%;
     animation: none !important;
+    white-space: nowrap;
   }
 
   &.segment-leaf {
-    min-width: 17px;
-    height: 34px;
-    line-height: 34px;
+    min-width: 1em;
+    height: 2em;
+    line-height: 2em;
   }
 
   &.segment-parent {
@@ -79,44 +104,26 @@ $rotationDegrees: (90 180 270 360);
       width: 50%;
     }
   }
+}
 
-  //&.rotate-0 {
-  //  animation-name: rotate-360;
-  //  animation-duration: 0.25s;
-  //  animation-fill-mode: forwards;
-  //  //transform: rotate(360deg);
-  //  .segment {
-  //    transform: rotate(-360deg);
-  //  }
-  //}
-  //
-  //&.rotate-90 {
-  //  animation-name: rotate-90;
-  //  animation-duration: 0.25s;
-  //  animation-fill-mode: forwards;
-  //  //transform: rotate(90deg);
-  //  .segment {
-  //    transform: rotate(-90deg);
-  //  }
-  //}
-  //
-  //&.rotate-180 {
-  //  animation-name: rotate-180;
-  //  animation-duration: 0.25s;
-  //  animation-fill-mode: forwards;
-  //  //transform: rotate(180deg);
-  //  .segment {
-  //    transform: rotate(-180deg);
-  //  }
-  //}
-  //
-  //&.rotate-270 {
-  //  animation-name: rotate-270;
-  //  animation-duration: 0.25s;
-  //  animation-fill-mode: forwards;
-  //  //transform: rotate(270deg);
-  //  .segment {
-  //    transform: rotate(-270deg);
-  //  }
-  //}
-}
\ No newline at end of file
+//Won-screen
+.show-when-won {
+  visibility: hidden;
+  transition: none;
+  * {
+    transition: none;
+  }
+}
+
+.won {
+  .show-when-won {
+    visibility: initial;
+  }
+}
+
+#continue-button {
+  //width: 80%;
+  //margin-left: 10%;
+  //margin-right: 10%;
+  //margin-bottom: 20%
+}