Commit edbab1f9 authored by Axel Bocciarelli's avatar Axel Bocciarelli
Browse files

Clean up index.html

parent b6b6b5a9
......@@ -6,22 +6,14 @@
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<meta name="theme-color" content="#000000" />
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<meta name="theme-color" content="#000000" />
<!-- Latest compiled and minified CSS -->
<link
......@@ -31,16 +23,7 @@
crossorigin="anonymous"
/>
<!-- <link rel="stylesheet" href="https://bootswatch.com/3/readable/bootstrap.min.css"> -->
<!-- Optional theme
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
-->
<!-- icons for the editor-->
<!--<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">-->
<title>ESRF Portal</title>
<title>ESRF Data Portal</title>
</head>
<body>
......@@ -48,61 +31,5 @@
You need to enable JavaScript to run this app.
</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
<script>
function makeFullScreen(img) {
if (img.style.height && img.style.width) {
// This test prevents bad image resizing out of fullscreen mode in case the user clicks several times on the image when it is in fullscreen mode.
let originalHeightByStyle = img.style.height;
let originalWidthByStyle = img.style.width;
img.setAttribute('style', '');
img.setAttribute('originalHeightByStyle', originalHeightByStyle);
img.setAttribute('originalWidthByStyle', originalWidthByStyle);
}
img.onfullscreenchange = function handleFullscreenChange(event) {
let img = event.target;
let isFullscreen = document.fullscreenElement === img;
if (!isFullscreen) {
// img goes out of fullscreen mode
img.style.height = img.getAttribute('originalHeightByStyle');
img.style.width = img.getAttribute('originalWidthByStyle');
img.style.cursor = 'zoom-in';
}
};
img.onwebkitfullscreenchange = img.onfullscreenchange;
img.onmozfullscreenchange = img.onfullscreenchange;
img.onMSFullscreenChange = img.onfullscreenchange;
try {
if (img.requestFullscreen) {
img.requestFullscreen();
} else if (img.msRequestFullscreen) {
img.msRequestFullscreen();
} else if (img.mozRequestFullScreen) {
img.mozRequestFullScreen();
} else if (img.webkitRequestFullscreen) {
img.webkitRequestFullscreen();
} else {
console.log('Fullscreen API is not supported');
}
} catch (e) {
console.log('make full screen not supported');
}
}
</script>
</html>
......@@ -30,6 +30,10 @@ import LogbookPager from '../LogbookPager';
import TagListInLine from '../Tag/TagListInLine';
import EventIcon from './EventIcon';
import './eventList.css';
import { makeFullScreen } from '../../../helpers';
// Expose on window to use as `onClick` handler on images
window.makeFullScreen = makeFullScreen;
/**
* The list of the all events
......
......@@ -104,3 +104,47 @@ export function addAddressIfAbsent(addresses, addressToAdd) {
return [addressToAdd, ...addresses];
}
export function makeFullScreen(img) {
if (img.style.height && img.style.width) {
// This test prevents bad image resizing out of fullscreen mode in case the user clicks several times on the image when it is in fullscreen mode.
const originalHeightByStyle = img.style.height;
const originalWidthByStyle = img.style.width;
img.setAttribute('style', '');
img.setAttribute('originalHeightByStyle', originalHeightByStyle);
img.setAttribute('originalWidthByStyle', originalWidthByStyle);
}
img.onfullscreenchange = function handleFullscreenChange(event) {
const img = event.target;
const isFullscreen = document.fullscreenElement === img;
if (!isFullscreen) {
// img goes out of fullscreen mode
img.style.height = img.getAttribute('originalHeightByStyle');
img.style.width = img.getAttribute('originalWidthByStyle');
img.style.cursor = 'zoom-in';
}
};
img.onwebkitfullscreenchange = img.onfullscreenchange;
img.onmozfullscreenchange = img.onfullscreenchange;
img.onMSFullscreenChange = img.onfullscreenchange;
try {
if (img.requestFullscreen) {
img.requestFullscreen();
} else if (img.msRequestFullscreen) {
img.msRequestFullscreen();
} else if (img.mozRequestFullScreen) {
img.mozRequestFullScreen();
} else if (img.webkitRequestFullscreen) {
img.webkitRequestFullscreen();
} else {
console.log('Fullscreen API is not supported');
}
} catch {
console.log('make full screen not supported');
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment