Created
January 27, 2012 11:05
-
-
Save brianherbert/1688313 to your computer and use it in GitHub Desktop.
testing adsense plugin
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> | |
<head> | |
<title>Local Ushahidi Deployment</title> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
<link rel="stylesheet" type="text/css" href="http://ushahidi.osx/media/css/jquery-ui-themeroller.css" /> | |
<link rel="stylesheet" type="text/css" href="http://ushahidi.osx/themes/default/css/style.css" /> | |
<!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="http://ushahidi.osx/media/css/iehacks.css" /> | |
<![endif]--><!--[if IE 7]><link rel="stylesheet" type="text/css" href="http://ushahidi.osx/media/css/ie7hacks.css" /> | |
<![endif]--><!--[if IE 6]><link rel="stylesheet" type="text/css" href="http://ushahidi.osx/media/css/ie6hacks.css" /> | |
<![endif]--><link rel="stylesheet" type="text/css" href="http://ushahidi.osx/media/css/openlayers.css" /> | |
<link rel="alternate" type="application/rss+xml" href="http://ushahidi.osx/feed/" title="RSS2" /><script type="text/javascript" src="http://ushahidi.osx/media/js/OpenLayers.js"></script> | |
<script type="text/javascript">OpenLayers.ImgPath = 'http://ushahidi.osx/media/img/openlayers/';</script><script type="text/javascript" src="http://ushahidi.osx/media/js/jquery.js"></script> | |
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script> | |
<script type="text/javascript" src="http://ushahidi.osx/media/js/jquery.pngFix.pack.js"></script> | |
<script type="text/javascript" src="http://ushahidi.osx/media/js/jquery.timeago.js"></script> | |
<script type="text/javascript" src="https://maps.google.com/maps/api/js?v=3.2&sensor=false"></script><script type="text/javascript" src="http://ushahidi.osx/media/js/selectToUISlider.jQuery.js"></script> | |
<script type="text/javascript" src="http://ushahidi.osx/media/js/jquery.flot.js"></script> | |
<script type="text/javascript" src="http://ushahidi.osx/media/js/timeline.js"></script> | |
<!--[if IE]><script type="text/javascript" src="http://ushahidi.osx/media/js/excanvas.min.js"></script> | |
<![endif]--><script type="text/javascript"> | |
<!--// | |
function runScheduler(img){img.onload = null;img.src = 'http://ushahidi.osx/scheduler';} | |
$(document).ready(function(){$(document).pngFix();}); // Map JS | |
// Map Object | |
var map; | |
// Selected Category | |
var currentCat; | |
// Selected Layer | |
var thisLayer; | |
// WGS84 Datum | |
var proj_4326 = new OpenLayers.Projection('EPSG:4326'); | |
// Spherical Mercator | |
var proj_900913 = new OpenLayers.Projection('EPSG:900913'); | |
// Change to 1 after map loads | |
var mapLoad = 0; | |
// /json or /json/cluster depending on if clustering is on | |
var default_json_url = "json"; | |
// Current json_url, if map is switched dynamically between json and json_cluster | |
var json_url = default_json_url; | |
/* | |
- Part of #2168 fix | |
- Added by E.Kala <emmanuel(at)ushahidi.com> | |
*/ | |
// Global list for current KML overlays in display | |
var kmlOverlays = []; | |
var baseUrl = "http://ushahidi.osx/"; | |
var longitude = 25.219888682471; | |
var latitude = 1.5249115531142; | |
var defaultZoom = 4; | |
var markerRadius = 4; | |
var markerOpacity = "0.8"; | |
var selectedFeature; | |
var allGraphData = ""; | |
var dailyGraphData = ""; | |
var gMediaType = 0 | |
var timeout = 1500; | |
var activeZoom = null; | |
var gMarkerOptions = { | |
baseUrl: baseUrl, longitude: longitude, | |
latitude: latitude, defaultZoom: defaultZoom, | |
markerRadius: markerRadius, | |
markerOpacity: markerOpacity, | |
protocolFormat: OpenLayers.Format.GeoJSON | |
}; | |
/* | |
Create the Markers Layer | |
*/ | |
function addMarkers(catID,startDate,endDate, currZoom, currCenter, | |
mediaType, thisLayerID, thisLayerType, thisLayerUrl, thisLayerColor) | |
{ | |
activeZoom = currZoom; | |
if(activeZoom == ''){ | |
return $.timeline({categoryId: catID, | |
startTime: new Date(startDate * 1000), | |
endTime: new Date(endDate * 1000), | |
mediaType: mediaType | |
}).addMarkers( | |
startDate, endDate, gMap.getZoom(), | |
gMap.getCenter(), thisLayerID, thisLayerType, | |
thisLayerUrl, thisLayerColor, json_url); | |
} | |
setTimeout(function(){ | |
if(currZoom == activeZoom){ | |
return $.timeline({categoryId: catID, | |
startTime: new Date(startDate * 1000), | |
endTime: new Date(endDate * 1000), | |
mediaType: mediaType | |
}).addMarkers( | |
startDate, endDate, gMap.getZoom(), | |
gMap.getCenter(), thisLayerID, thisLayerType, | |
thisLayerUrl, thisLayerColor, json_url); | |
}else{ | |
return true; | |
} | |
}, timeout); | |
} | |
/** | |
* Display loader as Map Loads | |
*/ | |
function onMapStartLoad(event) | |
{ | |
if ($("#loader")) | |
{ | |
$("#loader").show(); | |
} | |
if ($("#OpenLayers\\.Control\\.LoadingPanel_4")) | |
{ | |
$("#OpenLayers\\.Control\\.LoadingPanel_4").show(); | |
} | |
} | |
/** | |
* Hide Loader | |
*/ | |
function onMapEndLoad(event) | |
{ | |
if ($("#loader")) | |
{ | |
$("#loader").hide(); | |
} | |
if ($("#OpenLayers\\.Control\\.LoadingPanel_4")) | |
{ | |
$("#OpenLayers\\.Control\\.LoadingPanel_4").hide(); | |
} | |
} | |
/** | |
* Close Popup | |
*/ | |
function onPopupClose(event) | |
{ | |
selectControl.unselect(selectedFeature); | |
selectedFeature = null; | |
} | |
/** | |
* Display popup when feature selected | |
*/ | |
function onFeatureSelect(event) | |
{ | |
selectedFeature = event.feature; | |
zoom_point = event.feature.geometry.getBounds().getCenterLonLat(); | |
lon = zoom_point.lon; | |
lat = zoom_point.lat; | |
var thumb = ""; | |
if ( typeof(event.feature.attributes.thumb) != 'undefined' && | |
event.feature.attributes.thumb != '') | |
{ | |
thumb = "<div class=\"infowindow_image\"><a href='"+event.feature.attributes.link+"'>"; | |
thumb += "<img src=\""+event.feature.attributes.thumb+"\" height=\"59\" width=\"89\" /></a></div>"; | |
} | |
var content = "<div class=\"infowindow\">" + thumb; | |
content += "<div class=\"infowindow_content\"><div class=\"infowindow_list\">"+event.feature.attributes.name+"</div>"; | |
content += "\n<div class=\"infowindow_meta\">"; | |
if ( typeof(event.feature.attributes.link) != 'undefined' && | |
event.feature.attributes.link != '') | |
{ | |
content += "<a href='"+event.feature.attributes.link+"'>More Information</a><br/>"; | |
} | |
content += "<a href='javascript:zoomToSelectedFeature("+ lon + ","+ lat +",1)'>"; | |
content += "Zoom In</a>"; | |
content += " | "; | |
content += "<a href='javascript:zoomToSelectedFeature("+ lon + ","+ lat +",-1)'>"; | |
content += "Zoom Out</a></div>"; | |
content += "</div><div style=\"clear:both;\"></div></div>"; | |
if (content.search("<script") != -1) | |
{ | |
content = "Content contained Javascript! Escaped content below.<br />" + content.replace(/</g, "<"); | |
} | |
// Destroy existing popups before opening a new one | |
if (event.feature.popup != null) | |
{ | |
map.removePopup(event.feature.popup); | |
} | |
popup = new OpenLayers.Popup.FramedCloud("chicken", | |
event.feature.geometry.getBounds().getCenterLonLat(), | |
new OpenLayers.Size(100,100), | |
content, | |
null, true, onPopupClose); | |
event.feature.popup = popup; | |
map.addPopup(popup); | |
} | |
/** | |
* Destroy Popup Layer | |
*/ | |
function onFeatureUnselect(event) | |
{ | |
// Safety check | |
if (event.feature.popup != null) | |
{ | |
map.removePopup(event.feature.popup); | |
event.feature.popup.destroy(); | |
event.feature.popup = null; | |
} | |
} | |
// Refactor Clusters On Zoom | |
// *** Causes the map to load json twice on the first go | |
// *** Need to fix this! | |
function mapZoom(event) | |
{ | |
// Prevent this event from running on the first load | |
if (mapLoad > 0) | |
{ | |
// Get Current Category | |
currCat = $("#currentCat").val(); | |
// Get Current Start Date | |
currStartDate = $("#startDate").val(); | |
// Get Current End Date | |
currEndDate = $("#endDate").val(); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// Refresh Map | |
addMarkers(currCat, currStartDate, currEndDate, currZoom, currCenter); | |
} | |
} | |
function mapMove(event) | |
{ | |
// Prevent this event from running on the first load | |
if (mapLoad > 0) | |
{ | |
// Get Current Category | |
currCat = $("#currentCat").val(); | |
// Get Current Start Date | |
currStartDate = $("#startDate").val(); | |
// Get Current End Date | |
currEndDate = $("#endDate").val(); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// Part of #2168 fix | |
// Remove the KML overlays | |
if (kmlOverlays.length > 0) | |
{ | |
for (var i = 0; i < kmlOverlays.length; i++) | |
{ | |
map.removeLayer(kmlOverlays[i]); | |
} | |
} | |
// Refresh Map | |
addMarkers(currCat, currStartDate, currEndDate, currZoom, currCenter, gMediaType); | |
// Part of #2168 fix | |
// E.Kala <emmanuel(at)ushahidi.com> | |
// Add back the KML overlays | |
/* | |
- The timout is so that the cluster markers are given time to load before | |
- the overlays can be rendered | |
*/ | |
setTimeout( | |
function() | |
{ | |
if (kmlOverlays.length > 0) | |
{ | |
for (var i = 0; i < kmlOverlays.length; i++) | |
{ | |
kmlItem = kmlOverlays[i]; | |
map.addLayer(kmlItem); | |
// Add feature selection events to the last item | |
if (i == kmlOverlays.length -1) | |
{ | |
selectControl = new OpenLayers.Control.SelectFeature(kmlItem); | |
map.addControl(selectControl); | |
selectControl.activate(); | |
kmlItem.events.on({ | |
"featureselected": onFeatureSelect, | |
"featureunselected": onFeatureUnselect | |
}); | |
} | |
} | |
} | |
}, | |
timeout | |
); | |
} | |
} | |
/** | |
* Display info window for checkin data | |
*/ | |
function showCheckinData(event) | |
{ | |
selectedFeature = event.feature; | |
zoom_point = event.feature.geometry.getBounds().getCenterLonLat(); | |
lon = zoom_point.lon; | |
lat = zoom_point.lat; | |
var content = "<div class=\"infowindow\" style=\"color:#000000\"><div class=\"infowindow_list\">"; | |
if(event.feature.attributes.ci_media_medium !== "") | |
{ | |
content += "<a href=\""+event.feature.attributes.ci_media_link+"\" rel=\"lightbox-group1\" title=\""+event.feature.attributes.ci_msg+"\">"; | |
content += "<img src=\""+event.feature.attributes.ci_media_medium+"\" /><br/>"; | |
} | |
content += event.feature.attributes.ci_msg+"</div><div style=\"clear:both;\"></div>"; | |
content += "\n<div class=\"infowindow_meta\">"; | |
content += "<a href='javascript:zoomToSelectedFeature("+ lon + ","+ lat +",1)'>Zoom In</a>"; | |
content += " | "; | |
content += "<a href='javascript:zoomToSelectedFeature("+ lon + ","+ lat +",-1)'>Zoom Out</a></div>"; | |
content += "</div>"; | |
if (content.search("<script") != -1) | |
{ | |
content = "Content contained Javascript! Escaped content below.<br />" + content.replace(/</g, "<"); | |
} | |
popup = new OpenLayers.Popup.FramedCloud("chicken", | |
event.feature.geometry.getBounds().getCenterLonLat(), | |
new OpenLayers.Size(100,100), | |
content, | |
null, true, onPopupClose); | |
event.feature.popup = popup; | |
map.addPopup(popup); | |
} | |
/** | |
* Display Checkin Points | |
* Note: This function totally ignores the timeline | |
*/ | |
function showCheckins() | |
{ | |
$(document).ready(function(){ | |
var ci_styles = new OpenLayers.StyleMap({ | |
"default": new OpenLayers.Style({ | |
pointRadius: "5", // sized according to type attribute | |
fillColor: "${fillcolor}", | |
strokeColor: "${strokecolor}", | |
fillOpacity: "${fillopacity}", | |
strokeOpacity: 0.75, | |
strokeWidth: 1.5 | |
}) | |
}); | |
var checkinLayer = new OpenLayers.Layer.Vector('Checkins', {styleMap: ci_styles}); | |
map.addLayers([checkinLayer]); | |
highlightCtrl = new OpenLayers.Control.SelectFeature(checkinLayer, { | |
hover: true, | |
highlightOnly: true, | |
renderIntent: "temporary" | |
}); | |
map.addControl(highlightCtrl); | |
highlightCtrl.activate(); | |
selectControl = new OpenLayers.Control.SelectFeature([checkinLayer,markers]); | |
map.addControl(selectControl); | |
selectControl.activate(); | |
checkinLayer.events.on({ | |
"featureselected": showCheckinData, | |
"featureunselected": onFeatureUnselect | |
}); | |
$.getJSON("http://ushahidi.osx/api/?task=checkin&action=get_ci&mapdata=1&sqllimit=1000&orderby=checkin.checkin_date&sort=ASC", function(data) { | |
var user_colors = new Array(); | |
// Get colors | |
$.each(data["payload"]["users"], function(i, payl) { | |
user_colors[payl.id] = payl.color; | |
}); | |
// Get checkins | |
$.each(data["payload"]["checkins"], function(key, ci) { | |
var cipoint = new OpenLayers.Geometry.Point(parseFloat(ci.lon), parseFloat(ci.lat)); | |
cipoint.transform(proj_4326, proj_900913); | |
var media_link = ''; | |
var media_medium = ''; | |
var media_thumb = ''; | |
if(ci.media === undefined) | |
{ | |
// No image | |
} | |
else | |
{ | |
// Image! | |
media_link = ci.media[0].link; | |
media_medium = ci.media[0].medium; | |
media_thumb = ci.media[0].thumb; | |
} | |
var checkinPoint = new OpenLayers.Feature.Vector(cipoint, { | |
fillcolor: "#"+user_colors[ci.user], | |
strokecolor: "#FFFFFF", | |
fillopacity: ci.opacity, | |
ci_id: ci.id, | |
ci_msg: ci.msg, | |
ci_media_link: media_link, | |
ci_media_medium: media_medium, | |
ci_media_thumb: media_thumb | |
}); | |
checkinLayer.addFeatures([checkinPoint]); | |
}); | |
}); | |
}); | |
} | |
/** | |
* Refresh Graph on Slider Change | |
*/ | |
function refreshGraph(startDate, endDate) | |
{ | |
var currentCat = gCategoryId; | |
// refresh graph | |
if (!currentCat || currentCat == '0') | |
{ | |
currentCat = '0'; | |
} | |
var startTime = new Date(startDate * 1000); | |
var endTime = new Date(endDate * 1000); | |
// daily | |
var graphData = ""; | |
// plot hourly incidents when period is within 2 days | |
if ((endTime - startTime) / (1000 * 60 * 60 * 24) <= 3) | |
{ | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat+"?i=hour", function(data) { | |
graphData = data[0]; | |
gTimeline = $.timeline({categoryId: currentCat, | |
startTime: new Date(startDate * 1000), | |
endTime: new Date(endDate * 1000), mediaType: gMediaType, | |
markerOptions: gMarkerOptions, | |
graphData: graphData | |
}); | |
gTimeline.plot(); | |
}); | |
} | |
else if ((endTime - startTime) / (1000 * 60 * 60 * 24) <= 124) | |
{ | |
// weekly if period > 2 months | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat+"?i=day", function(data) { | |
graphData = data[0]; | |
gTimeline = $.timeline({categoryId: currentCat, | |
startTime: new Date(startDate * 1000), | |
endTime: new Date(endDate * 1000), mediaType: gMediaType, | |
markerOptions: gMarkerOptions, | |
graphData: graphData | |
}); | |
gTimeline.plot(); | |
}); | |
} | |
else if ((endTime - startTime) / (1000 * 60 * 60 * 24) > 124) | |
{ | |
// monthly if period > 4 months | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat, function(data) { | |
graphData = data[0]; | |
gTimeline = $.timeline({categoryId: currentCat, | |
startTime: new Date(startDate * 1000), | |
endTime: new Date(endDate * 1000), mediaType: gMediaType, | |
markerOptions: gMarkerOptions, | |
graphData: graphData | |
}); | |
gTimeline.plot(); | |
}); | |
} | |
// Get dailyGraphData for All Categories | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat+"?i=day", function(data) { | |
dailyGraphData = data[0]; | |
}); | |
// Get allGraphData for All Categories | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat, function(data) { | |
allGraphData = data[0]; | |
}); | |
} | |
/** | |
* Zoom to Selected Feature from within Popup | |
*/ | |
function zoomToSelectedFeature(lon, lat, zoomfactor) | |
{ | |
var lonlat = new OpenLayers.LonLat(lon,lat); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// New Zoom | |
newZoom = currZoom + zoomfactor; | |
// Center and Zoom | |
map.setCenter(lonlat, newZoom); | |
// Remove Popups | |
for (var i=0; i<map.popups.length; ++i) | |
{ | |
map.removePopup(map.popups[i]); | |
} | |
} | |
/* | |
Zoom to Selected Feature from outside Popup | |
*/ | |
function externalZeroIn(lon, lat, newZoom, cipopup) | |
{ | |
var point = new OpenLayers.LonLat(lon,lat); | |
point.transform(proj_4326, map.getProjectionObject()); | |
// Center and Zoom | |
map.setCenter(point, newZoom); | |
if (cipopup === undefined) | |
{ | |
// A checkin id was not passed so we won't bother showing the info window | |
} | |
else | |
{ | |
// An id was passed, so lets show an info window | |
// TODO: Do this. | |
} | |
} | |
/* | |
Add KML/KMZ Layers | |
*/ | |
function switchLayer(layerID, layerURL, layerColor) | |
{ | |
if ( $("#layer_" + layerID).hasClass("active") ) | |
{ | |
new_layer = map.getLayersByName("Layer_"+layerID); | |
if (new_layer) | |
{ | |
for (var i = 0; i < new_layer.length; i++) | |
{ | |
map.removeLayer(new_layer[i]); | |
} | |
// Part of #2168 fix | |
// Added by E.Kala <emmanuel(at)ushahidi.com> | |
// Remove the layer from the list of KML overlays - kmlOverlays | |
if (kmlOverlays.length == 1) | |
{ | |
kmlOverlays.pop(); | |
} | |
else if (kmlOverlays.length > 1) | |
{ | |
// Temporarily store the current list of overlays | |
tempKmlOverlays = kmlOverlays; | |
// Re-initialize the list of overlays | |
kmlOverlays = []; | |
// Search for the overlay that has just been removed from display | |
for (var i = 0; i < tempKmlOverlays.length; i ++) | |
{ | |
if (tempKmlOverlays[i].name != "Layer_"+layerID) | |
{ | |
kmlOverlays.push(tempKmlOverlays[i]); | |
} | |
} | |
// Unset the working list | |
tempKmlOverlays = null; | |
} | |
} | |
$("#layer_" + layerID).removeClass("active"); | |
} | |
else | |
{ | |
$("#layer_" + layerID).addClass("active"); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// Add New Layer | |
addMarkers('', '', '', currZoom, currCenter, '', layerID, 'layers', layerURL, layerColor); | |
} | |
} | |
/** | |
* Toggle Layer Switchers | |
*/ | |
function toggleLayer(link, layer) | |
{ | |
if ($("#"+link).text() == "Show") | |
{ | |
$("#"+link).text("Hide"); | |
} | |
else | |
{ | |
$("#"+link).text("Show"); | |
} | |
$('#'+layer).toggle(500); | |
} | |
/** | |
* Create a function that calculates the smart columns | |
*/ | |
function smartColumns() | |
{ | |
//Reset column size to a 100% once view port has been adjusted | |
$("ul.content-column").css({ 'width' : "100%"}); | |
var colWrap = $("ul.content-column").width(); //Get the width of row | |
//var colNum = Math.floor(colWrap / 460); //Find how many columns of 200px can fit per row / then round it down to a whole number | |
var colNum = 2; | |
var colFixed = Math.floor(colWrap / colNum); //Get the width of the row and divide it by the number of columns it can fit / then round it down to a whole number. This value will be the exact width of the re-adjusted column | |
$("ul.content-column").css({ 'width' : colWrap}); //Set exact width of row in pixels instead of using % - Prevents cross-browser bugs that appear in certain view port resolutions. | |
$("ul.content-column li").css({ 'width' : colFixed}); //Set exact width of the re-adjusted column | |
} | |
jQuery(function() { | |
var map_layer; | |
markers = null; | |
var catID = ''; | |
OpenLayers.Strategy.Fixed.prototype.preload=true; | |
/* | |
- Initialize Map | |
- Uses Spherical Mercator Projection | |
- Units in Metres instead of Degrees | |
*/ | |
var options = { | |
units: "mi", | |
numZoomLevels: 18, | |
controls:[], | |
projection: proj_900913, | |
'displayProjection': proj_4326, | |
eventListeners: { | |
"zoomend": mapMove | |
}, | |
'theme': null | |
}; | |
map = new OpenLayers.Map('map', options); | |
map.addControl( new OpenLayers.Control.LoadingPanel({minSize: new OpenLayers.Size(573, 366)}) ); | |
var google_satellite = new OpenLayers.Layer.Google("Google Maps Satellite", { | |
type: google.maps.MapTypeId.SATELLITE, | |
sphericalMercator: true, | |
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34)}); | |
var google_hybrid = new OpenLayers.Layer.Google("Google Maps Hybrid", { | |
type: google.maps.MapTypeId.HYBRID, | |
sphericalMercator: true, | |
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34)}); | |
var google_normal = new OpenLayers.Layer.Google("Google Maps Normal", { | |
sphericalMercator: true, | |
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34)}); | |
var google_physical = new OpenLayers.Layer.Google("Google Maps Physical", { | |
type: google.maps.MapTypeId.TERRAIN, | |
sphericalMercator: true, | |
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34)}); | |
map.addLayers([google_satellite,google_hybrid,google_normal,google_physical]); | |
// Add Controls | |
map.addControl(new OpenLayers.Control.Navigation()); | |
map.addControl(new OpenLayers.Control.Attribution()); | |
map.addControl(new OpenLayers.Control.PanZoomBar()); | |
map.addControl(new OpenLayers.Control.MousePosition( | |
{ | |
div: document.getElementById('mapMousePosition'), | |
numdigits: 5 | |
})); | |
map.addControl(new OpenLayers.Control.Scale('mapScale')); | |
map.addControl(new OpenLayers.Control.ScaleLine()); | |
map.addControl(new OpenLayers.Control.LayerSwitcher()); | |
// display the map projection | |
document.getElementById('mapProjection').innerHTML = map.projection; | |
gMap = map; | |
// Category Switch Action | |
$("a[id^='cat_']").click(function() | |
{ | |
var catID = this.id.substring(4); | |
var catSet = 'cat_' + this.id.substring(4); | |
$("a[id^='cat_']").removeClass("active"); // Remove All active | |
$("[id^='child_']").hide(); // Hide All Children DIV | |
$("#cat_" + catID).addClass("active"); // Add Highlight | |
$("#child_" + catID).show(); // Show children DIV | |
$(this).parents("div").show(); | |
currentCat = catID; | |
$("#currentCat").val(catID); | |
// setUrl not supported with Cluster Strategy | |
//markers.setUrl("http://ushahidi.osx/" json_url + '/?c=' + catID); | |
// Destroy any open popups | |
if (selectedFeature) { | |
onPopupClose(); | |
}; | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
gCategoryId = catID; | |
var startTime = new Date($("#startDate").val() * 1000); | |
var endTime = new Date($("#endDate").val() * 1000); | |
addMarkers(catID, $("#startDate").val(), $("#endDate").val(), currZoom, currCenter, gMediaType); | |
graphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+catID, function(data) { | |
graphData = data[0]; | |
gTimeline = $.timeline({categoryId: catID, startTime: startTime, endTime: endTime, | |
graphData: graphData, | |
mediaType: gMediaType | |
}); | |
gTimeline.plot(); | |
}); | |
dailyGraphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+catID+"?i=day", function(data) { | |
dailyGraphData = data[0]; | |
}); | |
allGraphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat, function(data) { | |
allGraphData = data[0]; | |
}); | |
return false; | |
}); | |
// Sharing Layer[s] Switch Action | |
$("a[id^='share_']").click(function() | |
{ | |
var shareID = this.id.substring(6); | |
if ( $("#share_" + shareID).hasClass("active") ) | |
{ | |
share_layer = map.getLayersByName("Share_"+shareID); | |
if (share_layer) | |
{ | |
for (var i = 0; i < share_layer.length; i++) | |
{ | |
map.removeLayer(share_layer[i]); | |
} | |
} | |
$("#share_" + shareID).removeClass("active"); | |
} | |
else | |
{ | |
$("#share_" + shareID).addClass("active"); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// Add New Layer | |
addMarkers('', '', '', currZoom, currCenter, '', shareID, 'shares'); | |
} | |
}); | |
// Exit if we don't have any incidents | |
if (!$("#startDate").val()) | |
{ | |
map.setCenter(new OpenLayers.LonLat(25.219888682471, 1.5249115531142), 5); | |
return; | |
} | |
//Accessible Slider/Select Switch | |
$("select#startDate, select#endDate").selectToUISlider({ | |
labels: 4, | |
labelSrc: 'text', | |
sliderOptions: { | |
change: function(e, ui) | |
{ | |
var startDate = $("#startDate").val(); | |
var endDate = $("#endDate").val(); | |
var currentCat = gCategoryId; | |
// Get Current Category | |
currCat = currentCat; | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// If we're in a month date range, switch to | |
// non-clustered mode. Default interval is monthly | |
var startTime = new Date(startDate * 1000); | |
var endTime = new Date(endDate * 1000); | |
if ((endTime - startTime) / (1000 * 60 * 60 * 24) <= 32) | |
{ | |
json_url = "json"; | |
} | |
else | |
{ | |
json_url = default_json_url; | |
} | |
// Refresh Map | |
addMarkers(currCat, startDate, endDate, '', '', gMediaType); | |
refreshGraph(startDate, endDate); | |
} | |
} | |
}); | |
var startTime = 1317394800; // Default to most active month | |
var endTime = 1320073199; // Default to most active month | |
// get the closest existing dates in the selection options | |
options = $('#startDate > optgroup > option').map(function() | |
{ | |
return $(this).val(); | |
}); | |
//figure out what time is the greatest time, that is less than the startTime | |
var foundStartTime = false; | |
for(i = 1; i < options.length; i++) | |
{ | |
var time = parseInt(options[i]); | |
if(time == startTime) | |
{ | |
foundStartTime = true; | |
break; | |
} | |
else if(time > startTime) | |
{ | |
startTime = options[i-1]; | |
foundStartTime = true; | |
break; | |
} | |
} | |
//if the original start time is after the last option date | |
if(!foundStartTime) | |
{ | |
startTime = options[options.length-1]; | |
} | |
options = $('#endDate > optgroup > option').map(function() | |
{ | |
return $(this).val(); | |
}); | |
endTime = $.grep(options, function(n,i) | |
{ | |
return parseInt(n) >= endTime ; | |
})[0]; | |
gCategoryId = '0'; | |
gMediaType = 0; | |
//$("#startDate").val(startTime); | |
//$("#endDate").val(endTime); | |
// Initialize Map | |
addMarkers(gCategoryId, startTime, endTime, '', '', gMediaType); | |
refreshGraph(startTime, endTime); | |
// Media Filter Action | |
$('.filters li a').click(function() | |
{ | |
// Destroy any open popups | |
if (selectedFeature) { | |
onPopupClose(); | |
}; | |
var startTimestamp = $("#startDate").val(); | |
var endTimestamp = $("#endDate").val(); | |
var startTime = new Date(startTimestamp * 1000); | |
var endTime = new Date(endTimestamp * 1000); | |
gMediaType = parseFloat(this.id.replace('media_', '')) || 0; | |
currentCat = $("#currentCat").val(); | |
// Get Current Zoom | |
currZoom = map.getZoom(); | |
// Get Current Center | |
currCenter = map.getCenter(); | |
// Refresh Map | |
addMarkers(currentCat, startTimestamp, endTimestamp, | |
currZoom, currCenter, gMediaType); | |
$('.filters li a').attr('class', ''); | |
$(this).addClass('active'); | |
graphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat, function(data) { | |
graphData = data[0]; | |
gTimeline = $.timeline({categoryId: currentCat, startTime: startTime, endTime: endTime, | |
graphData: graphData, | |
mediaType: gMediaType | |
}); | |
gTimeline.plot(); | |
}); | |
dailyGraphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat+"?i=day", function(data) { | |
dailyGraphData = data[0]; | |
}); | |
allGraphData = ""; | |
$.getJSON("http://ushahidi.osx/json/timeline/"+currentCat, function(data) { | |
allGraphData = data[0]; | |
}); | |
return false; | |
}); | |
$('#playTimeline').click(function() | |
{ | |
gTimelineMarkers = gTimeline.addMarkers(gStartTime.getTime()/1000, | |
$.dayEndDateTime(gEndTime.getTime()/1000), gMap.getZoom(), | |
gMap.getCenter(),null,null,null,null,"json"); | |
gTimeline.playOrPause('raindrops'); | |
}); | |
smartColumns();//Execute the function when page loads | |
}); | |
$(window).resize(function () | |
{ //Each time the viewport is adjusted/resized, execute the function | |
smartColumns(); | |
}); | |
function cilisting(sqllimit,sqloffset) { | |
jsonurl = "http://ushahidi.osx/api/?task=checkin&action=get_ci&sqllimit="+sqllimit+"&sqloffset="+sqloffset+"&orderby=checkin.checkin_date&sort=DESC"; | |
var showncount = 0; | |
$.getJSON(jsonurl, function(data) { | |
if(data.payload.checkins == undefined) | |
{ | |
if(sqloffset != 0) | |
{ | |
var newoffset = sqloffset - sqllimit; | |
$('div#cilist').html("<div style=\"text-align:center;\">No checkins to display.<br/><br/><a href=\"javascript:cilisting("+sqllimit+","+newoffset+");\"><< Previous</a></div>"); | |
}else{ | |
$('div#cilist').html("<div style=\"text-align:center;\">No checkins to display.</div>"); | |
} | |
return; | |
} | |
$('div#cilist').html(""); | |
var user_colors = new Array(); | |
// Get colors | |
$.each(data.payload.users, function(i, payl) { | |
user_colors[payl.id] = payl.color; | |
}); | |
$.each(data.payload.checkins, function(i,item){ | |
if(i == 0) | |
{ | |
$('div#cilist').append("<div class=\"ci_checkin\" class=\"ci_id_"+item.id+"\"style=\"border:none\"><a name=\"ci_id_"+item.id+"\" />"); | |
}else{ | |
$('div#cilist').append("<div class=\"ci_checkin\" class=\"ci_id_"+item.id+"\" style=\"padding-bottom:5px;margin-bottom:5px;\"><a name=\"ci_id_"+item.id+"\" />"); | |
} | |
if(item.media === undefined) | |
{ | |
// Tint the color a bit | |
$('div#cilist').append("<div class=\"ci_colorblock ci_shorterblock\" style=\"background-color:#"+user_colors[item.user]+";\"><div class=\"ci_colorfade\"></div></div>"); | |
}else{ | |
// Show image | |
$('div#cilist').append("<div class=\"ci_colorblock ci_tallerblock\" style=\"background-color:#"+user_colors[item.user]+";\"><div class=\"ci_imgblock\"><a href=\""+item.media[0].link+"\" rel=\"lightbox-group1\" title=\""+item.msg+"\"><img src=\""+item.media[0].thumb+"\" height=\"59\" /></a></div></div>"); | |
} | |
$('div#cilist').append("<div style=\"float:right;width:24px;height:24px;margin-right:10px;\"><a class=\"ci_moredetails\" reportid=\""+item.id+"\" href=\"javascript:externalZeroIn("+item.lon+","+item.lat+",16,"+item.id+");\"><img src=\"http://ushahidi.osx/media/img/pin_trans.png\" width=\"24\" height=\"24\" /></a></div>"); | |
$.each(data.payload.users, function(j,useritem){ | |
if(useritem.id == item.user){ | |
$('div#cilist').append("<div style=\"font-size:14px;width:215px;padding-top:0px;\"><a href=\"http://ushahidi.osx/profile/user/"+useritem.username+"\">"+useritem.name+"</a></div>"); | |
} | |
}); | |
var utcDate = item.date.replace(" ","T")+"Z"; | |
if(item.msg == "") | |
{ | |
$('div#cilist').append("<div class=\"ci_cimsg\"><small><em>"+$.timeago(utcDate)+"</em></small></div>"); | |
}else{ | |
$('div#cilist').append("<div class=\"ci_cimsg\">"+item.msg+"<br/><small><em>"+$.timeago(utcDate)+"</em></small></div>"); | |
} | |
if(item.comments !== undefined) | |
{ | |
var user_link = ''; | |
var comment_utcDate = ''; | |
$.each(item.comments, function(j,comment){ | |
comment_utcDate = comment.date.replace(" ","T")+"Z"; | |
if(item.user_id != 0){ | |
user_link = '<a href=\"http://ushahidi.osx/profile/user/'+comment.username+'\">'+comment.author+'</a>'; | |
}else{ | |
user_link = ''+comment.author+''; | |
} | |
$('div#cilist').append("<div style=\"clear:both\"></div>"+user_link+": "+comment.description+" <small>(<em>"+$.timeago(comment_utcDate)+"</em>)</small></div>"); | |
}); | |
} | |
$('div#cilist').append("<div style=\"clear:both\"></div></div>"); | |
showncount = showncount + 1; | |
}); | |
// Show previous link | |
if(sqloffset == 0) | |
{ | |
$('div#cilist').append("<div style=\"float:left;\"><< Previous</div>"); | |
}else{ | |
var newoffset = sqllimit - sqloffset; | |
$('div#cilist').append("<div style=\"float:left;\"><a href=\"javascript:cilisting("+sqllimit+","+newoffset+");\"><< Previous</a></div>"); | |
} | |
// Show next link | |
if(showncount != sqllimit) | |
{ | |
$('div#cilist').append("<div style=\"float:right;\">Next >></div>"); | |
}else{ | |
var newoffset = sqloffset + sqllimit; | |
$('div#cilist').append("<div style=\"float:right;\"><a href=\"javascript:cilisting("+sqllimit+","+newoffset+");\">Next >></a></div>"); | |
} | |
$('div#cilist').append("<div style=\"clear:both\"></div>"); | |
}); | |
} | |
cilisting(3,0); | |
showCheckins(); | |
//--> | |
</script> </head> | |
<body id="page" class="page-main" /> <!-- wrapper --> | |
<div class="rapidxwpr floatholder"> | |
<!-- header --> | |
<div id="header"> | |
<!-- searchbox --> | |
<div id="searchbox"> | |
<!-- user actions --> | |
<div id="loggedin_user_action" class="clearingfix"> | |
<a href="http://ushahidi.osx/admin">admin</a> [<a href="http://ushahidi.osx/logout/front">Logout</a>] | |
</div><br/> | |
<!-- / user actions --> | |
<!-- languages --> | |
<div class="language-box"><form action=""><select id="l" name="l" onchange="this.form.submit()" > | |
<option value="en_US" selected="selected">English (US)</option> | |
<option value="fr_FR">Français (FR)</option> | |
</select></form></div> <!-- / languages --> | |
<!-- searchform --> | |
<div class="search-form"><form method="get" id="search" action="http://ushahidi.osx/search/"><ul><li><input type="text" name="k" value="" class="text" /></li><li><input type="submit" name="b" class="searchbtn" value="SEARCH" /></li></ul></form></div> <!-- / searchform --> | |
</div> | |
<!-- / searchbox --> | |
<!-- logo --> | |
<div id="logo"> | |
<h1><a href="http://ushahidi.osx/">Local Ushahidi Deployment</a></h1> | |
<span>blah blah blah</span> | |
</div> | |
<!-- / logo --> | |
<!-- submit incident --> | |
<div class="submit-incident clearingfix"><a href="http://ushahidi.osx/reports/submit">Submit a Report</a></div> <!-- / submit incident --> | |
</div> | |
<!-- / header --> | |
<!-- main body --> | |
<div id="middle"> | |
<div class="background layoutleft"> | |
<!-- mainmenu --> | |
<div id="mainmenu" class="clearingfix"> | |
<ul> | |
<li><a href="http://ushahidi.osx/main" class="active">Home</a></li><li><a href="http://ushahidi.osx/reports" >Reports</a></li><li><a href="http://ushahidi.osx/reports/submit" >Submit a Report</a></li><li><a href="http://ushahidi.osx/contact" >Contact Us</a></li> </ul> | |
<div style="float:right;"><a href="http://ushahidi.osx/feed/"><img src="http://ushahidi.osx/media/img/icon-feed.png" style="vertical-align: middle;" border="0"></a></div> | |
</div> | |
<!-- / mainmenu --> | |
<!-- main body --> | |
<div id="main" class="clearingfix"> | |
<div id="mainmiddle" class="floatbox withright"> | |
<!-- right column --> | |
<div id="right" class="clearingfix"> | |
<!-- category filters --> | |
<div class="cat-filters clearingfix"> | |
<strong>Category Filter <span>[<a href="javascript:toggleLayer('category_switch_link', 'category_switch')" id="category_switch_link">Hide</a>]</span></strong> | |
</div> | |
<ul id="category_switch" class="category-filters"> | |
<li><a class="active" id="cat_0" href="#"><span class="swatch" style="background-color:#CC0000"></span><span class="category-title">All Categories</span></a></li> | |
<li><a href="#" id="cat_1"><span ><img src="http://ushahidi.osx/media/uploads/category_1_1314242777.png" style="float:left;padding-right:5px;" /></span><span class="category-title">Category 1</span></a><div class="hide" id="child_1"></div></li><li><a href="#" id="cat_2"><span class="swatch" style="background-color:#3300FF"></span><span class="category-title">Category 2</span></a><div class="hide" id="child_2"></div></li><li><a href="#" id="cat_3"><span class="swatch" style="background-color:#663300"></span><span class="category-title">Category 3</span></a><div class="hide" id="child_3"></div></li> </ul> | |
<!-- / category filters --> | |
<!-- Layers (KML/KMZ) --> | |
<div class="cat-filters clearingfix" style="margin-top:20px;"> | |
<strong>Other Layers <span>[<a href="javascript:toggleLayer('kml_switch_link', 'kml_switch')" id="kml_switch_link">Hide</a>]</span></strong> | |
</div> | |
<ul id="kml_switch" class="category-filters"> | |
<li><a href="#" id="layer_1" | |
onclick="switchLayer('1','http://ushahidi.osx/media/uploads/1323915647test.kml','c946c9'); return false;"><div class="swatch" style="background-color:#c946c9"></div> | |
<div>Test</div></a></li><li><a href="#" id="layer_2" | |
onclick="switchLayer('2','https://c767056.ssl.cf2.rackcdn.com/cordonindustrialrosario/1318962648Transito_sustancias_peligrosas.kml','2abd2a'); return false;"><div class="swatch" style="background-color:#2abd2a"></div> | |
<div>From URL</div></a></li> </ul> | |
<!-- /Layers --> | |
<br /> | |
<!-- additional content --> | |
<div class="additional-content"> | |
<h5>How to Report</h5> | |
<div> | |
<!-- Phone --> | |
<!-- External Apps --> | |
<div style="margin-bottom:10px;"> | |
<strong>By using an app:</strong><br/> | |
<a href="http://download.ushahidi.com/track_download.php?download=ios">iPhone</a><br/> | |
<a href="http://download.ushahidi.com/track_download.php?download=android">Android</a><br/> | |
</div> | |
<!-- Email --> | |
<!-- Twitter --> | |
<div style="margin-bottom:10px;"> | |
<strong>By sending a tweet with the hashtag/s:</strong><br/> | |
<span>#ushahidi</span> | |
</div> | |
<!-- Web Form --> | |
<div style="margin-bottom:10px;"> | |
<a href="http://ushahidi.osx/reports/submit/">By filling this form on our website.</a> | |
</div> | |
</div> | |
</div> | |
<!-- / additional content --> | |
<!-- Checkins --> | |
<br/> | |
<div class="additional-content"> | |
<h5>Checkins</h5> | |
<div id="cilist"></div> | |
</div> | |
<!-- /Checkins --> | |
</div> | |
<!-- / right column --> | |
<!-- content column --> | |
<div id="content" class="clearingfix"> | |
<div class="floatbox"> | |
<!-- filters --> | |
<div class="filters clearingfix"> | |
<div style="float:left; width: 100%"> | |
<strong>Filters</strong> | |
<ul> | |
<li><a id="media_0" class="active" href="#"><span>Reports</span></a></li> | |
<li><a id="media_4" href="#"><span>News</span></a></li> | |
<li><a id="media_1" href="#"><span>Pictures</span></a></li> | |
<li><a id="media_2" href="#"><span>Video</span></a></li> | |
<li><a id="media_0" href="#"><span>All</span></a></li> | |
</ul> | |
</div> | |
</div> | |
<!-- / filters --> | |
<!-- map --> | |
<div class="map" id="map"></div> | |
<div style="clear:both;"></div> | |
<div id="mapStatus"> | |
<div id="mapScale" style="border-right: solid 1px #999"></div> | |
<div id="mapMousePosition" style="min-width: 135px;border-right: solid 1px #999;text-align: center"></div> | |
<div id="mapProjection" style="border-right: solid 1px #999"></div> | |
<div id="mapOutput"></div> | |
</div> | |
<div style="clear:both;"></div> | |
<!-- / map --><div class="slider-holder"> | |
<form action=""> | |
<input type="hidden" value="0" name="currentCat" id="currentCat"/> | |
<fieldset> | |
<div class="play"><a href="#" id="playTimeline">Play</a></div> | |
<label for="startDate">From:</label> | |
<select name="startDate" id="startDate"><optgroup label="2011"><option value="1317394800" selected="selected" >Oct 2011</option></optgroup></select> | |
<label for="endDate">to:</label> | |
<select name="endDate" id="endDate"><optgroup label="2011"><option value="1320073199" selected="selected" >Oct 2011</option></optgroup></select> | |
</fieldset> | |
</form> | |
</div> | |
<div id="graph" class="graph-holder"></div> </div> | |
</div> | |
<!-- / content column --> | |
</div> | |
</div> | |
<!-- / main body --> | |
<!-- content --> | |
<div class="content-container"> | |
<!-- content blocks --> | |
<div class="content-blocks clearingfix"> | |
<ul class="content-column"> | |
</ul> | |
</div> | |
<!-- /content blocks --> | |
</div> | |
<!-- content --> | |
</div> | |
</div> | |
<!-- / main body --> | |
</div> | |
<!-- / wrapper --> | |
<!-- footer --> | |
<div id="footer" class="clearingfix"> | |
<div id="underfooter"></div> | |
<!-- footer content --> | |
<div class="rapidxwpr floatholder"> | |
<!-- footer credits --> | |
<div class="footer-credits"> | |
Powered by the <a href="http://www.ushahidi.com/"><img src="http://ushahidi.osx/media/img/footer-logo.png" alt="Ushahidi" style="vertical-align:middle" /></a> Platform | |
</div> | |
<!-- / footer credits --> | |
<!-- footer menu --> | |
<div class="footermenu"> | |
<ul class="clearingfix"> | |
<li><a class="item1" href="http://ushahidi.osx/">Home</a></li> | |
<li><a href="http://ushahidi.osx/reports/submit">Submit a Report</a></li> | |
<li><a href="http://ushahidi.osx/contact">Contact Us</a></li> | |
</ul> | |
</div> | |
<!-- / footer menu --> | |
<h2 class="feedback_title" style="clear:both"> | |
<a href="http://feedback.ushahidi.com/fillsurvey.php?sid=2">Provide Feedback</a> | |
</h2> | |
</div> | |
<!-- / footer content --> | |
</div> | |
<!-- / footer --> | |
<!-- Task Scheduler --><script type="text/javascript">$(document).ready(function(){$('#schedulerholder').html('<img src="http://ushahidi.osx/scheduler" />');});</script><div id="schedulerholder"></div><!-- End Task Scheduler --> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment