Open-Harbor/osrm-backend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

continued work on printing header

Browse Source
This commit is contained in:
DennisSchiefer 2012-04-24 15:28:09 +01:00
parent c0b71cb62a
commit 7cdeeb0723
2 changed files with 54 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
WebContent/printing/OSRM.Printing.js
View File

@ -44,37 +44,58 @@ show: function(response) {
var header = var header =
'<thead class="header-group"><tr><td colspan="3">' + '<thead class="header-group"><tr><td colspan="3">' +
'<div class="full">' + // '<div class="full">' +
'<div style="display:table-row">' + // '<div class="row">' +
// '<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("GUI_START")+ ': </div>' +
// '<div class="left header-content" style="width:100%;font-weight:bold;">' + document.getElementById("gui-input-source").value + '</div>' +
// '<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("DISTANCE")+': </div>' +
// '<div class="left header-content" style="font-weight:bold;">' + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
// '</div>' +
// '<div class="row">' +
// '<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("GUI_END")+ ': </div>' +
// '<div class="left header-content" style="width:100%;font-weight:bold;">' + document.getElementById("gui-input-target").value + '</div>' +
// '<div class="left header-content" style="padding:0px 5px 0px 0x;">' + OSRM.loc("DURATION")+': </div>' +
// '<div class="left header-content" style="font-weight:bold;">' + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
// '</div>' +
// '</div>' +
'<div class="left">' + '<div class="full">' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("GUI_START")+ ': </div>' + '<div class="row">' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("GUI_END")+ ': </div>' +
'</div>' +
'<div class="left" style="width:100%">' + '<div class="left" style="width:100%">' +
'<div class="header-content" style="font-weight:bold;">' + document.getElementById("gui-input-source").value + '</div>' + '<div class="full">' +
'<div class="header-content" style="font-weight:bold;">' + document.getElementById("gui-input-target").value + '</div>' + '<div class="row">' +
'<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("GUI_START")+ ': </div>' +
'<div class="left header-content" style="width:100%;font-weight:bold;">' + document.getElementById("gui-input-source").value + '</div>' +
'</div>' + '</div>' +
'<div class="row">' +
'<div class="left">' + '<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("GUI_END")+ ': </div>' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("DISTANCE")+': </div>' + '<div class="left header-content" style="font-weight:bold;">' + document.getElementById("gui-input-target").value + '</div>' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("DURATION")+': </div>' +
'</div>' + '</div>' +
'</div>' +
'</div>' +
'<div class="left">' + '<div class="left">' +
'<div class="header-content" style="font-weight:bold;">' + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' + '<div class="full">' +
'<div class="header-content" style="font-weight:bold;">' + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' + '<div class="row">' +
'<div class="left header-content" style="padding:0px 5px 0px 0px;">' + OSRM.loc("DISTANCE")+': </div>' +
'<div class="left header-content" style="font-weight:bold;">' + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
'</div>' +
'<div class="row">' +
'<div class="left header-content" style="padding:0px 5px 0px 0x;">' + OSRM.loc("DURATION")+': </div>' +
'<div class="left header-content" style="font-weight:bold;">' + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
'</div>' +
'</div>' +
'</div>' + '</div>' +
'</div>' + '</div>' +
'</div>' + '</div>' +
'<div class="quad"></div>' + '<div class="quad" />' +
'</td></tr></thead>'; '</td></tr></thead>';
// create route description // create route description
var route_desc = '<tbody class="row-group">'; var route_desc = '<tbody style="row-group">';
for(var i=0; i < response.route_instructions.length; i++){ for(var i=0; i < response.route_instructions.length; i++){
//odd or even ? //odd or even ?
var rowstyle='results-odd'; var rowstyle='results-odd';
@ -83,19 +104,15 @@ show: function(response) {
route_desc += '<tr class="'+rowstyle+'">'; route_desc += '<tr class="'+rowstyle+'">';
route_desc += '<td class="result-directions">'; route_desc += '<td class="result-directions">';
route_desc += '<img width="18px" src="../'+OSRM.RoutingDescription.getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />'; route_desc += '<img class="result-direction" src="../'+OSRM.RoutingDescription.getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />';
route_desc += "</td>"; route_desc += "</td>";
route_desc += '<td class="result-items">';
route_desc += '<div class="result-item">';
// build route description // build route description
route_desc += '<td class="result-items">';
if( response.route_instructions[i][1] != "" ) if( response.route_instructions[i][1] != "" )
route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"$1").replace(/%s/, response.route_instructions[i][1]).replace(/%d/, OSRM.loc(response.route_instructions[i][6])); route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"$1").replace(/%s/, response.route_instructions[i][1]).replace(/%d/, OSRM.loc(response.route_instructions[i][6]));
else else
route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"").replace(/%d/, OSRM.loc(response.route_instructions[i][6])); route_desc += OSRM.loc(OSRM.RoutingDescription.getDrivingInstruction(response.route_instructions[i][0])).replace(/\[(.*)\]/,"").replace(/%d/, OSRM.loc(response.route_instructions[i][6]));
route_desc += '</div>';
route_desc += "</td>"; route_desc += "</td>";
route_desc += '<td class="result-distance">'; route_desc += '<td class="result-distance">';

30
WebContent/printing/printing.css
View File

@ -84,36 +84,32 @@ div.header-title
{ {
background-color: #FFF9BB; background-color: #FFF9BB;
} }
.result-counter
{
text-align:right;
vertical-align:top;
font-weight:bold;
padding:1px 5px 1px 5px;
}
.result-items .result-items
{ {
text-align:left; text-align:left;
vertical-align: middle; vertical-align: middle;
width:100%; width:100%;
padding:1px; padding:1px;
border-bottom: 1px solid black;
} }
.result-directions .result-directions
{ {
text-align:left; text-align:left;
vertical-align: middle; vertical-align: middle;
padding:1px 5px 1px 5px; padding:1px 5px 1px 5px;
border-bottom: 1px solid black;
}
.result-direction
{
height:36px;
width:36px;
} }
.result-distance .result-distance
{ {
text-align:right; text-align:right;
vertical-align: middle; vertical-align: middle;
padding:1px 1px 1px 5px; padding:1px 1px 1px 5px;
} border-bottom: 1px solid black;
.result-item
{
cursor:pointer;
color:#000000
} }
.no-results .no-results
{ {
@ -238,23 +234,27 @@ div.header-title
display:table; display:table;
width:100%; width:100%;
} }
.row
{
display:table-row;
}
.left .left
{ {
display:table-cell; display:table-cell;
text-align:left; text-align:left;
vertical-align:middle; vertical-align:top;
} }
.right .right
{ {
display:table-cell; display:table-cell;
text-align:right; text-align:right;
vertical-align:middle; vertical-align:top;
} }
.center .center
{ {
display:table-cell; display:table-cell;
text-align:center; text-align:center;
vertical-align:middle; vertical-align:top;
} }
.header-group .header-group
{ {