<template>
  <v-app>
    <v-content>
      <v-container style="margin-left: 0px;" width="100%" >
        <div id="gamediv" class="apply-font">
          <div
            style="width: 640px; height: 480px; position: absolute; overflow: hidden;">
            <video v-if="levels[currentLevel].background" loop autoplay muted :src="levels[currentLevel].background"></video>
          </div>
          <v-card
            width="640"
            height="480"
            style="position: absolute; border-radius: 0px; top:0; left:0; z-index: 5"
            :img="levels[currentLevel].foreground"
          >
            <div
              style="position: absolute; border-radius: 0px; top: 0; left: 0; z-index: 20; width: 640px; height: 480px; display: block;"
              :style="{
                backgroundImage: 'url(' + overlayimg + ')',
                backgroundSize: 'cover',
              }"
              v-if="showoverlay"
            ></div>
            <div
              v-if="showtimer"
              style="position: absolute; top: 0; left: 0; z-index: 20; width: 640px; height: 480px; display: block;"
            >
              <base-timer
                :timeLimit="timer"
                :afterTimer="stoptimer"
              ></base-timer>
            </div>

            <template v-if="currentLevel == 0 && !hidehighscorecover">
              <v-card-title
                  style="justify-content: center;"
                  class="levelscore pa-6 font-weight-black apply-font"
              >
                High Score: {{ highscore }} by {{ highscorer }}
                <br />
              </v-card-title>
            </template>
            <template v-if="currentLevel != 0">
              <v-card-title
                  style="justify-content: center;"
                  class="levelscore pa-6 font-weight-black">
                {{ name }}
                <v-spacer></v-spacer>
                {{ score }}
              </v-card-title>
            </template>
            <v-card-text v-if="currentLevel > 0" style="height: 400px;">
              <v-container
                style="display: flex; justify-content: center"
                class="task font-weight-black"
                @click="completetask"
              >
                <v-row align="center" style="height: 300px;">
                  <v-col :class="{ completed: levels[currentLevel].completed }">
                    {{ levels[currentLevel].task }}
                    <br />
                    <v-icon x-large color="green" v-if="levels[currentLevel].completed"
                      >mdi-check</v-icon
                    >
                    {{ levels[currentLevel].points }} Points
                  </v-col>
                </v-row>
              </v-container>
            </v-card-text>
            <v-card-text v-else> </v-card-text>
          </v-card>
