daily pastebin goal
83%
SHARE
TWEET

How typeform is rendered

a guest Jun 13th, 2018 74 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <template>
  2.   <div class="scroll">
  3.     <timer :title="title" :step="step"></timer>
  4.     <div align="center">
  5.       <iframe :src="typeform"
  6.    scrolling="no" frameborder="0" allowtransparency="true" data-transparency="100" data-hide-headers=true data-hide-footer=true></iframe>
  7.     </div>
  8.     <custom-footer></custom-footer>
  9.     <grey-bg/>
  10.   </div>
  11. </template>
  12.  
  13. <script>
  14. import Parse from 'parse';
  15. import Timer from './Timer';
  16. import myMixin from '../mixins/index.js';
  17. import quizMixin from '../mixins/quiz.js';
  18. import Footer from '@/components/Footer'
  19. import GreyBackgroundDarker from './GreyBackgroundDarker';
  20. export default {
  21.   mixins: [myMixin, quizMixin],
  22.   components: {
  23.     timer:Timer,
  24.     'custom-footer': Footer,
  25.     'grey-bg': GreyBackgroundDarker
  26.   },
  27.   data () {
  28.     return {
  29.       title: "",
  30.       step: 0
  31.     }
  32.   },
  33.   created() {
  34.     this.renderTypeform();
  35.     this.step = parseInt(this.getStepFromQuery());
  36.     var setId = this.getSetIdFromQuery();
  37.     if(setId.indexOf("S1") >= 0){
  38.       this.title = "ROUND 1";
  39.     }else if(setId.indexOf("S2") >= 0){
  40.       this.title = "ROUND 2";
  41.     }else if(setId.indexOf("S3") >= 0){
  42.       this.title = "ROUND 3";
  43.     }
  44.   },
  45.   methods: {
  46.     handleFormSubmitDetected(){
  47.       console.log("Quiz Tutorial detected form submit, proceed to next page");
  48.       this.nextPage();
  49.     }  
  50.   }
  51. }
  52. </script>
  53. <!-- Add "scoped" attribute to limit CSS to this component only -->
  54. <style scoped>
  55.   .scroll {
  56.    width: 100%;
  57.    height: 800px;
  58.    overflow: none;
  59.    background-color: transparent;    
  60.   }
  61.   iframe {
  62.     width: 100%;
  63.     height: 800px;
  64.     max-width: 900px;
  65.   }
  66.   .scroll::-webkit-scrollbar {
  67.     width: 10px;
  68.   }
  69.   .scroll::-webkit-scrollbar-thumb {
  70.     border-radius: 10px;
  71.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  72.   }
  73. </style>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top