rangefindr/index.html at master · ramjoshi/rangefindr · 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
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<title>RangeFindr</title>
	<link rel="stylesheet" href="css/style.css" />
	<link rel="stylesheet" type="text/css" href="js/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
</head>
<body>
	<div id="container">
		<input id="pac-input" class="controls" type="text" placeholder="Location search">
		<div id="map">
		</div>
		<div id="search">
			<h2>Explore Flickr's best pictures near you or anywhere in the world!</h2><br/>
			<form method="get">
				<fieldset id="fields">
					<div class="text">
						<label for="text">Text</label>
						<input type="text" id="text" placeholder="Free text search"/>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="tags">Tags</label>
						<input type="text" id="tags" />
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="tagmode">Tag mode</label>
						<select id="tagmode">
							<option value="any">Any</option>
							<option value="all">All</option>
						</select>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="license">License</label>
						<select id="license">
							<option value="0">Select</option>
							<option value="1">Attribution-NonCommercial-ShareAlike</option>
							<option value="2">Attribution-NonCommercial</option>
							<option value="3">Attribution-NonCommercial-NoDerivs</option>
							<option value="4">Attribution</option>
							<option value="5">Attribution-ShareAlike</option>
							<option value="6">Attribution-NoDerivs</option>
							<option value="7">No known copyright</option>
						</select><br/>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="sort">Sort</label>
						<select id="sort">
							<option value="interestingness-desc">Most Interesting</option>
							<option value="relevance">Most Relevant</option>
							<option value="radial">Radially Outward</option>
							<option value="date-posted-desc">Newest</option>
							<option value="date-posted-asc">Oldest</option>
						</select>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="accuracy">Accuracy</label>
						<select id="accuracy">
							<!--<option value="0">Select</option>-->
							<option value="16">Street</option>
							<option value="11" selected="selected">City</option>
							<option value="6">Region</option>
							<option value="3">Country</option>
							<option value="1">World</option>
						</select>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="radius">Radius</label>
						<input type="range" id="radius" min="1" max="30" value="5"/>
						<span id="radius-selected">(5 km)</span>
						<div class="clear"></div>
					</div>
					<div class="text">
						<label for="nearby">Near Me</label>
						<input type="checkbox" id="nearby" />
						<div class="clear"></div>
					</div>
					<div class="text">
						<input type="submit" id="submit" value="Find">
						<div class="clear"></div>
					</div>
				<fieldset>
			</form>
			<div id="info">
				<br/><h4>Search the map or drag it around and click Find. Then click on an image below for slideshow (browse with left-right key).</h4><br/>
				<span>* To see things fresh and keep Flickr API happy, only images taken within the last one year are shown.</span></br>
				</br><input type="checkbox" id="nofancy" checked="checked"/> Slideshow Enabled<a href="#" id="showcall" /><button>Show API call</button></a>
			</div>
		</div>
		<div id="results">
			<ul id="photos">
			</ul>
		</div>
	</div>

		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
		<script type="text/javascript" src="js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
		<script type="text/javascript" src="js/jquery.busy.js"></script>
		<script type="text/javascript" src="js/main.js"></script>
		<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB_yqtJKcYbsGltQI8U9epYm-BeQIXSr2k&libraries=places&callback=initMap"></script>
	</body>
</html>