Home > Mobile >  Making functions into an an array
Making functions into an an array

Time:03-07

const fs = require("fs");
const inquirer = require("inquirer");
var Employee = require("./Lib/Employee");
//can export intern file and more. We will not need it for employee just for intern, manager, engineer.

inquirer
  .prompt([{
      type: 'input',
      message: 'What is the name of the entire teams general manager? Note this will appear as the title as example "Johns(name given from this question) Team"',
      name: 'generalManager',
    },
    {
      type: 'input',
      message: 'What is the team managers name?',
      name: 'managerName',
    },
    {
      type: 'input',
      message: 'What is the managers ID?',
      name: 'managerId',
    },
    {
      type: 'input',
      name: 'managerEmail',
      message: 'What is the managers email?',

    },
    {
      type: 'input',
      message: 'What is the managers office number?',
      name: 'managerOffice',
    },
  ])


  //end of prompt
  .then(function(response) {
    console.log(response);
    endofCode();

    const htmlTemplate =
      `<!DOCTYPE html>
                  <html>
                    <head>
                      <title>Kourtneys Team Profile Generator</title>
                      <meta charset="UTF-8" />
                      <meta name="viewport" content="width=device-width, initial-scale=1" />
                      <link rel="stylesheet" type="text/css" href="./assets/style.css" />
                    </head>
                    <body>
                      <!-- Header -->
                      <header>
                        <h1>${response.generalManager}'s Team</h1>
                
                      </header>

                      <!-- Body -->
                      <main>
                        
                        <!-- Product Cards -->
                        <div >
                          <section >
                            <header><h1>${response.managerName}</h1> <h3>Manager</h3></header>
                            <ul>
                              <li>ID:</li>
                              <li>Email:</li>
                              <li>GitHub:</li>
                            </ul>
                          </section>
                          <section >
                            <header><h1>${response.engineer1Name}</h1> <h3>Engineer</h3></header>
                            <ul>
                              <li>ID:</li>
                              <li>Email:</li>
                              <li>GitHub:</li>
                            </ul>
                          </section>
                          <section >
                            <header><h1>${response.username}</h1> <h3>Engineer</h3></header>
                            <ul>
                              <li>ID:</li>
                              <li>Email:</li>
                              <li>GitHub:</li>
                            </ul>
                          </section>
                          <section >
                            <header><h1>${response.engineer1Github}</h1> <h3>Engineer</h3></header>
                            <ul>
                              <li>ID:</li>
                              <li>Email:</li>
                              <li>GitHub:</li>
                            </ul>
                            
                            
                          </section>
                          <section >
                            <header><h1>Wooden Spoons</h1> <h3>Intern</h3></header>
                            <ul>
                              <li>ID:</li>
                              <li>Email:</li>
                              <li>GitHub:</li>
                            </ul>
                            
                            
                          </section>
                        </div>
                      </main>
                    </body>
                  </html>`;


    fs.writeFile('index.html', htmlTemplate, (err) =>
    )
  });
//step 1: Create 3 additional functions. Next function to create is going to be a menu. After they choose who their manager is, they will come back to this. Crossroads
function endofCode(params) {
  inquirer
    .prompt([{
      type: 'list',
      name: 'addToTeam',
      message: 'end',
      choices: [
        'Done adding to the team',
        'Continue',
      ]


    }])
    .then(function(response) {
      console.log(response)
      engineerA();
      engineerB();
      engineerC();
      intern();

    })
};

function engineerA(params) {
  inquirer
    .prompt([{
      type: 'input',
      name: 'engineer1Name',
      message: 'What is the first engineers name?',
    }, {
      type: 'input',
      name: 'engineer1Id',
      message: 'What is the first engineers ID?',
    }, {
      type: 'input',
      message: 'What is the first engineers email?',
      name: 'engineer1Email',
    }, {
      type: 'input',
      message: 'What is the first engineers github username?',
      name: 'engineer1Github',
    }])
    .then(function(response) {
      console.log(response)
      endofCode();
    })
};

function engineerB(params) {
  inquirer
    .prompt([{
      type: 'input',
      name: 'engineer2Name',
      message: 'What is the second engineers name?',
    }, {
      type: 'input',
      name: 'engineer2Id',
      message: 'What is the second engineers ID?',
    }, {
      type: 'input',
      message: 'What is the second engineers email?',
      name: 'engineer2Email',
    }, {
      type: 'input',
      message: 'What is the second engineers github username?',
      name: 'engineer2Github',
    }])
    .then(function(response) {
      console.log(response)
      endofCode();
    })
};

function engineerC(params) {
  inquirer
    .prompt([{
      type: 'input',
      name: 'engineer3Name',
      message: 'What is the third engineers name?',
    }, {
      type: 'input',
      name: 'engineer3Id',
      message: 'What is the third engineers ID?',
    }, {
      type: 'input',
      message: 'What is the third engineers email?',
      name: 'engineer3Email',
    }, {
      type: 'input',
      message: 'What is the third engineers github username?',
      name: 'engineer3Github',
    }])
    .then(function(response) {
      console.log(response)
      endofCode();
    })
};

