Ainias/wordRotator
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Added Coins

Browse Source
This commit is contained in:
silas 2018-09-20 14:20:13 +02:00
parent f729bd487a
commit e56ed8fcb8
13 changed files with 187 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.idea/wordRotator.iml generated
View File

@ -3,7 +3,6 @@
<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/doctrine/event-manager" />
<excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/persistence" />
<excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/reflection" />

3
log/error.log
View File

@ -32,3 +32,6 @@
2018-09-19T12:21:19+02:00 ERR (3):
2018-09-19T12:21:44+02:00 ERR (3):
2018-09-19T12:21:59+02:00 ERR (3):
2018-09-19T13:33:57+02:00 ERR (3):
2018-09-19T13:34:11+02:00 ERR (3):
2018-09-20T10:32:44+02:00 ERR (3):

3
log/log.log
View File

@ -32,3 +32,6 @@
2018-09-19T12:21:19+02:00 ERR (3):
2018-09-19T12:21:44+02:00 ERR (3):
2018-09-19T12:21:59+02:00 ERR (3):
2018-09-19T13:33:57+02:00 ERR (3):
2018-09-19T13:34:11+02:00 ERR (3):
2018-09-20T10:32:44+02:00 ERR (3):

2
public/css/wordRotator.css
View File

File diff suppressed because one or more lines are too long

2
public/html/application/level.html
View File

@ -1 +1 @@
<div class="max-height overflow-hidden"><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=segment-triangle-template class="segment segment-triangle"><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"><div id=level></div></div><div class="show-when-won flex-center height-20"><button class="button max-width" id=continue-button data-translation=continue></button></div></div></div>
<div class="max-height overflow-hidden"><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=segment-triangle-template class="segment segment-triangle"><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 id=coin-container><div id=coin-template class=coin><img src=img/coin.png></div></div></div><div class="flex-center height-60"><div id=level></div></div><div class="show-when-won flex-center height-20"><button class="button max-width" id=continue-button data-translation=continue></button></div></div></div>

BIN
public/img/coin.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 264 KiB

BIN
public/img/coinTower.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

107
public/js/app.js
View File

