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

Merge branch 'trial/printing' into develop

Browse Source
This commit is contained in:
DennisSchiefer 2012-04-17 22:34:18 +02:00
commit 8d5d1a9400
3 changed files with 65 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -41,26 +41,43 @@ show: function(response) {
// add events // add events
OSRM.printwindow.document.getElementById('gui-printer').onclick = OSRM.printwindow.printWindow; OSRM.printwindow.document.getElementById('gui-printer').onclick = OSRM.printwindow.printWindow;
// // localization
OSRM.printwindow.document.getElementById('description-label').innerHTML = OSRM.loc( "ROUTE_DESCRIPTION" );
OSRM.printwindow.document.getElementById('overview-map-label').innerHTML = OSRM.loc( "OVERVIEW_MAP" ); OSRM.printwindow.document.getElementById('overview-map-label').innerHTML = OSRM.loc( "OVERVIEW_MAP" );
// create header // create header
header = header =
'<div class="full">' + '<div class="full">' +
'<div style="display:table-row">' +
'<div class="left">' + '<div class="left">' +
'<div class="header-title base-font">' + OSRM.loc("ROUTE_DESCRIPTION") + '</div>' + '<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("GUI_START")+ ': </div>' +
'<div class="header-content">' + OSRM.loc("DISTANCE")+": " + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' + '<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("GUI_END")+ ': </div>' +
'<div class="header-content">' + OSRM.loc("DURATION")+": " + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
'</div>' + '</div>' +
'<div class="right">' +
'<div class="left" style="width:100%">' +
'<div class="header-content" style="font-weight:bold;">' + document.getElementById("gui-input-source").value + '</div>' +
'<div class="header-content" style="font-weight:bold;">' + document.getElementById("gui-input-target").value + '</div>' +
'</div>' + '</div>' +
'</div>';
'<div class="left">' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("DISTANCE")+': </div>' +
'<div class="header-content" style="margin:0px 2px 0px 0px;">' + OSRM.loc("DURATION")+': </div>' +
'</div>' +
'<div class="left">' +
'<div class="header-content" style="font-weight:bold;">' + OSRM.Utils.metersToDistance(response.route_summary.total_distance) + '</div>' +
'<div class="header-content" style="font-weight:bold;">' + OSRM.Utils.secondsToTime(response.route_summary.total_time) + '</div>' +
'</div>' +
'</div>' +
'</div>' +
'<div class="quad"></div>';
// create route description // create route description
var route_desc = ''; var route_desc = '';
route_desc += '<table id="thetable" class="results-table medium-font">'; route_desc += '<table id="thetable" class="results-table medium-font">';
route_desc += '<thead style="display:table-header-group;"><tr><td colspan="3">'+header+'</td></tr></thead>'; route_desc += '<thead style="display:table-header-group;"><tr><td colspan="3">'+header+'</td></tr></thead>';
route_desc += '</thead>';
route_desc += '<tbody stlye="display:table-row-group">'; route_desc += '<tbody stlye="display:table-row-group">';
for(var i=0; i < response.route_instructions.length; i++){ for(var i=0; i < response.route_instructions.length; i++){
@ -72,7 +89,6 @@ show: function(response) {
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 width="18px" src="../'+OSRM.RoutingDescription.getDrivingInstructionIcon(response.route_instructions[i][0])+'" alt="" />';
console.log(route_desc);
route_desc += "</td>"; route_desc += "</td>";
route_desc += '<td class="result-items">'; route_desc += '<td class="result-items">';
@ -99,8 +115,14 @@ show: function(response) {
route_desc += '</tbody>'; route_desc += '</tbody>';
route_desc += '</table>'; route_desc += '</table>';
// put everything in DOM // put everything in DOM
OSRM.printwindow.document.getElementById('description').innerHTML = route_desc; OSRM.printwindow.document.getElementById('description').innerHTML = route_desc;
OSRM.printwindow.document.getElementById('overview-description').innerHTML =
'<table id="" class="results-table medium-font">' +
'<thead style="display:table-header-group;"><tr><td colspan="3">'+header+'</td></tr></thead>'+
'</table>';
// init map // init map
var map = OSRM.printwindow.initialize( OSRM.DEFAULTS.TILE_SERVERS[0] ); var map = OSRM.printwindow.initialize( OSRM.DEFAULTS.TILE_SERVERS[0] );

33
WebContent/printing/printing.css
View File

@ -31,6 +31,13 @@ body
margin:5px; margin:5px;
} }
/* route description box */
#overview-description
{
width:500px;
margin:5px;
}
/* route map box */ /* route map box */
#overview-map #overview-map
@ -221,3 +228,29 @@ div.header-title
font-weight: normal; font-weight: normal;
} }
} }
/* table */
.full
{
display:table;
width:100%;
}
.left
{
display:table-cell;
text-align:left;
vertical-align:middle;
}
.right
{
display:table-cell;
text-align:right;
vertical-align:middle;
}
.center
{
display:table-cell;
text-align:center;
vertical-align:middle;
}

2
WebContent/printing/printing.html
View File

@ -53,11 +53,13 @@ or see http://www.gnu.org/licenses/agpl.txt.
</div> </div>
<!--description--> <!--description-->
<div id="description-label" class="header-title">Routenbeschreibung</div>
<div id="description"></div> <div id="description"></div>
<!--map--> <!--map-->
<div class="quad"></div> <div class="quad"></div>
<div id="overview-map-label" class="header-title">Übersichtskarte</div> <div id="overview-map-label" class="header-title">Übersichtskarte</div>
<div id="overview-description" class="results-table medium-font"></div>
<div id="overview-map"></div> <div id="overview-map"></div>
</body> </body>