sdfidk / skraafoto_frontend Goto Github PK

Webapplikation, som gør det muligt at finde og vise skråfotos.

License: MIT License

HTML 5.04% JavaScript 94.18% CSS 0.78%

skraafoto_frontend's Introduction

skraafoto_frontend

skraafoto_frontend (Skraafoto) is an application that lets users browse oblique arial photographs (skråfotos) in a web browser. Photographs are fetched using Skråfoto STAC API.

The full documentation is available at https://sdfidk.github.io/skraafoto_frontend/

For information on running local servers and testing, see Instructions for installation

Provided by Styrelsen for Dataforsyning og Infrastruktur 2023

skraafoto_frontend's People

Contributors

Stargazers

Watchers

Forkers

huulbaek septima thomasclausen

skraafoto_frontend's Issues

Shortkeys interfere with search

Shift+arrow shortkeys interfere with address search. Using shift+arrowLeft to mark a selection in the input field activates image rotation. Also you can't write capital letters using shift+letter in the input field.

html2canvas complains about being unable to clone tainted canvas in console

It doesn't seem to have any actual impact as the canvas it complains about is not the one it is using. The one it is complaining about being tainted is the map. If it's something we want to fix at some point, we should probably look at preventing the map from being tainted. Possibly related issue: niklasvh/html2canvas#2805

Url (update)

URL'er skal have tilføjet /rest.
https://api.dataforsyningen.dk/skraafoto_api/v1.0 -> https://api.dataforsyningen.dk/rest/skraafoto_api/v1.0

https://api.dataforsyningen.dk/skraafoto_api_test/v1.0 -> https://api.dataforsyningen.dk/rest/skraafoto_api_test/v1.0

Webtilgængelighed: SHIFT + TAB ignoreres

Når man trykker på SHIFT + TAB vil man normalt navigere til forrige interaktive element (link, knap osv.).
På https://skraafoto.dataforsyningen.dk/ ignores dette dog, hvilket gør det lidt besværligt at bruge tasteturet til at navigere med.

En hurtig søgning, og jeg har fundet denne funktion, som jeg vurderer er kilden til problemet:

skraafoto_frontend/src/modules/listeners.js

Lines 33 to 58 in ba88508

 function keyDownHandler(event) { 

 const isShiftKeyPressed = event.shiftKey; 

 const isInputField = event.target.tagName === 'INPUT' 

 if (isShiftKeyPressed && !isInputField) { 

 event.preventDefault() 

 switch (event.key) { 

 case 'ArrowDown': 

 shiftItemTime(0, -1) 

 break 

 case 'ArrowUp': 

 shiftItemTime(0, 1) 

 break 

 case 'ArrowLeft': 

 shiftItemOrientation(-1) 

 break 

 case 'ArrowRight': 

 shiftItemOrientation(1) 

 break 

 default: 

 // Handle other keys if needed 

 break 

 } 

 } 

 }

Kald fejler med orientation og center angivet

Det plejer at være muligt, at lave et kald med kun orientation og center angivet (fx https://skraafoto.dataforsyningen.dk/?orientation=north&center=524565,6257181), men nu giver det en fejl:
"Der var ingen billeder for det valgte koordinat."

Return building coordinates on address search

Return building coordinates on address search in stead of access road coordinates.

Cache responses from STAC API

Consider setting CacheControl on servers to enable clients to cache responses from STAC API.

Check styles

Check general styles now that @dataforsyningen/css has been upgradd.

Improvement: Bedre cachebusting af statiske filer

Ikke alle javascript- og CSS-filer bliver bygget med et nyt navn, når vi sender til prod.
Det betyder, at brugere bliver nødt til at lave hard refresh i deres browsere for ikke at få gamle fejl.

Det kan vi sikkert gøre bedre.

Download feature should download entire image

Download feature should download entire image - not the current view.

Unable to load views within VDI session

Hi SDFI.

We have a client that relies on skraafoto.dataforsyningen.dk in their daily work and has now switched to a VDI desktop for their work.
Here we are unable to view any of the pictures that accompany the 2d view of the addresses entered. The VDI session is GPU accelerated and we have confirmed this by running

We in IT have tried a lot of things and these are our findings:

it works in Microsoft Edge & not Google Chrome Chrome
When opening Chrome Dev Tools we see this error in the console
We have tried to disable hardware acceleration but this did not do anything

Anyway, we can provide logs or other ways of reporting this issue to make your life easier?

Write tests for URL sanitation

Write automated tests for URL sanitation.

E2E testing

Set up a couple more E2E tests.

Performance issue

A user comments that having https://skraafoto.dataforsyningen.dk open in a browser for too long (how long?) causes the computer to become hot (browser undisclosed).

Obviously there is some computing going on - even when the user is not interacting with the web page.

My best guess is that the culprit is the loading animation. Since it never stops and just keeps spinning invisibly in the the background when all images are loaded. This was a hack. It might be improved by listening to OpenLayer's loadended or rendercomplete events and stopping the animation accordingly.

	function keyDownHandler(event) {
	const isShiftKeyPressed = event.shiftKey;
	const isInputField = event.target.tagName === 'INPUT'

	if (isShiftKeyPressed && !isInputField) {
	event.preventDefault()

	switch (event.key) {
	case 'ArrowDown':
	shiftItemTime(0, -1)
	break
	case 'ArrowUp':
	shiftItemTime(0, 1)
	break
	case 'ArrowLeft':
	shiftItemOrientation(-1)
	break
	case 'ArrowRight':
	shiftItemOrientation(1)
	break
	default:
	// Handle other keys if needed
	break
	}
	}
	}