final/template2.5 at master · japes12345/final · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<form action="compare.php" method="post">
    <!--http://demosthenes.info/blog/757/Playing-With-The-HTML5-range-Slider-Input !-->
    <script>
    function popoutputUpdate(number)
    {
        document.querySelector('.popnumber').value = number;
    }
    function areaoutputUpdate(number)
    {
        document.querySelector('.areanumber').value = number;
    }
    function tempoutputUpdate(number)
    {
        document.querySelector('.tempnumber').value = number;
    }
    function incomeoutputUpdate(number)
    {
        document.querySelector('.incomenumber').value = number;
    }
    function coastoutputUpdate(number)
    {
        document.querySelector('.coastnumber').value = number;
    }
    </script>
    <fieldset>
        </br>
        <div>
            First state?
            <select name="nameselect">
                <option value=""></option>
                <?php foreach ($positions as $position): ?>
                     <option value="<?=$position['name']?>"> <?=$position["name"]?></option>
                <?php endforeach ?>
            </select>

            Second state?
            <select name="nameselect2">
                <option value=""></option>
                <?php foreach ($positions as $position): ?>
                   <option value="<?=$position['name']?>"> <?=$position["name"]?></option>
                <?php endforeach ?>
            </select>

            </br>
            </br>
            </br>
            <div>
                Population
                </br>
                </br>
                Which is better?
                </br>
                <input type="radio" name="opopulation" value="high" checked>High
                <input type="radio" name="opopulation" value="low">Low
            </div>
            </br>
                How important is this factor to you?
                <input type=range name="ipopulation" value=5 min=0 max=10 id=popfader step=1 onchange="popoutputUpdate(this.value)">
                <output for=popfader class=popnumber>5</output>
            </br>
            </br>
            <div>
                Area (square miles)
                </br>
                </br>
                Which is better?
                </br>
                <input type="radio" name="oarea" value="high" checked>High
                <input type="radio" name="oarea" value="low">Low
            </div>
            </br>
                How important is this factor to you?
                <input type=range name="iarea" value=5 min=0 max=10 id=areafader step=1 onchange="areaoutputUpdate(this.value)">
                <output for=areafader class=areanumber>5</output>
            </br>
            </br>
            <div>
                Average Temperature (F)
                </br>
                </br>
                Which is better?
                </br>
                <input type="radio" name="otemp" value="high" checked>High
                <input type="radio" name="otemp" value="low">Low
            </div>
            </br>
                How important is this factor to you?
                <input type=range name="itemp" value=5 min=0 max=10 id=tempfader step=1 onchange="tempoutputUpdate(this.value)">
                <output for=tempfader class=tempnumber>5</output>
            </br>
            </br>
            <div>
                Median Household Income
                </br>
                </br>
                Which is better?
                </br>
                <input type="radio" name="oincome" value="high" checked>High
                <input type="radio" name="oincome" value="low">Low
            </div>
            </br>
                How important is this factor to you?
                <input type=range name="iincome" value=5 min=0 max=10 id=incomefader step=1 onchange="incomeoutputUpdate(this.value)">
                <output for=incomefader class=incomenumber>5</output>
            </br>
            </br>
            <div>
                Coastline (miles)
                </br>
                </br>
                Which is better?
                </br>
                <input type="radio" name="ocoast" value="high" checked>High
                <input type="radio" name="ocoast" value="low">Low
            </div>
            </br>
                Coastline Importance:
                <input type=range name="icoast" value=5 min=0 max=10 id=coastfader step=1 onchange="coastoutputUpdate(this.value)">
                <output for=coastfader class=coastnumber>5</output>
            </br>
        </div>
        </br>
        <div>
            <button type="submit">Compare!</button>
        </div>
    </fieldset>
</form>