@ -1,21 +1,10 @@
class SystemSettings {
static setBasePath(basePath)
{
SystemSettings._basePath = basePath;
}
static getBasePath()
{
return SystemSettings._basePath;
}
}
SystemSettings.setBasePath("/");
class MenuAction {
constructor(title, callback, showFor, order) {
this.title = Helper.nonNull(title, null);
this.callback = callback;
this.showFor = Helper.nonNull(showFor, MenuAction.SHOW_FOR_MEDIUM);
this.order = Helper.nonNull(order, 1000);
this._liClass = "";
this._menu = null;
this._activated = true;
@ -112,6 +101,7 @@ class MenuAction {
copy.callback = this.callback;
copy.showFor = this.showFor;
copy.order = this.order;
copy._liClass = this._liClass;
copy._activated = this._activated;
copy._visible = this._visible;
@ -174,8 +164,7 @@ class Menu {
}
}
copy(instance)
{
copy(instance) {
instance = Helper.nonNull(instance, new Menu([]));
instance.actions = [];
@ -261,19 +250,16 @@ class Menu {
let iconElement = document.createElement("img");
iconElement.src = action.getIcon();
iconElement.classList.add('action-image');
if (action.getShouldTranslate())
{
if (action.getShouldTranslate()) {
iconElement.dataset["translationTitle"] = action.title;
}
aElement.appendChild(iconElement);
}
let title = action.getTitle();
if (action.getShouldTranslate())
{
if (action.getShouldTranslate()) {
title = Translator.makePersistentTranslation(title);
}
else
{
else {
title = document.createTextNode(title);
}
aElement.appendChild(title);
@ -285,14 +271,16 @@ class Menu {
renderLiElement(aElement, action) {
let liElement = document.createElement("li");
liElement.classList.add('action');
if (action._liClass.trim() !== "") {
liElement.classList.add(action._liClass);
}
liElement.appendChild(aElement);
liElement.dataset["id"] = action.id;
if (Helper.isNotNull(action.getIcon())) {
liElement.classList.add("img");
}
if (!action.getVisible())
{
if (!action.getVisible()) {
liElement.classList.add("hidden");
}
@ -312,21 +300,18 @@ class Menu {
});
}
_getElementsForAction(action){
_getElementsForAction(action) {
let elements = [];
for (let i = 0; i < this.parentElements.length; i++) {
let elem = this.parentElements[i].querySelector("[data-id=\""+action.getId()+"\"]");
let elem = this.parentElements[i].querySelector("[data-id=\"" + action.getId() + "\"]");
Helper.isNull(elem) || elements.push(elem);
}
return elements
}
updateAction(action)
{
console.log("update action here!");
updateAction(action) {
let oldElements = this._getElementsForAction(action);
if (oldElements.length === 0)
{
if (oldElements.length === 0) {
return;
}
@ -338,11 +323,9 @@ class Menu {
}
}
removeAction(action)
{
removeAction(action) {
let index = this.actions.indexOf(action);
if (index > 0)
{
if (index > 0) {
this.actions.splice(index, 1);
let oldElements = this._getElementsForAction(action);
for (let i = 0, n = oldElements.length; i < n; i++) {
@ -1291,6 +1274,31 @@ class Helper {
}
Helper.init();
class SystemSettings {
static setBasePath(basePath) {
SystemSettings._basePath = basePath;
}
static getBasePath() {
return SystemSettings._basePath;
}
static set(key, value) {
SystemSettings._settings[key] = value;
}
static get(key, defaultValue) {
return Helper.nonNull(SystemSettings._settings[key], defaultValue);
}
static has(key){
return Helper.nonNull(SystemSettings._settings[key]);
}
}
SystemSettings.setBasePath("/");
SystemSettings._settings = {};
class ThemeManager {
static init() {
ThemeManager.loadCurrentTheme();
@ -5495,7 +5503,20 @@ class EndSite extends WordRotatorBaseSite{
class LevelSite extends WordRotatorBaseSite {
constructor(siteManager) {
super(siteManager, "html/application/level.html");
this.levelScaler = ()=>{};
this.levelScaler = () => {
};
}
createActionBarMenu(menu) {
menu = super.createActionBarMenu(menu);
let coinAction = new MenuAction(Helper.nonNull(localStorage.getItem("coins"), "0"), ()=>{}, MenuAction.SHOW_ALWAYS, 900);
coinAction.setShouldTranslate(false);
coinAction._liClass = "coin-counter";
menu.addAction(coinAction);
this.coinAction = coinAction;
return menu;
}
onConstruct(args) {
@ -5540,6 +5561,12 @@ class LevelSite extends WordRotatorBaseSite {
this.levelNumberScaler = scaleHelper.scaleToFull(this.levelCounterAction, this.levelCounterActionContainer, false, false, 4);
this.templateContainer = new TemplateContainer(leafSegmentTemplate, parentSegmentTemplate, rowSegmentTemplate, triangleTemplate);
this.coinTemplate = this.findBy("#coin-template");
this.coinContainer = this.findBy("#coin-container");
this.coinTemplate.id = null;
this.coinContainer.removeAllChildren();
this.loadLastLevel();
}
@ -5614,6 +5641,9 @@ class LevelSite extends WordRotatorBaseSite {
this.level = level;
this.levelCounterAction.innerText = this.levelCounter;
this.levelNumberScaler();
this.coinAction.setTitle(Helper.nonNull(localStorage.getItem("coins"), "0"));
this.coinAction.redraw();
}
catch (e) {
console.error(e);
@ -5644,6 +5674,15 @@ class LevelSite extends WordRotatorBaseSite {
this._siteContent.classList.add('won');
localStorage.removeItem("currentLevel");
this.coinContainer.removeAllChildren();
let coinsPerLevel = SystemSettings.get("coinsPerLevel", 5);
for (let i = 0; i < coinsPerLevel; i++) {
let coinElem = Helper.cloneNode(this.coinTemplate);
this.coinContainer.appendChild(coinElem);
}
localStorage.setItem("coins", parseInt(Helper.nonNull(localStorage.getItem("coins"), "0"))+parseInt(coinsPerLevel));
await savePromise;
}
catch (e) {

74
src/js/lib/pwa-lib.js
View File

@ -1,21 +1,10 @@
class SystemSettings {
static setBasePath(basePath)
{
SystemSettings._basePath = basePath;
}
static getBasePath()
{
return SystemSettings._basePath;
}
}
SystemSettings.setBasePath("/");
class MenuAction {
constructor(title, callback, showFor, order) {
this.title = Helper.nonNull(title, null);
this.callback = callback;
this.showFor = Helper.nonNull(showFor, MenuAction.SHOW_FOR_MEDIUM);
this.order = Helper.nonNull(order, 1000);
this._liClass = "";
this._menu = null;
this._activated = true;
@ -112,6 +101,7 @@ class MenuAction {
copy.callback = this.callback;
copy.showFor = this.showFor;
copy.order = this.order;
copy._liClass = this._liClass;
copy._activated = this._activated;
copy._visible = this._visible;
@ -174,8 +164,7 @@ class Menu {
}
}
copy(instance)
{
copy(instance) {
instance = Helper.nonNull(instance, new Menu([]));
instance.actions = [];
@ -261,19 +250,16 @@ class Menu {
let iconElement = document.createElement("img");
iconElement.src = action.getIcon();
iconElement.classList.add('action-image');
if (action.getShouldTranslate())
{
if (action.getShouldTranslate()) {
iconElement.dataset["translationTitle"] = action.title;
}
aElement.appendChild(iconElement);
}
let title = action.getTitle();
if (action.getShouldTranslate())
{
if (action.getShouldTranslate()) {
title = Translator.makePersistentTranslation(title);
}
else
{
else {
title = document.createTextNode(title);
}
aElement.appendChild(title);
@ -285,14 +271,16 @@ class Menu {
renderLiElement(aElement, action) {
let liElement = document.createElement("li");
liElement.classList.add('action');
if (action._liClass.trim() !== "") {
liElement.classList.add(action._liClass);
}
liElement.appendChild(aElement);
liElement.dataset["id"] = action.id;
if (Helper.isNotNull(action.getIcon())) {
liElement.classList.add("img");
}
if (!action.getVisible())
{
if (!action.getVisible()) {
liElement.classList.add("hidden");
}
@ -312,21 +300,18 @@ class Menu {
});
}
_getElementsForAction(action){
_getElementsForAction(action) {
let elements = [];
for (let i = 0; i < this.parentElements.length; i++) {
let elem = this.parentElements[i].querySelector("[data-id=\""+action.getId()+"\"]");
let elem = this.parentElements[i].querySelector("[data-id=\"" + action.getId() + "\"]");
Helper.isNull(elem) || elements.push(elem);
}
return elements
}
updateAction(action)
{
console.log("update action here!");
updateAction(action) {
let oldElements = this._getElementsForAction(action);
if (oldElements.length === 0)
{
if (oldElements.length === 0) {
return;
}
@ -338,11 +323,9 @@ class Menu {
}
}
removeAction(action)
{
removeAction(action) {
let index = this.actions.indexOf(action);
if (index > 0)
{
if (index > 0) {
this.actions.splice(index, 1);
let oldElements = this._getElementsForAction(action);
for (let i = 0, n = oldElements.length; i < n; i++) {
@ -1291,6 +1274,31 @@ class Helper {
}
Helper.init();
class SystemSettings {
static setBasePath(basePath) {
SystemSettings._basePath = basePath;
}
static getBasePath() {
return SystemSettings._basePath;
}
static set(key, value) {
SystemSettings._settings[key] = value;
}
static get(key, defaultValue) {
return Helper.nonNull(SystemSettings._settings[key], defaultValue);
}
static has(key){
return Helper.nonNull(SystemSettings._settings[key]);
}
}
SystemSettings.setBasePath("/");
SystemSettings._settings = {};
class ThemeManager {
static init() {
ThemeManager.loadCurrentTheme();

7
src/module/Application/pwa/html/application/fragment/settings.html
View File

@ -8,6 +8,13 @@
</span>
</div>
<!--<div class='row'>-->
<!--<span class='columns small-6' data-translation="language"></span>-->
<!--<span class='columns small-6'>-->
<!--<label id = 'language-radio-template'><input type="radio" class='setting' name='language'></label>-->
<!--</span>-->
<!--</div>-->
<button id = 'reset-levels' class = "button" data-translation="reset-levels"></button>

5
src/module/Application/pwa/html/application/level.html
View File

@ -16,6 +16,11 @@
<div class='max-height'>
<div class = 'show-when-won height-20 center flex-center'>
<b data-translation="won" id = "won-text"></b>
<div id = 'coin-container'>
<div id = 'coin-template' class='coin'>
<img src = 'img/coin.png'/>
</div>
</div>
</div>
<div class="flex-center height-60">
<div id='level'>

35
src/module/Application/pwa/js/site/LevelSite.js
View File

@ -1,4 +1,4 @@
import {Helper, Menu, MenuAction} from "../../../../../js/lib/pwa-lib";
import {Helper, Menu, MenuAction, SystemSettings} from "../../../../../js/lib/pwa-lib";
import {ParentSegment} from "../wordrotator/Segment/ParentSegment";
import {LeafSegment} from "../wordrotator/Segment/LeafSegment";
import {TemplateContainer} from "../wordrotator/Segment/TemplateContainer";
@ -12,7 +12,20 @@ import {WordRotatorBaseSite} from "./WordRotatorBaseSite";
export class LevelSite extends WordRotatorBaseSite {
constructor(siteManager) {
super(siteManager, "html/application/level.html");
this.levelScaler = ()=>{};
this.levelScaler = () => {
};
}
createActionBarMenu(menu) {
menu = super.createActionBarMenu(menu);
let coinAction = new MenuAction(Helper.nonNull(localStorage.getItem("coins"), "0"), ()=>{}, MenuAction.SHOW_ALWAYS, 900);
coinAction.setShouldTranslate(false);
coinAction._liClass = "coin-counter";
menu.addAction(coinAction);
this.coinAction = coinAction;
return menu;
}
onConstruct(args) {
@ -57,6 +70,12 @@ export class LevelSite extends WordRotatorBaseSite {
this.levelNumberScaler = scaleHelper.scaleToFull(this.levelCounterAction, this.levelCounterActionContainer, false, false, 4);
this.templateContainer = new TemplateContainer(leafSegmentTemplate, parentSegmentTemplate, rowSegmentTemplate, triangleTemplate);
this.coinTemplate = this.findBy("#coin-template");
this.coinContainer = this.findBy("#coin-container");
this.coinTemplate.id = null;
this.coinContainer.removeAllChildren();
this.loadLastLevel();
}
@ -131,6 +150,9 @@ export class LevelSite extends WordRotatorBaseSite {
this.level = level;
this.levelCounterAction.innerText = this.levelCounter;
this.levelNumberScaler();
this.coinAction.setTitle(Helper.nonNull(localStorage.getItem("coins"), "0"));
this.coinAction.redraw();
}
catch (e) {
console.error(e);
@ -161,6 +183,15 @@ export class LevelSite extends WordRotatorBaseSite {
this._siteContent.classList.add('won');
localStorage.removeItem("currentLevel");
this.coinContainer.removeAllChildren();
let coinsPerLevel = SystemSettings.get("coinsPerLevel", 5);
for (let i = 0; i < coinsPerLevel; i++) {
let coinElem = Helper.cloneNode(this.coinTemplate);
this.coinContainer.appendChild(coinElem);
}
localStorage.setItem("coins", parseInt(Helper.nonNull(localStorage.getItem("coins"), "0"))+parseInt(coinsPerLevel));
await savePromise;
}
catch (e) {

20
src/scss/wordRotator.scss
View File

@ -207,4 +207,24 @@ $animationDuration: 0.25s;
transform: translate(-50%,-50%);
font-weight: bold;
}
}
//coin element
.coin-counter{
display: inline-block;
position: relative;
:after{
background-image: url('../img/coinTower.png');
background-size: 20px 20px;
width: 20px;
height: 20px;
display: inline-block;
content:"";
}
}
#coin-container .coin{
margin: 3px;
max-width: 30px;
display: inline-block;
}