Tutorial angefangen

This commit is contained in:
silas
2018-09-27 12:32:28 +02:00
parent 4a5d41fe70
commit d2a5489c32
21 changed files with 491 additions and 216 deletions

View File

@@ -4827,76 +4827,20 @@ InitPromise.addPromise(function (app) {
app.addDeepLink("code", CodeSite);
});
class WordRotatorDb extends MyDb {
static getInstance() {
if (Helper.isNull(WordRotatorDb.instance)) {
WordRotatorDb.instance = new WordRotatorDb();
}
return WordRotatorDb.instance;
}
constructor() {
super("wordRotator", 3);
}
upgrade(db, oldVersion, newVersion, e) {
if (Helper.isNull(oldVersion) || oldVersion < 1 && newVersion >= 1) {
let levelObjectStore = db.createObjectStore(WordRotatorDb.OBJECT_STORE.LEVEL, {"keyPath": "id"});
}
if (Helper.isNull(oldVersion) || oldVersion < 2 && newVersion >= 2) {
let levelObjectStore = e.target.transaction.objectStore(WordRotatorDb.OBJECT_STORE.LEVEL);
levelObjectStore.createIndex("played", ["deleted", "played", "difficulty", "id"], {"unique": false});
}
if (Helper.isNull(oldVersion) || oldVersion < 3 && newVersion >= 3) {
let levelObjectStore = e.target.transaction.objectStore(WordRotatorDb.OBJECT_STORE.LEVEL);
levelObjectStore.createIndex("difficulty", "difficulty", {"unique": false});
}
};
async saveManyLevels(levels) {
return this.saveMany(levels, WordRotatorDb.OBJECT_STORE.LEVEL);
}
async loadLevel(levelId) {
return this.load(levelId, WordRotatorDb.OBJECT_STORE.LEVEL);
}
async loadNextLevel(rendererTypes) {
const levels = await this.loadMany("difficulty", IDBKeyRange.lowerBound(0), WordRotatorDb.OBJECT_STORE.LEVEL);
let wrongLevels = [];
let newLevels = [];
let difficulty = -1;
for (let i = 0, n = levels.length; i < n; i++) {
if ((difficulty < 0 || difficulty === levels[i]["difficulty"]) && !levels[i]["deleted"] && !levels[i]["played"] && rendererTypes.indexOf(levels[i]["rendererType"]) !== -1) {
newLevels.push(levels[i]);
difficulty = levels[i]["difficulty"];
}
else if (levels[i]["difficulty"] !== 0 && !levels[i]["deleted"] && !levels[i]["played"] ) {
wrongLevels.push(levels[i]);
}
}
if (newLevels.length === 0) {
return null;
}
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);
}
class WordRotatorBaseSite extends AbstractSite {
// createActionBarMenu(menu) {
// menu = super.createActionBarMenu(menu);
// // menu.addAction(SettingsSite.settingsAction.copy());
// // let actions = menu.actions;
// // for (let i = 0; i < actions.length; i++) {
// // if (actions[i].title === "login" || actions[i].title === "registration"){
// // actions[i].setVisible(false);
// // }
// // }
// return menu;
// }
}
WordRotatorDb.OBJECT_STORE = {
LEVEL: "level",
};
WordRotatorDb.instance = null;
class TemplateContainer{
constructor(leafTemplate, parentTemplate, rowTemplate, triangleTemplate){
this.leafTemplate = leafTemplate;
@@ -5044,6 +4988,7 @@ class ParentSegment extends Segment {
this.touchendListener = function (e) {
let target = document.elementFromPoint(e.changedTouches[0].pageX, e.changedTouches[0].pageY);
if (e.targetTouches.length === 0 && e.changedTouches.length === 1 && self.element.contains(ParentSegment.mouseDownTarget) && self.element.contains(target)) {
self.getLevel().segmentClickedListener(self);
self.rotate(ParentSegment.mouseDownTarget, target);
e.stopPropagation();
e.preventDefault();
@@ -5051,6 +4996,7 @@ class ParentSegment extends Segment {
};
this.mouseupListener = function (e) {
if (ParentSegment.mouseDownTarget !== null && self.element.contains(ParentSegment.mouseDownTarget) && self.element.contains(e.target)) {
self.getLevel().segmentClickedListener(self);
self.rotate(ParentSegment.mouseDownTarget, e.target);
e.stopPropagation();
e.preventDefault();
@@ -5258,6 +5204,8 @@ class Level {
self.wonResolver = resolve;
self.giveUpResolver = reject;
});
this.segmentClickedListener = () => {};
}
saveAsCurrentLevel(){
@@ -5368,6 +5316,10 @@ class Level {
return Level._getRotatableSegmentsFrom(this.rootSegment);
}
setSegmentClickedListener(listener){
this.segmentClickedListener = listener;
}
static _getRotatableSegmentsFrom(segment){
let rotatable = [];
if (segment.canRotate())
@@ -5723,20 +5675,76 @@ LevelHelper.types = {
160: FourWordsLevel12,
};
class WordRotatorBaseSite extends AbstractSite {
// createActionBarMenu(menu) {
// menu = super.createActionBarMenu(menu);
// // menu.addAction(SettingsSite.settingsAction.copy());
// // let actions = menu.actions;
// // for (let i = 0; i < actions.length; i++) {
// // if (actions[i].title === "login" || actions[i].title === "registration"){
// // actions[i].setVisible(false);
// // }
// // }
// return menu;
// }
class WordRotatorDb extends MyDb {
static getInstance() {
if (Helper.isNull(WordRotatorDb.instance)) {
WordRotatorDb.instance = new WordRotatorDb();
}
return WordRotatorDb.instance;
}
constructor() {
super("wordRotator", 3);
}
upgrade(db, oldVersion, newVersion, e) {
if (Helper.isNull(oldVersion) || oldVersion < 1 && newVersion >= 1) {
let levelObjectStore = db.createObjectStore(WordRotatorDb.OBJECT_STORE.LEVEL, {"keyPath": "id"});
}
if (Helper.isNull(oldVersion) || oldVersion < 2 && newVersion >= 2) {
let levelObjectStore = e.target.transaction.objectStore(WordRotatorDb.OBJECT_STORE.LEVEL);
levelObjectStore.createIndex("played", ["deleted", "played", "difficulty", "id"], {"unique": false});
}
if (Helper.isNull(oldVersion) || oldVersion < 3 && newVersion >= 3) {
let levelObjectStore = e.target.transaction.objectStore(WordRotatorDb.OBJECT_STORE.LEVEL);
levelObjectStore.createIndex("difficulty", "difficulty", {"unique": false});
}
};
async saveManyLevels(levels) {
return this.saveMany(levels, WordRotatorDb.OBJECT_STORE.LEVEL);
}
async loadLevel(levelId) {
return this.load(levelId, WordRotatorDb.OBJECT_STORE.LEVEL);
}
async loadNextLevel(rendererTypes) {
const levels = await this.loadMany("difficulty", IDBKeyRange.lowerBound(0), WordRotatorDb.OBJECT_STORE.LEVEL);
let wrongLevels = [];
let newLevels = [];
let difficulty = -1;
for (let i = 0, n = levels.length; i < n; i++) {
if ((difficulty < 0 || difficulty === levels[i]["difficulty"]) && !levels[i]["deleted"] && !levels[i]["played"] && rendererTypes.indexOf(levels[i]["rendererType"]) !== -1) {
newLevels.push(levels[i]);
difficulty = levels[i]["difficulty"];
}
else if (levels[i]["difficulty"] !== 0 && !levels[i]["deleted"] && !levels[i]["played"] ) {
wrongLevels.push(levels[i]);
}
}
if (newLevels.length === 0) {
return null;
}
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 = {
LEVEL: "level",
};
WordRotatorDb.instance = null;
class EndSite extends WordRotatorBaseSite{
constructor(siteManager) {
super(siteManager, "html/application/end.html");
@@ -5769,11 +5777,16 @@ class LevelSite extends WordRotatorBaseSite {
aborted: false,
coinCounterTimer: null,
};
this.coinPromise = Promise.resolve();
let settingsManager = SettingsManager.getInstance();
let soundManager = SoundManager.getInstance();
soundManager.set({audio: "sound/single_coin_fall_on_concrete_.mp3", muted: !settingsManager.getSetting("play-sound", true), volume:0.7}, SoundManager.CHANNELS.SOUND);
soundManager.set({
audio: "sound/single_coin_fall_on_concrete_.mp3",
muted: !settingsManager.getSetting("play-sound", true),
volume: 0.7
}, SoundManager.CHANNELS.SOUND);
return super.onConstruct(args);
}
@@ -5864,7 +5877,7 @@ class LevelSite extends WordRotatorBaseSite {
this.levelScaler = await scaleHelper.scaleToFull(levelSegment, levelSegment.parentElement, false, false, 2, level.words[0].length * 2, null, 0);
this.level = level;
return;
return this.tutorial();
}
}
catch (e) {
@@ -5910,6 +5923,8 @@ class LevelSite extends WordRotatorBaseSite {
this.wonParams.aborted = true;
clearTimeout(this.wonParams.coinCounterTimer);
return this.tutorial();
}
catch (e) {
console.error(e);
@@ -5950,24 +5965,31 @@ class LevelSite extends WordRotatorBaseSite {
this.coinContainer.removeAllChildren();
let coinsPerLevel = SystemSettings.get("coinsPerLevel", 5);
let coinsBefore = parseInt(Helper.nonNull(localStorage.getItem("coins"), "0"));
localStorage.setItem("coins", coinsBefore + parseInt(coinsPerLevel));
let coinsBefore = 0;
let soundManager = SoundManager.getInstance();
let audioOptions = soundManager.get(SoundManager.CHANNELS.SOUND);
let coinPromise = Promise.all([new Promise((r) => {
this.coinPromise = Promise.all([new Promise((r) => {
setTimeout(() => {
r(continueButton.fadeIn());
}, 500);
}), audioOptions.loadedPromise.catch(e => {console.error(e);})]);
}), audioOptions.loadedPromise.catch(e => {
console.error(e);
}),
this.coinPromise.then(() => {
coinsBefore = parseInt(Helper.nonNull(localStorage.getItem("coins"), "0"));
localStorage.setItem("coins", coinsBefore + parseInt(coinsPerLevel));
})
]);
this.wonParams.aborted = false;
for (let i = 0; i < coinsPerLevel; i++) {
let coinElem = Helper.cloneNode(this.coinTemplate);
this.coinContainer.appendChild(coinElem);
coinPromise = coinPromise.then(() => {
this.coinPromise = this.coinPromise.then(() => {
return new Promise(r => {
let timeout = 350;
@@ -6027,8 +6049,85 @@ class LevelSite extends WordRotatorBaseSite {
FlashMessenger.addMessage("not-enough-coins");
}
}
async tutorial() {
if (this.level.id === LevelSite.TUTORIAL.FIRST_LEVEL) {
let currentStep = Helper.nonNull(localStorage.getItem("tutorial-step"), "1");
let scaleHelper = new ScaleHelper();
this._siteContent.classList.add("tutorial");
this._siteContent.classList.add("step-" + currentStep);
this.levelScaler();
switch (currentStep) {
case "1": {
this.level.setSegmentClickedListener(() => {
this._siteContent.classList.remove("step-1");
localStorage.setItem("tutorial-step", "2");
this.tutorial();
});
let textElem = this.findBy(".tutorial-text .step-1");
scaleHelper.scaleToFull(textElem, textElem.parentElement, null, true, null, 2);
break;
}
case "2": {
this.level.setSegmentClickedListener(() => {
});
this.level.getWonPromise().then(() => {
this._siteContent.classList.remove("tutorial");
this._siteContent.classList.remove("step-2");
localStorage.removeItem("tutorial-step");
this.coinPromise = this.coinPromise.then(() => {
FlashMessenger.addMessage("extra-coins-after-first-level");
localStorage.setItem("coins", parseInt(Helper.nonNull(localStorage.getItem("coins"), "0")) + 50);
this.coinAction.setTitle(Helper.nonNull(localStorage.getItem("coins"), "0"));
this.coinAction.redraw();
});
});
let textElem = this.findBy(".tutorial-text .step-2");
scaleHelper.scaleToFull(textElem, textElem.parentElement, null, true, null, 2);
break;
}
}
}
else if (this.level.id === LevelSite.TUTORIAL.SECOND_LEVEL) {
let currentStep = Helper.nonNull(localStorage.getItem("tutorial-step"), "3");
let scaleHelper = new ScaleHelper();
this._siteContent.classList.add("tutorial");
this._siteContent.classList.add("step-" + currentStep);
this.levelScaler();
switch (currentStep) {
case "3": {
let eventListener = () => {
this._siteContent.classList.remove("tutorial");
this._siteContent.classList.remove("step-2");
localStorage.removeItem("tutorial-step");
this.findBy("#help-button").removeEventListener("click", eventListener);
};
this.findBy("#help-button").addEventListener("click", eventListener);
let textElem = this.findBy(".tutorial-text .step-3");
scaleHelper.scaleToFull(textElem, textElem.parentElement, null, true, null, 2);
break;
}
}
}
}
}
LevelSite.TUTORIAL = {
FIRST_LEVEL: 67,
SECOND_LEVEL: 15,
};
class MainMenuLevel extends FourWordsLevel{
constructor(templateContainer) {
@@ -6045,7 +6144,7 @@ class MainMenuLevel extends FourWordsLevel{
class MenuSite extends WordRotatorBaseSite {
constructor(siteManager) {
super(siteManager, "html/application/menu.html");
this.loadLevelPromise = this.loadLevels();
this.listener = null;
}
@@ -6125,7 +6224,7 @@ class MenuSite extends WordRotatorBaseSite {
let playButton = this.findBy("#play-button");
playButton.addEventListener("click", () => {
this.startSite(LevelSite);
this.startSite(LevelSite, this.loadLevelPromise);
});
let leafSegmentTemplate = this.findBy("#segment-leaf-template");
@@ -6171,9 +6270,6 @@ class MenuSite extends WordRotatorBaseSite {
playSoundButton.addEventListener("change", () => {
settingsManager.setSetting("play-sound", playSoundButton.checked);
soundManager.set({muted: !playSoundButton.checked}, SoundManager.CHANNELS.SOUND);
// if (playSoundButton.checked){
// soundManager.play(SoundManager.CHANNELS.MUSIC);
// }
});
}
@@ -6182,30 +6278,6 @@ class MenuSite extends WordRotatorBaseSite {
window.removeEventListener("resize", this.listener);
super.onPause(args);
}
}
MenuSite.app = null;
InitPromise.addPromise(app => {
MenuSite.app = app;
});
class SynchronizeSite extends WordRotatorBaseSite {
constructor(siteManager) {
super(siteManager, "html/application/sync.html");
}
async onConstruct(args) {
let res = await super.onConstruct(args);
await this.loadLevels();
return res;
}
onFirstStart() {
super.onFirstStart();
this.startSite(MenuSite);
this.finish();
}
async loadLevels() {
const dateLastSync = Helper.nonNull(localStorage.getItem("date-last-sync"), 0);
@@ -6247,6 +6319,11 @@ class SynchronizeSite extends WordRotatorBaseSite {
}
}
MenuSite.app = null;
InitPromise.addPromise(app => {
MenuSite.app = app;
});
class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
constructor(site) {
super(site, "html/application/fragment/settings.html");
@@ -6280,6 +6357,7 @@ class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
localStorage.removeItem("currentLevel");
localStorage.removeItem("date-last-sync");
localStorage.removeItem("levelCounter");
localStorage.removeItem("tutorial-step");
WordRotatorDb.getInstance().removeAll(WordRotatorDb.OBJECT_STORE.LEVEL);
});
@@ -6298,7 +6376,7 @@ if (window.location.pathname.endsWith("publicTest/"))
}
SystemSettings.setBasePath(basePath);
Translator.supportedLanguages = ["de", "en"];
Translator.supportedLanguages = ["de"];
Translator.markTranslations = false;
applyPolyfills();
@@ -6341,6 +6419,6 @@ InitPromise.resolve(app).then(function(){
let soundManager = SoundManager.getInstance();
soundManager.play(SoundManager.CHANNELS.MUSIC, {audio: "sound/brightAndBeautifull__.mp3", loop: true, volume: 0.6, muted: !settingsManager.getSetting("play-music", true)});
app.start(SynchronizeSite);
app.start(MenuSite);
Translator.setLanguage("de");
});

File diff suppressed because one or more lines are too long