Window Cleaning Training v3

In this example below you will see how to do a Window Cleaning Training v3 with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by grantcodes, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright grantcodes ©
  • HTML
  • CSS
  • JavaScript
    <div class = "col-3">
  <img src="https://www.dropbox.com/s/4ky1moeb7qqqw5e/men_in_kilts_stacked.png?raw=1" style="width:120px;">
</div>
<div class = "row justify-content-md-center">
  <div class = "col-7">
    <h1 class="white-text">So you want to clean a window?</h1>
  </div>
</div>
<div class = "row justify-content-md-center">
  <div id = "vids">
  </div>
</div>
<div class = "row offset-3 mt-3 mb-3">
  <div class = "col-8">
    <div class = "card">
        <div class = "card-body">
          <div id = "choices">
          </div>
        </div>
    </div>
  </div>
</div>
<div class = "row offset-8">
  <button id="back" class="btn-warning btn-lg">Back</button>
</div>


/*Downloaded from https://www.codeseek.co/grantcodes/window-cleaning-training-v3-aGZgKB */
    body {
  background-color: #333333;
}

.white-text{
  color: white;
  font-family: Raleway;
}


/*Downloaded from https://www.codeseek.co/grantcodes/window-cleaning-training-v3-aGZgKB */
    var DecisionTree = function(data) {
  
  this.initial = data.initial;
  this.choices = data.choices;
  
  /* Return an array of choice objects for the root of the tree */
  this.getInitial = function() {
    
    if (!this.initial) throw 'DecisionTree: no initial choice(s) specified';
    return this.getChoices(this.initial);
    
  };
  
  /* Get full choice data by specific id */
  this.getChoice = function(id) {

    if (!(id in this.choices)) return false;
    if (!('id' in this.choices[id])) this.choices[id].id = id;
    return this.choices[id];
    
  };
  
  /* As above, but passing an array of choice IDs */
  this.getChoices = function(idList) {
    if(!idList) return [];
    var list = [];
    for(var i = 0, ln = idList.length; i < ln; i++) {
      var childChoice = this.getChoice(idList[i]);
      list.push(childChoice);
    }
    return list;
    
  };
  
  /* Get an array of choice data for a parent id */
  this.getChildren = function(parentId) {
    
    if (!(parentId in this.choices)) return false;
    if (!('children' in this.choices[parentId])) return false;
    
    var childIds = this.choices[parentId].children;
    return this.getChoices(childIds);
    
  };
  
  /* Get an array of choice data for the parent(s) of an id */
  this.getParents = function(id) {
    
    var parents = [];
    var node = this.getChoice(id);
    
    while(node.parent) {
      node = this.getChoice(node.parent);
      parents.unshift(node);
    }
    
    return parents;
    
  };
  
  /* Get just an array of ids for the parents of a specific id */
  this.getParentIds = function(id) {
    var parents = this.getParents(id);
    var parentIds = [];
    for(var i = 0, ln = parents.length; i < ln; i++) {
      parentIds.push(parents[i].id);
    }
    return parentIds;
  };
  
  /* Get the 'descript' prop for the parent of an id */
  this.getParentName = function(id) {
    var parent = this.getParents(id).pop();
    if(!parent) {
      return false;
    } else {
      return parent.descript;
    }
  };
  
    /* Get the 'video' prop for the parent of an id */
  this.getParentVid = function(id) {
    var parent = this.getParents(id).pop();
    if(!parent) {
      return false;
    } else {
      return parent.video;
    }
  };
  
  /* Init - insert ids into choice objects, check dups, associate parents, etc */
  this.init = function() {
    
    var idList = [];
    for(var k in this.choices) {
      if(idList.indexOf(k) !== -1) throw 'DecisionTree: duplicate ID "' + k + '" in choice set';
      
      var choice = this.getChoice(k);
      choice.id = k;
      
      var children = this.getChildren(k);
      for(var i = 0; i < children.length; i++) {
        
        var child = children[i];
        if(child.parent) throw 'DecisionTree: tried to assign parent "' + k + '" to child "' + choice.children[i] + '" which already has parent "' + child.parent + '"';
        child.parent = k;
       
      }
      
    }
    
    console.log('init', this.initial, this.choices);
    
  };
  
  this.init();
  
};


/*** TEST DATA ***/

var data = {
  initial: ['Absolutely', 'Nah', 'Not sure'],
  choices: {
    
    // TOP LEVEL
    
    'Absolutely': {
      name: 'Absolutely',
      descript: 'Have you received training before?',
      children: ['I did', 'No, I didn\'t', 'Don\'t remember']
    },
    
    'Nah': {
      name: 'Nah',
      descript: 'Are you sure you don\'t want to clean some windows?',
      video: '',
      children: ['I\'m good', 'I\'m listening']
    },
    
        'Not sure': {
      name: 'Not sure',
      descript: 'Why don\'t we run through the training and you can decide?',
      video: '',
      children: ['OK', 'Not now']
    },
    
    // ABSOLUTELY
    
    'I did': {
      name: 'I did',
      descript: 'Just looking for a refresher or something specific?',
      video: '',
      children: ['Refresher', 'Something specific']
    },
    'No, I didn\'t': {
      name: 'No, I didn\'t',
      descript: 'Ready to run through training now?',
      video: '',
      children: ['Sure thing', 'Maybe later']
    },
    'Don\'t remember': {
      name: 'Don\'t remember',
      descript: 'Let\'s run through it now, just to be safe',
      video: '',
      children: ['Cool', 'Just remembered - I did complete training']
    },
    
    // Nah
    
    'I\'m good': {
      name: 'I\'m good',
      descript: 'Okay, let us know if anything changes',
      video: '',
      children: ['Exit']
    },
    'I\'m listening': {
      name: 'I\'m listening',
      descript: 'Let\'s run through the training',
      video: '',
      children: ['Why not?', 'I don\'t have time']
    },
    
    // Not sure
    
    'OK': {
      name: 'OK',
      descript: 'Great! Watch this video',
      video: '<iframe width="560" height="315" src="https://www.youtube.com/embed/RZ6rABQRR84" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>',
      children: ['Great video', 'Great video, but I need more']
    },
    'Not now': {
      name: 'Not now',
      descript: 'Don\'t be a stranger',
      video: '',
      children: ['Adios']
    },
        
    // I did
    
    'Refresher': {
      name: 'Refresher',
      descript: 'Great! Watch this video',
      video: '<iframe width="560" height="315" src="https://www.youtube.com/embed/RZ6rABQRR84" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>',
      children: ['I should be good now', 'I need more']
    },
    'Something specific': {
      name: 'Something specific',
      descript: 'What do you want to learn more about?',
      video: '',
      children: ['Streaks', 'Caked on dirt', 'Sticky residue']
    },
    
    // No, I didn't
    
    'Sure thing': {
      name: 'Sure thing',
      descript: 'Perfect! Watch this video',
     video: '<iframe width="560" height="315" src="https://www.youtube.com/embed/RZ6rABQRR84" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>',
      children: ['I\'m ready to wash windows like a pro', 'I\'m still a little unsure']
    },
    'Maybe later': {
      name: 'Maybe later',
      descript: 'Alright, we\'ll see you later',
      video: '',
      children: ['Bye']
    },
    
    // Don't remember
    
    'Cool': {
      name: 'Cool',
      descript: 'Watch this video',
      video: '<iframe width="560" height="315" src="https://www.youtube.com/embed/RZ6rABQRR84" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>',
      children: ['That was helpful', 'I want to learn more']
    },
    'Just remembered - I did complete training': {
      name: 'Just remembered - I did complete training',
      descript: 'Great, let\'s get to work',
      video: '',
      children: ['Let\'s do this!']
    },
    
    // I'm listening
    
    'Why not?': {
      name: 'Why not?',
      descript: 'Great! Watch this video',
      video: '<iframe width="560" height="315" src="https://www.youtube.com/embed/RZ6rABQRR84" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>',
      children: ['Awesome! Ready to go!', 'Meh. I still have questions']
    },
    'I don\'t have time': {
      name: 'I don\'t have time',
      descript: 'Don\'t be a stranger',
      video: '',
      children: ['See you soon!']
    },
    
    // OK
    
    'Great video': {
      name: 'Great video',
      descript: 'Love your enthusiasm! Let\'s get to work',
      video: '',
      children: ['Warning! Do not click this button']
    },
    'Great video, but I need more': {
      name: 'Great video, but I need more',
      descript: 'What do you want to learn about?',
      video: '',
      children: ['Window streaks', 'Tough to remove dirt', 'Sticker residue']
    },
    
    // Refresher
    
    'I should be good now': {
      name: 'I should be good now',
      descript: 'Great! Let\'s get to work!',
      video: '',
      children: ['You\'re going to click this, aren\'t you?']
    },
    'I need more': {
      name: 'I need more',
      descript: 'What do you want to learn more about?',
      video: '',
      children: ['Streaks on windows', 'Caked with dirt', 'Glue/other residue']
    },
    
    // Something specific
    
    'Streaks': {
      name: 'Streaks',
      descript: 'Are you using 1 part cleaning solution to 5 parts water?',
      video: '',
      children: ['Yes, I\'m using the correct ratio', 'No, I\'ll try using the correct ratio']
    },
    'Caked on dirt': {
      name: 'Caked on dirt',
      descript: 'Have you presoaked the dirt to loosen it?',
      video: '',
      children: ['Yes, I have presoaked', 'No, I haven\'t presoaked']
    },
    'Sticky residue': {
      name: 'Sticky residue',
      descript: 'Have you used a scraping tool to try to remove the sticky residue',
      video: '',
      children: ['Yes, I\'ve scraped', 'No, I haven\'t tried scraping']
    },
    
    // Sure thing
    
    'I\'m ready to wash windows like a pro': {
      name: 'I\'m ready to wash windows like a pro',
      descript: 'Great! Let\'s do this!',
      video: '',
      children: ['Good luck!']
    },
    'I\'m still a little unsure': {
      name: 'I\'m still a little unsure',
      descript: 'What do you want to learn about?',
      video: '',
      children: ['Streaky windows', 'Layers of hard to remove dirt', 'Foreign substances']
    },
    
    // Cool
    
    'That was helpful': {
      name: 'That was helpful',
      descript: 'Great! Let\'s clean some windows',
      video: '',
      children: ['I know it\'s tempting, but don\'t click this button']
    },
    'I want to learn more': {
      name: 'I want to learn more',
      descript: 'What do you want to learn more about?',
      video: '',
      children: ['Streaked windows', 'Layers of dirt & grime', 'Tree sap/other sticky stuff']
    },
    
    // Why not?
    
    'Awesome! Ready to go!': {
      name: 'Awesome! Ready to go!',
      descript: 'Great! Let\'s get to work!',
      video: '',
      children: ['Nice!']
    },
    'Meh. I still have questions': {
      name: 'Meh. I still have questions',
      descript: 'What do you want to learn more about?',
      video: '',
      children: ['Windows with streaks', 'Really dirty & grimy windows', 'Sticky stuff that won\'t come off']
    },
    
    // Great video, but I need more
    'Window streaks': {
      name: 'Window streaks',
      descript: 'Are you using 1 part cleaning solution to 5 parts water?',
      video: '',
      children: ['Yes, 1 part cleaning solution to 5 parts water', 'No, I\'ll start using 1:5']
    },
    'Tough to remove dirt': {
      name: 'Tough to remove dirt',
      descript: 'Have you presoaked the dirt to loosen it?',
      video: '',
      children: ['Presoaking did not help', 'No, I\'ll try presoaking']
    },
      'Sticker residue': {
        name: 'Sticker residue',
        descript: 'Have you used a scraping tool to try to remove the sticky residue',
      children: ['Scraping did not work', 'Guess I could try scraping']
      },
    
    // I need more
    
    'Streaks on windows': {
      name: 'Streaks on windows', 
      descript: 'Are you using cleaning solution in a 1 part to 5 parts water ratio?',
      children: ['Yes, 1:5 didn\'t work', 'Guess it wouldn\'t hurt to give 1:5 a try']
    },
    'Caked with dirt': {
      name: 'Caked with dirt',
      descript: 'Have you presoaked the dirt to loosen it?',
      children: ['Presoaking didn\'t help', 'Guess I could try presoaking']
    },
    'Glue/other residue': {
      name: 'Glue/other residue',
      descript: 'Have you used a scraping tool to try to remove the sticky residue',
      children: ['Scraping didn\'t work', 'No, I\'ll try scraping']
    },
    
    // Streaks
    'Yes, I\'m using the correct ratio': {
      name: 'Yes, I\'m using the correct ratio',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['Yep, wiping after every pass', 'No, I\'ll give wiping a try']
    },
    'No, I\'ll try using the correct ratio': {
      name: 'No, I\'ll try using the correct ratio',
      descript: 'Great! Let us know how it works out',
      children: ['Get mixing!']
    },
    
    // Caked on dirt
    
    'Yes, I have presoaked': {
      name: 'Yes, I have presoaked',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['Yes, the brush didn\'t work','No, I\'ll get my brush']
    },
    'No, I haven\'t presoaked': {
      name: 'No, I haven\'t presoaked',
      descript: 'Give it a good soak',
      children: ['Let me know if it works']
    },
    
    // Sticky residue
    
    'Yes, I\'ve scraped': {
      name: 'Yes, I\'ve scraped',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['Yes, the scrubbing powder did not work', 'I\'ll give the scrubbing powder a try']
    },
    'No, I haven\'t tried scraping': {
      name: 'No, I haven\'t tried scraping',
      descript: 'Be careful not to scratch the windows!',
      children: ['Remember: be gentle']
    },
    
    // Streaks on windows
    
    'Yes, 1:5 didn\'t work': {
      name: 'Yes, 1:5 didn\'t work',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['Yeah, I\'m wiping after every pass', 'No, I\'ll start wiping the blade after every pass']
    },
    'Guess it wouldn\'t hurt to give 1:5 a try': {
      name: 'Guess it wouldn\'t hurt to give 1:5 a try',
      descript: 'What\'s the worst that could happen?',
      children: ['Right?']
    },
    
    // Caked with dirt
    
    'Presoaking didn\'t help': {
      name: 'Presoaking didn\'t help',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['Yes, the brush was useless','No, I\'ll try giving it a scrub']
    },
    'Guess I could try presoaking': {
      name: 'Guess I could try presoaking',
      descript: 'Try to wet the dirt enough so it comes off easily',
      children: ['Don\'t let this window beat you']
    },
    
    // Glue/other residue
    
    'Scraping didn\'t work': {
      name: 'Scraping didn\'t work',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['Yes, the scrubbing powder only worked a little', 'I\'ll give the powder a try']
    },
    'No, I\'ll try scraping': {
      name: 'No, I\'ll try scraping',
      descript: 'Try to keep the scraper at a 45 degree angle',
      children: ['Avoid scratches']
    },
    
    // I'm still a little unsure
    
    'Streaky windows': {
      name: 'Streaky windows',
      descript: 'Are you using cleaning solution in a 1 part to 5 parts water ratio?',
      children: ['Yes, 1:5 did not work', 'Guess I could give give 1:5 a try']
    },
    'Layers of hard to remove dirt': {
      name: 'Layers of hard to remove dirt',
      descript: 'Have you presoaked the dirt to loosen it?',
      children: ['I gave it a presoak - didn\'t work', 'No, I\'ll give it a presoak']
    },
    'Foreign substances': {
      name: 'Foreign substances',
      descript: 'Have you used a scraping tool to try to remove the sticky residue',
      children: ['Tried scraping - didn\'t work', 'No, I\'ll give scraping a shot']
    },
    
    // I want to learn more
    
    'Streaked windows': {
      name: 'Streaked windows',
      descript: 'Are you using cleaning solution in a 1 part to 5 parts water ratio?',
      children: ['Yes, I carefully measured the solution', 'Oops! I didn\'t realize it was a 1:5 ratio']
    },
    'Layers of dirt & grime': {
      name: 'Layers of dirt & grime',
      descript: 'Have you presoaked the dirt to loosen it?',
      children: ['I gave it a good presoak - didn\'t work', 'No, I\'ll start presoaking']
    },
    'Tree sap/other sticky stuff': {
      name: 'Tree sap/other sticky stuff',
      descript: 'Have you used a scraping tool to try to remove the sticky residue',
      children: ['Yes. Scraping didn\'t work', 'No, I\'ll try giving it a scrape']
    },
    
    // Meh
    
    'Windows with streaks': {
      name: 'Windows with streaks',
      descript: 'Are you using cleaning solution in a 1 part to 5 parts water ratio?',
      children: ['Yes, I always make sure to use the correct ratio', 'Oops! I\'ll start using a 1:5 ratio']
    },
    'Really dirty & grimy windows': {
      name: 'Really dirty & grimy windows',
      descript: 'Have you presoaked the dirt to loosen it?',
      children: ['I always remember to presoak', 'Let\'s pretend this conversation never happened']
    },
    'Sticky stuff that won\'t come off': {
      name: 'Sticky stuff that won\'t come off',
      descript: 'Have you used a scraping tool to try to remove the sticky residue',
      children: ['Yes. My arm is numb from scraping', 'On my way out to start scraping']
    },
    
    // Window streaks
    
    'Yes, 1 part cleaning solution to 5 parts water': {
      name: 'Yes, 1 part cleaning solution to 5 parts water',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['I don\'t think wiping is the issue', 'I\'m not great at remembering to wipe']
    },
    'No, I\'ll start using 1:5': {
      name: 'No, I\'ll start using 1:5',
      descript: 'I\'m sure it will help',
      children: ['Won\'t hurt to try']
    },
    
    // Tough to remove dirt
    
    'Presoaking did not help': {
      name: 'Presoaking did not help',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['The dirt\'s too tough for the brush','Thanks for the tip - I\'ll try brushing']
    },
    'No, I\'ll try presoaking': {
      name: 'No, I\'ll try presoaking',
      descript: 'Sometimes a good presoak will loosen the dirt',
      children: ['Give it a shot!']
    },
    
    // Sticker residue
    
    'Scraping did not work': {
      name: 'Scraping did not work',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['This dirt\'s too tough for scrubbing powder', 'Scrubbing powder? I\'ll give it a try']
    },
    'Guess I could try scraping': {
      name: 'Guess I could try scraping',
      descript: 'Sometimes you just need a little elbow grease',
      children: ['But not too much']
    },
    
    // Streaky windows
    
    'Yes, 1:5 did not work': {
      name: 'Yes, 1:5 did not work',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['Yep, I\'m militant about wiping', 'No, I\'ll be more militant about wiping']
    },
    'Guess I could give give 1:5 a try': {
      name: 'Guess I could give give 1:5 a try',
      descript: 'Great! Let us know how it works out',
      children: ['Measure twice, mix once']
    },
    
    // Layers of hard to remove dirt
    
    'I gave it a presoak - didn\'t work': {
      name: 'I gave it a presoak - didn\'t work',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['The brush was the first thing I tried','No, I\'ll start brushing']
    },
    'No, I\'ll give it a presoak': {
      name: 'No, I\'ll give it a presoak',
      descript: 'Give it a good soak',
      children: ['Soak that window good']
    },
    
    // Foreign substances
    
    'Tried scraping - didn\'t work': {
      name: 'Tried scraping - didn\'t work',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['Scrubbing powder isn\'t working', 'I\'ll get some scrubbing powder']
    },
    'No, I\'ll give scraping a shot': {
      name: 'No, I\'ll give scraping a shot',
      descript: 'Be careful not to scratch the windows!',
      children: ['Remember: scrape in one direction']
    },
    
     // Streaked windows
    'Yes, I carefully measured the solution': {
      name: 'Yes, I carefully measured the solution',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['I am constantly wiping', 'No, I\'ll remember to wipe every time']
    },
    'Oops! I didn\'t realize it was a 1:5 ratio': {
      name: 'Oops! I didn\'t realize it was a 1:5 ratio',
      descript: 'Great! Let us know how it works out',
      children: ['Remember: 1 part solution to 5 parts water']
    },
    
    // Layers of dirt & grime
    
    'I gave it a good presoak - didn\'t work': {
      name: 'I gave it a good presoak - didn\'t work',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['I always try using a brush','No, the brush will be my new \'go to\'']
    },
    'No, I\'ll start presoaking': {
      name: 'No, I\'ll start presoaking',
      descript: 'Give it a good soak',
      children: ['I\'m on it!']
    },
    
    // Tree sap/other sticky stuff
    
    'Yes. Scraping didn\'t work': {
      name: 'Yes. Scraping didn\'t work',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['Scrubbing powder didn\'t make a dent', 'On my way to get some scrubbing powder']
    },
    'No, I\'ll try giving it a scrape': {
      name: 'No, I\'ll try giving it a scrape',
      descript: 'Be careful not to scratch the windows!',
      children: ['That sticky stuff doesn\'t stand a chance!']
    },
    
    // Windows with streaks
    
    'Yes, I always make sure to use the correct ratio': {
      name: 'Yes, I always make sure to use the correct ratio',
      descript: 'Are you wiping your squeegee blade after every pass?',
      children: ['All I do is wipe that blade', 'No, that blade will be getting wiped non-stop']
    },
    'Oops! I\'ll start using a 1:5 ratio': {
      name: 'Oops! I\'ll start using a 1:5 ratio',
      descript: 'Great! Let us know how it works out',
      children: ['A little solution goes a long way']
    },
    
    // Really dirty & grimy windows
    
    'I always remember to presoak': {
      name: 'I always remember to presoak',
      descript: 'Have you tried scrubbing with a natural bristle brush',
      children: ['The brush didn\'t make a dent','No, but I will']
    },
    'Let\'s pretend this conversation never happened': {
      name: 'Let\'s pretend this conversation never happened',
      descript: 'Give it a good soak',
      children: ['Soaking as we speak']
    },
    
    // Sticky stuff that won\'t come off
    
    'Yes. My arm is numb from scraping': {
      name: 'Yes. My arm is numb from scraping',
      descript: 'Have you tried using a scrubbing powder?',
      children: ['Yes, I switched to scrubbing powder after my arm went numb', 'Anything sounds better than the brush right now']
    },
    'On my way out to start scraping': {
      name: 'On my way out to start scraping',
      descript: 'Be careful not to scratch the windows!',
      children: ['You can do this!']
    },
    
    // Yes I\'m using the correct ratio
    'Yep, wiping after every pass': {
      name: 'Yep, wiping after every pass',
      descript: 'We\'ll need to call in some expert help',
      children: ['Your supervisor probably has some ideas']
    },
    'No, I\'ll give wiping a try': {
      name: 'No, I\'ll give wiping a try',
      descript: 'Let me know how it works out for you',
      children: ['Happy wiping!']
    },
    
    // Yes, I have presoaked
    
    'Yes, the brush didn\'t work': {
      name: 'Yes, the brush didn\'t work',
      descript: 'Time to call in an expert',
      children: ['A teammate will be able to point you in the right direction']
    },
    'No, I\'ll get my brush': {
      name: 'No, I\'ll get my brush',
      descript: 'Your brush is your friend',
      children: ['Brush, brush, brush']
    },
    
    // Yes I\'ve scraped
    
    'Scrubbing powder isn\'t working': {
      name: 'Scrubbing powder isn\'t working',
      descript: 'Sounds like it\'s really caked on',
      children: ['Someone on your team will have some ideas']
    },
    'I\'ll get some scrubbing powder': {
      name: 'I\'ll get some scrubbing powder',
      descript: 'You + scrubbing powder',
      children: ['= win']
    },
    
    //Yes, 1 part cleaning solution to 5 parts water
    'I don\'t think wiping is the issue': {
      name: 'I don\'t think wiping is the issue',
      descript: 'Okay. I\'ve exhausted my solutions',
      children: ['Try speaking with a manager/supervisor']
    },
    'I\'m not great at remembering to wipe': {
      name: 'I\'m not great at remembering to wipe',
      descript: 'You might be surprised at how effective it can be',
      children: ['See if it works']
    },

    // Presoaking did not help
    
    'The dirt\'s too tough for the brush': {
      name: 'The dirt\'s too tough for the brush',
      descript: 'Sounds like a doozy',
      children: ['Try reaching out to other Men In Kilts']
    },
      'Thanks for the tip - I\'ll try brushing': {
        name: 'Thanks for the tip - I\'ll try brushing',
        descript: 'Great!',
        children: ['Check back if it doesn\'t work']
      },
    
    // Scraping did not work
    'This dirt\'s too tough for scrubbing powder': {
      name: 'This dirt\'s too tough for scrubbing powder',
      descript: 'It\'s not too tough for us!',
      children: ['Another team member can probably help out']
    },
    'Scrubbing powder? I\'ll give it a try': {
      name: 'Scrubbing powder? I\'ll give it a try',
      descript: 'Hope it works',
      children: ['Fingers crossed']
    },
    
    // Yes, 1.5 didn\'t work
    
    'Yeah, I\'m wiping after every pass': {
      name: 'Yeah, I\'m wiping after every pass',
      descript: 'Alright, time to reach out for help',
      children: ['Try your supervisor or teammates']
    },
    'No, I\'ll start wiping the blade after every pass': {
      name: 'No, I\'ll start wiping the blade after every pass',
      descript: 'Keep your blade clean...',
      children: ['...and the windows should be streak-free']
    },
    
    // Presoaking didn\'t help
    'Yes, the brush was useless': {
      name: 'Yes, the brush was useless',
      descript: 'Good effort!',
      children: ['Probably a good time to reach out for help']
    },
    'No, I\'ll try giving it a scrub': {
      name: 'No, I\'ll try giving it a scrub',
      descript: 'Let that scrubbing powder do the work',
      children: ['Scrub away!']
    },
    
    // Scraping didn\'t work
    
    'Yes, the scrubbing powder only worked a little': {
      name: 'Yes, the scrubbing powder only worked a little',
      descript: 'You\'ve followed the correct steps',
      children: ['Next step: ask your supervisor']
    },
    'I\'ll give the powder a try': {
      name: 'I\'ll give the powder a try',
      descript: 'Try the powder and...',
      children: ['...speak to your teammates if it doesn\'t work']
    },
    
    // Yes, I carefully measured the solution
    
    'I am constantly wiping': {
      name: 'I am constantly wiping',
      descript: 'This is a headscratcher',
      children: ['Have you asked any of your coworkers?']
    },
    'No, I\'ll remember to wipe every time': {
      name: 'No, I\'ll remember to wipe every time',
      descript: 'You got this',
      children: ['What are you waiting for?']
    },
    
    // Yes, 1:5 did not work
    
    'Yep, I\'m militant about wiping': {
      name: 'Yep, I\'m militant about wiping',
      descript: 'You have me stumped',
      children: ['I bet your teammates could help']
    },
    'No, I\'ll be more militant about wiping': {
      name: 'No, I\'ll be more militant about wiping',
      descript: 'Keep that squeegee blade clean',
      children: ['And it will keep your windows streak-free']
    },
    
    // I gave it a good presoak - didn\'t work
    
    'I always try using a brush': {
      name: 'I always try using a brush',
      descript: 'Hmmm...this one sounds tough',
      children: ['Try asking a coworker']
    },
    'No, the brush will be my new \'go to\'': {
      name: 'No, the brush will be my new \'go to\'',
      descript: 'Grab your brush...',
      children: ['...and get brushing']
    },
    
    // Yes, scraping didn\'t work
    
    'Scrubbing powder didn\'t make a dent': {
      name: 'Scrubbing powder didn\'t make a dent',
      descript: 'Sounds like a job for the team',
      children: ['Check with your teammates']
    },
    'On my way to get some scrubbing powder': {
      name: 'On my way to get some scrubbing powder',
      descript: 'That\'s the spirit',
      children: ['That dirt will be gone in no time']
    },
    
    // Yes, I always make sure to use the correct ratio
    
    'All I do is wipe that blade': {
      name: 'All I do is wipe that blade',
      descript: 'I\'m sure someone on your team has experience with this problem',
      children: ['Please consult your team']
    },
    'No, that blade will be getting wiped non-stop': {
      name: 'No, that blade will be getting wiped non-stop',
      descript: 'Problem solved',
      children: ['Here if you need me']
    },
    
    // I always remember to presoak
    
    'The brush didn\'t make a dent': {
      name: 'The brush didn\'t make a dent',
      descript: 'Sounds like a tough job',
      children: ['Nothing your team hasn\'t faced before']
    },
    'No, but I will': {
      name: 'No, but I will',
      descript: 'Dirt is no match for you',
      children: ['Get after it!']
    },
    
    // Yes, my arm is numb from scraping
    
    'Yes, I switched to scrubbing powder after my arm went numb': {
      name: 'Yes, I switched to scrubbing powder after my arm went numb',
      descript: 'Time to call in the reinforcements',
      children: ['Your team has your back']
    },
    'Anything sounds better than the brush right now': {
      name: 'Anything sounds better than the brush right now',
      descript: 'Hope the scrubbing powder works!',
      children: ['Talk to your supervisor if it doesn\'t']
    },
    
    // Dead ends
    
    'Exit': {
      name: 'Exit'
    },
        'Bye': {
      name: 'Bye'
    },
        'Adios': {
      name: 'Adios'
    },
        'Let\'s do this!': {
      name: 'Let\'s do this!'
    },
    'Warning! Do not click this button': {
      name: 'Warning! Do not click this button'
    },
    'I know it\'s tempting, but don\'t click this button': {
      name: 'I know it\'s tempting, but don\'t click this button'
    },
    'You\'re going to click this, aren\'t you?': {
      name: 'You\'re going to click this, aren\'t you?'
    },
    'See you soon!': {
      name: 'See you soon!'
    },
    'Get mixing!': {
      name: 'Get mixing!'
    },
    'Let me know if it works': {
      name: 'Let me know if it works'
    },
    'Remember: be gentle': {
      name: 'Remember: be gentle'
    },
    'Good luck!': {
      name: 'Good luck!'
    },
    'Nice!': {
      name: 'Nice!'
    },
    'Measure twice, mix once': {
      name: 'Measure twice, mix once'
    },
    'Soak that window good': {
      name: 'Soak that window good'
    },
    'Remember: scrape in one direction': {
      name: 'Remember: scrape in one direction'
    },
    'Remember: 1 part solution to 5 parts water': {
      name: 'Remember: 1 part solution to 5 parts water'
    },
    'I\'m on it!': {
      name: 'I\'m on it!'
    },
    'That sticky stuff doesn\'t stand a chance!': {
      name: 'That sticky stuff doesn\'t stand a chance!'
    },
    'A little solution goes a long way': {
      name: 'A little solution goes a long way'
    },
    'Soaking as we speak': {
      name: 'Soaking as we speak'
    },
    'You can do this!': {
      name: 'You can do this!'
    },
    'Your supervisor probably has some ideas': {
      name: 'Your supervisor probably has some ideas'
    },
    'Happy wiping!': {
      name: 'Happy wiping'
    },
    'A teammate will be able to point you in the right direction': {
      name: 'A teammate will be able to point you in the right direction'
    },
    'Brush, brush, brush': {
      name: 'Brush, brush, brush'
    },
    'Someone on your team might have some ideas': {
      name: 'Someone on your team might have some ideas'
    },
    '= win': {
      name: '= win'
    },
    'Have you asked any of your coworkers?': {
      name: 'Have you asked any of your coworkers?'
    },
    'What are you waiting for?': {
      name: 'What are you waiting for?'
    },
    'Try asking a coworker': {
      name: 'Try asking a coworker'
    },
    '...and get brushing': {
      name: '...and get brushing'
    },
    'Check with your teammates': {
      name: 'Check with your teammates'
    },
    'That dirt will be gone in no time': {
      name: 'That dirt will be gone in no time'
    },
    'Please consult your team': {
      name: 'Please consult your team'
    },
    'Here if you need me': {
      name: 'Here if you need me'
    },
  'Nothing your team hasn\'t faced before': {
    name: 'Nothing your team hasn\'t faced before'
  },
  'Get after it!': {
    name: 'Get after it!'
  },
    'Your team has your back': {
      name: 'Your team has your back'
    },
    'Talk to your supervisor if it doesn\'t':{
      name: 'Talk to your supervisor if it doesn\'t'
    },
    'And it will keep your windows streak-free': {
      name: 'And it will keep your windows streak-free'
    },
    'I bet your teammates could help': {
      name: 'I bet your teammates could help'
    },
     'Try speaking with a manager/supervisor': {
      name: 'Try speaking with a manager/supervisor',
        },
    'See if it works': {
      name: 'See if it works'
    },
    'Try reaching out to other Men In Kilts': {
      name: 'Try reaching out to other Men In Kilts'
    },
    'Check back if it doesn\'t work': {
      name: 'Check back if it doesn\'t work'
    },
    'Another team member can probably help out': {
      name: 'Another team member can probably help out'
    },
    'Fingers crossed': {
      name: 'Fingers crossed'
    },
    'Won\'t hurt to try': {
      name: 'Won\'t hurt to try'
    },
    'Give it a shot!': {
      name: 'Give it a shot!'
    },
    'But not too much': {
      name: 'But not too much'
    },
    'Don\'t let this window beat you': {
      name: 'Don\'t let this window beat you'
    },
    'Right?': {
      name: 'Right?'
    },
    'Avoid scratches': {
      name: 'Avoid scratches'
    },
    '...and the windows should be streak-free': {
      name: '...and the windows should be streak-free'
    },
    'Try your supervisor or teammates': {
      name: 'Try your supervisor or teammates'
    },
    'Probably a good time to reach out for help': {
      name: 'Probably a good time to reach out for help'
    },
    'Scrub away!': {
      name: 'Scrub away!'
    },
    '...speak to your teammates if it doesn\'t work': {
      name: '...speak to your teammates if it doesn\'t work'
    },
    'Next step: ask your supervisor': {
      name: 'Next step: ask your supervisor'
    },
    'Please talk to your supervisor': {
      name: 'Please talk to your supervisor'
    },
    'Happy brushing!': {
      name: 'Happy brushing!'
    },
    'Your manager might have some ideas': {
      name: 'Your manager might have some ideas'
    }
    
  }
};

/** TEST CODE **/

$(function() {
  
  var tree = new DecisionTree(data);
  var $list = $('#choices');
  var $vids = $('#vids');
  var $title = $('h1');
  
  var current_id = null;
  
  var renderList = function(items) {
    
    var title = tree.getParentName(items[0].id);
    if(title) {
      $title.text(title);
    } else {
      $title.text('So you want to clean some windows?');
    }
    
    var vids = tree.getParentVid(items[0].id);
    if(vids) {
      $vids.html(vids);
    } else {
      $vids.html('');
    }
    
    $list.empty();
    for(var i = 0; i < items.length; i++) {
      var item = items[i];
      $list.append('<br /><div class="col-4"><a href="#" data-choice="' + item.id + '"><button type="button" class="btn btn-success btn-lg">' + item.name + '</button></a></div><br />');
    }
  };
  
  var _doInitial = function() {
      var initData = tree.getInitial();
      current_id = null;
      renderList(initData);
  };
  
  $(document).on('click', '#choices a', function(e) {
    e.preventDefault();
    var choiceId = $(this).data('choice');
    console.log('clicked', choiceId);
    
    var kids = tree.getChildren(choiceId);
    if(kids) {
      current_id = choiceId;
      renderList(kids);
    }
  });
  
  $('#back').on('click', function(e) {
    e.preventDefault();
    if(!current_id) return false;
    console.log('back button clicked', current_id);
    
    var parents = tree.getParents(current_id);
   
    if(parents.length > 0) {
      var prev_node = parents.pop();
      current_id = prev_node.id;
      renderList(tree.getChildren(prev_node.id));
    } else {
      _doInitial();
    }
    
  });
  

$('#go').on('click', function(e) {
    e.preventDefault();
    
    var cid = $('#show-id').val();
    if(!cid || !(cid in data,choices)) return false;
    console.log('show parents for', cid);
    
    var parentData = tree.getParents(cid);
    $('#results').val(JSON.stringify(parentData, null, 4));
    
  });

  _doInitial();

  
});

Comments