function intern(params) {
  inquirer
    .prompt([{
      type: 'input',
      name: 'internName',
      message: 'What is the interns name?',

    }, {
      type: 'input',
      name: 'internId',
      message: 'What is the interns ID?',

    }, {
      type: 'input',
      message: 'What is the interns email?',
      name: 'internEmail',
    }, {
      type: 'input',
      message: 'What is the interns school?',
      name: 'internSchool',
    }])
    .then(function(response) {
      console.log(response)
      endofCode();
    })
};

Hello, I have to make a Teamprofile generator and am having an issue with how to make it so that it will call the function endofCode after each question asked. Here is the code I am having an issue with:

.then(function(response) {
    console.log(response)
    engineerA();
    engineerB();
    engineerC();
    intern();

  } )};

Unfortunately, this does not work because if I prompt the questions for engineerA and then have it go to endofCode, it will just spit out all of these at once instead of one at a time once it hits endofCode. Any idea how to make these only prompt one after the other? I also need these to render to the HTML page correctly according to answers as well.

CodePudding user response:

Simply return a promise from your individual functions and then you could easily chain them using .then() or async/await.

function engineerA(){
  return new Promise((resolve, reject)=> {
    // put your logic for asking questions here. 
    // once the logic is complete, resolve or reject the promise
    if(confirm('Asking you my first question?')) resolve('you answered my question')
    else reject('You did not answer my question')
  
  })
}

function engineerB(){
  return new Promise((resolve, reject)=> {
    // put your logic for asking questions here. 
    // once the logic is complete, resolve or reject the promise
    if(confirm('Asking you my second question?')) resolve('you answered my second question')
    else reject('You did not answer my question')
  })
}


(async () =>{
  const resp = await engineerA();
  console.log(resp);
  const resp2 = await engineerB();
  console.log(resp2);
})();

P.S: Check your browser console instead of this snippet console by pressing f12 when running this snippet code.

CodePudding user response:

i made similar program long time ago see if this helps

<script>
function query() {
    var html = `
    <style>
    .prompt {
        display:flex;
        width:100%;
        justify-content:center;
        z-index:99999;
    }
    
    .prompt > .holder {
         padding: 1em 1.5em;
         border-radius: 0.2em;
         color:#4a4a4a;
         position:fixed;
         top:50px;
         width:80%;
         background:white;
          box-shadow: 0px 0px 20px #cbcbcb;
    }
    
    .prompt > .holder > div {
        outline: none;
    }
    
    .prompt .btnc{
        font-size: 0.9em;
        padding: 0.1em 0.5em;
        border-radius: 0.2em;
        margin-right: 0.2em;
        cursor: pointer;
        box-shadow: 0px 0px 1.5px black;
    }

    .prompt .data{ 
        width:100%;
        font-size:1.1em;
        border:none;
        font-family:inherit;
        outline:none;
    }
    
    .btnc:nth-child(1){
        background:#3f56ff;
        color:white;
    }
    
    .btns {
        display: flex;
        justify-content: flex-end;
        margin-top: 0.9em;
    }
    
    .heading {
        font-size: 1.4em;
        margin-bottom: 0.5em;
        font-weight: bold;
    }

    .hide {
        display:none !important;
    }
    </style>
    <div >
        <div >
            <div >Field Title</div>
            <textarea  spellcheck="false"></textarea>
            <div >
                <div >Done</div>
                <div >Cancel</div>            
            </div>
        </div>
    </div>
    `;
    var div = document.createElement("div");
    document.body.appendChild(div);
    div.innerHTML = html;
    var hc = "hide", rootEl = div.querySelector(".prompt"),
        fnEl = document.querySelector(".prompt .heading"),
        dataEl = document.querySelector(".prompt .data"),
        btnsEl = document.querySelectorAll(".btnc");
    function show(){rootEl.classList.remove(hc);}
    function hide(){rootEl.classList.add(hc);}

    rootEl.addEventListener("keydown", d => {
        if (d.keyCode == 13 && !d.shiftKey) {
            d.preventDefault();
            btnsEl[0].click();
        }
    });

    this.prompt = (ques, data) => {
        return new Promise((res,rej)=>{
            show();
            fnEl.innerText = ques;
            dataEl.value = data;
            dataEl.style.display = "";
            btnsEl[0].innerText = "Done";        
            dataEl.focus();
            dataEl.select();
            btnsEl[0].onclick = ()=>{
                hide();
                res(dataEl.value);
            }
            btnsEl[1].onclick = ()=>{
                hide();
                res(null);
            }            
        })

    }

    this.confirm = (ques)=>{
        return new Promise((res,rej)=>{
            show();
            fnEl.innerText = ques;
            dataEl.value = "";
            dataEl.style.display = "none";
            btnsEl[0].innerText = "Confirm";
            btnsEl[0].onclick = ()=>{
                hide();
                res(true);
            }
            btnsEl[1].onclick = ()=>{
                hide();
                res(false);
            }            
        })

    }
}

//example use 
var p = new query(),vals={}
async function startQuestions(){
    vals.fname = await p.prompt("Your First Name ?","")
    vals.lname = await p.prompt("Your Last Name ?","")
    vals.mos = await p.confirm("Are You Married ?")
    vals.mos = vals.mos ? await p.prompt("Your Wife Name",""):"Singal"
    vals.City = await p.prompt("Your City Name","")
    console.log(vals)
}
startQuestions()
</script>

  • Related