feat: ✨ added cookie prompt component not yet functional
removed js files from missconfigured typescript project
This commit is contained in:
parent
1da99ff982
commit
61abbcccc5
67
web/public/cookie.svg
Normal file
67
web/public/cookie.svg
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||||
|
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||||
|
<svg height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||||
|
viewBox="0 0 512 512" xml:space="preserve">
|
||||||
|
<path style="fill:#DC774E;" d="M211.805,8.17c79.011,0,147.51,44.991,181.27,110.755c-27.844-14.292-59.425-22.365-92.879-22.365
|
||||||
|
c-112.466,0-203.634,91.169-203.634,203.634c0,33.454,8.072,65.035,22.365,92.879C53.161,359.315,8.17,290.816,8.17,211.805
|
||||||
|
C8.17,99.339,99.339,8.17,211.805,8.17z M102.465,166.749c8.508-8.508,8.508-22.299,0-30.818c-8.508-8.508-22.299-8.508-30.807,0
|
||||||
|
c-8.508,8.519-8.508,22.31,0,30.818C80.166,175.257,93.957,175.257,102.465,166.749z"/>
|
||||||
|
<path style="fill:#F7CD95;" d="M393.074,118.926c65.765,33.77,110.755,102.258,110.755,181.27
|
||||||
|
c0,112.466-91.169,203.634-203.634,203.634c-79.011,0-147.5-44.991-181.27-110.755c-14.292-27.844-22.365-59.425-22.365-92.879
|
||||||
|
c0-112.466,91.169-203.634,203.634-203.634C333.65,96.561,365.23,104.633,393.074,118.926z M446.802,311.743
|
||||||
|
c0-12.037-9.761-21.787-21.787-21.787c-12.037,0-21.787,9.75-21.787,21.787s9.75,21.787,21.787,21.787
|
||||||
|
C437.041,333.53,446.802,323.78,446.802,311.743z M396.691,389.425c0-12.037-9.761-21.787-21.787-21.787
|
||||||
|
c-12.037,0-21.787,9.75-21.787,21.787s9.75,21.787,21.787,21.787C386.93,411.212,396.691,401.462,396.691,389.425z M381.691,221.337
|
||||||
|
c0-24.064-19.51-43.574-43.574-43.574c-24.075,0-43.574,19.51-43.574,43.574s19.5,43.574,43.574,43.574
|
||||||
|
C362.18,264.911,381.691,245.401,381.691,221.337z M283.844,379.043c0-24.064-19.51-43.574-43.574-43.574
|
||||||
|
s-43.574,19.51-43.574,43.574s19.51,43.574,43.574,43.574S283.844,403.107,283.844,379.043z M197.164,253.255
|
||||||
|
c0-12.037-9.75-21.787-21.787-21.787s-21.787,9.75-21.787,21.787s9.75,21.787,21.787,21.787
|
||||||
|
C187.414,275.042,197.164,265.292,197.164,253.255z"/>
|
||||||
|
<g>
|
||||||
|
<path style="fill:#8E4238;" d="M102.465,135.931c8.508,8.519,8.508,22.31,0,30.818s-22.299,8.508-30.807,0
|
||||||
|
c-8.508-8.508-8.508-22.299,0-30.818C80.166,127.423,93.957,127.423,102.465,135.931z"/>
|
||||||
|
<path style="fill:#8E4238;" d="M374.904,367.638c12.027,0,21.787,9.75,21.787,21.787s-9.761,21.787-21.787,21.787
|
||||||
|
c-12.037,0-21.787-9.75-21.787-21.787C353.117,377.388,362.866,367.638,374.904,367.638z"/>
|
||||||
|
<path style="fill:#8E4238;" d="M338.116,177.762c24.064,0,43.574,19.51,43.574,43.574s-19.51,43.574-43.574,43.574
|
||||||
|
c-24.075,0-43.574-19.51-43.574-43.574S314.041,177.762,338.116,177.762z"/>
|
||||||
|
</g>
|
||||||
|
<path style="fill:#B75548;" d="M175.376,231.468c12.037,0,21.787,9.75,21.787,21.787s-9.75,21.787-21.787,21.787
|
||||||
|
s-21.787-9.75-21.787-21.787S163.339,231.468,175.376,231.468z"/>
|
||||||
|
<circle style="fill:#8E4238;" cx="240.27" cy="379.043" r="43.574"/>
|
||||||
|
<path style="fill:#B75548;" d="M425.014,289.955c12.027,0,21.787,9.75,21.787,21.787s-9.761,21.787-21.787,21.787
|
||||||
|
c-12.037,0-21.787-9.75-21.787-21.787C403.227,299.705,412.977,289.955,425.014,289.955z"/>
|
||||||
|
<g>
|
||||||
|
<circle style="fill:#700D00;" cx="207.926" cy="67.595" r="8.17"/>
|
||||||
|
<circle style="fill:#700D00;" cx="251.098" cy="221.337" r="8.17"/>
|
||||||
|
<circle style="fill:#700D00;" cx="319.052" cy="324.085" r="8.17"/>
|
||||||
|
<path style="fill:#700D00;" d="M108.246,130.157c-5.658-5.657-13.181-8.774-21.183-8.774s-15.524,3.116-21.183,8.774
|
||||||
|
c-11.681,11.681-11.681,30.687,0,42.369c5.658,5.657,13.181,8.774,21.183,8.774s15.524-3.116,21.183-8.774
|
||||||
|
C119.927,160.844,119.927,141.838,108.246,130.157z M96.692,160.971c-2.572,2.572-5.991,3.988-9.629,3.988
|
||||||
|
s-7.057-1.416-9.629-3.988c-5.31-5.31-5.31-13.948,0-19.258c2.572-2.571,5.991-3.988,9.629-3.988s7.057,1.417,9.629,3.988
|
||||||
|
C102.001,147.022,102.001,155.661,96.692,160.971z"/>
|
||||||
|
<path style="fill:#700D00;" d="M16.34,211.807c0-107.78,87.686-195.466,195.466-195.466c53.958,0,104.193,21.508,141.451,60.564
|
||||||
|
c3.115,3.266,8.287,3.388,11.552,0.272c3.265-3.114,3.387-8.286,0.272-11.552c-19.574-20.518-42.617-36.657-68.489-47.971
|
||||||
|
C269.804,5.939,241.278,0,211.807,0C95.016,0,0,95.016,0,211.807c0,29.472,5.94,57.998,17.654,84.786
|
||||||
|
c11.314,25.872,27.454,48.916,47.972,68.489c1.582,1.51,3.611,2.258,5.639,2.258c2.156,0,4.307-0.848,5.913-2.531
|
||||||
|
c3.114-3.265,2.992-8.436-0.272-11.552C37.85,316,16.34,265.765,16.34,211.807z"/>
|
||||||
|
<path style="fill:#700D00;" d="M389.856,221.339c0-28.531-23.213-51.745-51.745-51.745s-51.745,23.213-51.745,51.745
|
||||||
|
s23.213,51.745,51.745,51.745S389.856,249.87,389.856,221.339z M338.112,256.743c-19.522,0-35.404-15.882-35.404-35.404
|
||||||
|
s15.882-35.404,35.404-35.404s35.404,15.882,35.404,35.404S357.634,256.743,338.112,256.743z"/>
|
||||||
|
<path style="fill:#700D00;" d="M240.267,327.302c-28.531,0-51.745,23.213-51.745,51.745s23.213,51.745,51.745,51.745
|
||||||
|
s51.745-23.213,51.745-51.745S268.799,327.302,240.267,327.302z M240.267,414.451c-19.521,0-35.404-15.882-35.404-35.404
|
||||||
|
s15.883-35.404,35.404-35.404c19.522,0,35.404,15.882,35.404,35.404S259.79,414.451,240.267,414.451z"/>
|
||||||
|
<path style="fill:#700D00;" d="M374.899,359.466c-16.518,0-29.957,13.439-29.957,29.957s13.439,29.957,29.957,29.957
|
||||||
|
c16.518,0,29.957-13.439,29.957-29.957S391.417,359.466,374.899,359.466z M374.899,403.041c-7.509,0-13.617-6.108-13.617-13.617
|
||||||
|
s6.108-13.617,13.617-13.617c7.509,0,13.617,6.108,13.617,13.617S382.407,403.041,374.899,403.041z"/>
|
||||||
|
<path style="fill:#700D00;" d="M425.01,281.785c-16.518,0-29.957,13.439-29.957,29.957S408.492,341.7,425.01,341.7
|
||||||
|
c16.518,0,29.957-13.439,29.957-29.957S441.528,281.785,425.01,281.785z M425.01,325.36c-7.509,0-13.617-6.108-13.617-13.617
|
||||||
|
s6.108-13.617,13.617-13.617s13.617,6.108,13.617,13.617S432.518,325.36,425.01,325.36z"/>
|
||||||
|
<path style="fill:#700D00;" d="M205.334,253.254c0-16.518-13.438-29.957-29.957-29.957s-29.957,13.439-29.957,29.957
|
||||||
|
s13.438,29.957,29.957,29.957S205.334,269.773,205.334,253.254z M175.376,266.871c-7.509,0-13.617-6.108-13.617-13.617
|
||||||
|
c0-7.509,6.108-13.617,13.617-13.617s13.617,6.108,13.617,13.617C188.993,260.763,182.884,266.871,175.376,266.871z"/>
|
||||||
|
<path style="fill:#700D00;" d="M300.192,88.386c-116.79,0-211.807,95.016-211.807,211.807C88.386,416.984,183.402,512,300.192,512
|
||||||
|
C416.984,512,512,416.984,512,300.192C512,183.402,416.984,88.386,300.192,88.386z M300.192,495.66
|
||||||
|
c-107.78,0-195.466-87.686-195.466-195.467c0-107.779,87.686-195.466,195.466-195.466
|
||||||
|
c107.781,0.001,195.467,87.687,195.467,195.466C495.66,407.974,407.974,495.66,300.192,495.66z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 6.1 KiB |
@ -2,9 +2,10 @@
|
|||||||
import {defineComponent, Ref, ref, SetupContext} from 'vue';
|
import {defineComponent, Ref, ref, SetupContext} from 'vue';
|
||||||
import DebugLog from "./classes/debugger";
|
import DebugLog from "./classes/debugger";
|
||||||
import Settings from "./components/Settings.vue";
|
import Settings from "./components/Settings.vue";
|
||||||
|
import cookiePrompt from "./components/cookiePrompt.vue";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {Settings, GameInput, AttemptList},
|
components: {Settings, cookiePrompt},
|
||||||
setup() {
|
setup() {
|
||||||
var showSettings:Ref<boolean> = ref(false);
|
var showSettings:Ref<boolean> = ref(false);
|
||||||
|
|
||||||
@ -35,7 +36,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
const attemptList = ref<InstanceType<typeof AttemptList> | null>(null);
|
const attemptList = ref<InstanceType<typeof AttemptList> | null>(null);
|
||||||
|
|
||||||
return { showSettings, toggleSettings, attemptList };
|
return { showSettings, toggleSettings };
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
@ -48,6 +49,7 @@ export default defineComponent({
|
|||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<Settings v-if="showSettings" @close="toggleSettings"/>
|
<Settings v-if="showSettings" @close="toggleSettings"/>
|
||||||
|
<cookiePrompt></cookiePrompt>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -1,16 +0,0 @@
|
|||||||
/**
|
|
||||||
* Used to log values given as parameter
|
|
||||||
* Function triggers when debug is set to true in local storage
|
|
||||||
* @param debugLogs An array of type debugInput logged
|
|
||||||
*/
|
|
||||||
function DebugLog(debugLogs) {
|
|
||||||
if (localStorage.getItem("debug") === "true") {
|
|
||||||
console.log("========================== [ fetched settings values from document ] ==========================");
|
|
||||||
debugLogs.forEach((log) => {
|
|
||||||
console.log(log.logText, log.logValue);
|
|
||||||
});
|
|
||||||
console.log("===============================================================================================");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default DebugLog;
|
|
||||||
//# sourceMappingURL=debugger.js.map
|
|
||||||
@ -1,31 +0,0 @@
|
|||||||
/**
|
|
||||||
* Handles getting the correct localized string for the requested key
|
|
||||||
* @param textKey The key for which text should be fetched
|
|
||||||
* @returns The localized text as a string
|
|
||||||
*/
|
|
||||||
async function GetLocalizedText(textKey) {
|
|
||||||
try {
|
|
||||||
// Dynamically import the JSON data and cast it to LocalizationData
|
|
||||||
const jsonData = (await import("../assets/language.json")).default;
|
|
||||||
// Return a new Promise
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
// Get the language from the 'data-language' attribute, default to "en"
|
|
||||||
const lang = document.documentElement.getAttribute("data-language") ?? "en";
|
|
||||||
// Construct the key based on the language and textKey
|
|
||||||
const localizedText = jsonData[`${lang}_${textKey}`];
|
|
||||||
// Check if the localized text exists
|
|
||||||
if (localizedText) {
|
|
||||||
resolve(localizedText); // Resolve with the localized text
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
reject(`No localized text found for key: ${lang}_${textKey}`); // Reject if not found
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
catch (error) {
|
|
||||||
// Handle any errors from importing the JSON file
|
|
||||||
return Promise.reject(`Failed to load localization with error: ${error}`);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default GetLocalizedText;
|
|
||||||
//# sourceMappingURL=language.js.map
|
|
||||||
@ -7,9 +7,9 @@ enum SettingNodes {
|
|||||||
/**
|
/**
|
||||||
* class which handles reading and writing settings
|
* class which handles reading and writing settings
|
||||||
*/
|
*/
|
||||||
class SettingsHandler {
|
class SettingsHandler implements ISettings{
|
||||||
|
|
||||||
settings:Map<string,string>
|
settings:Map<SettingNodes, any>
|
||||||
constructor() {
|
constructor() {
|
||||||
this.settings = new Map<SettingNodes, any>();
|
this.settings = new Map<SettingNodes, any>();
|
||||||
// TODO: load settings from localstorage if any present
|
// TODO: load settings from localstorage if any present
|
||||||
@ -20,7 +20,7 @@ class SettingsHandler {
|
|||||||
* @param name the settings name
|
* @param name the settings name
|
||||||
* @param value
|
* @param value
|
||||||
*/
|
*/
|
||||||
writeSetting(name:SettingNodes, value:any):boolean {
|
WriteSetting(name:SettingNodes, value:any):boolean {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -28,7 +28,7 @@ class SettingsHandler {
|
|||||||
* fetches settings from the localstorage and handles errors
|
* fetches settings from the localstorage and handles errors
|
||||||
* @param name the requested setting
|
* @param name the requested setting
|
||||||
*/
|
*/
|
||||||
fetchSettings(name:SettingNodes):any {
|
FetchSetting(name:SettingNodes):any {
|
||||||
return ""
|
return ""
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
57
web/src/components/cookiePrompt.vue
Normal file
57
web/src/components/cookiePrompt.vue
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import {defineComponent, SetupContext, ref, Ref} from 'vue';
|
||||||
|
import GetLocalizedText from "../classes/language";
|
||||||
|
import SettingsHandler from "../classes/settings";
|
||||||
|
import ISettings from "../interfaces/ISettings"
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
emits: ['close'],
|
||||||
|
name: 'cookiePrompt',
|
||||||
|
setup(_, { emit }: SetupContext) {
|
||||||
|
|
||||||
|
var settings:ISettings = new SettingsHandler();
|
||||||
|
|
||||||
|
function acceptCookies(){
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function rejectCookies(){
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
acceptCookies, rejectCookies
|
||||||
|
};
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div style="display: flexbox; width: 100%;">
|
||||||
|
<div class="hero bg-base-200 cardBody">
|
||||||
|
<div class="hero-content flex-col lg:flex-row">
|
||||||
|
<img src="/cookie.svg" class="max-w-sm rounded-lg shadow-2xl" />
|
||||||
|
<div>
|
||||||
|
<h1 class="text-5xl font-bold">Diese Seite nutzt Cookies</h1>
|
||||||
|
<p class="py-6">
|
||||||
|
Um richtig zu arbeiten verwendet diese Seite cookies.
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
Ein cookie welcher die entscheidung speichert wird immer gesetzt
|
||||||
|
</p>
|
||||||
|
<div class="divider"></div>
|
||||||
|
<button class="btn btn-success">Cookies zulassen</button>
|
||||||
|
<button class="btn btn-error" style="margin-left: 15px;">Cookies verbieten</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.cardBody {
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
4
web/src/interfaces/ISettings.ts
Normal file
4
web/src/interfaces/ISettings.ts
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
interface ISettings {
|
||||||
|
WriteSetting: (name:SettingNodes, value:any) => boolean;
|
||||||
|
FetchSetting: (name:SettingNodes) => any;
|
||||||
|
}
|
||||||
@ -1,7 +0,0 @@
|
|||||||
import { createApp } from 'vue';
|
|
||||||
import './style.css';
|
|
||||||
import App from './App.vue';
|
|
||||||
const app = createApp(App);
|
|
||||||
// Mount the app
|
|
||||||
app.mount('#app');
|
|
||||||
//# sourceMappingURL=main.js.map
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
// add the names of the themes you want to use here
|
|
||||||
// warning: you need to specify them in tailwind.config.js as well
|
|
||||||
// DO NOT REMOVE: 'default', 'light', 'dark'
|
|
||||||
export default [
|
|
||||||
'default',
|
|
||||||
'light',
|
|
||||||
'dark',
|
|
||||||
'storm',
|
|
||||||
'breeze',
|
|
||||||
'cupcake',
|
|
||||||
'bumblebee',
|
|
||||||
'emerald',
|
|
||||||
'corporate',
|
|
||||||
'synthwave',
|
|
||||||
'retro',
|
|
||||||
'cyberpunk',
|
|
||||||
'valentine',
|
|
||||||
'halloween',
|
|
||||||
'garden',
|
|
||||||
'forest',
|
|
||||||
'aqua',
|
|
||||||
'lofi',
|
|
||||||
'pastel',
|
|
||||||
'fantasy',
|
|
||||||
'wireframe',
|
|
||||||
'black',
|
|
||||||
'luxury',
|
|
||||||
'dracula',
|
|
||||||
'cmyk',
|
|
||||||
'autumn',
|
|
||||||
'business',
|
|
||||||
'acid',
|
|
||||||
'lemonade',
|
|
||||||
'night',
|
|
||||||
'coffee',
|
|
||||||
'winter',
|
|
||||||
];
|
|
||||||
//# sourceMappingURL=theme-manager.config.js.map
|
|
||||||
Loading…
x
Reference in New Issue
Block a user