client.js.otp.widgets.tripoptions.TripOptionsWidget.js Maven / Gradle / Ivy
Go to download
Show more of this group Show more artifacts with this name
Show all versions of otp Show documentation
Show all versions of otp Show documentation
The OpenTripPlanner multimodal journey planning system
/* This program is free software: you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public License
as published by the Free Software Foundation, either version 3 of
the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
").appendTo(this.$());
control.doAfterLayout();
this.controls[id] = control;
},
initScrollPanel : function() {
this.scrollPanel = $('').appendTo(this.$());
this.$().resizable({
minHeight: 80,
alsoResize: this.scrollPanel
});
},
addSeparator : function(scrollable) {
var hr = $("
")
if(scrollable) {
if(this.scrollPanel == null) this.initScrollPanel();
hr.appendTo(this.scrollPanel);
}
else {
hr.appendTo(this.$());
}
},
addVerticalSpace : function(pixels, scrollable) {
var vSpace = $('');
if(scrollable) {
if(this.scrollPanel == null) this.initScrollPanel();
vSpace.appendTo(this.scrollPanel);
}
else {
vSpace.appendTo(this.$());
}
},
restorePlan : function(data) {
if(data == null) return;
for(var id in this.controls) {
this.controls[id].restorePlan(data);
}
},
applyQueryParams : function(queryParams) {
this.restorePlan({ queryParams : queryParams });
},
restoreDefaults : function(useCurrentTime) {
var params = _.clone(this.module.defaultQueryParams);
if(useCurrentTime) {
params['date'] = moment().format(otp.config.locale.time.date_format);
params['time'] = moment().format(otp.config.locale.time.time_format);
}
this.applyQueryParams(params);
},
newItinerary : function(itin) {
for(var id in this.controls) {
this.controls[id].newItinerary(itin);
}
},
inputChanged : function(params) {
if(params) _.extend(this.module, params);
if(this.autoPlan) {
this.module.planTrip();
}
},
CLASS_NAME : "otp.widgets.TripWidget"
});
//** CONTROL CLASSES **//
otp.widgets.tripoptions.TripOptionsWidgetControl = otp.Class({
div : null,
tripWidget : null,
initialize : function(tripWidget) {
this.tripWidget = tripWidget;
this.div = document.createElement('div');
//this.div.className()
},
setContent : function(content) {
this.div.innerHTML = content;
},
doAfterLayout : function() {
},
restorePlan : function(data) {
},
newItinerary : function(itin) {
},
isApplicableForMode : function(mode) {
return false;
},
$ : function() {
return $(this.div);
}
});
//** LocationsSelector **//
otp.widgets.tripoptions.LocationsSelector =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
geocoders : null,
activeIndex : 0,
initialize : function(tripWidget, geocoders) {
console.log("init loc");
this.geocoders = geocoders;
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-locSelector";
ich['otp-tripOptions-locations']({
widgetId : this.id,
showGeocoders : (this.geocoders && this.geocoders.length > 1),
geocoders : this.geocoders,
//TODO: Maybe change to Start and Destination
start: pgettext('template', "Start"),
end: _tr("End"),
geocoder: _tr("Geocoder")
}).appendTo(this.$());
this.tripWidget.module.on("startChanged", $.proxy(function(latlng, name) {
$("#"+this.id+"-start").val(name || '(' + latlng.lat.toFixed(5) + ', ' + latlng.lng.toFixed(5) + ')');
}, this));
this.tripWidget.module.on("endChanged", $.proxy(function(latlng, name) {
$("#"+this.id+"-end").val(name || '(' + latlng.lat.toFixed(5) + ', ' + latlng.lng.toFixed(5) + ')');
}, this));
},
doAfterLayout : function() {
var this_ = this;
this.startInput = this.initInput($("#"+this.id+"-start"), this.tripWidget.module.setStartPoint);
this.endInput = this.initInput($("#"+this.id+"-end"), this.tripWidget.module.setEndPoint);
$("#"+this.id+"-startDropdown").click($.proxy(function() {
$("#"+this.id+"-start").autocomplete("widget").show();
}, this));
$("#"+this.id+"-endDropdown").click($.proxy(function() {
$("#"+this.id+"-end").autocomplete("widget").show();
}, this));
$("#"+this.id+"-reverseButton").click($.proxy(function() {
var module = this.tripWidget.module;
var startLatLng = module.startLatLng, startName = module.startName;
var endLatLng = module.endLatLng, endName = module.endName;
module.clearTrip();
module.setStartPoint(endLatLng, false, endName);
module.setEndPoint(startLatLng, false, startName);
this_.tripWidget.inputChanged();
}, this));
if(this.geocoders.length > 1) {
var selector = $("#"+this.id+"-selector");
selector.change(function() {
this_.activeIndex = this.selectedIndex;
});
}
},
initInput : function(input, setterFunction) {
var this_ = this;
input.autocomplete({
delay: 500, // 500ms between requests.
source: function(request, response) {
this_.geocoders[this_.activeIndex].geocode(request.term, function(results) {
console.log("got results "+results.length);
response.call(this, _.pluck(results, 'description'));
input.data("results", this_.getResultLookup(results));
});
},
select: function(event, ui) {
var result = input.data("results")[ui.item.value];
var latlng = new L.LatLng(result.lat, result.lng);
this_.tripWidget.module.webapp.map.lmap.panTo(latlng);
setterFunction.call(this_.tripWidget.module, latlng, false, result.description);
this_.tripWidget.inputChanged();
},
})
.dblclick(function() {
$(this).select();
});
return input;
},
getResultLookup : function(results) {
var resultLookup = {};
for(var i=0; i= 1 && num <= 12) $(this).val(num + ":00" + val.charAt(val.length-1) + "m");
else if(num >= 100) {
var hour = Math.floor(num/100), min = num % 100;
if(hour >= 1 && hour <= 12 && min >= 0 && min < 60) {
$(this).val(hour + ":" + (min < 10 ? "0" : "") + min + val.charAt(val.length-1) + "m");
}
}
}
}
}
this_.tripWidget.inputChanged({
time : $(this).val(),
});
});
$("#"+this.id+'-nowButton').click(function() {
$('#'+this_.id+'-date').datepicker("setDate", new Date());
$('#'+this_.id+'-time').val(moment().format(otp.config.locale.time.time_format))
this_.tripWidget.inputChanged({
time : $('#'+this_.id+'-time').val(),
date : $('#'+this_.id+'-date').val()
});
});
},
getDate : function() {
return $('#'+this.id+'-date').val();
},
getTime : function() {
return $('#'+this.id+'-time').val();
},
restorePlan : function(data) {
//var m = moment(data.queryParams.date+" "+data.queryParams.time, "MM-DD-YYYY h:mma");
//$('#'+this.id+'-picker').datepicker("setDate", new Date(m));
if(data.queryParams.date) {
$('#'+this.id+'-date').datepicker("setDate", new Date(moment(data.queryParams.date, otp.config.apiDateFormat)));
this.tripWidget.module.date = data.queryParams.date;
}
if(data.queryParams.time) {
$('#'+this.id+'-time').val(moment(data.queryParams.time, otp.config.apiTimeFormat).format(otp.config.locale.time.time_format));
this.tripWidget.module.time = data.queryParams.time;
}
if(data.queryParams.arriveBy === true || data.queryParams.arriveBy === "true") {
this.tripWidget.module.arriveBy = true;
$('#'+this.id+'-depArr option:eq(1)').prop('selected', true);
}
else {
this.tripWidget.module.arriveBy = false;
$('#'+this.id+'-depArr option:eq(0)').prop('selected', true);
}
}
});
//** WheelChairSelector **//
otp.widgets.tripoptions.WheelChairSelector =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
//TRANSLATORS: label for checkbox
label : _tr("Wheelchair accessible trip:"),
initialize : function(tripWidget) {
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id;
ich['otp-tripOptions-wheelchair']({
widgetId : this.id,
label : this.label,
}).appendTo(this.$());
},
doAfterLayout : function() {
var this_ = this;
$("#"+this.id+"-wheelchair-input").change(function() {
this_.tripWidget.module.wheelchair = this.checked;
});
},
restorePlan : function(data) {
var checked = data.queryParams.wheelchair === true || data.queryParams.wheelchair === 'true';
this.tripWidget.module.wheelchair = checked;
$("#"+this.id+"-wheelchair-input").prop("checked", checked);
},
isApplicableForMode : function(mode) {
//wheelchair mode is shown on transit and walk trips that
//doesn't include a bicycle
return (otp.util.Itin.includesTransit(mode) || mode === "WALK") && !otp.util.Itin.includesAnyBicycle(mode);
}
});
//** Debug Itineraries Filters **//
otp.widgets.tripoptions.DebugItineraryFiltersSelector = otp.Class(
otp.widgets.tripoptions.TripOptionsWidgetControl,
{
id: null,
//TRANSLATORS: label for checkbox
label: _tr("Show Filtered Itineraries:"),
initialize: function (tripWidget) {
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id;
ich['otp-tripOptions-debug-filters']({
widgetId: this.id,
label: this.label,
}).appendTo(this.$());
},
doAfterLayout: function () {
var this_ = this;
$("#" + this.id + "-debug-filters-input").change(function () {
this_.tripWidget.module.debugItineraryFilter = this.checked;
});
},
restorePlan: function (data) {
var checked = data.queryParams.debugItineraryFilter === true || data.queryParams.debugItineraryFilter === 'true';
this.tripWidget.module.debugItineraryFilter = checked;
$("#" + this.id + "-debug-filters-input").prop("checked", checked);
},
isApplicableForMode : function(mode) { return true; }
}
);
//** ModeSelector **//
otp.widgets.tripoptions.ModeSelector =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
modes : otp.config.modes,
optionLookup : null,
modeControls : null,
initialize : function(tripWidget) {
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-modeSelector";
this.modeControls = [];
this.optionLookup = {};
//TRANSLATORS: Label for dropdown Travel by: [mode of transport]
var html = "" + _tr("Travel by") + ": ";
html += '';
html += '';
html += "";
$(html).appendTo(this.$());
//this.setContent(content);
},
doAfterLayout : function() {
var this_ = this;
$("#"+this.id).change(function() {
this_.tripWidget.inputChanged({
mode : _.keys(this_.modes)[this.selectedIndex],
});
this_.refreshModeControls();
});
},
restorePlan : function(data) {
var i = 0;
for(mode in this.modes) {
if(mode === data.queryParams.mode) {
this.tripWidget.module.mode = data.queryParams.mode;
$('#'+this.id+' option:eq('+i+')').prop('selected', true);
}
i++;
}
for(i = 0; i < this.modeControls.length; i++) {
this.modeControls[i].restorePlan(data);
}
this.refreshModeControls();
},
controlPadding : "8px",
refreshModeControls : function() {
var container = $("#"+this.id+'-widgets');
container.empty();
var mode = _.keys(this.modes)[document.getElementById(this.id).selectedIndex];
for(var i = 0; i < this.modeControls.length; i++) {
var control = this.modeControls[i];
if(control.isApplicableForMode(mode)) {
container.append($(''));
container.append(control.$());
control.doAfterLayout();
}
}
},
addModeControl : function(widget) {
this.modeControls.push(widget);
}
});
//** PreferredRoutes **//
otp.widgets.tripoptions.PreferredRoutes =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
selectorWidget : null,
lastSliderValue : null,
initialize : function(tripWidget) {
var this_ = this;
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-preferredRoutes";
ich['otp-tripOptions-preferredRoutes']({
widgetId : this.id,
//TRANSLATORS: label Preferred Routes: (routes/None)
preferredRoutes_label: _tr("Preferred Routes"),
//TRANSLATORS: button to edit Preffered public transport Routes
edit: _tr("Edit"),
//TRANSLATORS: Words in brackets when no Preffered public transport route is set
none : _tr("None"),
//TRANSLATORS: Label for Weight slider to set to preffered public
//transport routes
weight: _tr("Weight")
}).appendTo(this.$());
//TRANSLATORS: widget title
this.selectorWidget = new otp.widgets.RoutesSelectorWidget(this.id+"-selectorWidget", this, _tr("Preferred Routes"));
},
doAfterLayout : function() {
var this_ = this;
$('#'+this.id+'-button').button().click(function() {
this_.selectorWidget.updateRouteList();
this_.selectorWidget.show();
if(this_.selectorWidget.isMinimized) this_.selectorWidget.unminimize();
this_.selectorWidget.bringToFront();
});
$('#'+this.id+'-weightSlider').slider({
min : 0,
max : 120000,
value : this_.lastSliderValue || 300,
})
.on('slidechange', function(evt) {
this_.lastSliderValue = $(this).slider('value');
this_.tripWidget.inputChanged({
otherThanPreferredRoutesPenalty : this_.lastSliderValue,
});
});
},
setRoutes : function(paramStr, displayStr) {
this.tripWidget.inputChanged({
preferredRoutes : paramStr,
});
$('#'+this.id+'-list').html(displayStr);
},
restorePlan : function(planData) {
if(planData.queryParams.preferredRoutes) {
var this_ = this;
var restoredIds = [];
var preferredRoutesArr = planData.queryParams.preferredRoutes.split(',');
// convert the API's agency_name_id format to standard agency_id
for(var i=0; i < preferredRoutesArr.length; i++) {
var apiIdArr = preferredRoutesArr[i].split("_");
var agencyAndId = apiIdArr[0] + "_" + apiIdArr.pop();
restoredIds.push(agencyAndId);
}
this.selectorWidget.restoredRouteIds = restoredIds;
if(this.selectorWidget.initializedRoutes) this.selectorWidget.restoreSelected();
this.tripWidget.module.preferredRoutes = planData.queryParams.preferredRoutes;
// resolve the IDs to user-friendly names
var indexApi = this.tripWidget.module.webapp.indexApi;
indexApi.loadRoutes(this, function() {
var routeNames = [];
for(var i = 0; i < restoredIds.length; i++) {
var route = indexApi.routes[restoredIds[i]].routeData;
routeNames.push(route.shortName || route.longName);
}
$('#'+this_.id+'-list').html(routeNames.join(', '));
});
}
else { // none specified
this.selectorWidget.clearSelected();
this.selectorWidget.restoredRouteIds = [];
$('#'+this.id+'-list').html('('+_tr("None")+')');
this.tripWidget.module.preferredRoutes = null;
}
if(planData.queryParams.otherThanPreferredRoutesPenalty) {
this.lastSliderValue = planData.queryParams.otherThanPreferredRoutesPenalty;
$('#'+this.id+'-weightSlider').slider('value', this.lastSliderValue);
}
},
isApplicableForMode : function(mode) {
return otp.util.Itin.includesTransit(mode);
}
});
//** BannedRoutes **//
otp.widgets.tripoptions.BannedRoutes =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
selectorWidget : null,
initialize : function(tripWidget) {
var this_ = this;
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-bannedRoutes";
var html = '';
//TRANSLATORS: buton edit Banned public transport routes
var html = '';
//TRANSLATORS: label Banned public transport Routes: (routes/None)
//(Routes you don't want to take)
html += _tr("Banned routes") + ': ('+_tr("None")+')';
html += '';
$(html).appendTo(this.$());
//TRANSLATORS: Widget title
this.selectorWidget = new otp.widgets.RoutesSelectorWidget(this.id+"-selectorWidget", this, _tr("Banned routes"));
},
doAfterLayout : function() {
var this_ = this;
$('#'+this.id+'-button').button().click(function() {
this_.selectorWidget.updateRouteList();
this_.selectorWidget.show();
if(this_.selectorWidget.isMinimized) this_.selectorWidget.unminimize();
this_.selectorWidget.bringToFront();
});
},
setRoutes : function(paramStr, displayStr) {
this.tripWidget.inputChanged({
bannedRoutes : paramStr,
});
$('#'+this.id+'-list').html(displayStr);
},
restorePlan : function(planData) {
if(planData.queryParams.bannedRoutes) {
var this_ = this;
var restoredIds = [];
var bannedRoutesArr = planData.queryParams.bannedRoutes.split(',');
// convert the API's agency_name_id format to standard agency_id
for(var i=0; i < bannedRoutesArr.length; i++) {
var apiIdArr = bannedRoutesArr[i].split("_");
var agencyAndId = apiIdArr[0] + "_" + apiIdArr.pop();
restoredIds.push(agencyAndId);
}
this.selectorWidget.restoredRouteIds = restoredIds;
if(this.selectorWidget.initializedRoutes) this.selectorWidget.restoreSelected();
this.tripWidget.module.bannedRoutes = planData.queryParams.bannedRoutes;
// resolve the IDs to user-friendly names
var indexApi = this.tripWidget.module.webapp.indexApi;
indexApi.loadRoutes(this, function() {
var routeNames = [];
for(var i = 0; i < restoredIds.length; i++) {
var route = indexApi.routes[restoredIds[i]].routeData;
routeNames.push(route.shortName || route.longName);
}
$('#'+this_.id+'-list').html(routeNames.join(', '));
});
}
else { // none specified
this.selectorWidget.clearSelected();
this.selectorWidget.restoredRouteIds = [];
$('#'+this.id+'-list').html('('+_tr("None")+')');
this.tripWidget.module.bannedRoutes = null;
}
},
isApplicableForMode : function(mode) {
return otp.util.Itin.includesTransit(mode);
}
});
//** BikeTriangle **//
otp.widgets.tripoptions.BikeTriangle =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
bikeTriangle : null,
defaultValues: {time: 0.33, slope: 0.33, safety: 0.33},
initialize : function(tripWidget) {
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-bikeTriangle";
var content = '';
//content += 'Drag to Change Trip:
';
content += '';
this.setContent(content);
},
doAfterLayout : function() {
if(!this.bikeTriangle) {
this.bikeTriangle = new otp.widgets.BikeTrianglePanel(this.id);
this.bikeTriangle.setValues(this.defaultValues.time, this.defaultValues.slope, this.defaultValues.safety);
}
var this_ = this;
this.bikeTriangle.onChanged = function() {
var formData = this_.bikeTriangle.getFormData();
this_.tripWidget.inputChanged({
optimize : "TRIANGLE",
triangleTimeFactor : formData.triangleTimeFactor,
triangleSlopeFactor : formData.triangleSlopeFactor,
triangleSafetyFactor : formData.triangleSafetyFactor,
});
};
},
restorePlan : function(planData) {
if(planData.queryParams.optimize === 'TRIANGLE') {
if (this.bikeTriangle) {
this.bikeTriangle.setValues(
planData.queryParams.triangleTimeFactor,
planData.queryParams.triangleSlopeFactor,
planData.queryParams.triangleSafetyFactor);
} else {
// doAfterLayout creates the bikeTriangle, which hasn't yet run
this.defaultValues = {
time: planData.queryParams.triangleTimeFactor,
slope: planData.queryParams.triangleSlopeFactor,
safety: planData.queryParams.triangleSafetyFactor,
};
}
}
},
isApplicableForMode : function(mode) {
return otp.util.Itin.includesAnyBicycle(mode);
}
});
//** BikeType **//
otp.widgets.tripoptions.BikeType =
otp.Class(otp.widgets.tripoptions.TripOptionsWidgetControl, {
id : null,
initialize : function(tripWidget) {
otp.widgets.tripoptions.TripOptionsWidgetControl.prototype.initialize.apply(this, arguments);
this.id = tripWidget.id+"-bikeType";
this.$().addClass('notDraggable');
var content = '';
//TRANSLATORS: In Bike share planner radio button: