Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: CBeloch/Locate
base: master
...
head fork: MattiSG/Locate
compare: master
Checking mergeability… Don’t worry, you can still create the pull request.
  • 8 commits
  • 5 files changed
  • 0 commit comments
  • 1 contributor
Commits on Nov 13, 2010
@MattiSG MattiSG Implemented timeout option support for browser that don't do it prope…
…rly.

Set default value of loi to false (displays a modal to Safari users for example).
Improved and formalized error handling.
900aade
@MattiSG MattiSG Decreased source size. 02fe374
@MattiSG MattiSG Improved heading calculation efficiency. c229e7a
@MattiSG MattiSG Added details about Google Maps API. 7e6227a
@MattiSG MattiSG Resetting master branch to loi = true, for better compatibility.
Options will be refactored in another branch.
38d9053
@MattiSG MattiSG Removed loi (specifying it as an option was as long as adding .locate…
…() after init, removes an error case and decreases code), renamed "options.positionOptions" to "options.position" and renamed "watcher" to "observe" (verbal forms are better but "watch" is forbidden according to original author).

Uniformized documentation and made it more concise.
e89e625
Commits on Nov 14, 2010
@MattiSG MattiSG Added tests.
Refactored and optimized code.
Updated and improved documentation.
8d543ee
@MattiSG MattiSG Added tests.
Made the locate() and watcher() methods chainable.

