Difference between revisions of "Widget:SpaceAPI"

From Hackerspace ACKspace
Jump to: navigation, search
m (whoops, adding too much markers)
m (implemented 1 beacon, added icon support)
Line 122: Line 122:
 
                     this._beacon.follow = true;
 
                     this._beacon.follow = true;
  
                     // TODO: icon
+
                     // Icons
 +
                    this._beacon.icons = {
 +
                        "HoaB" : L.icon( {
 +
                            iconUrl: 'http://maps.google.com/intl/en_us/mapfiles/ms/micons/cycling.png',
 +
                            iconSize: [32, 32],
 +
                            iconAnchor: [16, 26],
 +
                            popupAnchor: [0, -26],
 +
                            shadowUrl: 'http://maps.google.com/intl/en_us/mapfiles/ms/micons/cycling.shadow.png',
 +
                            shadowSize: [59, 32],
 +
                            shadowAnchor: [16, 26]
 +
                        } )
 +
                    };
  
 
                     this._beacon.marker = L.marker( this._beacon.point, { /*icon: myIcon*/ } ).addTo( this._beacon.map );
 
                     this._beacon.marker = L.marker( this._beacon.point, { /*icon: myIcon*/ } ).addTo( this._beacon.map );
Line 213: Line 224:
 
                 if ( this.data.sensors && this.data.sensors.beacon && this.data.sensors.beacon.length )
 
                 if ( this.data.sensors && this.data.sensors.beacon && this.data.sensors.beacon.length )
 
                 {
 
                 {
                     // Draw the beacons
+
                     // Draw the beacons (for now, only draw the first one)
                     //this._beacon.point = L.latLng( this.data.location.lat, this.data.location.lon );
+
                     this._beacon.point = L.latLng( this.data.sensors.beacon[0].lat, this.data.sensors.beacon[0].lon );
 +
                    this._beacon.circle.setRadius( this.data.sensors.beacon[0].accuracy );
 +
                    this._beacon.marker.setIcon( this._beacon.icons[ this.data.sensors.beacon[0].name || new L.Icon.Default() ] );
 
                 }
 
                 }
 
                 else
 
                 else
 
                 {
 
                 {
                     // Assume mandatory location
+
                     // Assume mandatory location of the space with a 20m radius
 
                     this._beacon.point = L.latLng( this.data.location.lat, this.data.location.lon );
 
                     this._beacon.point = L.latLng( this.data.location.lat, this.data.location.lon );
 +
                    this._beacon.circle.setRadius( 20 );
 +
                    this._beacon.marker.setIcon( this._beacon.marker.setIcon( new L.Icon.Default() ) );
 +
                }
  
                    this._beacon.marker.update();
+
                this._beacon.marker.setLatLng( this._beacon.point );
                    this._beacon.circle.setLatLng( this._beacon.point ).setRadius( 20 );
+
                this._beacon.circle.setLatLng( this._beacon.point );
                    this._beacon.map.setView( this._beacon.point, 16, {} );
+
                this._beacon.map.setView( this._beacon.point, 16, {} );
                }
 
 
             }
 
             }
 
         };
 
         };

Revision as of 14:41, 11 May 2016

This widget allows you to display the Space API data (provided as JSON)

Created by Xopr

Using this widget

To insert this widget, use the following code:

{{#widget:SpaceAPI
|url=/spaceAPI/
|width=260px
|height=20px
|padding=8px
|interval=20
|float=right
}}

This will give the following result:

Notes

  • url is mandatory, the rest is optional (leave out interval to make the data static).
    it also must be written without protocol since colon (:) is not allowed, and may be relative, for example: //ackspace.nl/spaceAPI/ or /spaceAPI/
  • You must provide a unit for the sizes (i.e. px, %, etc.)

Copy to your site

To use this widget on your site, just install MediaWiki Widgets extension and copy full source code of this page to your wiki as Widget:SpaceAPI article.