Installierbar und Settings bearbeitet

This commit is contained in:
silas 2018-10-06 18:14:39 +02:00
parent 07ec39b1a1
commit cd917c0f2d
12 changed files with 48 additions and 26 deletions

1
.idea/wordRotator.iml generated
View File

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

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
<div><div id=theme-choose-container><div id=choose-theme-template><div class=name></div></div></div></div>
<div><div id=theme-choose-container><div id=choose-theme-template class="setting-row row"><div class="name column small-12"></div></div></div></div>

View File

@ -1 +1 @@
<div class="max-height fill-me"><div class="row max-width grow flex-center"><div class="columns small-centered small-12 smedium-11 medium-9 large-7"><div class="row setting-row" id=theme-chooser><span class="columns small-6" data-translation=theme></span> <span class="columns small-6 text-right"><div id=theme-name></div></span></div><label class="switch row setting-row"><span class="columns small-6" data-translation=sound></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=play-sound name=play-sound value=1 data-default=1> <span class=slider></span></span></label> <label class="switch row setting-row"><span class="columns small-6" data-translation=music></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=play-music name=play-music value=1 data-default=1> <span class=slider></span></span></label><div class="row setting-row" id=credits-button><span class="columns small-6" data-translation=credits></span> <span class="columns small-6 text-right" data-translation=">"></span></div><div class="row setting-row" id=privacy-policy-button><span class="columns small-6" data-translation=privacy-policy></span> <span class="columns small-6 text-right" data-translation=">"></span></div><div class="row setting-row" id=impressum-button><span class="columns small-6" data-translation=impressum></span> <span class="columns small-6 text-right" data-translation=">"></span></div><label class="switch row setting-row"><span class="columns small-6" data-translation=track></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=track-switch name=matomoShouldTrack value=1 data-default=1 data-raw=1> <span class=slider></span></span></label> <button id=reset-levels class="button hidden" data-translation=reset-levels></button></div></div></div>
<div class="max-height fill-me"><div class="row max-width grow flex-center"><div class="columns small-centered small-12 smedium-11 medium-9 large-7"><div class="row setting-row hidden" id=install-button><span class="columns small-6" data-translation=install></span> <span class="columns small-6 text-right" data-translation=">"></span></div><div class="row setting-row" id=theme-chooser><span class="columns small-6" data-translation=theme></span> <span class="columns small-6 text-right"><div id=theme-name></div></span></div><label class="switch row setting-row"><span class="columns small-6" data-translation=sound></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=play-sound name=play-sound value=1 data-default=1> <span class=slider></span></span></label> <label class="switch row setting-row"><span class="columns small-6" data-translation=music></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=play-music name=play-music value=1 data-default=1> <span class=slider></span></span></label><div class="row setting-row" id=credits-button><span class="columns small-6" data-translation=credits></span> <span class="columns small-6 text-right" data-translation=">"></span></div><div class="row setting-row" id=privacy-policy-button><span class="columns small-6" data-translation=privacy-policy></span> <span class="columns small-6 text-right" data-translation=">"></span></div><div class="row setting-row" id=impressum-button><span class="columns small-6" data-translation=impressum></span> <span class="columns small-6 text-right" data-translation=">"></span></div><label class="switch row setting-row"><span class="columns small-6" data-translation=track></span> <span class="columns small-6 text-right"><input type=checkbox class=setting id=track-switch name=matomoShouldTrack value=1 data-default=1 data-raw=1> <span class=slider></span></span></label> <button id=reset-levels class="button hidden" data-translation=reset-levels></button></div></div></div>

View File

@ -10,9 +10,7 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="manifest" href="js/manifest.json">
<link rel="manifest" href="js/manifest.json" crossOrigin="use-credentials">
<link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png">
@ -24,8 +22,6 @@
<meta name="msapplication-config" content="img/icons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<meta name="application-name" content="WordRotator">
<title>WordRotator</title>
@ -242,10 +238,6 @@
alert(error);
document.body.innerHTML = error;
}
window.addEventListener('beforeinstallprompt', e => {
console.log("beforeinstallprompt 2", e);
});
</script>
</body>
</html>

View File

