new Asset.css('/css/dynamic.css');
window.addEvent('domready', function(){
c_carpool = new carpool;
});
var carpool = new Class({
versionInfo: '1.0 beta',
initialize: function() {
this.fx = {};
this.startlocations = new Array();
this.stoplocations = new Array();
this.endlocations = new Array();
this.startlocation = {};
this.stoplocation = {};
this.endlocation = {};
this.overlayFn('create');
this.overlayFn('show', {'effect':false});
this.splash = new Element('div', {'id' : 'splash'}).injectInside(document.body);
this.splash_feedback = new Element('div', {'id': 'splash_feedback'}).injectInside(this.splash).setHTML('...');
this.splash_versionInfo = new Element('div', {'id': 'splash_versioninfo'}).injectInside(this.splash).setHTML(this.versionInfo);
this.position(['splash', 'overlay']);
window.addEvent('scroll', this.position.pass([['splash', 'overlay']], this)).addEvent('resize', this.position.pass([['splash', 'overlay']], this));
$extend(this.fx, {
splash: this.splash.effect('opacity', {duration: 500, wait: false})
});
this.loadVariables();
this.addEvent('onVariablesLoaded', function(){
this.buildUI();
}.bind(this));
this.addEvent('onUILoaded', function(){
this.loadMap();
}.bind(this));
this.addEvent('onMapsLoaded', function(){
this.defaultMap();
}.bind(this));
this.addEvent('onDefaultLocationsLoaded', function(){
this.splash_feedback.setHTML("");
this.overlayFn('hide');
this.fx.splash.start(0);
}.bind(this));
},
//var myXHR = new XHR({method: 'get'}).send('http://site.com/requestHandler.php', 'id=john&lastid=dorian');
loadVariables: function() {
var jSonRequest = new Json.Remote("/getdata.php?script=inter", {
method: 'post',
async: true,
onComplete: function(response) {
variable = response.v;
error = response.e;
this.fireEvent('onVariablesLoaded');
}.bind(this)
},this).send({"action": "get_variables", "lang": "nl"})
},
buildUI: function() {
this.splash_feedback.setHTML(variable.loading.buildingInterface);
this.wrap = $('wrap');
this.navigation = $('navigation');
this.navigation_wrap = new Element('div', {'id':'navigation_wrap'}).injectAfter(this.navigation);
this.navigation.injectInside(this.navigation_wrap);
this.d_body = $('body');
this.dock = new Element('div', {'id': 'dock'}).injectInside(this.wrap);
this.navigation_wrap.injectInside(this.dock);
this.d_body.injectInside(this.dock);
this.d_hidebutton = new Element('a', {'id':'d_hidebutton'}).setHTML(variable.hide).addEvent('click', function(){ this.toggleDock('hide') }.bind(this)).injectInside(this.dock)
this.dock.visible = true;
this.infowindowFn('create');
this.infowindowFn('hide');
this.dialogFn('create');
this.dialogFn('hide');
// map area
this.map_container = new Element('div', {'id': 'map_container'}).injectTop(this.wrap);
window.addEvent(
'scroll', this.position.pass([['interface', 'map', 'dock', 'infowindow', 'dialog']], this)
).addEvent(
'resize', this.position.pass([['interface', 'map', 'dock', 'infowindow', 'dialog']], this)
);
$extend(this.fx, {
dock: this.dock.effect('top', {duration: 500, wait: false})
});
this.activateNavigation();
this.position(['interface', 'map', 'dock', 'infowindow']);
this.fireEvent('onUILoaded');
},
activateNavigation: function() {
$ES('li', 'nav').each(function(item){
//var item = item;
var link = $E('a', item);
link.addEvent('click', function(e){
switch(link.getProperty('id')){
case 'btn_search_offer':
new Event(e).stop();
this.switchTab('search_offer');
this.activateNavigation_postProcess(item);
pageTracker._trackPageview('/aanbod');
break;
case 'btn_search_demand':
new Event(e).stop();
this.switchTab('search_demand');
this.activateNavigation_postProcess(item);
pageTracker._trackPageview('/vraag');
break;
case 'btn_sportpaleis':
$('btn_sportpaleis').target = "_blank";
break;
case 'btn_info':
$('btn_info').target = "_blank";
break;
}
}.bind(this));
}.bind(this));
},
activateNavigation_postProcess: function(item) {
$$('li', 'nav').each(function(item){
item.removeClass('selected');
});
this.switchTab.pass('search', this);
item.addClass('selected');
this.toggleDock.pass('show', this);
},
loadMap: function() {
this.splash_feedback.setHTML(variable.loading.loadingMap);
c_map = new map;
c_map.addEvent('onMapsLoaded', function(){
c_map.loadMaps(this.map_container);
this.map_controls_wrap = new Element('div', {'id': 'map_controls_wrap'}).injectInside(this.wrap);
this.map_controls = new Element('div', {'id': 'map_controls'}).injectInside(this.map_controls_wrap);
this.map_controls_c_zoom_in = new Element('a', {'id': 'c_zoom_in', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls_c_zoom_out = new Element('a', {'id': 'c_zoom_out', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls_c_up = new Element('a', {'id': 'c_up', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls_c_down = new Element('a', {'id': 'c_down', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls_c_left = new Element('a', {'id': 'c_left', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls_c_right = new Element('a', {'id': 'c_right', 'class': 'button', 'href': '#'}).injectInside(this.map_controls);
this.map_controls = new Element('div', {'id': 'map_controls_r'}).injectInside(this.map_controls_wrap);
this.map_controls_c_zoom_in.onclick = c_map.controls.pass('zoom_in', c_map);
this.map_controls_c_zoom_out.onclick = c_map.controls.pass('zoom_out', c_map);
this.map_controls_c_up.onclick = c_map.controls.pass('up', c_map);
this.map_controls_c_down.onclick = c_map.controls.pass('down', c_map);
this.map_controls_c_left.onclick = c_map.controls.pass('left', c_map);
this.map_controls_c_right.onclick = c_map.controls.pass('right', c_map);
this.baseIcon = new google.maps.Icon();
//this.baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
this.baseIcon.iconSize = new google.maps.Size(32, 42);
//this.baseIcon.shadowSize = new GSize(37, 34);
this.baseIcon.iconAnchor = new google.maps.Point(16, 42);
this.baseIcon.infoWindowAnchor = new google.maps.Point(9, 2);
this.baseIcon.infoShadowAnchor = new google.maps.Point(18, 25);
this.defaultIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/default.png", null, ""));
this.sportpaleisIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/sportpaleis.png", null, ""));
this.lottoarenaIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/lottoarena.png", null, ""));
this.pIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/parking.png", null, ""));
this.prIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/pr.png", null, ""));
this.homeIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/home.png", null, ""));
this.number1Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/1.png", null, ""));
this.number2Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/2.png", null, ""));
this.number3Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/3.png", null, ""));
this.number4Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/4.png", null, ""));
this.number5Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/5.png", null, ""));
this.number6Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/6.png", null, ""));
this.number7Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/7.png", null, ""));
this.number8Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/8.png", null, ""));
this.number9Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/9.png", null, ""));
this.number10Icon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/10.png", null, ""));
this.number10plusIcon = (new google.maps.Icon(this.baseIcon, "/css/images/markers/10plus.png", null, ""));
this.fireEvent('onMapsLoaded');
}.bind(this));
c_map.addEvent('onMapsNotCampatible', function(){
// alert('browser not compatible');
this.fireEvent('onMapsLoaded');
}.bind(this));
},
infowindowFn: function(action, args) {
switch(action) {
case 'create':
// info window
this.infowindow = {};
this.infowindow.events = new Element('div');
this.infowindow.el = new Element('div', {'id': 'info_window'}).injectInside(this.wrap);
this.infowindow.Top = new Element('div', {'id': 'info_window_top'}).injectInside(this.infowindow.el);
this.infowindow.Middle = new Element('div', {'id': 'info_window_middle'}).injectInside(this.infowindow.el);
this.infowindow.Body = new Element('div', {'id': 'info_window_body'}).injectInside(this.infowindow.Middle);
this.infowindow.Bottom = new Element('div', {'id': 'info_window_bottom'}).injectInside(this.infowindow.el);
//this.info_window_closebutton = new Element('a', {'id': 'info_window_closebutton', 'href': '#'}).injectInside(this.info_window).addEvent('click', this.toggleInfoWindow.bind(this));
this.infowindow.Title = new Element('h1', {'id': 'info_window_title'}).injectInside(this.infowindow.el);
new Drag.Move('info_window', {'container': this.wrap, 'onDrag' : this.infowindowFn.pass('move', this)});
this.infowindow.el.setStyles({'left': window.getWidth() - 300});
this.infowindowFn('move');
$extend(this.fx, {
infowindow: new Fx.Slide(this.infowindow.Middle)
});
break;
case 'toggle':
break;
case 'show':
this.infowindow.el.setOpacity(1);
this.infowindow.el.visible = true;
break;
case 'hide':
this.infowindow.el.setOpacity(0);
this.infowindow.el.visible = false;
break;
case 'remove':
this.infowindow = null;
break;
case 'reset':
this.infowindow.Title.empty();
this.infowindow.Body.remove();
this.infowindow.Body = new Element('div', {'id': 'info_window_body'}).injectInside(this.infowindow.Middle);
this.infowindow.events = new Element('div');
case 'move':
this.infowindow.position = {
'x' : (100 / (this.wrap.getStyle('width').toInt() - this.infowindow.el.getStyle('width').toInt()) * this.infowindow.el.getLeft()),
'y' : (100 / (this.wrap.getStyle('height').toInt() - this.infowindow.el.getStyle('height').toInt()) * this.infowindow.el.getTop())
};
break;
}
},
dialogFn: function(action, args) {
switch(action) {
case 'create':
this.dialog = new Element('div', {'id': 'dialog'}).injectInside(document.body);
this.dialog_top = new Element('div', {'id': 'dialog_top'}).injectInside(this.dialog);
this.dialog_content = new Element('div', {'id': 'dialog_content'}).injectInside(this.dialog);
this.dialog_bottom = new Element('div', {'id': 'dialog_bottom'}).injectInside(this.dialog);
break;
case 'position':
/*
var info_window_left = ((this.wrap.getStyle('width').toInt() - this.info_window.getStyle('width').toInt()) / 100) * this.info_window_position['x'];
var info_window_top = ((this.wrap.getStyle('height').toInt() - this.info_window.getStyle('height').toInt()) / 100) * this.info_window_position['y'];
this.info_window.setStyles({'left': info_window_left, 'top': info_window_top});
*/
break;
case 'show':
this.dialog.setOpacity(1);
this.dialog.visible = true;
break;
case 'hide':
this.dialog.setOpacity(0);
this.dialog.visible = false;
break;
case 'reset':
this.dialog_content.setHTML('');
break;
}
},
overlayFn: function(action, args) {
switch(action) {
case 'create':
this.overlay = new Element('div', {'id': 'overlay'}).injectInside(document.body);
$extend(this.fx, {
overlay: this.overlay.effect('opacity', {duration: 500, wait: false})
});
break;
case 'position':
this.overlay.setStyles({'top': window.getScrollTop(), 'height': window.getHeight(), 'width': window.getWidth(), 'left':window.getScrollLeft() });
break;
case 'show':
if ($defined(args)) {
args['effect'] == false ? this.overlay.setOpacity(0.6) : this.fx.overlay.start(0.6);
}
else {
this.overlay.setOpacity(0.6);
}
break;
case 'hide':
if ($defined(args)) {
args['effect'] == false ? this.overlay.setOpacity(0) : this.fx.overlay.start(0);
}
else {
this.overlay.setOpacity(0);
}
break;
case 'reset':
break;
}
},
createLocation: function(point, args) {
var args = $merge(args, {});
switch(args.type){
default:
cIcon = this.defaultIcon;
break;
case 'sportpaleis':
cIcon = this.sportpaleisIcon;
break;
case 'lottoarena':
cIcon = this.lottoarenaIcon;
break;
case 'p':
cIcon = this.pIcon;
break;
case 'pr':
cIcon = this.prIcon;
break;
case 'home':
cIcon = this.homeIcon;
break;
case 'stop_1':
cIcon = this.number1Icon;
break;
case 'stop_2':
cIcon = this.number2Icon;
break;
case 'stop_3':
cIcon = this.number3Icon;
break;
case 'stop_4':
cIcon = this.number4Icon;
break;
case 'stop_5':
cIcon = this.number5Icon;
break;
case 'stop_6':
cIcon = this.number6Icon;
break;
case 'stop_7':
cIcon = this.number7Icon;
break;
case 'stop_8':
cIcon = this.number8Icon;
break;
case 'stop_9':
cIcon = this.number9Icon;
break;
case 'stop_10':
cIcon = this.number10Icon;
break;
case 'stop_10plus':
cIcon = this.number10plusIcon;
break;
}
//new GMarker(startLatLng,{icon:greenIcon,draggable:true,bouncy:false})
markerOptions = $merge({ icon:cIcon }, args.marker);
var marker = new GMarker(point, markerOptions);
GEvent.addListener(marker, "click", function() {
// alert("clicked " + name);
});
c_map.mapObj.addOverlay(marker);
return marker;
},
position: function(input) {
input.each(function(item, index){
switch (item) {
case 'interface':
this.wrap.setStyles({'top': window.getScrollTop(), 'height': window.getHeight(), 'width': window.getWidth()});
//this.d_body.setStyle('margin-top', this.navigation.getCoordinates()['height']);
break;
case 'map':
this.map_container.setStyles({'height': window.getHeight()});
break;
case 'infowindow':
var info_window_left = ((this.wrap.getStyle('width').toInt() - this.infowindow.el.getStyle('width').toInt()) / 100) * this.infowindow.position['x'];
var info_window_top = ((this.wrap.getStyle('height').toInt() - this.infowindow.el.getStyle('height').toInt()) / 100) * this.infowindow.position['y'];
this.infowindow.el.setStyles({'left': info_window_left, 'top': info_window_top});
break;
case 'dock':
if (this.dock.visible == true) {
this.dock.setStyles({
'top': window.getHeight() - this.navigation.getCoordinates()['height'] - this.d_body.getCoordinates()['height'] +1
});
}
else {
this.dock.setStyles({
'top': window.getHeight() - this.navigation.getCoordinates()['height'] +1
});
}
break;
case 'splash':
this.splash.setStyles({'top': (window.getHeight()-this.splash.getStyle('height').toInt())/2, 'left': (window.getWidth()-this.splash.getStyle('width').toInt())/2});
break;
case 'overlay':
this.overlayFn('position');
break;
case 'dialog':
this.dialogFn('position');
break;
}
}.bind(this));
},
toggleDock: function(action){
switch(action){
case 'show':
this.fx.dock.start(window.getHeight() - this.navigation.getCoordinates()['height'] - this.d_body.getCoordinates()['height'] +1);
this.dock.visible = true;
break;
case 'hide':
if (this.dock.visible == true) {
this.fx.dock.start(window.getHeight() - this.navigation.getCoordinates()['height'] +1);
this.dock.visible = false;
}
break;
default:
if (this.dock.visible == true) {
this.fx.dock.start(window.getHeight() - this.navigation.getCoordinates()['height'] +1);
this.dock.visible = false;
}
else {
this.fx.dock.start(window.getHeight() - this.navigation.getCoordinates()['height'] - this.d_body.getCoordinates()['height'] +1);
this.dock.visible = true;
}
break;
}
},
switchTab: function(tab) {
this.resetMap.bind(this);
if (tab != this.active_tab) this.loadTab(tab);
this.toggleDock('show');
},
closeTab: function(tab) {
this.d_body.empty();
switch(tab) {
case 'search_offer':
this.resetitem(['map', 'stop', 'route']);
this.infowindowFn('reset');
break;
case 'search_demand':
this.resetitem(['map', 'start', 'route']);
this.infowindowFn('reset');
break;
}
},
loadTab: function(tab) {
this.tab = {};
this.tab.events = new Element('div');
if (this.active_tab == 'search_offer') this.closeTab('search_offer');
if (this.active_tab == 'search_demand') this.closeTab('search_demand');
this.d_body.setHTML(variable.loading);
switch(tab) {
/****************** OFFER ******************/
case 'search_offer':
this.active_tab = 'search_offer'
// set core Elements
this.defaultRoute = new route();
this.altRoute = new route();
this.c_event = {};
this.c_date = {};
this.tab.tab_search = new Element('div', {'id':'tab_search'});
// generate form
this.tab.tab_search_form = new Element('form', {'id':'tab_search_form'}).addEvent('submit', function(e){
new Event(e).stop();
}).injectInside(this.tab.tab_search);
// generate columns
this.tab.tab_search_event = new Element('div', {'id':'tab_search_event'}).injectInside(this.tab.tab_search_form);
this.tab.tab_search_route = new Element('div', {'id':'tab_search_route'}).injectInside(this.tab.tab_search_form);
//this.tab.tab_search_options = new Element('div', {'id':'tab_search_options'}).injectInside(this.tab.tab_search_form);
this.tab.tab_search_buttons = new Element('div', {'id':'tab_search_buttons'}).injectInside(this.tab.tab_search_form);
// choose event
new Element('h1').setHTML(variable.event).injectInside(this.tab.tab_search_event);
this.tab.tab_search_eventselect = new Element('select', {'name':'tab_search_eventselect'}).injectInside(this.tab.tab_search_event);
new Element('option', {'value': 0}).setText(variable.choose_event).injectInside(this.tab.tab_search_eventselect);
new Element('br').injectInside(this.tab.tab_search_event);
// choose date
this.tab.tab_search_dateselect = new Element('select', {'name':'tab_search_dateselect'}).injectInside(this.tab.tab_search_event);
new Element('option', {'value': 0}).setText(variable.choose_date).injectInside(this.tab.tab_search_dateselect);
// choose start
new Element('h1').setHTML(variable.route).injectInside(this.tab.tab_search_route);
new Element('label', {'for': 'tab_search_address', 'class':'label'}).setHTML(variable.address).injectInside(this.tab.tab_search_route);
this.tab.tab_search_address = new Element('input', {'type':'text','id': 'tab_search_address', 'name': 'tab_search_address'}).injectInside(this.tab.tab_search_route)
this.tab.tab_search_address_feedback = new Element('p', {'id':'tab_search_address_feedback'}).setHTML(' ').injectInside(this.tab.tab_search_route);
// buttons
this.tab.tab_search_btn_search = new Element('a', {'class':'button'}).setHTML(variable.search).injectInside(this.tab.tab_search_buttons);
this.tab.tab_search_btn_save = new Element('a', {'class':'button'}).setHTML(variable.save).injectInside(this.tab.tab_search_buttons);
this.tab.tab_search_btn_search.addEvent('click', this.searchDrivers.bind(this));
this.tab.tab_search_btn_save.addEvent('click', this.saveCarpooler.bind(this));
// info window
this.infowindow.Title.setHTML(variable.info);
this.infowindow.Body.event = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.event).injectInside(this.infowindow.Body.event);
this.infowindow.Body.event_name = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.event);
this.infowindow.Body.event_date = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.event);
this.infowindow.Body.start = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.start).injectInside(this.infowindow.Body.start);
this.infowindow.Body.start_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.start);
this.infowindow.Body.stop = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.stop).injectInside(this.infowindow.Body.stop);
this.infowindow.Body.stop_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.stop);
this.infowindow.Body.destination = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.destination).injectInside(this.infowindow.Body.destination);
this.infowindow.Body.destination_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.destination);
this.infowindow.Body.routeAlt = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.route).injectInside(this.infowindow.Body.routeAlt);
this.infowindow.Body.routeAlt_value = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.routeAlt);
// get events
this.tab.tab_search_eventselect.addEvent('change', function(event){
event = new Event(event);
var value = $(event.target).options.selectedIndex;
if (value > 0) {
this.c_event = {
'ID': $(event.target).options[value].value,
'Name': $(event.target).options[value].text
}
this.getDates($(event.target).options[$(event.target).options.selectedIndex].value, this.tab.events);
this.infowindow.Body.event_name.setHTML(this.c_event.Name);
this.resetitem(['date', 'destination', 'map', 'route', 'start', 'starts']);
}
else {
this.resetitem(['event', 'date', 'map', 'route', 'start', 'starts']);
}
}.bind(this));
this.getEvents(this.tab.events);
this.tab.events.addEvent('onEventsLoaded', function(response){
if (response.s == "true") {
var events = response.d;
events.each(function(item, index){
new Element('option', {'value': item.id}).setText(item.name).injectInside(this.tab.tab_search_eventselect);
}, this);
}
}.bind(this));
// get dates
this.tab.tab_search_dateselect.addEvent('change', function(event){
event = new Event(event);
var value = $(event.target).options.selectedIndex;
if (value > 0) {
this.c_date = {
'ID': $(event.target).options[value].value,
'Name': $(event.target).options[value].text
}
this.getDestinations($(event.target).options[$(event.target).options.selectedIndex].value, this.tab.events);
this.infowindow.Body.event_date.setHTML($(event.target).options[value].text);
this.resetitem(['route', 'start']);
}
else {
this.resetitem(['date', 'route', 'map', 'start', 'starts']);
}
}.bind(this));
this.tab.events.addEvent('onDatesLoaded', function(response){
if (response.s == "true") {
var events = response.d;
events.each(function(item, index){
new Element('option', {'value': item.id}).setText(item.startdate_formatted).injectInside(this.tab.tab_search_dateselect);
}, this);
}
}.bind(this));
// get destinations
this.tab.events.addEvent('onDestinationsLoaded', function(response){
if (response.s == "true") {
this.resetitem(['destinations','destination']);
this.endlocations = this.populatemap(response.d, 0);
}
}.bind(this));
// verify address
this.tab.tab_search_address.addEvent('blur', function(event){
event = new Event(event);
var address = $(event.target).value;
c_map.geocoder.getLocations(address, function(response){
this.resetitem(['stop', 'route']);
this.tab.tab_search_address_feedback.setHTML(variable.addressSearching)
if (response.Status.code == '602') {
this.tab.tab_search_address_feedback.setHTML(error.addressNotFound)
this.resetitem(['route', 'stop', 'starts'])
}
else {
this.resetitem(['stop']);
this.stoplocation.details = response.Placemark[0];
this.stoplocation.coord = new google.maps.LatLng(this.stoplocation.details.Point.coordinates[1], this.stoplocation.details.Point.coordinates[0]);
this.startlocation.address = address
// new google.maps.LatLng(item.lat,item.lng)
this.tab.tab_search_address_feedback.setHTML(variable.addressFound)
this.infowindow.Body.stop_address.setHTML(this.startlocation.address);
this.stoplocation.point = this.createLocation(this.stoplocation.coord, {'type': 'home', 'name': 'home'});
c_map.zoomMap([this.stoplocation.coord, $pick(this.endlocation.coord ,new google.maps.LatLng('51.231129','4.4414377'))]);
}
}.bind(this));
}.bind(this))
this.defaultRoute.addEvent('onDirectionsLoading', function(response){
this.infowindow.Body.routeShort_value.setHTML(variable.calculateRoute);
}.bind(this));
this.altRoute.addEvent('onDirectionsLoading', function(response){
this.infowindow.Body.routeAlt_value.setHTML(variable.calculateRoute);
}.bind(this));
this.defaultRoute.addEvent('onDirectionsLoaded', function(response){
this.infowindow.Body.routeShort_value.setHTML(this.defaultRoute.distance.html + " (" + this.defaultRoute.duration.html + ") ");
this.defaultRoute.showRoute(c_map, {'width':5});
}.bind(this));
this.altRoute.addEvent('onDirectionsLoaded', function(response){
this.infowindow.Body.routeAlt_value.setHTML(this.altRoute.distance.html + " (" + this.altRoute.duration.html + ") ");
this.altRoute.showRoute(c_map, {'color': '#f00', 'weight':5});
}.bind(this));
// update DOM
output = this.tab.tab_search;
// infowindow.injectInside(this.infowindow.Body);
this.infowindowFn('show');
break;
/****************** DEMAND ******************/
case 'search_demand':
this.active_tab = 'search_demand'
// set core Elements
this.defaultRoute = new route();
this.altRoute = new route();
this.c_event = {};
this.c_date = {};
this.tab.tab_search = new Element('div', {'id':'tab_search'});
// generate form
this.tab.tab_search_form = new Element('form', {'id':'tab_search_form'}).addEvent('submit', function(e){
new Event(e).stop();
}).injectInside(this.tab.tab_search);
// generate columns
this.tab.tab_search_event = new Element('div', {'id':'tab_search_event'}).injectInside(this.tab.tab_search_form);
this.tab.tab_search_route = new Element('div', {'id':'tab_search_route'}).injectInside(this.tab.tab_search_form);
//this.tab.tab_search_options = new Element('div', {'id':'tab_search_options'}).injectInside(this.tab.tab_search_form);
this.tab.tab_search_buttons = new Element('div', {'id':'tab_search_buttons'}).injectInside(this.tab.tab_search_form);
// choose event
new Element('h1').setHTML(variable.event).injectInside(this.tab.tab_search_event);
this.tab.tab_search_eventselect = new Element('select', {'name':'tab_search_eventselect'}).injectInside(this.tab.tab_search_event);
new Element('option', {'value': 0}).setText(variable.choose_event).injectInside(this.tab.tab_search_eventselect);
new Element('br').injectInside(this.tab.tab_search_event);
// choose date
this.tab.tab_search_dateselect = new Element('select', {'name':'tab_search_dateselect'}).injectInside(this.tab.tab_search_event);
new Element('option', {'value': 0}).setText(variable.choose_date).injectInside(this.tab.tab_search_dateselect);
// choose start
new Element('h1').setHTML(variable.route).injectInside(this.tab.tab_search_route);
new Element('label', {'for': 'tab_search_address', 'class':'label'}).setHTML(variable.address).injectInside(this.tab.tab_search_route);
this.tab.tab_search_address = new Element('input', {'type':'text','id': 'tab_search_address', 'name': 'tab_search_address'}).injectInside(this.tab.tab_search_route)
this.tab.tab_search_address_feedback = new Element('p', {'id':'tab_search_address_feedback'}).setHTML(' ').injectInside(this.tab.tab_search_route);
// choose destination
new Element('label', {'for': 'tab_search_destination', 'class':'label'}).setHTML(variable.destination).injectInside(this.tab.tab_search_route);
this.tab.tab_search_destination = new Element('select', {'name':'tab_search_destination'}).injectInside(this.tab.tab_search_route);
new Element('option', {'value': 0}).setText(variable.choose_eventfirst).injectInside(this.tab.tab_search_destination);
// buttons
this.tab.tab_search_btn_search = new Element('a', {'class':'button'}).setHTML(variable.search).injectInside(this.tab.tab_search_buttons);
this.tab.tab_search_btn_save = new Element('a', {'class':'button'}).setHTML(variable.save).injectInside(this.tab.tab_search_buttons);
this.tab.tab_search_btn_search.addEvent('click', this.searchCarpoolers.bind(this));
this.tab.tab_search_btn_save.addEvent('click', this.saveDriver.bind(this));
// info window
this.infowindow.Title.setHTML(variable.info);
this.infowindow.Body.event = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.event).injectInside(this.infowindow.Body.event);
this.infowindow.Body.event_name = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.event);
this.infowindow.Body.event_date = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.event);
this.infowindow.Body.start = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.start).injectInside(this.infowindow.Body.start);
this.infowindow.Body.start_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.start);
this.infowindow.Body.stop = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.stop).injectInside(this.infowindow.Body.stop);
this.infowindow.Body.stop_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.stop);
this.infowindow.Body.destination = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.destination).injectInside(this.infowindow.Body.destination);
this.infowindow.Body.destination_address = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.destination);
this.infowindow.Body.routeShort = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.routeShort).injectInside(this.infowindow.Body.routeShort);
this.infowindow.Body.routeShort_value = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.routeShort);
this.infowindow.Body.routeAlt = new Element('div').injectInside(this.infowindow.Body);
new Element('span', {'class':'label'}).setHTML(variable.routeAlt).injectInside(this.infowindow.Body.routeAlt);
this.infowindow.Body.routeAlt_value = new Element('span', {'class':'value'}).injectInside(this.infowindow.Body.routeAlt);
// get events
this.tab.tab_search_eventselect.addEvent('change', function(event){
event = new Event(event);
var value = $(event.target).options.selectedIndex;
if (value > 0) {
this.c_event = {
'ID': $(event.target).options[value].value,
'Name': $(event.target).options[value].text
}
this.getDates($(event.target).options[$(event.target).options.selectedIndex].value, this.tab.events);
this.infowindow.Body.event_name.setHTML(this.c_event.Name);
this.resetitem(['date', 'destination', 'map', 'route', 'stops']);
}
else {
this.resetitem(['event', 'date', 'destination', 'map', 'route', 'stops']);
}
}.bind(this));
this.getEvents(this.tab.events);
this.tab.events.addEvent('onEventsLoaded', function(response){
if (response.s == "true") {
var events = response.d;
events.each(function(item, index){
new Element('option', {'value': item.id}).setText(item.name).injectInside(this.tab.tab_search_eventselect);
}, this);
}
}.bind(this));
// get dates
this.tab.tab_search_dateselect.addEvent('change', function(event){
event = new Event(event);
var value = $(event.target).options.selectedIndex;
if (value > 0) {
this.c_date = {
'ID': $(event.target).options[value].value,
'Name': $(event.target).options[value].text
}
this.getDestinations($(event.target).options[$(event.target).options.selectedIndex].value, this.tab.events);
this.infowindow.Body.event_date.setHTML($(event.target).options[value].text);
this.resetitem(['route', 'stops']);
}
else {
this.resetitem(['route', 'map', 'destination', 'stops']);
}
}.bind(this));
this.tab.events.addEvent('onDatesLoaded', function(response){
if (response.s == "true") {
var events = response.d;
events.each(function(item, index){
new Element('option', {'value': item.id}).setText(item.startdate_formatted).injectInside(this.tab.tab_search_dateselect);
}, this);
}
}.bind(this));
// verify address
this.tab.tab_search_address.addEvent('blur', function(event){
event = new Event(event);
var address = $(event.target).value;
c_map.geocoder.getLocations(address, function(response){
this.resetitem(['starts', 'route']);
this.tab.tab_search_address_feedback.setHTML(variable.addressSearching)
if (response.Status.code == '602') {
this.tab.tab_search_address_feedback.setHTML(error.addressNotFound)
this.resetitem(['route', 'stops', 'start'])
}
else {
this.resetitem(['start']);
this.startlocation.details = response.Placemark[0];
this.startlocation.coord = new google.maps.LatLng(this.startlocation.details.Point.coordinates[1], this.startlocation.details.Point.coordinates[0]);
this.startlocation.address = address
// new google.maps.LatLng(item.lat,item.lng)
this.tab.tab_search_address_feedback.setHTML(variable.addressFound)
this.infowindow.Body.start_address.setHTML(this.startlocation.address);
this.startlocation.point = this.createLocation(this.startlocation.coord, {'type': 'home', 'name': 'home'});
c_map.zoomMap([this.startlocation.coord, $pick(this.endlocation.coord ,new google.maps.LatLng('51.231129','4.4414377'))]);
if (this.endlocation.coord) {
this.defaultRoute.loadDirections([this.startlocation.coord, this.endlocation.coord]);
}
}
}.bind(this));
}.bind(this))
// get destinations
this.tab.tab_search_destination.addEvent('change', function(event){
event = new Event(event);
var value = $(event.target).options.selectedIndex;
this.resetitem(['route']);
if (value > 0) {
this.infowindow.Body.destination_address.setHTML($(event.target).options[value].text);
this.endlocation.details = this.endlocations[value-1];
this.endlocation.coord = new google.maps.LatLng(this.endlocation.details.lat,this.endlocation.details.lng);
//alert('destination chosen');
if (this.startlocation.point) {
c_map.zoomMap([this.startlocation.coord, $pick(this.endlocation.coord ,new google.maps.LatLng('51.231129','4.4414377'))]);
this.defaultRoute.loadDirections([this.startlocation.coord, this.endlocation.coord]);
}
}
else {
//alert('no destination chosen');
}
}.bind(this));
this.tab.events.addEvent('onDestinationsLoaded', function(response){
if (response.s == "true") {
this.resetitem(['destinations','destination']);
this.tab.tab_search_destination.empty();
new Element('option', {'value': 0}).setText(variable.choose_destination).injectInside(this.tab.tab_search_destination);
this.endlocations = this.populatemap(response.d, 0);
this.endlocations.each(function(item, index){
new Element('option', {'value': item.id}).setText(item.name).injectInside(this.tab.tab_search_destination);
}, this);
}
}.bind(this));
this.defaultRoute.addEvent('onDirectionsLoading', function(response){
this.infowindow.Body.routeShort_value.setHTML(variable.calculateRoute);
}.bind(this));
this.altRoute.addEvent('onDirectionsLoading', function(response){
this.infowindow.Body.routeAlt_value.setHTML(variable.calculateRoute);
}.bind(this));
this.defaultRoute.addEvent('onDirectionsLoaded', function(response){
this.infowindow.Body.routeShort_value.setHTML(this.defaultRoute.distance.html + " (" + this.defaultRoute.duration.html + ") ");
this.defaultRoute.showRoute(c_map, {'width':5});
//this.defaultRoute.route.weight = 5;
}.bind(this));
this.altRoute.addEvent('onDirectionsLoaded', function(response){
this.infowindow.Body.routeAlt_value.setHTML(this.altRoute.distance.html + " (" + this.altRoute.duration.html + ") ");
this.altRoute.showRoute(c_map, {'color': '#f00', 'weight':5});
//this.altRoute.route.color='#f00';
//this.altRoute.route.weight = 5;
}.bind(this));
// update DOM
output = this.tab.tab_search;
this.infowindowFn('show');
break;
default:
this.active_tab = null;
break;
}
this.d_body.empty();
if (output) output.injectInside(this.d_body);
},
resetitem: function(input) {
input.each( function(item, index) {
switch (item) {
case 'event':
if ($defined(this.c_date)) this.c_date = null;
if ($defined(this.infowindow.Body.event_name)) this.infowindow.Body.event_name.empty();
break;
case 'date':
if ($defined(this.c_date)) this.c_date = null;
if ($defined(this.infowindow.Body.event_date)) this.infowindow.Body.event_date.empty();
if ($defined(this.tab.tab_search_dateselect)) {
this.tab.tab_search_dateselect.empty();
new Element('option', {'value': 0}).setText(variable.choose_date).injectInside(this.tab.tab_search_dateselect);
}
break;
case 'map':
if (this.defaultMapLoaded == 0) {
this.removeMarkers(this.startlocations);
this.removeMarkers(this.stoplocations);
this.removeMarkers(this.endlocations);
this.startlocations = new Array();
this.stoplocations = new Array();
this.endlocations = new Array();
this.defaultMap();
}
break;
case 'route':
this.resetRoute(['default', 'alt']);
break;
case 'start':
if ($defined(this.infowindow.Body.start_address)) this.infowindow.Body.start_address.empty();
if ($defined(this.startlocation.point)) c_map.mapObj.removeOverlay(this.startlocation.point);
this.startlocation = {};
break;
case 'stop':
if ($defined(this.infowindow.Body.stop_address)) this.infowindow.Body.stop_address.empty();
if ($defined(this.stoplocation.point)) this.stoplocation.point.remove();
this.stoplocation = {};
break;
case 'destination':
if ($defined(this.tab.tab_search_destination)) this.tab.tab_search_destination.empty();
if ($defined(this.infowindow.Body.destination_address)) this.infowindow.Body.destination_address.empty();
if ($defined(this.endlocation.point)) this.endlocation.point.remove();
this.endlocation = {};
if ($defined(this.tab.tab_search_destination)) new Element('option', {'value': 0}).setText(variable.choose_eventfirst).injectInside(this.tab.tab_search_destination);
break;
case 'starts':
this.removeMarkers(this.startlocations);
this.startlocations = new Array();
if ($defined(this.infowindow.Body.start_address)) this.infowindow.Body.start_address.empty();
break;
case 'stops':
this.removeMarkers(this.stoplocations);
this.stoplocations = new Array();
if ($defined(this.infowindow.Body.stop_address)) this.infowindow.Body.stop_address.empty();
break;
case 'destinations':
this.removeMarkers(this.endlocations);
this.endlocations = new Array();
if ($defined(this.infowindow.Body.destination_address)) this.infowindow.Body.destination_address.empty();
break;
case 'dimStops':
if (this.stop_markers) this.stop_markers.each(function(dest){
c_map.mapObj.removeOverlay(dest);
});
break;
}
}.bind(this));
},
// Events
getEvents: function(output) {
output.empty();
new Element('option', {'value': 0}).setText(variable.choose_event).injectInside(output);
this.loadEvents(output);
},
loadEvents: function(output) {
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
output.fireEvent('onEventsLoaded', response);
}.bind(this)
}).send({"action": "get_events", "lang": "nl"});
},
getDates: function(input_id, output) {
output.empty();
new Element('option', {'value': 0}).setText(variable.choose_date).injectInside(output);
if (input_id != 0) {
this.loadDates(input_id, output);
}
},
loadDates: function(date_id, output) {
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
output.fireEvent('onDatesLoaded', response);
}.bind(this)
}).send({"action": "get_dates", "id": date_id, "lang": "nl"});
},
getDestinations: function(input_id, output) {
if (input_id != 0) {
this.loadDestinations(input_id, output);
}
},
loadDestinations: function(date_id, output) {
//alert("/getdata.php?script=carpool¶meters=action=get_destinations|id=" + date_id + "|lang=nl");
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
output.fireEvent('onDestinationsLoaded', response);
}.bind(this)
}).send({"action": "get_destinations", "id": date_id, "lang": "nl"});
},
resetRoute: function(input) {
input.each(function(item, index){
switch (item) {
case 'default':
if ($defined(this.defaultRoute)) this.defaultRoute.resetRoute(c_map);
if ($defined(this.infowindow.Body.routeShort_value)) this.infowindow.Body.routeShort_value.empty();
break;
case 'alt':
if ($defined(this.altRoute)) this.altRoute.resetRoute(c_map);
if ($defined(this.infowindow.Body.routeAlt_value)) this.infowindow.Body.routeAlt_value.empty();
break
}
//alert('reset route: ' + item);
}.bind(this));
},
resetMap: function() {
c_map.resetMap();
},
defaultMap: function() {
this.splash_feedback.setHTML(variable.loading.loadingDefaultLocations);
this.map = new Element;
this.loadDestinations(0, this.map);
this.map.addEvent('onDestinationsLoaded', function(response){
if (response.s == "true") {
this.endlocations = this.populatemap(response.d, 1);
}
this.fireEvent('onDefaultLocationsLoaded');
}.bind(this));
},
populatemap: function(input, defaultmap) {
// var output = new Array;
input.each(function(item, index){
var point = new google.maps.LatLng(item.lat,item.lng);
marker = this.createLocation(point, {'type': item.d_type, 'name': item.name});
item['point'] = marker;
}, this);
this.defaultMapLoaded = defaultmap;
return input;
},
removeMarkers: function(input) {
input.each(function(input, index){
c_map.mapObj.removeOverlay(input.point);
}, this);
return input;
},
loadCarpoolers: function(date_id) {
},
saveCarpooler: function() {
var error = false;
if(!this.c_date.ID){
alert('kies een evenement en datum...');
error = true;
}
if(!this.stoplocation.coord){
alert('voer uw adres in...');
error = true;
}
if (error) {
return false;
}
else {
this.dialogFn('reset');
var output = new Element('div');
var header = new Element('div', {'class' : 'header'}).injectInside(output);
var body = new Element('div', {'class' : 'body scroll'}).injectInside(output);
// var footer = new Element('div', {'class' : 'footer'}).injectInside(output);
new Element('h1').setHTML(variable.saveDemand).injectInside(header);
new Element('p').setHTML(variable.saveOfferDescription).injectInside(header);
var localityName = ($chk(this.stoplocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea)) ?
this.stoplocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName :
this.stoplocation.details.AddressDetails.Country.AdministrativeArea.Locality.LocalityName;
var form = new Element('form', {'id': 'contact_form'}).addEvent('submit', function(event){
event = new Event(event).stop();
var temp = new Element('div');
form.injectInside(temp);
body.empty();
new Element('p').setHTML(variable.saveOffer).injectInside(body);
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
form.fireEvent('onMessageSend', response);
}.bind(this)
}).send({
"action": "saveCarpooler",
"firstname": form.save_form_firstname.value,
"lastname": form.save_form_lastname.value,
"address": this.stoplocation.details.address,
"localityname": localityName,
"driver": 'N',
"passengers": numberOfPassengers,
"lat": this.stoplocation.details.Point.coordinates[1],
"lng": this.stoplocation.details.Point.coordinates[0],
"email":form.save_form_email.value,
"phone":form.save_form_phone.value,
"carpooldestination_id": 0,
"message":form.save_form_message.value,
"distancetodest": 0,
"timetodest": 0,
"lang": "nl",
"eventitem_id": this.c_date.ID
}, this);
}.bind(this)).injectInside(body);
form.addEvent('onMessageSend', function(response){
if (response.s == "true") {
body.empty();
new Element('p').setHTML(variable.dataSaved).injectInside(body);
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(body);
new Element('a', {'href': '#'}).setHTML(variable.close).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
}
else {
body.empty();
form.injectInside(body);
new Element('p', {'class': 'errors'}).setHTML(variable.dataNotSaved).injectInside(body);
form.injectInside(body)
}
}.bind(this));
var numberOfPassengers = 1;
var p_event = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.event).injectInside(p_event);
new Element('span', {'class': 'input float_left'}).setHTML(this.c_event.Name + "
" + this.c_date.Name).injectInside(p_event);
var p_start = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('span', {'class': 'label float_left'}).setHTML(variable.address).injectInside(p_start);
new Element('span', {'class': 'input float_left'}).setHTML(this.stoplocation.details.address).injectInside(p_start);
var p_firstname = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_firstname', 'class':'label float_left clear_both'}).setHTML(variable.firstname).injectInside(p_firstname);
var firstname = new Element('input', {'type':'text', 'id': 'save_form_firstname', 'name': 'save_form_firstname', 'class': 'input float_left'}).injectInside(p_firstname);
var p_lastname = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_lastname', 'class':'label float_left clear_both'}).setHTML(variable.lastname).injectInside(p_lastname);
var lastname = new Element('input', {'type':'text', 'id': 'save_form_lastname', 'name': 'save_form_lastname', 'class': 'input float_left'}).injectInside(p_lastname);
var p_email = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_email', 'class':'label float_left clear_both'}).setHTML(variable.email).injectInside(p_email);
var email = new Element('input', {'type':'text', 'id': 'save_form_email', 'name': 'save_form_email', 'class': 'input float_left'}).injectInside(p_email);
var p_phone = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_phone', 'class':'label float_left clear_both'}).setHTML(variable.phone).injectInside(p_phone);
var phone = new Element('input', {'type':'text', 'id': 'save_form_phone', 'name': 'save_form_phone', 'class': 'input float_left'}).injectInside(p_phone);
var p_passengers = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_passengers', 'class':'label float_left clear_both'}).setHTML(variable.passengers).injectInside(p_passengers);
var passengers = new Element('span', {'name': 'save_form_passengers', 'class': 'float_left'}).setHTML(numberOfPassengers).injectInside(p_passengers);
new Element('a', {'href': '#', 'class':'float_left'}).setStyle('margin-left', '1em').setHTML(variable.add).injectInside(p_passengers).addEvent('click', function(e) {
new Event(e).stop();
numberOfPassengers++;
passengers.setHTML(numberOfPassengers);
});
new Element('a', {'href': '#', 'class':'float_left'}).setStyle('margin-left', '1em').setHTML(variable.del).injectInside(p_passengers).addEvent('click', function(e) {
// new Event(e).stop();
if (numberOfPassengers > 1) numberOfPassengers--;
passengers.setHTML(numberOfPassengers);
});
var p_messa = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_message', 'class':'label float_left clear_both'}).setHTML(variable.message).injectInside(form);
var message = new Element('textarea', {'id': 'save_form_message', 'name': 'save_form_message', 'rows': '6', 'class': 'input float_left'}).injectInside(form)
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(form);
new Element('input', {'type':'submit', 'value': variable.save}).injectInside(buttons);
new Element('a', {'href': '#'}).setStyle('margin-left', '1em').setHTML(variable.cancel).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
output.injectInside(this.dialog_content);
this.dialogFn('show');
this.overlayFn('show', {'effect':false});
}
},
searchCarpoolers: function() {
var error = false;
if(!this.c_date.ID){
alert('kies een evenement en datum...');
error = true;
}
if(!this.startlocation.coord){
alert('voer uw adres in...');
error = true;
}
if(!this.endlocation.coord){
alert('kies een bestemming...');
error = true;
}
if (error) {
return false;
}
else {
this.carpoolers = new Element().addEvent('onCarpoolersLoaded', function(response){
if (response.s == "true") {
this.resetitem(['stops']);
response.c.each(function(item, index){
if (item.passengers <= 10) {
var number = item.passengers;
}
else {
var number = '10plus';
}
var point = new google.maps.LatLng(item.lat,item.lng);
var marker = this.createLocation(point, {'type': 'stop_' + number, 'name': item.name});
GEvent.addListener(marker, "click", function(e) {
//this.activeRoute = 'default'
this.resetRoute(['alt']);
this.infowindow.Body.stop_address.setHTML(item.localityname);
if (item.message == 'true') {
new Element('br').injectInside(this.infowindow.Body.stop_address)
new Element('a').setHTML(variable.moreInfo).setProperty('href', "#").injectInside(this.infowindow.Body.stop_address).addEvent('click', function(e) {
new Event(e).stop();
this.moreInfo(item);
}.bind(this));
}
new Element('br').injectInside(this.infowindow.Body.stop_address)
new Element('a').setHTML(variable.contact).setProperty('href', "#").injectInside(this.infowindow.Body.stop_address).addEvent('click', function(e) {
new Event(e).stop();
this.contactCarpooler(item);
}.bind(this));
this.altRoute.loadDirections([this.startlocation.coord, e, this.endlocation.coord]);
//alert("clicked " + name);
}.bind(this));
item['point'] = marker;
}, this);
this.stoplocations = response.c;
this.toggleDock('hide');
}
else {
alert('geen aanvragers gevonden...');
}
}.bind(this));
this.carpoolers.fireEvent('onCarpoolersLoading');
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
this.carpoolers.fireEvent('onCarpoolersLoaded', response);
}.bind(this)
}).send({"action": "get_carpoolers", "id": this.c_date.ID, "drivers": false , "lang": "nl"});
}
},
contactCarpooler: function(contact, args) {
this.dialogFn('reset');
var output = new Element('div');
var header = new Element('div', {'class' : 'header'}).injectInside(output);
var body = new Element('div', {'class' : 'body scroll'}).injectInside(output);
// var footer = new Element('div', {'class' : 'footer'}).injectInside(output);
new Element('h1').setHTML(variable.contactCarpooler).injectInside(header);
new Element('p').setHTML(variable.contactCarpoolerDescription).injectInside(header);
var subjectDescription = this.c_event.Name + " - " + this.c_date.Name;
var localityName = ($chk(this.startlocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea)) ?
this.startlocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName :
this.startlocation.details.AddressDetails.Country.AdministrativeArea.Locality.LocalityName;
var form = new Element('form', {'id': 'contact_form'}).addEvent('submit', function(event){
event = new Event(event).stop();
var temp = new Element('div');
form.injectInside(temp);
body.empty();
new Element('p').setHTML(variable.sendingMessage).injectInside(body);
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
form.fireEvent('onMessageSend', response);
}.bind(this)
}).send({
"action": "contactCarpooler",
"carpooler_id": contact.id,
"email": form.contact_form_email.value,
"phone": form.contact_form_phone.value,
"message": form.contact_form_message.value,
"event_id": this.c_date.ID,
"drivers": "false",
"lang": "nl",
"localityName": localityName
}, this);
}.bind(this)).injectInside(body);
form.addEvent('onMessageSend', function(response){
if (response.s == "true") {
body.empty();
new Element('p').setHTML(variable.messageSent).injectInside(body);
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(body);
new Element('a', {'href': '#'}).setHTML(variable.close).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
}
else {
body.empty();
form.injectInside(body);
new Element('p', {'class': 'errors'}).setHTML(variable.messageNotSent).injectInside(body);
form.injectInside(body)
}
}.bind(this));
var subject = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('span', {'class': 'label float_left'}).setHTML(variable.subject).injectInside(subject);
new Element('span', {'class': 'float_left'}).setHTML(subjectDescription).injectInside(subject);
var to = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.to).injectInside(to);
new Element('span', {'class': 'float_left'}).setHTML(variable.carpoolerFrom + " " + contact.localityname).injectInside(to);
var from = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.from).injectInside(from);
new Element('span', {'class': 'float_left'}).setHTML(variable.driverFrom + " " + localityName).injectInside(from);
new Element('label', {'for': 'contact_form_email', 'class':'label float_left clear_both'}).setHTML(variable.email).injectInside(form);
var lastname = new Element('input', {'type':'text', 'id': 'contact_form_email', 'name': 'contact_form_email', 'class': 'input float_left'}).injectInside(form);
new Element('label', {'for': 'contact_form_phone', 'class':'label float_left clear_both'}).setHTML(variable.phone).injectInside(form);
var lastname = new Element('input', {'type':'text', 'id': 'contact_form_phone', 'name': 'contact_form_phone', 'class': 'input float_left'}).injectInside(form);
new Element('br').injectInside(form);
new Element('label', {'for': 'contact_form_message', 'class':'label float_left clear_both'}).setHTML(variable.message).injectInside(form);
var message = new Element('textarea', {'id': 'contact_form_message', 'name': 'contact_form_message', 'rows': '6', 'class': 'input float_left'}).injectInside(form)
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(form);
new Element('input', {'type':'submit', 'value': variable.send}).injectInside(buttons);
new Element('a', {'href': '#'}).setStyle('margin-left', '1em').setHTML(variable.cancel).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
output.injectInside(this.dialog_content);
this.dialogFn('show');
this.overlayFn('show', {'effect':false});
},
saveDriver: function(contact, args) {
var error = false;
if(!this.c_date.ID){
alert('kies een evenement en datum...');
error = true;
}
if(!this.startlocation.coord){
alert('voer uw adres in...');
error = true;
}
if(!this.endlocation.coord){
alert('kies een bestemming...');
error = true;
}
if (error) {
return false;
}
else {
this.dialogFn('reset');
var output = new Element('div');
var header = new Element('div', {'class' : 'header'}).injectInside(output);
var body = new Element('div', {'class' : 'body scroll'}).injectInside(output);
// var footer = new Element('div', {'class' : 'footer'}).injectInside(output);
new Element('h1').setHTML(variable.saveOffer).injectInside(header);
new Element('p').setHTML(variable.saveOfferDescription).injectInside(header);
var localityName = ($chk(this.startlocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea)) ?
this.startlocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName :
this.startlocation.details.AddressDetails.Country.AdministrativeArea.Locality.LocalityName;
var form = new Element('form', {'id': 'contact_form'}).addEvent('submit', function(event){
event = new Event(event).stop();
var temp = new Element('div');
form.injectInside(temp);
body.empty();
new Element('p').setHTML(variable.saveOffer).injectInside(body);
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
form.fireEvent('onMessageSend', response);
}.bind(this)
}).send({
"action": "saveDriver",
"firstname": form.save_form_firstname.value,
"lastname": form.save_form_lastname.value,
"address": this.startlocation.details.address,
"localityname": localityName,
"driver": true,
"passengers": numberOfPassengers,
"lat": this.startlocation.details.Point.coordinates[1],
"lng": this.startlocation.details.Point.coordinates[0],
"email":form.save_form_email.value,
"phone":form.save_form_phone.value,
"carpooldestination_id": this.endlocation.details.id,
"message":form.save_form_message.value,
"distancetodest": this.defaultRoute.distance.meters,
"timetodest": this.defaultRoute.duration.seconds,
"lang": "nl",
"eventitem_id": this.c_date.ID
}, this);
}.bind(this)).injectInside(body);
form.addEvent('onMessageSend', function(response){
if (response.s == "true") {
body.empty();
new Element('p').setHTML(variable.dataSaved).injectInside(body);
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(body);
new Element('a', {'href': '#'}).setHTML(variable.close).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
}
else {
body.empty();
form.injectInside(body);
new Element('p', {'class': 'errors'}).setHTML(variable.dataNotSaved).injectInside(body);
form.injectInside(body)
}
}.bind(this));
var numberOfPassengers = 1;
var p_event = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.event).injectInside(p_event);
new Element('span', {'class': 'input float_left'}).setHTML(this.c_event.Name + "
" + this.c_date.Name).injectInside(p_event);
var p_start = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('span', {'class': 'label float_left'}).setHTML(variable.start).injectInside(p_start);
new Element('span', {'class': 'input float_left'}).setHTML(this.startlocation.details.address).injectInside(p_start);
var p_destination = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('span', {'class': 'label float_left'}).setHTML(variable.destination).injectInside(p_destination);
new Element('span', {'class': 'input float_left'}).setHTML(this.endlocation.details.name).injectInside(p_destination);
var p_firstname = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_firstname', 'class':'label float_left clear_both'}).setHTML(variable.firstname).injectInside(p_firstname);
var firstname = new Element('input', {'type':'text', 'id': 'save_form_firstname', 'name': 'save_form_firstname', 'class': 'input float_left'}).injectInside(p_firstname);
var p_lastname = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_lastname', 'class':'label float_left clear_both'}).setHTML(variable.lastname).injectInside(p_lastname);
var lastname = new Element('input', {'type':'text', 'id': 'save_form_lastname', 'name': 'save_form_lastname', 'class': 'input float_left'}).injectInside(p_lastname);
var p_email = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_email', 'class':'label float_left clear_both'}).setHTML(variable.email).injectInside(p_email);
var email = new Element('input', {'type':'text', 'id': 'save_form_email', 'name': 'save_form_email', 'class': 'input float_left'}).injectInside(p_email);
var p_phone = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_phone', 'class':'label float_left clear_both'}).setHTML(variable.phone).injectInside(p_phone);
var phone = new Element('input', {'type':'text', 'id': 'save_form_phone', 'name': 'save_form_phone', 'class': 'input float_left'}).injectInside(p_phone);
var p_passengers = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_passengers', 'class':'label float_left clear_both'}).setHTML(variable.passengers).injectInside(p_passengers);
var passengers = new Element('span', {'name': 'save_form_passengers', 'class': 'float_left'}).setHTML(numberOfPassengers).injectInside(p_passengers);
new Element('a', {'href': '#', 'class':'float_left'}).setStyle('margin-left', '1em').setHTML(variable.add).injectInside(p_passengers).addEvent('click', function(e) {
new Event(e).stop();
numberOfPassengers++;
passengers.setHTML(numberOfPassengers);
});
new Element('a', {'href': '#', 'class':'float_left'}).setStyle('margin-left', '1em').setHTML(variable.del).injectInside(p_passengers).addEvent('click', function(e) {
// new Event(e).stop();
if (numberOfPassengers > 1) numberOfPassengers--;
passengers.setHTML(numberOfPassengers);
});
var p_messa = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('label', {'for': 'save_form_message', 'class':'label float_left clear_both'}).setHTML(variable.message).injectInside(form);
var message = new Element('textarea', {'id': 'save_form_message', 'name': 'save_form_message', 'rows': '6', 'class': 'input float_left'}).injectInside(form)
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(form);
new Element('input', {'type':'submit', 'value': variable.save}).injectInside(buttons);
new Element('a', {'href': '#'}).setStyle('margin-left', '1em').setHTML(variable.cancel).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
output.injectInside(this.dialog_content);
this.dialogFn('show');
this.overlayFn('show', {'effect':false});
}
},
searchDrivers: function() {
var error = false;
if(!this.c_date.ID){
alert('kies een evenement en datum...');
error = true;
}
if(!this.stoplocation.coord){
alert('voer uw adres in...');
error = true;
}
if (error) {
return false;
}
else {
this.drivers = new Element().addEvent('onDriversLoaded', function(response){
if (response.s == "true") {
this.resetitem(['starts']);
response.c.each(function(item, index){
if (item.passengers <= 10) {
var number = item.passengers;
}
else {
var number = '10plus';
}
var point = new google.maps.LatLng(item.lat,item.lng);
var marker = this.createLocation(point, {'type': 'stop_' + number, 'name': item.name});
GEvent.addListener(marker, "click", function(e) {
this.resetRoute(['alt']);
var carpooldestination_id = item.carpooldestination_id;
this.endlocations.each(function(item, index) {
if (item['id'] == carpooldestination_id) {
this.endlocation.details = item;
}
}.bind(this));
this.infowindow.Body.destination_address.setHTML(this.endlocation.details.name);
this.endlocation.coord = new google.maps.LatLng(this.endlocation.details.lat,this.endlocation.details.lng)
this.startlocation.details = item;
this.startlocation.coord = new google.maps.LatLng(item.lat,item.lng)
this.infowindow.Body.start_address.setHTML(item.localityname);
if (item.message == 'true') {
new Element('br').injectInside(this.infowindow.Body.start_address)
new Element('a').setHTML(variable.moreInfo).setProperty('href', "#").injectInside(this.infowindow.Body.start_address).addEvent('click', function(e) {
new Event(e).stop();
this.moreInfo(item);
}.bind(this));
}
new Element('br').injectInside(this.infowindow.Body.start_address)
new Element('a').setHTML(variable.contact).setProperty('href', "#").injectInside(this.infowindow.Body.start_address).addEvent('click', function(e) {
new Event(e).stop();
this.contactDriver(item);
}.bind(this))
this.altRoute.loadDirections([this.startlocation.coord, this.stoplocation.coord, this.endlocation.coord]);
//alert("clicked " + name);
}.bind(this));
item['point'] = marker;
}, this);
this.startlocations = response.c;
this.toggleDock('hide');
}
else {
alert('geen aanbieders gevonden...');
}
}.bind(this));
this.drivers.fireEvent('onDriversLoading');
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
this.drivers.fireEvent('onDriversLoaded', response);
}.bind(this)
}).send({"action": "get_carpoolers", "id": this.c_date.ID, "drivers": true , "lang": "nl"});
}
},
contactDriver: function(contact, args) {
this.dialogFn('reset');
var output = new Element('div');
var header = new Element('div', {'class' : 'header'}).injectInside(output);
var body = new Element('div', {'class' : 'body scroll'}).injectInside(output);
// var footer = new Element('div', {'class' : 'footer'}).injectInside(output);
new Element('h1').setHTML(variable.contactDriver).injectInside(header);
new Element('p').setHTML(variable.contactDriverDescription).injectInside(header);
var subjectDescription = this.c_event.Name + " - " + this.c_date.Name;
var localityName = ($chk(this.stoplocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea)) ?
this.stoplocation.details.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName :
this.stoplocation.details.AddressDetails.Country.AdministrativeArea.Locality.LocalityName;
var form = new Element('form', {'id': 'contact_form'}).addEvent('submit', function(event){
event = new Event(event).stop();
var temp = new Element('div');
form.injectInside(temp);
body.empty();
new Element('p').setHTML(variable.sendingMessage).injectInside(body);
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
form.fireEvent('onMessageSend', response);
}.bind(this)
}).send({
"action": "contactDriver",
"carpooler_id": contact.id,
"email": form.contact_form_email.value,
"phone": form.contact_form_phone.value,
"message": form.contact_form_message.value,
"event_id": this.c_date.ID,
"lang": "nl",
"localityName": localityName
}, this);
}.bind(this)).injectInside(body);
form.addEvent('onMessageSend', function(response){
if (response.s == "true") {
body.empty();
new Element('p').setHTML(variable.messageSent).injectInside(body);
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(body);
new Element('a', {'href': '#'}).setHTML(variable.close).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
}
else {
body.empty();
form.injectInside(body);
new Element('p', {'class': 'errors'}).setHTML(variable.messageNotSent).injectInside(body);
form.injectInside(body)
}
}.bind(this));
var subject = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form);
new Element('span', {'class': 'label float_left'}).setHTML(variable.subject).injectInside(subject);
new Element('span', {'class': 'float_left'}).setHTML(subjectDescription).injectInside(subject);
var to = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.to).injectInside(to);
new Element('span', {'class': 'float_left'}).setHTML(variable.driverFrom + " " + contact.localityname).injectInside(to);
var from = new Element('p', {'class': 'float_left clear_both width100'}).injectInside(form)
new Element('span', {'class': 'label float_left'}).setHTML(variable.from).injectInside(from);
new Element('span', {'class': 'float_left'}).setHTML(variable.carpoolerFrom + " " + localityName).injectInside(from);
new Element('label', {'for': 'contact_form_email', 'class':'label float_left clear_both'}).setHTML(variable.email).injectInside(form);
var lastname = new Element('input', {'type':'text', 'id': 'contact_form_email', 'name': 'contact_form_email', 'class': 'input float_left'}).injectInside(form);
new Element('label', {'for': 'contact_form_phone', 'class':'label float_left clear_both'}).setHTML(variable.phone).injectInside(form);
var lastname = new Element('input', {'type':'text', 'id': 'contact_form_phone', 'name': 'contact_form_phone', 'class': 'input float_left'}).injectInside(form);
new Element('br').injectInside(form);
new Element('label', {'for': 'contact_form_message', 'class':'label float_left clear_both'}).setHTML(variable.message).injectInside(form);
var message = new Element('textarea', {'id': 'contact_form_message', 'name': 'contact_form_message', 'rows': '6', 'class': 'input float_left'}).injectInside(form)
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(form);
new Element('input', {'type':'submit', 'value': variable.send}).injectInside(buttons);
new Element('a', {'href': '#'}).setStyle('margin-left', '1em').setHTML(variable.cancel).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
output.injectInside(this.dialog_content);
this.dialogFn('show');
this.overlayFn('show', {'effect':false});
},
moreInfo: function(item) {
this.dialogFn('reset');
var output = new Element('div');
var header = new Element('div', {'class' : 'header'}).injectInside(output);
var body = new Element('div', {'class' : 'body scroll'}).injectInside(output);
// var footer = new Element('div', {'class' : 'footer'}).injectInside(output);
new Element('h1').setHTML(variable.moreInfo).injectInside(header);
var message = new Element('div').setHTML(variable.loadingData).injectInside(body);
var buttons = new Element('span', {'class': 'buttons float_left clear_both'}).injectInside(body);
new Element('a', {'href': '#'}).setStyle('margin-left', '1em').setHTML(variable.close).addEvent('click', function(e) {
new Event(e).stop();
this.dialogFn('hide');
this.overlayFn('hide', {'effect':true});
this.dialogFn('reset');
}.bind(this)).injectInside(buttons);
output.injectInside(this.dialog_content);
var jSonRequest = new Json.Remote("/getdata.php?script=carpool", {
method: 'post',
async: true,
onComplete: function(response) {
this.infowindow.events.fireEvent('onMessageSend', response);
}.bind(this)
}).send({
"action": 'get_carpooler',
"id": item.id
}, this);
this.infowindow.events.addEvent('onMessageSend', function(response){
if (response.s == "true") {
var carpooler = response.c[0];
message.setHTML(carpooler.messageHtml);
}
else {
message.setHTML(variable.errorLoadingData);
}
}.bind(this));
this.dialogFn('show');
this.overlayFn('show', {'effect':false});
}
});
carpool.implement(new Events);