Commit 6d65b551639dd848ddaa20fb9ae34bda7df78f80
Replaced tree structure with form (1)
- openlayers.html 96 ------------------------------------------++++++++++++++++++++++++++++++++++++++++++++++++++++++
| | | | 4 | <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script> | 4 | <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script> |
---|
5 | <script type="text/javascript"> | 5 | <script type="text/javascript"> |
---|
6 | function annotationTree() { | 6 | function annotationTree() { |
---|
7 | $('#annotation-tree').show(); | | $('#annotation-tree').show(); |
---|
| | 7 | $('#annotation-overlay').show(); | 8 | } | 8 | } |
---|
9 | | 9 | |
---|
10 | function closeForm() { | 10 | function closeForm() { |
---|
11 | $('#annotation-tree').hide(); | | $('#annotation-tree').hide(); |
---|
| | 11 | $('#annotation-overlay').hide(); | 12 | } | 12 | } |
---|
13 | | 13 | |
---|
14 | function faceOrnament() { | 14 | function faceOrnament() { |
---|
15 | x = document.getElementsByClassName('annotate'); | 15 | x = document.getElementsByClassName('annotate'); |
---|
16 | if(x[0].checked == true && x[0].value == 'face') { | | if(x[0].checked == true && x[0].value == 'face') { |
---|
17 | $('face').show(); | | $('face').show(); |
---|
| | 16 | $('#face').hide(); $('#ornament').hide(); | | | 17 | if(x[0].checked == true) { |
---|
| | 18 | $('#face').show(); |
---|
18 | } | 19 | } |
---|
19 | else if (x[1].checked == true && x[1].value == 'ornament') { | | else if (x[1].checked == true && x[1].value == 'ornament') { |
---|
20 | $('ornament').show(); | | $('ornament').show(); |
---|
| | 20 | else if (x[1].checked == true) { | | | 21 | $('#ornament').show(); |
---|
21 | } | 22 | } |
---|
22 | else { | 23 | else { |
---|
23 | alert('Please select any one of the option') | 24 | alert('Please select any one of the option') |
---|
… | | … | |
---|
26 | } | 26 | } |
---|
27 | </script> | 27 | </script> |
---|
28 | <style type='text/css'> | 28 | <style type='text/css'> |
---|
29 | #annotation-tree { | | #annotation-tree { |
---|
| | 29 | #annotation-overlay { | 30 | position:fixed; | 30 | position:fixed; |
---|
31 | top:0px; | 31 | top:0px; |
---|
32 | left:0px; | 32 | left:0px; |
---|
… | | … | |
---|
36 | display:none; | 36 | display:none; |
---|
37 | z-index:99999; | 37 | z-index:99999; |
---|
38 | } | 38 | } |
---|
| | 39 | |
---|
| | 40 | #container { |
---|
| | 41 | position:absolute; |
---|
| | 42 | top:10%; |
---|
| | 43 | left:20%; |
---|
| | 44 | width:60%; |
---|
| | 45 | height:90%; |
---|
| | 46 | background-color:#ffa; |
---|
| | 47 | } |
---|
| | 48 | |
---|
39 | #face, #ornament { | 49 | #face, #ornament { |
---|
40 | display:none; | 50 | display:none; |
---|
41 | } | 51 | } |
---|
… | | … | |
---|
66 | <script type="text/javascript"> | 66 | <script type="text/javascript"> |
---|
67 | function treeClose() | 67 | function treeClose() |
---|
68 | { | 68 | { |
---|
69 | $('#annotation-tree').hide(); | | $('#annotation-tree').hide(); |
---|
| | 69 | $('#annotation-overlay').hide(); | 70 | attribs["character"] = $("#character-value").text(); | 70 | attribs["character"] = $("#character-value").text(); |
---|
71 | attribs["material"] = $("#material-value").text(); | 71 | attribs["material"] = $("#material-value").text(); |
---|
72 | myJSON.push(attribs); | 72 | myJSON.push(attribs); |
---|
… | | … | |
---|
99 | </ul> | 99 | </ul> |
---|
100 | </div> | 100 | </div> |
---|
101 | <script type="text/javascript" >resize()</script> | 101 | <script type="text/javascript" >resize()</script> |
---|
102 | <div id="annotation-tree"> | | <div id="annotation-tree"> |
---|
103 | <input id="close-form" type="submit" onClick="closeForm();" value="Close" title="Close this form" /> | | <input id="close-form" type="submit" onClick="closeForm();" value="Close" title="Close this form" /> |
---|
104 | <div id="annotate" name="annotateForm" > | | <div id="annotate" name="annotateForm" > |
---|
105 | Choose a category for annotated part : <br /> | | Choose a category for annotated part : <br /> |
---|
106 | <input type="radio" class="annotate" name="annotate" value="face" /> Face <br /> | | <input type="radio" class="annotate" name="annotate" value="face" /> Face <br /> |
---|
107 | <input type="radio" class="annotate" name="annotate" value="ornament" /> Ornament <br /> | | <input type="radio" class="annotate" name="annotate" value="ornament" /> Ornament <br /> |
---|
108 | <input type="submit" name="annotate" value="Next" onclick="faceOrnament();" /> | | <input type="submit" name="annotate" value="Next" onclick="faceOrnament();" /> |
---|
109 | </div> | | </div> |
---|
110 | <div id="face" name="faceForm"> | | <div id="face" name="faceForm"> |
---|
111 | Choose whose face is it : <br> | | Choose whose face is it : <br> |
---|
112 | <input type="radio" name="face" value="Shiva" /> Shiva <br /> | | <input type="radio" name="face" value="Shiva" /> Shiva <br /> |
---|
113 | <input type="radio" name="face" value="Vishnu" /> Vishnu <br /> | | <input type="radio" name="face" value="Vishnu" /> Vishnu <br /> |
---|
114 | <input type="radio" name="face" value="Krishna" /> Krishna <br /> | | <input type="radio" name="face" value="Krishna" /> Krishna <br /> |
---|
115 | <input type="radio" name="face" value="Parvati" /> Parvati <br /> | | <input type="radio" name="face" value="Parvati" /> Parvati <br /> |
---|
116 | <input type="radio" name="face" value="Lakshmi" /> Lakshmi <br /> | | <input type="radio" name="face" value="Lakshmi" /> Lakshmi <br /> |
---|
117 | <input type="radio" name="face" value="Saraswati" /> Saraswati <br /> | | <input type="radio" name="face" value="Saraswati" /> Saraswati <br /> |
---|
| | 102 | <div id="annotation-overlay"> | | | 103 | <div id="container"> |
---|
| | 104 | <input id="close-form" type="submit" onClick="closeForm();" value="Close" title="Close this form" /> |
---|
| | 105 | <div id="annotate" name="annotateForm" > |
---|
| | 106 | Choose a category for annotated part : <br /> |
---|
| | 107 | <input type="radio" class="annotate" name="annotate" value="face" /> Face <br /> |
---|
| | 108 | <input type="radio" class="annotate" name="annotate" value="ornament" /> Ornament <br /> |
---|
| | 109 | <input type="submit" name="annotate" value="Next" onclick="faceOrnament();" /> |
---|
118 | </div> | 110 | </div> |
---|
119 | | | |
---|
120 | <div id="ornament" name="ornamentForm" > | | <div id="ornament" name="ornamentForm" > |
---|
121 | Choose what jewellery is it : <br /> | | Choose what jewellery is it : <br /> |
---|
122 | <input type="radio" name="jewellery" value="Neckless" /> Neckless <br /> | | <input type="radio" name="jewellery" value="Neckless" /> Neckless <br /> |
---|
123 | <input type="radio" name="jewellery" value="Bangles" /> Bangles <br /> | | <input type="radio" name="jewellery" value="Bangles" /> Bangles <br /> |
---|
124 | <input type="radio" name="jewellery" value="Ear-ring" /> Ear-ring <br /> | | <input type="radio" name="jewellery" value="Ear-ring" /> Ear-ring <br /> |
---|
125 | <input type="radio" name="jewellery" value="Nose-ring" /> Nose-ring <br /> | | <input type="radio" name="jewellery" value="Nose-ring" /> Nose-ring <br /> |
---|
126 | <input type="radio" name="jewellery" value="Waistlet" /> Waistlet <br /> | | <input type="radio" name="jewellery" value="Waistlet" /> Waistlet <br /> |
---|
127 | <input type="radio" name="jewellery" value="Ankalet" /> Ankalet <br /> | | <input type="radio" name="jewellery" value="Ankalet" /> Ankalet <br /> |
---|
128 | <br /> | | <br /> |
---|
129 | Choose what materal of an ornament : <br /> | | Choose what materal of an ornament : <br /> |
---|
130 | <input type="radio" name="material" value="Gold" /> Gold <br /> | | <input type="radio" name="material" value="Gold" /> Gold <br /> |
---|
131 | <input type="radio" name="material" value="Silver" /> Silver <br /> | | <input type="radio" name="material" value="Silver" /> Silver <br /> |
---|
132 | <input type="radio" name="material" value="Bronze" /> Bronze <br /> | | <input type="radio" name="material" value="Bronze" /> Bronze <br /> |
---|
133 | <input type="radio" name="material" value="Ruby" /> Ruby <br /> | | <input type="radio" name="material" value="Ruby" /> Ruby <br /> |
---|
134 | <input type="radio" name="material" value="Diamond" /> Diamond <br /> | | <input type="radio" name="material" value="Diamond" /> Diamond <br /> |
---|
135 | <input type="radio" name="material" value="Platinum" /> Platinum <br /> | | <input type="radio" name="material" value="Platinum" /> Platinum <br /> |
---|
| | 111 | <div id="face" name="faceForm"> | | | 112 | Choose whose face is it : <br> |
---|
| | 113 | <input type="radio" name="face" value="Shiva" /> Shiva <br /> |
---|
| | 114 | <input type="radio" name="face" value="Vishnu" /> Vishnu <br /> |
---|
| | 115 | <input type="radio" name="face" value="Krishna" /> Krishna <br /> |
---|
| | 116 | <input type="radio" name="face" value="Parvati" /> Parvati <br /> |
---|
| | 117 | <input type="radio" name="face" value="Lakshmi" /> Lakshmi <br /> |
---|
| | 118 | <input type="radio" name="face" value="Saraswati" /> Saraswati <br /> |
---|
| | 119 | </div> |
---|
| | 120 | |
---|
| | 121 | <div id="ornament" name="ornamentForm" > |
---|
| | 122 | Choose what jewellery is it : <br /> |
---|
| | 123 | <input type="radio" name="jewellery" value="Neckless" /> Neckless <br /> |
---|
| | 124 | <input type="radio" name="jewellery" value="Bangles" /> Bangles <br /> |
---|
| | 125 | <input type="radio" name="jewellery" value="Ear-ring" /> Ear-ring <br /> |
---|
| | 126 | <input type="radio" name="jewellery" value="Nose-ring" /> Nose-ring <br /> |
---|
| | 127 | <input type="radio" name="jewellery" value="Waistlet" /> Waistlet <br /> |
---|
| | 128 | <input type="radio" name="jewellery" value="Ankalet" /> Ankalet <br /> |
---|
| | 129 | <br /> |
---|
| | 130 | Choose what materal of an ornament : <br /> |
---|
| | 131 | <input type="radio" name="material" value="Gold" /> Gold <br /> |
---|
| | 132 | <input type="radio" name="material" value="Silver" /> Silver <br /> |
---|
| | 133 | <input type="radio" name="material" value="Bronze" /> Bronze <br /> |
---|
| | 134 | <input type="radio" name="material" value="Ruby" /> Ruby <br /> |
---|
| | 135 | <input type="radio" name="material" value="Diamond" /> Diamond <br /> |
---|
| | 136 | <input type="radio" name="material" value="Platinum" /> Platinum <br /> |
---|
| | 137 | </div> |
---|
136 | </div> | 138 | </div> |
---|
137 | | | |
---|
138 | </div> | 139 | </div> |
---|
139 | </body> | 140 | </body> |
---|
140 | </html> | 141 | </html> |
---|