@ -6756,7 +6756,7 @@ class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
themeNameElem.removeAllChildren().appendChild(Translator.makePersistentTranslation(currentThemeName));
this.findBy("#theme-chooser").addEventListener("click", async () => {
let newTheme = await (new ChooseThemeDialog()).show();
if (Helper.isNotNull(newTheme)){
if (Helper.isNotNull(newTheme)) {
SettingsManager.getInstance().setSetting("theme", newTheme);
ThemeManager.changeCurrentTheme(newTheme);
themeNameElem.removeAllChildren().appendChild(Translator.makePersistentTranslation(newTheme));
@ -6772,7 +6772,7 @@ class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
WordRotatorDb.getInstance().removeAll(WordRotatorDb.OBJECT_STORE.LEVEL);
});
if (location.hostname.includes("beta") || location.hostname.includes("127.0.0.1")){
if (location.hostname.includes("beta") || location.hostname.includes("127.0.0.1")) {
this.findBy("#reset-levels").classList.remove("hidden");
}
@ -6780,12 +6780,12 @@ class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
playMusicButton.addEventListener("change", () => {
let soundManager = SoundManager.getInstance();
soundManager.set({muted: !playMusicButton.checked}, SoundManager.CHANNELS.MUSIC);
if (playMusicButton.checked){
if (playMusicButton.checked) {
soundManager.play(SoundManager.CHANNELS.MUSIC);
}
});
this.findBy("#track-switch").addEventListener("change", function(e) {
this.findBy("#track-switch").addEventListener("change", function (e) {
Matomo.setTrack(this.checked === true);
e.stopPropagation();
e.preventDefault();
@ -6798,6 +6798,14 @@ class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
this.getSite().startSite(PrivacyPolicySite);
});
InstallManager.setCanInstallListener((e) => {
let installButton =this.findBy("#install-button");
installButton.addEventListener("click", () => {
e.prompt();
});
installButton.classList.remove("hidden");
});
return super.onFirstStart();
}

File diff suppressed because one or more lines are too long

View File

@ -1,7 +1,7 @@
<div>
<div id='theme-choose-container'>
<div id='choose-theme-template'>
<div class='name'></div>
<div id='choose-theme-template' class = 'setting-row row'>
<div class='name column small-12'></div>
</div>
</div>
</div>

View File

@ -1,6 +1,10 @@
<div class='max-height fill-me'>
<div class='row max-width grow flex-center'>
<div class='columns small-centered small-12 smedium-11 medium-9 large-7'>
<div class='row setting-row hidden' id='install-button'>
<span class='columns small-6' data-translation="install"></span>
<span class='columns small-6 text-right' data-translation=">"></span>
</div>
<div class='row setting-row' id="theme-chooser">
<span class='columns small-6' data-translation="theme"></span>
<span class='columns small-6 text-right'>

View File

@ -1,7 +1,7 @@
import {LocalStorageSettingsFragment, SettingsManager, SettingsSite} from "../../../../../js/lib/pwa-core";
import {Helper, InitPromise, ThemeManager, Translator} from "../../../../../js/lib/pwa-lib";
import {WordRotatorDb} from "../WordRotatorDb";
import {Matomo, SoundManager} from "../../../../../js/lib/pwa-assets";
import {InstallManager, Matomo, SoundManager} from "../../../../../js/lib/pwa-assets";
import {CreditsSite} from "../site/CreditsSite";
import {PrivacyPolicySite} from "../site/PrivacyPolicySite";
import {ChooseThemeDialog} from "../dialog/ChooseThemeDialog";
@ -19,7 +19,7 @@ export class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
themeNameElem.removeAllChildren().appendChild(Translator.makePersistentTranslation(currentThemeName));
this.findBy("#theme-chooser").addEventListener("click", async () => {
let newTheme = await (new ChooseThemeDialog()).show();
if (Helper.isNotNull(newTheme)){
if (Helper.isNotNull(newTheme)) {
SettingsManager.getInstance().setSetting("theme", newTheme);
ThemeManager.changeCurrentTheme(newTheme);
themeNameElem.removeAllChildren().appendChild(Translator.makePersistentTranslation(newTheme));
@ -35,7 +35,7 @@ export class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
WordRotatorDb.getInstance().removeAll(WordRotatorDb.OBJECT_STORE.LEVEL);
});
if (location.hostname.includes("beta") || location.hostname.includes("127.0.0.1")){
if (location.hostname.includes("beta") || location.hostname.includes("127.0.0.1")) {
this.findBy("#reset-levels").classList.remove("hidden");
}
@ -43,12 +43,12 @@ export class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
playMusicButton.addEventListener("change", () => {
let soundManager = SoundManager.getInstance();
soundManager.set({muted: !playMusicButton.checked}, SoundManager.CHANNELS.MUSIC);
if (playMusicButton.checked){
if (playMusicButton.checked) {
soundManager.play(SoundManager.CHANNELS.MUSIC);
}
});
this.findBy("#track-switch").addEventListener("change", function(e) {
this.findBy("#track-switch").addEventListener("change", function (e) {
Matomo.setTrack(this.checked === true);
e.stopPropagation();
e.preventDefault();
@ -61,6 +61,14 @@ export class WordRotatorSettingFragment extends LocalStorageSettingsFragment {
this.getSite().startSite(PrivacyPolicySite);
});
InstallManager.setCanInstallListener((e) => {
let installButton =this.findBy("#install-button");
installButton.addEventListener("click", () => {
e.prompt();
});
installButton.classList.remove("hidden");
});
return super.onFirstStart();
}

View File

@ -25,5 +25,6 @@
"impressum":"Impressum",
"track":"Anonymisierte Nutzungsdaten senden:",
">":">",
"choose-theme-dialog-title":"Theme auswählen:"
"choose-theme-dialog-title":"Theme auswählen:",
"install":"Installieren"
}

View File

@ -49,6 +49,12 @@
}
}
}
//.setting-row{
// border-bottom: 1px solid #{map-get($theme, textColor)};
// &:not(.hidden):first-child{
// border-top: 1px solid #{map-get($theme, textColor)};
// }
//}
}
body {
@ -93,11 +99,13 @@ body {
font-size: 1em !important;
}
.setting-row{
.setting-row:not(.hidden){
line-height: 1;
padding-top: 0.5em;
padding-bottom: 0.5em;
width: 100%;
cursor: pointer;
background: rgba(195, 195, 195, 0.13);
display: inline-block;
}
}