<!DOCTYPE html>
<html>
<head>
<script src="http://www.webglearth.com/v2/api.js"></script>
<link data-require="bootstrap@*" data-semver="3.3.2" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" />
<link data-require="bootstrap-css@*" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<script data-require="bootstrap@*" data-semver="3.3.2" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script data-require="jquery@*" data-semver="2.1.3" src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body style='background-color:black;'>
<h1 style='color:white;'>Pr / Pr</h1>
<div id="earth_div" style="width:600px;height:400px;"></div><br>
<button type="button" class="btn btn-info btn-rss-js">Get RSS Feed of Prayer/Praise Info</button>
<button type="button" class="btn btn-info btn-submit-p-js">Submit Prayer/Praise</button>
<form id='submit_prayer_frm'>
<span style='color:white;'>Title:</span> <input type='text' name='p_title'><br>
<span style='color:white;'>Content:</span> <textarea name="p_content"cols="30" rows="4"></textarea><br>
<span style='color:white;'>Content Type:</span><br>
<input type="radio" name="p_type" value="prayer" checked><span style='color:white;'>Prayer</span><br>
<input type="radio" name="p_type" value="praise"><span style='color:white;'>Praise</span>
</form>
</body>
</html>
// Code goes here
$(document).ready(function(){
var earth = new WE.map('earth_div');
window.earth = earth;
WE.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(
earth);
window.WE = WE;
// window.marker = marker;
setInterval(function() {
var c = earth.getPosition();
earth.setCenter([c[0], c[1] + 0.1]);
}, 50);
window.longitude = 0;
window.latitude = 0;
function setPosition(position) {
window.longitude = position.coords.longitude;
window.latitude = position.coords.latitude;
}
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(setPosition);
} else {
alert("Geolocation is not supported by this browser.");
}
$(".btn-submit-p-js").click(function() {
/*
$.ajax({
type:"POST",
url: "www.graysonconsulting.biz:5000/input_p?callback=?", // Send the login info to this page
data: $('#submit_prayer_frm').serializeArray(),
dataType: "jsonp",
timeout: 200000,
jsonpCallback: function(result)
{
alert('success');
}
});
*/
url = "http://www.graysonconsulting.biz:5000/input_p";
$.ajax({
url: url,
type: 'get',
data: $('#submit_prayer_frm').serializeArray(),
dataType: 'jsonp',
success: function(data) {
console.log('hi')
}
});
});
$(".btn-rss-js").click(function(){
$.get('http://www.graysonconsulting.biz/pofp5.rss', function (data) {
$(data).find("entry").each(function () { // or "item" or whatever suits your feed
var el = $(this);
var marker = window.WE.marker([el.find("longitude").text(), el.find("latitude").text()]).addTo(window.earth);
marker.bindPopup("<b>"+el.find("title").text()+"</b><br>"+ el.find("summary").text()+"<br>", {maxWidth: 150, closeButton: true});
console.log("------------------------");
console.log("title : " + el.find("title").text());
console.log("author : " + el.find("author").text());
console.log("description: " + el.find("description").text());
console.log("summary: " + el.find("summary").text());
});
});
});
});
/* Styles go here */