Merge pull request #135 from codewizardshq/finalfinalfinal

adds final question cutoff

Author: net8floz

src/plugins/router.js

@@ -151,6 +151,14 @@ const routes = [
  return import("@/views/Quiz/QuizFinished");
  }
 
+ // User did not make the cut
+ if (
+ store.state.Quiz.rankToday == store.state.Quiz.maxRank &&
+ store.state.User.rank != store.state.Quiz.rankToday
+ ) {
+ return import("@/views/Quiz/QuizFinishedFail");
+ }
+
  // MUST WAIT FOR NEXT QUESTION
  if (store.state.Quiz.awaitNextQuestion) {
  return import("@/views/Quiz/QuizCountdown");

src/store/quiz.js

@@ -59,6 +59,7 @@ function getDefaultState() {
  question: "",
  asset: "",
  rank: 0,
+ rankToday: 0,
  maxRank: 0,
  isLastQuestion: false,
  hints: ["", ""],
@@ -92,6 +93,7 @@ const actions = {
  // get current rank and see if quiz has started
  try {
  const rank = await quiz.getRank();
+ commit("rankToday", rank.rank);
  commit("maxRank", rank.maxRank);
  commit(
  "quizStartedMoment",
@@ -185,6 +187,9 @@ const mutations = {
  maxRank(state, value) {
  state.maxRank = value;
  },
+ rankToday(state, value) {
+ state.rankToday = value;
+ },
  isLastQuestion(state, value) {
  state.isLastQuestion = value;
  },

src/views/Quiz/QuizFinished.vue

@@ -18,6 +18,27 @@
  The player with the highest number of votes will be crowned the
  champion on May 1. Will you be the champion …
  <br /><br />Good luck! <br /><br />
+ <v-btn :to="{ name: 'voting' }" color="white" light
+ >Cast Your Votes Here</v-btn
+ ><br />
+ <v-btn
+ class="mr-3 mt-5"
+ :style="{ backgroundColor: 'white !important' }"
+ x-large
+ color="blue"
+ href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fcodewizardshq.com%2Fchallenge%2F&amp;src=sdkpreparse"
+ icon
+ ><v-icon>mdi-facebook</v-icon></v-btn
+ >
+ <v-btn
+ class="mt-5"
+ :style="{ backgroundColor: 'white !important' }"
+ x-large
+ color="blue"
+ href="https://twitter.com/intent/tweet?text=The%20Dragon%20Quest%20%E2%80%93%20Code%20Challenge&url=https%3A%2F%2Fcodewizardshq.com%2Fchallenge%2F&original_referer="
+ icon
+ ><v-icon>mdi-twitter</v-icon></v-btn
+ >
  </div>
  </template>
  </quiz-scroll>

src/views/Quiz/QuizFinishedFail.vue

@@ -0,0 +1,55 @@
+<template>
+ <div class="mt-6">
+ <v-row justify="center">
+ <quiz-scroll>
+ <template v-slot:title>It's Over!</template>
+ <template v-slot:default>
+ <div style="padding-left:130px; padding-right: 130px;">
+ Sorry my young pilgrim, your quest has ended.
+ <br />
+ <br />
+ Be proud of the work you did!
+ <br />
+ <br />
+ Brush up on your coding skills and follow us on Facebook and Twitter
+ to compete again next year. You can still vote on The Dragon Quest
+ winner starting 5 PM CT On Sunday, April 26.
+ <br /><br />
+ <v-btn :to="{ name: 'voting' }" color="white" light
+ >Cast Your Votes Here</v-btn
+ ><br />
+ <v-btn
+ class="mr-3 mt-5"
+ :style="{ backgroundColor: 'white !important' }"
+ x-large
+ color="blue"
+ href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fcodewizardshq.com%2Fchallenge%2F&amp;src=sdkpreparse"
+ icon
+ ><v-icon>mdi-facebook</v-icon></v-btn
+ >
+ <v-btn
+ class="mt-5"
+ :style="{ backgroundColor: 'white !important' }"
+ x-large
+ color="blue"
+ href="https://twitter.com/intent/tweet?text=The%20Dragon%20Quest%20%E2%80%93%20Code%20Challenge&url=https%3A%2F%2Fcodewizardshq.com%2Fchallenge%2F&original_referer="
+ icon
+ ><v-icon>mdi-twitter</v-icon></v-btn
+ >
+ </div>
+ </template>
+ </quiz-scroll>
+ </v-row>
+ </div>
+</template>
+
+<script>
+import QuizScroll from "@/components/QuizScroll";
+export default {
+ name: "quiz-finished-fail",
+ components: {
+ QuizScroll
+ },
+ mounted() {}
+};
+</script>