2016年9月2日金曜日

開発環境

Exercises for Programmers: 57 Challenges to Develop Your Coding Skills (Brian P. Hogan 著、Pragmatic Bookshelf)のChapter 4(Making Decisions)、23(Troubleshooting Car Issues)を取り組んでみる。

23(Troubleshooting Car Issues)

コード(Emacs)

<div id="questions0"></div>

<button id="start0">start</button>

<script src="sample23.js"></script>
(function () {
    'use strict';
    var questions,
        question,
        div_questions = document.querySelector('#questions0'),
        button_start = document.querySelector('#start0'),
        createQuestion,
        nextQuestion,
        start;

    question = function (q, y, n) {
        return {
            question: q,
            yes: y,
            no: n,
        };
    };

    questions = question(
        'Is the car silent when you turn the key?',
        question(
            'Are the battery terminals corroded?',
            question('Clean terminals and try starting again.',
                     null,
                     null
                    ),
            question('Replace cables and try again.',
                     null,
                     null)
        ),
        question(
            'Does the car make a clicking noise?',
            question(
                'Replace the battery.',
                null,
                null
            ),
            question(
                'Does the car crank up but fall to start?',
                question(
                    'Check spark plug connections.',
                    null,
                    null
                ),
                question(
                    'Does the engine start and then die?',
                    question(
                        'Does your car have fuel injection?',
                        question(
                            'Get it in for service.',
                            null,
                            null
                        ),
                        question(
                            'Check to ensure the choke is opening and closing.',
                            null,
                            null
                        )
                    ),
                    null
                )
            )
        )
    );

    createQuestion = function (n, text) {
        var label = document.createElement('label'),
            select = document.createElement('select'),
            id = 'question' + n,
            option_text = ['yes/no', 'yes', 'no'];

        label.setAttribute('for', id);
        label.innerText = text;
        select.id = id;    
        option_text.forEach(function (text) {
            var option = document.createElement('option');

            option.innerText = text;
            select.appendChild(option);
        });
        return {label: label, select: select};
    };
    nextQuestion = function (n, questions) {
        var question,
            label,
            select;
        
        console.log(questions);
        if (questions.yes === null) {
            div_questions.innerHTML += questions.question
        } else {
            question = createQuestion(n, questions.question);
            label = question.label;
            select = question.select;
            div_questions.appendChild(label)
            div_questions.appendChild(select);
            div_questions.appendChild(document.createElement('br'));        
            select.onchange = function () {
                console.log('hello');
                nextQuestion(n + 1, questions[select.value]);
            };
        }
    };
    start = function () {
        var question;

        div_questions.innerHTML = '';
        nextQuestion(1, questions);
    };

    button_start.onclick = start;
}());

0 コメント:

コメントを投稿

Comments on Google+: