PageRenderTime 65ms CodeModel.GetById 34ms RepoModel.GetById 0ms app.codeStats 0ms

/www/index.html

https://github.com/codeforamerica/mobile-mapper
HTML | 265 lines | 256 code | 9 blank | 0 comment | 0 complexity | f098dc6131348108a80ac4f4ae7a6189 MD5 | raw file
    

  1. <!doctype html>
    2. 

  2. <html>
    3. 

  3.   <head>
    4. 

  4.     <title>Mobile Mapper</title>
    5. 

  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    6. 

  6.     <link rel="stylesheet" href="jquery.mobile-1.0b1.min.css" />
    7. 

  7.     <link rel="stylesheet" href="base.css" type="text/css" />
    8. 

  8.     <link rel="stylesheet" href="custom.css" type="text/css" />
    9. 

  9.     <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
    10. 

  10.     <script type="text/javascript" charset="utf-8" src="phonegap.0.9.6.min.js"></script>
    11. 

  11.     <script type="text/javascript" charset="utf-8" src="phonegap.plugin.couchdb-attachment-upload.js"></script>
    12. 

  12.     <script type="text/javascript" charset="utf-8" src="MapKitPlug.js"></script>
    13. 

  13.     <script type="text/javascript" charset="utf-8" src="sha1.js"></script>
    14. 

  14.     <script type="text/javascript" charset="utf-8" src="jquery-1.6.1.min.js"></script>
    15. 

  15.     <script type="text/javascript" charset="utf-8" src="jquery.mobile-1.0b1.min.js"></script>
    16. 

  16.     <script type="text/javascript" charset="utf-8" src="jquery.couch.js"></script>
    17. 

  17.     <script type="text/javascript" charset="utf-8" src="jquery.couch2.js"></script>
    18. 

  18.     <script type="text/javascript" charset="utf-8" src="infobox_packed.js"></script>
    19. 

  19.     <script type="text/javascript" charset="utf-8" src="config.js"></script>
    20. 

  20.     <script type="text/javascript" charset="utf-8" src="utils.js"></script>
    21. 

  21.     <script type="text/javascript" charset="utf-8" src="geo.js"></script>
    22. 

  22.     <script type="text/javascript" charset="utf-8" src="script.js"></script>
    23. 

  23.     <script type="text/javascript" charset="utf-8" src="details.js"></script>
    24. 

  24.     <script type="text/javascript" charset="utf-8" src="favorites.js"></script>
    25. 

  25.     <script type="text/javascript" charset="utf-8" src="http://finder.iriscouch.com/apps/_design/couchdb-xd/couchdb.js"></script>
    26. 

  26.   </head>
    27. 

  27.   <body>
    28. 

  28.     <div data-role="page" id="nearby_map" class="page-map" data-theme="d">
    29. 

  29.       <div data-role="header">
    30. 

  30.         <a id="find_me" href="#" title="find me" data-icon="refresh">find me</a>
    31. 

  31.         <h1>Map</h1>
    32. 

  32.         <a id="set_username_btn" href="#set_username" class="ui-btn-right">set username</a>
    33. 

  33.       </div>
    34. 

  34.       <div data-role="content">
    35. 

  35.         <div id="map-container" style="width: 100%; height: 100%"></div>
    36. 

  36.       </div>
    37. 

  37.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    38. 

  38.         <div data-role="navbar">
    39. 

  39.           <ul>
    40. 

  40.             <li><a href="#nearby_map" data-icon="home" title="map">map</a></li>
    41. 

  41.           	<li><a href="#list_view" data-icon="grid">listing</a></li>
    42. 

  42.           	<li><a href="favorites.html" data-icon="star">favorite</a></li>
    43. 

  43.           	<li><a href="#add_record" data-icon="plus" data-transition="slideup" title="add artwork">add artwork</a></li>
    44. 

  44.           	<li><a href="#search_dialog" data-icon="search" data-rel="dialog" data-transition="slidedown">search</a></li>
    45. 

  45.         	</ul>
    46. 

  46.       	</div>
    47. 

  47.       </div>
    48. 

  48.     </div>
    49. 

  49.     <div data-role="page" id="list_view" data-theme="d">
    50. 

  50.       <div data-role="header">
    51. 

  51.         <h1>Listing</h1>
    52. 

  52.         <a id="list_view_more_link" href="" class="ui-btn-right">more info</a>
    53. 

  53.       </div>
    54. 

  54.       <div data-role="content">
    55. 

  55.         <ul id="list_view_ul" data-theme="d">
    56. 

  56.         	
    57. 

  57.         </ul>
    58. 

  58.       </div>
    59. 

  59.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    60. 

  60.         <div data-role="navbar">
    61. 

  61.           <ul>
    62. 

  62.             <li><a href="#nearby_map" data-icon="home" title="map">map</a></li>
    63. 

  63.           	<li><a href="#list_view" data-icon="grid">listing</a></li>
    64. 

  64.           	<li><a href="favorites.html" data-icon="star">favorite</a></li>
    65. 

  65.           	<li><a href="#add_record" data-icon="plus" data-transition="slideup" title="add artwork">add artwork</a></li>
    66. 

  66.           	<li><a href="index.html" data-icon="search">search</a></li>
    67. 

  67.         	</ul>
    68. 

  68.       	</div>
    69. 

  69.       </div>
    70. 

  70.     </div>
    71. 

  71.     
    72. 

  72.     <div data-role="page" id="single_view" data-theme="d">
    73. 

  73.       <div data-role="header">
    74. 

  74.         <h1 class="artwork-title">Details</h1>
    75. 

  75.       </div>
    76. 

  76.       <div data-role="content">
    77. 

  77.         <ul id="single_view_ul">
    78. 

  78.         </ul>
    79. 

  79.       </div>
    80. 

  80.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    81. 

  81.         <div data-role="navbar">
    82. 

  82.           <ul>
    83. 

  83.             <li><a href="#nearby_map" data-icon="home" title="map">map</a></li>
    84. 

  84.           	<li><a href="#list_view" data-icon="grid">listing</a></li>
    85. 

  85.           	<li><a href="favorites.html" data-icon="star">favorite</a></li>
    86. 

  86.           	<li><a href="#add_record" data-icon="plus" data-transition="slideup" title="add artwork">add artwork</a></li>
    87. 

  87.           	<li><a href="#search_dialog" data-icon="search" data-rel="dialog" data-transition="slidedown">search</a></li>
    88. 

  88.         	</ul>
    89. 

  89.       	</div>
    90. 

  90.       </div>
    91. 

  91.     </div>
    92. 

  92.     
    93. 

  93.     <div data-role="page" id="thank_you" data-theme="d">
    94. 

  94.       <div data-role="header">
    95. 

  95.         <a class="back-btn" href="" data-rel="back">back</a>
    96. 

  96.         <h1>Thank You!</h1>
    97. 

  97.       </div>
    98. 

  98.       <div data-role="content">
    99. 

  99.         <div>Thank you for liking this art!</div>
    100. 

  100.         <div>Wanna share it?</div>
    101. 

  101.       </div>
    102. 

  102.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    103. 

  103.         <div data-role="navbar">
    104. 

  104.           <ul>
    105. 

  105.             <li><a href="#nearby_map" data-icon="home" title="map">map</a></li>
    106. 

  106.           	<li><a href="#list_view" data-icon="grid">listing</a></li>
    107. 

  107.           	<li><a href="index.html" data-icon="star">favorite</a></li>
    108. 

  108.           	<li><a href="#add_record" data-icon="plus" data-transition="slideup" title="add artwork">add artwork</a></li>
    109. 

  109.           	<li><a href="#search_dialog" data-icon="search" data-rel="dialog" data-transition="slidedown">search</a></li>
    110. 

  110.         	</ul>
    111. 

  111.       	</div>
    112. 

  112.       </div>
    113. 

  113.     </div>
    114. 

  114.     
    115. 

  115.     <div data-role="page" id="search_dialog" data-theme="d">
    116. 

  116.       <div data-role="content">
    117. 

  117.           <h3>Location:</h3>
    118. 

  118.           <form id="location_search_form" action="" method="get">
    119. 

  119.               <input type="search" name="search_text" id="search_text" value="" />
    120. 

  120.               <button type="submit">Search</button>
    121. 

  121.           </form>
    122. 

  122.       </div>
    123. 

  123.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    124. 

  124.       </div>
    125. 

  125.     </div>
    126. 

  126.     
    127. 

  127.     <div data-role="page" id="login_view" data-theme="d">
    128. 

  128.       <div data-role="header">
    129. 

  129.         <a class="back-btn" href="" data-rel="back">back</a>
    130. 

  130.         <h1>Login</h1>
    131. 

  131.       </div>
    132. 

  132.       <div data-role="content">
    133. 

  133.         <form action="" method="post" id="login_form">
    134. 

  134.           <div data-role="fieldcontain">
    135. 

  135.           	<label for="username_field">Username</label>
    136. 

  136.           	<input type="text" id="username_field" value="" />
    137. 

  137.           </div>
    138. 

  138.           <div data-role="fieldcontain">
    139. 

  139.           	<label for="password_field">Password</label>
    140. 

  140.           	<input type="password" id="password_field" value="" />
    141. 

  141.           </div>
    142. 

  142.           <div data-role="fieldcontain">
    143. 

  143.           	<button type="submit" id="login_button">login</button>
    144. 

  144.           </div>
    145. 

  145.         </form>
    146. 

  146.       </div>
    147. 

  147.       <div data-role="footer" data-id="footer-nav" data-position="fixed">
    148. 

  148.         
    149. 

  149.       </div>
    150. 

  150.     </div>
    151. 

  151.     
    152. 

  152.     <div data-role="page" id="agree_terms" data-theme="d">
    153. 

  153.       <div data-role="header" data-backbtn="false">
    154. 

  154.         <h1>Agreement</h1>
    155. 

  155.       </div>
    156. 

  156.       <div data-role="content">
    157. 

  157.         <h4>Notes on Contributing</h4>
    158. 

  158.         <p class="gen">Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah Blah blah blah legal code blah blah.</p>
    159. 

  159.         <ul class="gen">
    160. 

  160.           <li><p>List item blah blah blah blah blah blah blah blah blah blah blah blah blah blah</p></li>
    161. 

  161.           <li><p>List item blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah </p></li>
    162. 

  162.         </ul>
    163. 

  163.         <p class="gen">Thanks for reading, and we look forward to your help in this collaborative effort.</p>
    164. 

  164.         <form action=".">
    165. 

  165.           <div data-role="fieldcontain">
    166. 

  166.             <fieldset data-role="controlgroup">
    167. 

  167.               <legend>Do you understand and accept these terms?</legend>
    168. 

  168.               <input type="checkbox" name="agreement_checkbox" id="id_agreement_checkbox" class="custom" />
    169. 

  169.               <label id="id_agreement_checkbox_label" for="id_agreement_checkbox">Yes</label>
    170. 

  170.             </fieldset>
    171. 

  171.           </div>
    172. 

  172.         </form>
    173. 

  173.       </div>
    174. 

  174.     </div>
    175. 

  175.     <div data-role="page" id="getting_started" data-theme="d">
    176. 

  176.       <div data-role="header">
    177. 

  177.         <h1>Getting Started</h1>
    178. 

  178.         <a href="#add_record" data-transition="slideup" class="ui-btn-right" title="Add" data-role="button">Add</a>
    179. 

  179.       </div>
    180. 

  180.       <div data-role="content">
    181. 

  181.         <h3>About Mobile Mapper</h3>
    182. 

  182.         <p class="gen">This project is intended to enable the public to contribute valuable data about the location of public items</p>
    183. 

  183.         <ul data-role="listview" data-inset="true" data-theme="c">
    184. 

  184.           <li><a href="#instructions">Learn how to use Mobile Mapper</a></li>
    185. 

  185.         </ul>
    186. 

  186.         <p class="gen">Find our more information at somewebsite.whatever:</p>
    187. 

  187.         <ul data-role="listview" data-inset="true" data-theme="c">
    188. 

  188.           <li><a rel="external" href="http://www.somewebsite.whatever/">Visit somewebsite.whatever</a></li>
    189. 

  189.         </ul>
    190. 

  190.       </div>
    191. 

  191.     </div>
    192. 

  192.     <div data-role="page" id="set_username" data-theme="d">
    193. 

  193.       <div data-role="header">
    194. 

  194.         <h1>Set Your Username</h1>
    195. 

  195.       </div>
    196. 

  196.       <div data-role="content">
    197. 

  197.         <p class="gen">If you'd like to be associated with the reports you submit, give yourself a username.</p>
    198. 

  198.         <p class="gen">It doesn't have to be complex, just unique to you.</p>
    199. 

  199.         <form id="set_username_form" action=".">
    200. 

  200.           <div data-role="fieldcontain">
    201. 

  201.             <label for="name">Username:</label>
    202. 

  202.             <input type="text" name="username" placeholder="johnsmith" id="id_username" value=""  />
    203. 

  203.           </div>
    204. 

  204.           <div data-role="fieldcontain">
    205. 

  205.             <input type="submit" data-theme="b" value="Save">
    206. 

  206.           </div>
    207. 

  207.         </form>
    208. 

  208.       </div>
    209. 

  209.     </div>
    210. 

  210.     <div data-role="page" id="instructions" data-theme="d">
    211. 

  211.       <div data-role="header">
    212. 

  212.         <h1>Mobile Mapper 101</h1>
    213. 

  213.       </div>
    214. 

  214.       <div data-role="content">
    215. 

  215.         <h3>Photo Tips</h3>
    216. 

  216.         <p class="gen">Here are a few key points to help you identify and submit photos:</p>
    217. 

  217.         <ol class="ident_list gen">
    218. 

  218.           <li><strong class="hl_g">Murals:</strong>&nbsp;Blah blah blah blah
    219. 

  219.           </li>
    220. 

  220.         </ol>
    221. 

  221.       </div>
    222. 

  222.     </div>
    223. 

  223.     <div data-role="page" id="add_record" data-theme="d">
    224. 

  224.       <div data-role="header" data-backbtn="false">
    225. 

  225.         <h1>New Record</h1>
    226. 

  226.         <a href="#" class="ui-btn-right" data-rel="back" title="Cancel" data-role="button">Cancel</a>
    227. 

  227.       </div>
    228. 

  228.       <div data-role="content">
    229. 

  229.         <form id="add_record_form" action="." method="post" data-ajax="false">
    230. 

  230.           <div data-role="fieldcontain">
    231. 

  231.             <img id="id_camera_image" class="photo placeholder">
    232. 

  232.             <a href="#choose_photo_source" data-rel="dialog" data-transition="slidedown" data-role="button" data-theme="b">Add Photo</a>
    233. 

  233.           </div>
    234. 

  234.           <div data-role="fieldcontain">
    235. 

  235.             <label for="id_new_record_health" class="select">Health:</label>
    236. 

  236.             <select name="new_record_health" data-native-menu="true" id="id_new_record_health">
    237. 

  237.               <option value="choose" data-placeholder="true">Choose...</option>
    238. 

  238.               <option value="healthy">Healthy</option>
    239. 

  239.               <option value="inspection-required">Inspection Required</option>
    240. 

  240.             </select>
    241. 

  241.           </div>
    242. 

  242.           <div data-role="fieldcontain">
    243. 

  243.             <label for="id_new_record_notes">Notes:</label>
    244. 

  244.             <textarea cols="40" rows="8" name="new_record_notes" placeholder="Optional" id="id_new_record_notes"></textarea>
    245. 

  245.           </div>
    246. 

  246.           <div data-role="fieldcontain">
    247. 

  247.             <div id="small_map_canvas"></div>
    248. 

  248.           </div>
    249. 

  249.           <div data-role="fieldcontain">
    250. 

  250.             <input type="submit" data-theme="a" value="Submit Report">
    251. 

  251.           </div>
    252. 

  252.         </form>
    253. 

  253.       </div>
    254. 

  254.     </div>
    255. 

  255.     <div data-role="page" id="choose_photo_source" data-theme="d">
    256. 

  256.       <div data-role="content">
    257. 

  257.         <a id="id_take_photo" href="#" data-role="button" data-theme="d">Take Photo</a>
    258. 

  258.         <a id="id_choose_library" href="#" data-role="button" data-theme="d">Choose from Library</a>
    259. 

  259.         <a href="#add_record" data-role="button" data-rel="back" data-theme="b">Cancel</a> 
    260. 

  260.       </div>
    261. 

  261.     </div>
    262. 

  262.     
    263. 

  263.     
    264. 

  264.   </body>
    265. 

  265. </html>
    266.