My Silly story generator

Hello. Good evening! I just finished the Silly story generator exercise. I would like you to provide me with a correction to my code. I couldn’t get it to work…maybe my problem is in the insertion of the js file in the HTML. If so, and someone can explain it to me, I would appreciate it (I have tried in various ways without success. Regards

const customName = document.getElementById('customname');
const randomize = document.querySelector('.randomize');
const story = document.querySelector('.story');

function randomValueFromArray(array){
  const random = Math.floor(Math.random()*array.length);
  return array[random];
}

let storyText = 'It was 94 fahrenheit outside, so :insertx: went for a climb. When they got to :inserty:, they stared in horror for a few moments, then :insertz:. Bob saw the whole thing, but was not surprised — :insertx: weighs 300 pounds, and it was a hot day.';
let insertX = ['Gandalff', 'Big Daddy', 'Father Christmas'];
let insertY = ['the soup kitchen', 'Maryland', 'the White House'];
let insertZ = ['spontaneously combusted', 'melted into a puddle on the sidewalk', 'turned into a slug and crawled away'];

randomize.addEventListener('click', result);

function result() {
    let newStory = storyText;
    let xItem = randomValueFromArray(insertX);
    let yItem = randomValueFromArray(insertY);
    let zItem = randomValueFromArray(insertZ);
    
    newStory = newStory.replace(':insertx:', xItem);
    newStory = newStory.replace(':inserty:', yItem);
    newStory = newStory.replace(':insertz:', zItem);
    newStory = newStory.replace(':insertx:', xItem);
    
    

  if(customName.value !== '') {
    const name = customName.value;
    newStory = newStory.replace('Bob', name);
  }

  if(document.getElementById("uk").checked) {
    const weight = Math.round(200 * 0.071429) + 'stone';
    const temperature =  Math.round((94 - 32) / 1.8) + 'centigrade';
    newStory = newStory.replace('300 pounds', weight);
    newStory = newStory.replace('94 fahrenheit', temperature);
  }

  story.textContent = newStory;
  story.style.visibility = 'visible';
}

Hi @Julio_Scozziero and welcome to the community :wave:

When I copy your code together with the starting code from MDN into CodePen it works correctly. That’s the good news. :slightly_smiling_face:

As you suspected there seems to be a problem with the integration of the JS file into the HTML file. Can you post your HTML file otherwise I can’t tell what’s going wrong.

Have a nice day,
Michael

Hello @miko. Thanks for the reply. I was able to solve it… The problem was (I think) in the creation of the .js and .html files… Both created using the VSC. I probably did wrong. I did this again using Notepad and it worked. Regards

1 Like

I’m glad to hear you solved the problem. Good luck with the other exercises.
Feel free to come back whenever you have more questions.