diff --git a/css/60_photos.css b/css/60_photos.css index b359bc30b..d508e6767 100644 --- a/css/60_photos.css +++ b/css/60_photos.css @@ -354,13 +354,21 @@ label.streetside-hires { } } -.kartaview-image-wrap, -.plane-photo { +.kartaview-image-wrap { width: 100%; height: 100%; transform-origin:0 0; } +.plane-frame { + width: 100%; + height: 100%; +} + +.plane-frame > .plane-photo{ + transform-origin:0 0; +} + .vegbilder-wrapper { position: relative; background-color: #000; diff --git a/data/core.yaml b/data/core.yaml index 3fe99c40a..334a8b244 100644 --- a/data/core.yaml +++ b/data/core.yaml @@ -1361,6 +1361,8 @@ en: vegbilder: title: "Vegbilder" tooltip: "Street-level photos from the Norwegian Public Roads Administration" + publisher: "Norwegian Public Roads Administration" + view_on: "View it on Vegbilder" mapillary_images: tooltip: "Street-level photos from Mapillary" mapillary_map_features: diff --git a/modules/services/vegbilder.js b/modules/services/vegbilder.js index 36d0b52fb..2d04bdaf4 100644 --- a/modules/services/vegbilder.js +++ b/modules/services/vegbilder.js @@ -1,6 +1,7 @@ import { json as d3_json, xml as d3_xml} from 'd3-fetch'; import { dispatch as d3_dispatch } from 'd3-dispatch'; import { pairs as d3_pairs } from 'd3-array'; +import { t, localizer } from '../core/localizer'; import { utilQsString, utilTiler, utilRebind, utilArrayUnion, utilStringQs} from '../util'; import {geoExtent, geoScaleToZoom, geoVecAngle} from '../geo'; import pannellumPhotoFrame from './pannellum_photo'; @@ -287,6 +288,12 @@ function roadReference(properties) { return reference; } +function localeTimestamp(date) { + const options = { day: '2-digit', month: '2-digit', year: 'numeric', + hour: 'numeric', minute: 'numeric', second: 'numeric' }; + return date.toLocaleString(localizer.localeCode(), options); +} + function partitionViewport(projection) { let z = geoScaleToZoom(projection.scale()); let z2 = (Math.ceil(z * 2) / 2) + 2.5; // round to next 0.5 and add 2.5 @@ -466,15 +473,21 @@ export default { if (d.captured_at) { attribution .append('span') - .attr('class', 'year') - .text(d.captured_at.getFullYear()); + .attr('class', 'captured_at') + .text(localeTimestamp(d.captured_at)); } attribution .append('a') .attr('target', '_blank') .attr('href', 'https://vegvesen.no') - .text('Norwegian Public Roads Administration'); + .call(t.append('vegbilder.publisher')); + + attribution + .append('a') + .attr('target', '_blank') + .attr('href', `https://vegbilder.atlas.vegvesen.no/?year=${d.captured_at.getFullYear()}&lat=${d.loc[1]}&lng=${d.loc[0]}&view=image&imageId=${d.key}`) + .call(t.append('vegbilder.view_on')); _currentFrame = d.is_sphere? _pannellumFrame : _planeFrame;