Merge branch 'options'
653070e
View
8 README.md
@@ -21,9 +21,11 @@ Use Code like this:
#JS
var location = new Locate({
onLocate: function(position){
- // Do stuff with the position data
+ alert('latitude: ' + position.latitude, '; longitude: ' + position.longitude + '; accuracy: ' + position.accuracy);
}
});
+
+_See below for more details about `position` fields._
Want to frequently get the position (watch your visitor move)?
@@ -53,11 +55,11 @@ No problem, the function distanceTo() returns the distance in km:
var location = new Locate({
loiType: 'watch',
onLocate: function(position){
- $("distance").set('html', this.distanceTo(37.3316591,-122.0301778));
+ $("distance").set('html', this.distanceTo(37.3316591, -122.0301778));
}
});
-position data
+Position data
-------------
The position data given with the event 'locate' looks like this:
View
3  Source/Locate.Extras.js
@@ -10,8 +10,9 @@ authors:
requires:
core/1.2.4: '*'
+ Google Maps API v2 for address()
-provides: [Locate.distanceTo()]
+provides: [Locate.distanceTo(), Locate.address()]
...
*/
View
89 Source/Locate.js
@@ -2,11 +2,12 @@
---
script: Locate.js
-version: 1.3
-description: With the Locate class you can retrieve the current position of your visitors
+version: 1.4
+description: The Locate class is an easy-to-use MooTools interface over the W3C's Geolocation API.
license: MIT-style
authors:
- Christopher Beloch
+- Matti Schneider-Ghibaudo
requires:
core/1.2.4: '*'
@@ -17,28 +18,40 @@ provides: [Locate]
*/
var Locate = new Class({
+ /**Fired events:
+ * - locate(position)
+ * - error({code: Number, message: String})
+ * `code` is one of the [W3C's Geolocation API](http://dev.w3.org/geo/api/spec-source-v2.html#position_error_interface) or one of:
+ * - -1: browser does not support geolocation
+ * - -2: inner Locate configuration error
+ */
Implements: [Options, Events],
+
options: {
loi: true, // loi = locate on init
loiType: 'locate', // locate OR watch
positionOptions: {
enableHighAccuracy: true, // may result in slower response times or increased power consumption if true
- timeout: 30000, // expressed in milliseconds, can correspond in an error event on timeout
+ timeout: 10000, // expressed in milliseconds, can correspond in an error event on timeout
maximumAge: 5000 // specified time in milliseconds
}
},
+
+/* //instance variables
+ timeout: null, //some browsers do not implement the "timeout" option, so we have to handle it ourselves
+*/
+ position: {},
initialize: function(options){
this.setOptions(options);
- if(!navigator.geolocation)
- {
- this.fireEvent("error", "geolocation is not supported");
+ if (! navigator.geolocation) {
+ this.fireEvent('error', {code: -1, message: "Your browser does not support geolocation."});
return false;
}
- if(this.options.loi){
- switch(this.options.loiType){
+ if (this.options.loi) {
+ switch (this.options.loiType) {
case 'locate':
this.locate();
break;
@@ -46,45 +59,44 @@ var Locate = new Class({
this.watcher();
break;
default:
- this.fireEvent("error", "loiType unknown");
+ this.fireEvent('error', {code: -2, message: 'Configuration error (LOI)'});
}
}
},
setPosition: function(position){
- pos = {
- latitude: position.coords.latitude,
- longitude: position.coords.longitude,
- accuracy: position.coords.accuracy, // specified in meters
- altitude: position.coords.altitude, // null if not supported, meters above the WGS84 ellipsoid
- altitudeAccuracy: position.coords.altitudeAccuracy, // specified in meters
- heading: position.coords.heading, // null if not supported, specified in degrees counting clockwise to true nort
- speed: position.coords.speed // null if not supported, specified in meters per second
- };
-
- if(this.position)
- $extend(this.position, pos);
- else
- this.position = pos;
+ $clear(this.timeout);
- $extend(this.position, {
+ this.position = $merge(this.position, position.coords, {
cardinalDirection: this.cardinalDirection()
});
- this.fireEvent("locate", this.position);
+ this.fireEvent('locate', this.position);
},
+
handleError: function(error){
- this.fireEvent("error", "Error " + error.code + " - " + error.message)
+ $clear(this.timeout);
+ this.fireEvent('error', error);
},
locate: function(){
+ $clear(this.timeout);
+ this.timeout = this.fireEvent.delay(this.options.positionOptions.timeout, this, ['error', { code: 3, message: 'Timeout' }]);
navigator.geolocation.getCurrentPosition(this.setPosition.bind(this), this.handleError.bind(this), this.options.positionOptions);
+
+ return this;
},
watcher: function(){
// have to call it 'watcher'
// 'watch' is causing errors on Firefox, MobileSafari works perfect
- this.watchId = navigator.geolocation.watchPosition(this.setPosition.bind(this), this.handleError.bind(this), this.options.positionOptions);
+ this.watchId = navigator.geolocation.watchPosition(
+ this.setPosition.bind(this),
+ this.handleError.bind(this),
+ this.options.positionOptions
+ );
+
+ return this;
},
stopWatcher: function(){
@@ -92,23 +104,28 @@ var Locate = new Class({
},
cardinalDirection: function(){
- if(!this.position.heading) // if heading is null
+ if (! $defined(this.position.heading))
return null;
- if(this.position.heading >= 337.5 || (this.position.heading >= 0 && this.position.heading <= 22.5))
+
+ var heading = this.position.heading % 360;
+
+ if (heading <= 22.5)
return "N";
- if(this.position.heading >= 22.5 && this.position.heading <= 67.5)
+ if (heading <= 67.5)
return "NE";
- if(this.position.heading >= 67.5 && this.position.heading <= 112.5)
+ if (heading <= 112.5)
return "E";
- if(this.position.heading >= 112.5 && this.position.heading <= 157.5)
+ if (heading <= 157.5)
return "SE";
- if(this.position.heading >= 157.5 && this.position.heading <= 202.5)
+ if (heading <= 202.5)
return "S";
- if(this.position.heading >= 202.5 && this.position.heading <= 247.5)
+ if (heading <= 247.5)
return "SW";
- if(this.position.heading >= 247.5 && this.position.heading <= 292.5)
+ if (heading <= 292.5)
return "W";
- if(this.position.heading >= 292.5 && this.position.heading <= 337.5)
+ if (heading <= 337.5)
return "NW";
+
+ return "N";
}
});
View
113 Source/test-extras.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
+ <head>
+ <title>Locate.Extras test</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <meta name="author" content="Matti Schneider-Ghibaudo"/>
+ <script language="javascript" type="text/javascript" src="mootools-1.2.4-core.js"></script>
+ <script language="javascript" type="text/javascript" src="Locate.js"></script>
+ <script language="javascript" type="text/javascript" src="Locate.Extras.js"></script>
+
+ <style type="text/css">
+ #degrees {
+ width: 5em;
+ text-align: right;
+ }
+
+ #degreesContainer, #numberFunctions {
+ float: left;
+ list-style-type: none;
+ }
+
+ button {
+ font-family: monospace;
+ }
+
+ hr {
+ clear: both;
+ }
+ </style>
+ </head>
+ <body>
+ <h1>Locate.Extras test</h1>
+
+ <noscript>
+ <h2>Come on, you're supposed to test a Javascript class… Activate JS!!</h2>
+ </noscript>
+
+ <div>
+ <span id="degreesContainer"><input type="text" id="degrees" value="45.5"/>°</span>
+ <ul id="numberFunctions">
+ <li>
+ <button onclick="convert()">.toRadians() = </button>
+ <input type="text" id="radians" value="" readonly="readonly"/>
+ rad
+ </li>
+
+ <li>
+ <button onclick="cardinal()">.cardinalDirection() = </button>
+ <input type="text" id="cardinal" value="" readonly="readonly"/>
+ </li>
+ </ul>
+ </div>
+
+ <hr/>
+
+ <div id="inputs">
+ <button onclick="locate()">locator.locate()</button>
+ <br/>
+ <label>Timeout: <input type="text" id="timeout" value="10000"/></label>
+ </div>
+
+ <ol id="errors">
+ <!-- dynamically filled -->
+ </ol>
+
+ <div>
+ <input type="text" id="distance" readonly="readonly"/>km to Paris
+ </div>
+ <hr/>
+
+ <script type="text/javascript">
+ //<![CDATA[
+ var convert = function() {
+ $('radians').set('value',
+ $('degrees').get('value').toFloat().toRadians()
+ );
+ }
+
+ var cardinal = function() {
+ $('cardinal').set('value',
+ $('degrees').get('value').toFloat().cardinalDirection()
+ );
+ }
+
+ var locator;
+
+ var locate = function() {
+ if (locator)
+ return locator.locate();
+
+ $('timeout').set('disabled', 'disabled');
+
+ locator = new Locate({
+ position: {
+ timeout: $('timeout').get('value').toInt()
+ },
+ onLocate: function(position) {
+ $('errors').grab(new Element('li', {
+ html: JSON.encode(position)
+ }));
+ $('distance').set('value', locator.distanceTo(48.856667, 2.350833))
+ },
+ onError: function(error) {
+ $('errors').grab(new Element('li', {
+ html: JSON.encode(error)
+ }));
+ }
+ }).locate();
+ }
+ //]]>
+ </script>
+ </body>
+</html>
View
70 Source/test.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
+ <head>
+ <title>Locate class test</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <meta name="author" content="Matti Schneider-Ghibaudo"/>
+ <script language="javascript" type="text/javascript" src="mootools-1.2.4-core.js"></script>
+ <script language="javascript" type="text/javascript" src="Locate.js"></script>
+ <script language="javascript" type="text/javascript" src="Locate.Extras.js"></script>
+ </head>
+ <body>
+ <h1>Locate test</h1>
+
+ <noscript>
+ <h2>Come on, you're supposed to test a Javascript class… Activate JS!!</h2>
+ </noscript>
+
+ <div id="inputs">
+ <button onclick="locate()">Locate me!</button>
+ <br/>
+ <label>Timeout: <input type="text" id="timeout" value="10000"/></label>
+ </div>
+
+ <hr/>
+
+ <dl>
+ <dt>Results:</dt>
+ <dd>
+ <ol id="results">
+ <!-- dynamically filled -->
+ </ol>
+ </dd>
+ <dt>Errors:</dt>
+ <dd>
+ <ol id="errors">
+ <!-- dynamically filled -->
+ </ol>
+ </dd>
+ </dl>
+
+ <script type="text/javascript">
+ //<![CDATA[
+ var locator;
+
+ var locate = function() {
+ if (locator)
+ return locator.locate();
+
+ $('timeout').set('disabled', 'disabled');
+
+ locator = new Locate({
+ position: {
+ timeout: $('timeout').get('value').toInt()
+ },
+ onLocate: function(position) {
+ $('results').grab(new Element('li', {
+ html: JSON.encode(position)
+ }));
+ },
+ onError: function(error) {
+ $('errors').grab(new Element('li', {
+ html: JSON.encode(error)
+ }));
+ }
+ }).locate();
+ }
+ //]]>
+ </script>
+ </body>
+</html>

No commit comments for this range

Something went wrong with that request. Please try again.