Difference between revisions of "Widget:GTform"
m |
m (Text replacement - "jquery-1.7.2.min.js" to "jquery-3.4.1.min.js") |
||
| (17 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<includeonly> | <includeonly> | ||
| + | <script src="https://apps.transitunlimited.org/jquery-3.4.1.min.js"></script> | ||
| + | <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> | ||
| + | <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false&key=AIzaSyA1-YSOAtIlnU0ZcufMDLNjEVZDmq7sPh4"></script> | ||
<p id="note"></p> | <p id="note"></p> | ||
<div id="info"> | <div id="info"> | ||
| Line 7: | Line 10: | ||
<br/> | <br/> | ||
<div style="display:inline-block;margin:2px 0 2px 0;"><label>from</label> | <div style="display:inline-block;margin:2px 0 2px 0;"><label>from</label> | ||
| − | <input class="input" id="from" value=""><span id="fromnote" style="display:none;">where I am at</span></div> | + | <input class="input" type="text" id="from" value=""><span id="fromnote" style="display:none;">where I am at</span></div> |
<div style="display:inline-block;margin:2px 0 2px 0;"><label>to</label> | <div style="display:inline-block;margin:2px 0 2px 0;"><label>to</label> | ||
| − | <input class="input" id="to" value=""><span id="tonote" style="display:none;">where I am at</span>.</div> | + | <input class="input" type="text" id="to" value=""><span id="tonote" style="display:none;">where I am at</span>.</div> |
| − | <div style="margin:2px;"> <form id="triptime" style="display:inline;" > | + | <div style="margin:2px;"> |
| + | <form id="triptime" style="display:inline;" > | ||
<input type="radio" name="triptime" value="depart" checked> Departing | <input type="radio" name="triptime" value="depart" checked> Departing | ||
<input type="radio" name="triptime" value="arrive"> arriving at | <input type="radio" name="triptime" value="arrive"> arriving at | ||
| Line 84: | Line 88: | ||
<option value="02:00">2:00 am</option> | <option value="02:00">2:00 am</option> | ||
<option value="02:30">2:30 am</option> | <option value="02:30">2:30 am</option> | ||
| − | + | </select> (time) today or next day or on | |
| + | <input type="text" id="datepicker" size="7"> (date)</div> | ||
<button id="go">Get Transit directions</button> | <button id="go">Get Transit directions</button> | ||
</div> | </div> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
| + | (window.RLQ=window.RLQ||[]).push(function(){ | ||
var nt1 = document.getElementById("note"); | var nt1 = document.getElementById("note"); | ||
var nt2 = document.getElementById("from"); | var nt2 = document.getElementById("from"); | ||
| Line 94: | Line 100: | ||
var nt3 = document.getElementById("to"); | var nt3 = document.getElementById("to"); | ||
var nt3a = document.getElementById("tonote"); | var nt3a = document.getElementById("tonote"); | ||
| + | var tpk1 = document.getElementById("datepicker"); | ||
function resetform() { | function resetform() { | ||
| Line 102: | Line 109: | ||
nt3.style.display = "inline"; | nt3.style.display = "inline"; | ||
nt3.value=""; | nt3.value=""; | ||
| + | tpk1.value=""; | ||
| + | document.getElementById("depart").selectedIndex = 0; | ||
} | } | ||
| Line 119: | Line 128: | ||
zoom:14 | zoom:14 | ||
}); | }); | ||
| − | }, | + | },2000); |
if (ntn.style.display=="none") { | if (ntn.style.display=="none") { | ||
ntn.style.display="inline"; | ntn.style.display="inline"; | ||
| Line 134: | Line 143: | ||
ntxg = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); | ntxg = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); | ||
} | } | ||
| − | |||
| − | + | $(function () { | |
| − | + | $( "#datepicker" ).datepicker(); | |
| + | } ); | ||
| + | |||
var directions = new google.maps.DirectionsService(); | var directions = new google.maps.DirectionsService(); | ||
var renderer = new google.maps.DirectionsRenderer(); | var renderer = new google.maps.DirectionsRenderer(); | ||
| Line 167: | Line 177: | ||
}); | }); | ||
| − | |||
route(); | route(); | ||
} | } | ||
| − | + | function route() { | |
var triptime = $('input[name="triptime"]:checked', '#triptime').val(); | var triptime = $('input[name="triptime"]:checked', '#triptime').val(); | ||
var departure = document.getElementById('depart').value; | var departure = document.getElementById('depart').value; | ||
| + | var tripdate = $('input[id="datepicker"]').datepicker('getDate'); | ||
if (departure=='now') { | if (departure=='now') { | ||
var departureTime = null; | var departureTime = null; | ||
| Line 191: | Line 201: | ||
} | } | ||
| − | + | if (tripdate == null) { | |
| − | var arrivalTime = null; | + | departureTime = new Date(ms); |
| + | arrivalTime = null; | ||
| + | } else { | ||
| + | var datetimestring = new Date(tripdate.getFullYear(), tripdate.getMonth(), tripdate.getDate(), time.getHours(), time.getMinutes(), time.getSeconds()); | ||
| + | departureTime = datetimestring; | ||
| + | arrivalTime = null; | ||
| + | } | ||
| + | |||
if (triptime == 'arrive') { | if (triptime == 'arrive') { | ||
arrivalTime = departureTime; | arrivalTime = departureTime; | ||
| Line 198: | Line 215: | ||
} | } | ||
} | } | ||
| + | |||
var request = { | var request = { | ||
origin: document.getElementById('from').value, | origin: document.getElementById('from').value, | ||
| Line 222: | Line 240: | ||
}); | }); | ||
| − | + | } | |
| − | + | google.maps.event.addDomListener(window, 'load', initialize); | |
| + | }); | ||
</script> | </script> | ||
<div id="transit-wpr"> | <div id="transit-wpr"> | ||
</div> | </div> | ||
</includeonly> | </includeonly> | ||