<!--          <div
            v-if="currentLevel > 0 && !hidehighscore"
            class="levelscore applyfont"
            style="font-size: 18px; position: absolute; bottom: 8px; right: 0px; "
          >
            High Score: {{ highscore }} by {{ highscorer }}
          </div>-->
        </div>
        <div id="levelselect">
          <v-virtual-scroll height="480" width="350" item-height="32" :items="levels">
            <template v-slot:default="{ item }">
              <v-list-item
                :key="item.index"
                @click="leveljump(item.index)"
                one-line
                dense
              >
                <v-list-item-action style="margin-right: 5px;">
                  <v-btn v-if="item.index == currentLevel"
                         x-small
                         depressed
                         color="error"
                  >
                    {{ item.index }}
                  </v-btn>
                  <v-btn v-else
                         x-small
                         depressed
                         color="teal"
                  >
                    {{ item.index }}
                  </v-btn>
                </v-list-item-action>
                <v-list-item-content>
                  <v-list-item-title v-if="item.index == currentLevel" >
                    <v-btn
                        x-small
                        depressed
                        color="error"
                    >
                      {{ item.title }}
                    </v-btn>
                  </v-list-item-title>
                  <v-list-item-title v-else
                                     style="margin-left: 0px;"
                  >
                    {{ item.title }}
                  </v-list-item-title>
                </v-list-item-content>
              </v-list-item>
              <v-divider />
            </template>
          </v-virtual-scroll>
        </div>

        <v-row>
          <v-col cols="9">
            <v-btn medium dense color="error" @click="reset">Reset</v-btn>
            <v-btn
                style="margin-left: 50px;"
                :disabled="currentLevel < 1"
                medium
                @click="previouslevel"
            >Previous Level</v-btn
            >
            <v-btn
                :disabled="currentLevel >= levels.length - 1"
                medium
                @click="nextlevel"
            >Next Level</v-btn
            >
          </v-col>
        </v-row>

        <v-row dense>
          <v-col :cols="12">
            <v-btn x-small @click="jumptotits">Tits</v-btn>
            <v-btn x-small @click="jumptopanties">Panties</v-btn>
            <v-btn x-small @click="jumptopussy">Pussy</v-btn>
            <v-btn x-small @click="jumptorubpussy">Rub Pussy</v-btn>
            <v-btn x-small @click="jumptosextoy">Sex Toy</v-btn>
            <v-btn x-small @click="jumptoclamps">Nipple Clamps</v-btn>
            <v-btn x-small @click="jumptocandle">Candle</v-btn>
            <v-btn x-small @click="jumptoassplay">Ass Play</v-btn>
            <v-btn x-small @click="jumptoasstoy">Ass Toy</v-btn>
          </v-col>
        </v-row>

        <v-row dense>
          <v-col :cols="6">
            <v-text-field
              dense
              v-model="name"
              label="Player Name"
              placeholder="Player Name"
            ></v-text-field>
          </v-col>
          <v-col :cols="3">
            <font-picker
                v-if="true"
                dense
                :api-key="'AIzaSyCAW_4WvUsVuikytJw_yvJKxHKRHrCsBAs'"
                :options="options"
                :active-font="fontFamily"
                @change="fontChanged"
            ></font-picker>
          </v-col>
        </v-row>
        <v-row dense>
            <v-col :cols="3">
              <v-text-field
                  dense
                  v-model="bonuspoints"
                  label="Bonus Points"
                  placeholder="Bonus Points"/>
            </v-col>
            <v-col :cols="3">
              <v-select
                  dense
                  v-model="timer"
                  label="Countdown time"
                  :items="countdownitems">
              </v-select>
            </v-col>
          </v-row>
        <v-row desnse>
          <v-col :cols="4">
            <v-btn
                x-small
                dense
                @click="givebonuspoints">Give bonus
            </v-btn>
          </v-col>
          <v-col :cols="1">
            <v-btn v-if="!showtimer" x-small @click="starttimer">Start</v-btn>
            <v-btn v-else x-small @click="stoptimer">Stop</v-btn>
          </v-col>
        </v-row>


        <div>
          <v-col :cols="12">
          <div
              class="levelcompliment font-weight-black">
            {{levels[currentLevel].compliment}}
          </div>
          </v-col>
        </div>

        <v-row>
          <v-col :cols="12">
          <v-btn
              color="primary"
              x-small
              dense
              @click="copycomp">Copy Compliment!
          </v-btn>
          </v-col>
        </v-row>
      </v-container>
    </v-content>
  </v-app>
</template>
<script>
import Vuetify from "vuetify";
// api key AIzaSyCAW_4WvUsVuikytJw_yvJKxHKRHrCsBAs
import FontPicker from "font-picker-vue";
import BaseTimer from "./components/BaseTimer.vue";

export default {
  vuetify: new Vuetify(),
  components: {
    FontPicker,
    BaseTimer,
  },
  beforeMount: function() {},
  mounted: function() {
    this.reset();
  },
  methods: {
    copycomp: function() {
        navigator.clipboard.writeText(this.levels[this.currentLevel].compliment)
    },
    reset: function () {
      this.currentLevel = 0;
      this.score = 0;
      this.currenttask = 0;
      this.name = "";
      for (var x = 0; x < this.levels.length; x++) {
        this.levels[x].completed = false;
        this.levels[x].index = x;
      }
    },
    /*scramble: function() {
      var tmp = [];
      for (
        var x = this.currenttask + 1;
        x < this.levels[this.currentLevel].tasks.length;
        x++
      ) {
        tmp.push(this.levels[this.currentLevel].tasks[x]);
      }
      tmp.sort(() => Math.random() - 0.5);
      for (
        x = this.currenttask + 1;
        x < this.levels[this.currentLevel].tasks.length;
        x++
      ) {
        this.levels[this.currentLevel].tasks[x] = tmp.pop();
      }
    },*/
    /*nexttask: function() {
      if (this.currenttask < this.levels[this.currentLevel].tasks.length - 1)
        this.currenttask++;
    },
    previoustask: function() {
      if (this.currenttask > 0) this.currenttask--;
    },*/

    nextlevel: function () {
      if (this.currentLevel < this.levels.length) {
        this.ready = false;
        this.currenttask = 0;
        this.currentLevel++;
        this.ready = true;
      }
    },
    previouslevel: function () {
      if (this.currentLevel > 0) {
        this.ready = false;
        this.currentLevel--;
        this.ready = true;
      }
    },
    /*nextTask: function() {
      this.currenttask++;
    },*/
    completetask: function () {
      if (!this.levels[this.currentLevel].completed) {
        this.levels[this.currentLevel].completed = true;
        this.score += this.levels[this.currentLevel].points;
        if (this.autonext && this.levels.length > this.currentLevel) {
          setTimeout(this.nextlevel, 600);
        }
      }
      console.log(this.currenttask);
    },
    givebonuspoints: function () {
      this.score += parseInt(this.bonuspoints);
      this.overlayimg = "assets/bonuspoints.png";
      this.showoverlay = true;
      setTimeout(this.stopoverlay, 2000);
    },
    leveljump: function (i) {
      this.ready = false;
      this.currentLevel = i;
      this.ready = true;
    },
    jumptotits: function () {
      this.ready = false;
      this.currentLevel = 13;
      this.ready = true;
    },
    jumptopanties: function () {
      this.ready = false;
      this.currentLevel = 30;
      this.ready = true;
    },
    jumptopussy: function () {
      this.ready = false;
      this.currentLevel = 39;
      this.ready = true;
    },
    jumptorubpussy: function () {
      this.ready = false;
      this.currentLevel = 49;
      this.ready = true;
    },
    jumptosextoy: function () {
      this.ready = false;
      this.currentLevel = 74;
      this.ready = true;
    },
    jumptoclamps: function () {
      this.ready = false;
      this.currentLevel = 84;
      this.ready = true;
    },
    jumptocandle: function () {
      this.ready = false;
      this.currentLevel = 89;
      this.ready = true;
    },
    jumptoassplay: function () {
      this.ready = false;
      this.currentLevel = 98;
      this.ready = true;
    },
    jumptoasstoy: function () {
      this.ready = false;
      this.currentLevel = 105;
      this.ready = true;
    },
    /*startoverlay: function() {
      this.overlayimg = this.overlayselect;
      this.showoverlay = true;
      setTimeout(this.stopoverlay, 5000);
    },*/
    stopoverlay: function () {
      this.showoverlay = false;
    },
    starttimer: function () {
      this.showtimer = true;
    },
    stoptimer: function () {
      this.showtimer = false;
    },
    fontChanged: function (e) {
      console.log(e);
      this.fontFamily = e.family;
    },
  },
  computed: {
    webmsource: function() {
      return "assets/webm" + this.currentLevel + ".webm";
    },
  },
  data: function() {
    return {
      options: {
        sort: "alphabetical",
        limit: 200,
      },
      /*hidehighscore: false,*/
      hidehightscorecover: false,
      fontFamily: "Acme",
      levels: [
        {
          title: "Start - Cover",
          foreground: "assets/background0.png",
          task: "",
          points: 0,
        },
        {
          title: "Start - Names & ages",
          foreground: "assets/white.png-trans.png",
          background: "assets/webm1.webm",
          task: "Type or say ages",
          points: 5,
        },
        {
          title: "Start - Peace sign",
          foreground: "assets/bg/peacesign.png",
          task: "Make a peace sign",
          compliment: "",
          points: 5,
        },
        {
          title: "Start - Heart sign",
          foreground: "assets/bg/hearthands.png",
          task: "Make a heart sign together",
          points: 10,
        },
        {
          title: "Start - High five",
          foreground: "assets/bg/highfive.png",
          task: "Give each other a high five",
          points: 10,
        },
        {
          title: "Start - Belly button",
          foreground: "assets/bg/bellybutton.png",
          task: "Show your belly buttons",
          points: 20,
        },
        {
          title: "Start - Smack ass",
          foreground: "assets/bg/bootyslap.webp",
          task: "Give each other a booty slap",
          points: 20,
        },
        {
          title: "Start - Snap bra straps",
          foreground: "assets/bg/brastrap.webp",
          task: "Pull and snap each others bra straps",
          points: 20,
        },
        {
          title: "Start - Show cleavage",
          foreground: "assets/bg/cleavage.png",
          task: "Show off your cleavage",
          points: 25,
        },
        {
          title: "Start - Touch noses",
          foreground: "assets/bg/nosetouching.png",
          task: "Touch your noses together",
          points: 10,
        },
        {
          title: "Start - Shake booty",
          foreground: "assets/bg/bootyshake.gif",
          task: "Shake your booties",
          points: 25,
        },
        {
          title: "Start - Flash panties",
          foreground: "assets/bg/flashpanties.png",
          task: "Flash your panties",
          points: 25,
        },
        {
          title: "Start - Show bra",
          foreground: "assets/bg/showoffbra.png",
          task: "Show off your bras",
          points: 30,
        },
        {
          stage: "TITS",
          title: "TITS - Boob drop",
          foreground: "assets/bg/boobdrop.webp",
          task: "Slowly do a boob drop together with your bra, shirt or hands",
          points: 30,
        },
        {
          title: "TITS - Boob drop each other",
          foreground: "assets/bg/boobdrophelp.webp",
          task: "Try to do a boob drop on each other",
          points: 30,
        },
        {
          title: "TITS - Go topless",
          foreground: "assets/bg/brasoff.png",
          task: "Take each others shirts & bra's off",
          points: 30,
        },
        {
          title: "TITS - Shake boobs",
          foreground: "assets/bg/boobshake.webp",
          task: "Both Shake Boobs (Side to Side)",
          points: 30,
        },
        {
          title: "TITS - Heart boob",
          foreground: "assets/bg/heartboob.png",
          task: "Both make a heart boob",
          points: 30,
        },
        {
          title: "TITS - Hand bra",
          foreground: "assets/bg/handbra.webp",
          task: "Both do a hand bra",
          points: 35,
        },
        {
          title: "TITS - Hand bra each other",
          foreground: "assets/bg/handbrahelp.gif",
          task: "Do a hand bra on each other",
          points: 35,
        },
        {
          title: "TITS - Push boobs together",
          foreground: "assets/bg/boobsqueeze.png",
          task: "Squeeze boobs together with hands",
          points: 35,
        },
        {
          title: "TITS - Hands behind head",
          foreground: "assets/bg/handsbehindhead.png",
          task: "Both put your hands behind your head",
          points: 35,
        },
        {
          title: "TITS - Arms behind back",
          foreground: "assets/bg/handsbehindback.png",
          task: "Both put arms behind your back (like wearing handcuffs)",
          points: 35,
        },
        {
          title: "TITS - Press boobs together",
          foreground: "assets/bg/boobpress.png",
          task: "Press your boobs together",
          points: 35,
        },
        {
          title: "TITS - Pinch nipples",
          foreground: "assets/bg/pinchnipples.webp",
          task: "Pinch each others nipples",
          points: 40,
        },
        {
          title: "TITS - Pull nipples",
          foreground: "assets/bg/pullingnipples.png",
          task: "Pull each others nipples at the same time",
          points: 40,
        },
        {
          title: "TITS - Lick nipples",
          foreground: "assets/bg/licknipple.webp",
          task: "Lick each others nipples",
          points: 40,
        },
        {
          title: "TITS - Suck nipples",
          foreground: "assets/bg/sucknipple.webp",
          task: "Slowly suck on each others nipples",
          points: 40,
        },
        {
          title: "TITS - Slap tits",
          foreground: "assets/bg/slaptits.webp",
          task: "Slap each others tits (3 times)",
          points: 40,
        },
        {
          title: "PANTIES - Remove bottoms",
          foreground: "assets/bg/removepants.webp",
          task: "Both slowly remove your bottoms (Keep panties on)",
          points: 45,
        },
        {
          title: "PANTIES - Show panties (front)",
          foreground: "assets/bg/showoffpanties.png",
          task: "Both show off front of panties",
          points: 45,
        },
        {
          title: "PANTIES - Rub over panties",
          foreground: "assets/bg/rubbingpanties.webp",
          task: "Both rub pussy over panties (30 Sec)",
          points: 45,
        },
        {
          title: "PANTIES - Rub each others panties",
          foreground: "assets/bg/rubbingpantieshelp.gif",
          task: "Rub each others pussy over panties (30 sec)",
          points: 45,
        },
        {
          title: "PANTIES - Pull panties to side",
          foreground: "assets/bg/pullpanties.png",
          task: "Slowly pull each others panties to the side",
          points: 50,
        },
        {
          title: "PANTIES - Panties close to cam",
          foreground: "assets/bg/wetpanties.png",
          task: "Both show Panties up close to cam",
          points: 50,
        },
        {
          title: "PANTIES - Bend Over",
          foreground: "assets/bg/pantiesbentover.png",
          task: "Bend over & show off panties",
          points: 50,
        },
        {
          title: "PANTIES - Pull panties to side",
          foreground: "assets/bg/pullpantiesbentover.png",
          task: "Pull each others panties to the side",
          points: 50,
        },
        {
          title: "PANTIES - Pull down panties",
          foreground: "assets/bg/pulldownpanties.webp",
          task: "Slowly pull down each others panties",
          points: 55,
        },
        {
          title: "PANTIES - Show off the inside of your panties",
          foreground: "assets/bg/showpanties.png",
          task: "Both show off the inside of your panties up close",
          points: 55,
        },
        {
          title: "PUSSY - Legs up",
          foreground: "assets/bg/legsupshowpussy.png",
          task: "Lift your legs up and show off your pussies",
          points: 55,
        },
        {
          title: "PUSSY - legs back",
          foreground: "assets/bg/holdlegsupshowpussy.png",
          task: "Pull & hold legs back and show off pussies",
          points: 55,
        },
        {
          title: "PUSSY - legs back far",
          foreground: "assets/bg/legswayback.png",
          task: "Pull & hold your legs back as far as you can",
          points: 55,
        },
        {
          title: "PUSSY - legs sideways",
          foreground: "assets/bg/legssidewaysbacktoback.png",
          task: "Put your legs sideways back to back",
          points: 55,
        },
        {
          title: "PUSSY - Ass to Ass",
          foreground: "assets/bg/legssidewaysspread.png",
          task: "Spread your cheeks with 1 hand & hold it",
          points: 55,
        },
        {
          title: "PUSSY - Ass to ass legs up",
          foreground: "assets/bg/legssidewayslegup.png",
          task: "Both lift 1 leg in the Air",
          points: 55,
        },
        {
          title: "PUSSY - Spank pussy",
          foreground: "assets/bg/spankpussy.webp",
          task: "Turn and spank your pussies 3 times",
          points: 55,
        },
        {
          title: "PUSSY - Spank each others pussy ",
          foreground: "assets/bg/spankpussyhelp.gif",
          task: "Spank each others pussy 3 times",
          points: 55,
        },
        {
          title: "PUSSY - Spread",
          foreground: "assets/bg/pussyspread.png",
          task: "Spread your pussies",
          points: 55,
        },
        {
          title: "PUSSY - Spread each other",
          foreground: "assets/bg/pussyspreadhelp.png",
          task: "Spread each others pussies",
          points: 55,
        },
        {
          title: "PUSSY - Rub pussy ",
          foreground: "assets/bg/pussyrub.gif",
          task: "Both rub your pussy (1 min)",
          points: 55,
        },
        {
          title: "PUSSY - Rub each others pussy",
          foreground: "assets/bg/pussyrubhelp.webp",
          task: "Rub each others pussy (30 seconds)",
          points: 55,
        },
        {
          title: "ASS - Show both asses",
          foreground: "assets/bg/showass.png",
          task: "Turn & show off your asses",
          points: 55,
        },
        {
          title: "ASS - Shake your asses",
          foreground: "assets/bg/shakeass.webp",
          task: "Shake your asses",
          points: 55,
        },
        {
          title: "ASS - Twerk",
          foreground: "assets/bg/twerk.webp",
          task: "Try to twerk or clap your asses",
          points: 55,
        },
        {
          title: "ASS - Spread asses",
          foreground: "assets/bg/spreadasses.png",
          task: "Spread your asses",
          points: 60,
        },
        {
          title: "ASS - Spread each others ass",
          foreground: "assets/bg/spreadingasshelp.webp",
          task: "Spread each others asses",
          points: 60,
        },
        {
          title: "ASS - Doggy rub Pussy",
          foreground: "assets/bg/doggypussyrub.webp",
          task: "Both bend over and rub your pussy (30 secs)",
          points: 60,
        },
        {
          title: "ASS - Doggy rub each others pussy",
          foreground: "assets/bg/pussyrubbehindhelp.gif",
          task: "Rub each others pussies while bent over",
          points: 60,
        },
        {
          title: "ASS - Spank each others ass",
          foreground: "assets/bg/assslap.webp",
          task: "Spank each others asses 3 times",
          points: 60,
        },
        {
          title: "PUSSY - Rub hard",
          foreground: "assets/bg/rubpussyhard.webp",
          task: "Rub your pussies hard (1 min)",
          points: 60,
        },
        {
          title: "PUSSY - Rub each other hard",
          foreground: "assets/bg/rubpussyhardhelp.webp",
          task: "Rub each others pussy hard (30 sec)",
          points: 60,
        },
        {
          title: "PUSSY - Finger Both 1",
          foreground: "assets/bg/fingering.webp",
          task: "Finger your pussy with 1 finger (30 sec)",
          points: 70,
        },
        {
          title: "PUSSY - Finger Both 2",
          foreground: "assets/bg/2fingerspussy.webp",
          task: "Finger your pussies with 2 fingers (30 sec)",
          points: 70,
        },
        {
          title: "PUSSY - Finger 1 (Girl 1)",
          foreground: "assets/bg/1fingerhelp1.webp",
          task: "One of you slowly slide a finger in the others pussy",
          points: 70,
        },
        {
          title: "PUSSY - Finger 2 (Girl 1)",
          foreground: "assets/bg/2fingershelp1.webp",
          task: "Finger her pussy with 2 fingers (1 min)",
          points: 70,
        },
        {
          title: "PUSSY - Finger 1 (Girl 2)",
          foreground: "assets/bg/1fingerhelp2.webp",
          task: "Switch and let her slowly slide a finger in",
          points: 70,
        },
        {
          title: "PUSSY - Finger 2 (Girl 2)",
          foreground: "assets/bg/2fingershelp2.webp",
          task: "Finger her pussy with 2 fingers (1 min)",
          points: 70,
        },
        {
          title: "PUSSY - Finger each other (Same time)",
          foreground: "assets/bg/fingeringhelp.webp",
          task: "Finger each other at the same time (1 min)",
          points: 70,
        },
        {
          title: "PUSSY - Show wet fingers",
          foreground: "assets/bg/wetfingers.webp",
          task: "Show wet fingers to the cam",
          points: 60,
        },
        {
          title: "PUSSY - lick fingers",
          foreground: "assets/bg/suckfingers.webp",
          task: "Lick & suck each other fingers",
          points: 65,
        },
        {
          title: "DOGGY - 2 finger (Girl 1)",
          foreground: "assets/bg/doggyfingeringhelp1.webp",
          task: "Bend her over & finger pussy from behind with 2 fingers (1min)",
          points: 75,
        },
        {
          title: "DOGGY - 2 finger (Girl 2)",
          foreground: "assets/bg/doggyfingeringhelp2.webp",
          task: "Switch and let her finger you from behind with 2 fingers (1min)",
          points: 75,
        },
        {
          title: "TOY - Get a toy",
          foreground: "assets/bg/sextoys.png",
          task: "Get a toy (vibrator, dildo, toothbrush, hairbrush)",
          points: 80,
        },
        {
          title: "TOY - Suck toy",
          foreground: "assets/bg/toysucking.webp",
          task: "Suck on it together",
          points: 80,
        },
        {
          title: "TOY - Rub pussy (Girl 1)",
          foreground: "assets/bg/toyrubpussy.webp",
          task: "Rub it over her pussy",
          points: 80,
        },
        {
          title: "TOY - Slide in pussy (Girl 1)",
          foreground: "assets/bg/slidetoyin1.png",
          task: "Slide it in her pussy slowly",
          points: 90,
        },
        {
          title: "TOY - Fuck pussy (Girl 1)",
          foreground: "assets/bg/toyfuckpussy1.gif",
          task: "Fuck her pussy with it (1 min)",
          points: 90,
        },
        {
          title: "TOY - Rub pussy (Girl 2)",
          foreground: "assets/bg/toyrubpussy.webp",
          task: "Switch and rub her pussy with it",
          points: 90,
        },
        {
          title: "TOY - Slide in pussy (Girl 2)",
          foreground: "assets/bg/slidetoyin2.png",
          task: "Slide it in her pussy slowly",
          points: 90,
        },
        {
          title: "TOY - Fuck pussy (Girl 2)",
          foreground: "assets/bg/toyfuckpussy2.webp",
          task: "Fuck her pussy with it (1 min)",
          points: 90,
        },
        {
          title: "TOY - Doggy fuck pussy (Girl 2)",
          foreground: "assets/bg/toypussydoggyhelp1.webp",
          task: "Bend her over and fuck her pussy with it (1 min)",
          points: 90,
        },
        {
          title: "TOY - Doggy fuck pussy (Girl 1)",
          foreground: "assets/bg/toypussydoggyhelp2.gif",
          task: "Switch and bend her over and fuck her pussy with it (1 min)",
          points: 90,
        },
        {
          title: "ORGASM!",
          foreground: "assets/white.png-trans.png",
          task: "ORGASM! - (Make each other cum with your toy, fingers & tongues)",
          points: 1000,
        },
        {
          title: "HEART - Draw heart on nipples",
          foreground: "assets/bg/heartnipples.png",
          task: "Draw a Heart around each others nipples with a marker or pen",
          points: 300,
        },
        {
          title: "CLAMP - Clamp nipples",
          foreground: "assets/bg/nippleclamps.png",
          task: "Clamp each others nipples (Binder Clips, Bobby Pins, Clothes Pins)",
          points: 300,
        },
        {
          title: "CLAMP - clamp lips",
          foreground: "assets/bg/clamppussylips.png",
          task: "Clamp each others pussy lips",
          points: 400,
        },
        {
          title: "CLAMP - Pull lips apart",
          foreground: "assets/bg/clamppullpussylips.png",
          task: "Pull each others pussy lips apart with clamps",
          points: 400,
        },
        {
          title: "CLAMP - Rub pussy",
          foreground: "assets/bg/clamprubpussy.png",
          task: "Rub each others pussy with the clamps on (1 min)",
          points: 400,
        },
        {
          title: "CLAMP - Clamp each others clits",
          foreground: "assets/bg/clampclit.png",
          task: "Clamp each others clits",
          points: 500,
        },
        {
          title: "CANDLE - light candle",
          foreground: "assets/bg/candle.png",
          task: "Get a Candle & light it",
          points: 300,
        },
        {
          title: "CANDLE - Tummy",
          foreground: "assets/bg/candletummy.png",
          task: "Drip the candle wax on each others tummies",
          points: 300,
        },
        {
          title: "CANDLE - Tits",
          foreground: "assets/bg/candletits.webp",
          task: "Drip candle wax on each others tits (not your nipples)",
          points: 300,
        },
        {
          title: "CANDLE - Nipples",
          foreground: "assets/bg/candlenipples.webp",
          task: "Drip candle wax on each others nipples",
          points: 300,
        },
        {
          title: "CANDLE - Ass",
          foreground: "assets/bg/candleass.gif",
          task: "Drip candle wax on each others ass",
          points: 300,
        },
        {
          title: "CANDLE - Above pussy",
          foreground: "assets/bg/candleabovepussy.png",
          task: "Drip candle wax just above each others pussy",
          points: 300,
        },
        {
          title: "CANDLE - On pussy",
          foreground: "assets/bg/candlepussy.png",
          task: "Drip the candle wax on each others pussy",
          points: 300,
        },
        {
          title: "CANDLE - In pussy",
          foreground: "assets/bg/candleinpussy.png",
          task: "Put the candle in each of your pussies",
          points: 300,
        },
        {
          title: "CANDLE - In ass",
          foreground: "assets/bg/candleinass.png",
          task: "Put the candle in each of your asses in doggy style",
          points: 300,
        },
        {
          title: "ASS PLAY - Rimming (Girl 1)",
          foreground: "assets/bg/asslickhelp1.gif",
          task: "Rim her asshole with your tongue (30 sec)",
          points: 300,
        },
        {
          title: "ASS PLAY - Rimming (Girl 2)",
          foreground: "assets/bg/asslickhelp2.gif",
          task: "Switch and Rim her asshole with your tongue (30 sec)",
          points: 400,
        },
        {
          title: "ASS PLAY - Finger ass (Girl 1)",
          foreground: "assets/bg/assfingerhelp1.webp",
          task: "Finger her asshole with 1 finger (30 sec)",
          points: 500,
        },
        {
          title: "ASS PLAY - Finger ass (Girl 2)",
          foreground: "assets/bg/assfingerhelp2.webp",
          task: "Switch & finger her asshole with 1 finger (30 sec)",
          points: 750,
        },
        {
          title: "ASS PLAY - 2 Finger ass (Girl 1)",
          foreground: "assets/bg/ass2fingerhelp1.webp",
          task: "Finger her asshole with 2 fingers (30 sec)",
          points: 750,
        },
        {
          title: "ASS PLAY - 2 Finger ass (Girl 2)",
          foreground: "assets/bg/ass2fingerhelp2.webp",
          task: "Switch & finger her asshole with 2 fingers (30 sec)",
          points: 750,
        },
        {
          title: "ASS PLAY - Finger each others ass (Same time)",
          foreground: "assets/bg/bothassfinger.webp",
          task: "Finger each others asses at the same time (30 sec)",
          points: 1000,
        },
        {
          title: "ASS TOY - Fuck Ass (Girl 1)",
          foreground: "assets/bg/toyinasshelp1.webp",
          task: "Fuck her ass with a toy (30 sec)",
          points: 1000,
        },
        {
          title: "ASS TOY - Fuck Ass (Girl 1)",
          foreground: "assets/bg/toyinasshelp2.webp",
          task: "Switch and fuck her ass with a toy (30 sec)",
          points: 1000,
        },
        {
          title: "ASS TOY - Lick toy",
          foreground: "assets/bg/asstoylick.webp",
          task: "Both of you suck/lick the toy",
          points: 2000,
        },
        {
          title: "Bonus",
          foreground: "assets/bg/bonusround.webp",
          task: "SPECIAL BONUS ROUND",
          points: 2000,
        },
      ],
      overlayselect: "",
      levelselect: "",
      currentLevel: 0,
      score: 0,
      currenttask: 0,
      name: "",
      autonext: false,
      ready: false,
      highscore: 45250,
      highscorer: "Ashley & Sarah",
      showoverlay: false,
      overlayimg: "",
      bonuspoints: 100,
      timer: {},
      countdownitems: [
        { text: "10", value: "10" },
        { text: "20", value: "20" },
        { text: "30", value: "30" },
        { text: "60", value: "60" },
        { text: "90", value: "90" },
        { text: "120", value: "120" },
        { text: "300", value: "300" },
      ],
      showtimer: false,
    };
  },
};
</script>
<style>
body {
  font-size: 38px;
  /*  text-shadow: 2px 2px rgba(0, 0, 0, 1); */
}
#gamediv {
  overflow-x: hidden;
  text-align: center;
  overflow-y: hidden;
  width: 640px;
  height: 480px;
  display: inline-block;
  position: relative;
  /*margin-left: auto;*/
  /*margin-right: auto;*/
  /*cursor: none;*/
  /*margin-top: 24px;*/
}
#levelselect {
  display: inline-block;
  position: absolute;
  width: 300px;
  height: 480px;
  margin-left: 10px;
  /*margin-top: 24px;*/
}
.task {
  /*background-color: rgba(255,255,255,0.5); */
  text-shadow: 2px 2px #000;
  color: #fff;
  font-size: 38px;
  line-height: 40px;
}
.completed {
  color: green;
}
.levelscore {
  font-size: 35px !important;
  color: #fff;
  text-shadow: 2px 2px #000;
}
.levelcompliment {
  font-size: 16px !important;
}
video {
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
/*.overlay {
  width: 640px;
  height: 480px;
}*/

.v-card__text,
.v-card__title {
  word-break: normal; /* maybe !important  */
}
</style>
