Dynamic basename ('/' or '/iris/') depending on initial path; Webpack dev server fully functional
This commit is contained in:
@ -7,7 +7,7 @@
|
||||
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<link rel="manifest" href="/iris/manifest.json" crossorigin="use-credentials" />
|
||||
<link rel="manifest" href="manifest.json" crossorigin="use-credentials" />
|
||||
|
||||
<!-- App setup -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
@ -18,24 +18,24 @@
|
||||
<meta name="theme-color" content="#222222" />
|
||||
|
||||
<!-- Icons -->
|
||||
<link rel="apple-touch-startup-image" href="/iris/assets/app-icon_512.png" />
|
||||
<link rel="apple-touch-icon" sizes="192x192" href="/iris/assets/app-icon_192.png" />
|
||||
<link rel="apple-touch-icon" sizes="512x512" href="/iris/assets/app-icon_512.png" />
|
||||
<link rel="apple-touch-icon" sizes="57x57" href="/iris/assets/app-icon_57.png">
|
||||
<link rel="apple-touch-icon" sizes="60x60" href="/iris/assets/app-icon_60.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="/iris/assets/app-icon_72.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="/iris/assets/app-icon_76.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="/iris/assets/app-icon_114.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="/iris/assets/app-icon_120.png">
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="/iris/assets/app-icon_144.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="/iris/assets/app-icon_152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/iris/assets/app-icon_180.png">
|
||||
<link rel="apple-touch-startup-image" href="assets/app-icon_512.png" />
|
||||
<link rel="apple-touch-icon" sizes="192x192" href="assets/app-icon_192.png" />
|
||||
<link rel="apple-touch-icon" sizes="512x512" href="assets/app-icon_512.png" />
|
||||
<link rel="apple-touch-icon" sizes="57x57" href="assets/app-icon_57.png">
|
||||
<link rel="apple-touch-icon" sizes="60x60" href="assets/app-icon_60.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="assets/app-icon_72.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="assets/app-icon_76.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="assets/app-icon_114.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="assets/app-icon_120.png">
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="assets/app-icon_144.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="assets/app-icon_152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="assets/app-icon_180.png">
|
||||
|
||||
<link class="favicon" rel="shortcut icon" type="image/ico" href="/iris/assets/favicon.png" />
|
||||
<link class="favicon" rel="shortcut icon" type="image/x-icon" href="/iris/assets/favicon.png" />
|
||||
<link class="favicon" rel="shortcut-icon" href="/iris/assets/favicon.png" />
|
||||
<link class="favicon" rel="shortcut icon" type="image/ico" href="assets/favicon.png" />
|
||||
<link class="favicon" rel="shortcut icon" type="image/x-icon" href="assets/favicon.png" />
|
||||
<link class="favicon" rel="shortcut-icon" href="assets/favicon.png" />
|
||||
|
||||
<link rel="mask-icon" href="/iris/assets/app-icon.svg" color="#08d58f" />
|
||||
<link rel="mask-icon" href="assets/app-icon.svg" color="#08d58f" />
|
||||
|
||||
<!-- Loading screen styles -->
|
||||
<style>
|
||||
@ -101,7 +101,7 @@
|
||||
<div id="app">
|
||||
<!-- ReactJS app gets injected here, replacing the loader -->
|
||||
<div id="app-loading">
|
||||
<img src="/iris/assets/app-icon.svg" id="app-loading-logo" />
|
||||
<img src="assets/app-icon.svg" id="app-loading-logo" />
|
||||
<div id="app-loading-loader" class="loading"></div>
|
||||
<div id="app-loading-message">
|
||||
<div id="app-loading-message-base"></div>
|
||||
@ -115,7 +115,7 @@
|
||||
|
||||
<script type="text/javascript">
|
||||
if ('serviceWorker' in navigator){
|
||||
navigator.serviceWorker.register('/iris/service-worker.js')
|
||||
navigator.serviceWorker.register('/service-worker.js')
|
||||
.then(function(registration){
|
||||
console.log('Service worker registered');
|
||||
}).catch(function(error){
|
||||
@ -167,11 +167,11 @@
|
||||
}
|
||||
|
||||
if (window.test_mode){ // Test mode, use un-minified code
|
||||
css.href = '/iris/app.css?v='+build;
|
||||
js.src = '/iris/app.js?v='+build;
|
||||
css.href = 'app.css?v='+build;
|
||||
js.src = 'app.js?v='+build;
|
||||
} else { // Production-grade, minified app
|
||||
css.href = '/iris/app.min.css?v='+build;
|
||||
js.src = '/iris/app.min.js?v='+build;
|
||||
css.href = 'app.min.css?v='+build;
|
||||
js.src = 'app.min.js?v='+build;
|
||||
}
|
||||
|
||||
setMessage('js', 'Loading core... ');
|
||||
|
||||
@ -17,7 +17,7 @@ const Icon = memo(({
|
||||
return (
|
||||
<span className={fullClassName}>
|
||||
<img
|
||||
src={`/iris/assets/icons/${name}.svg`}
|
||||
src={`/assets/icons/${name}.svg`}
|
||||
onClick={onClick}
|
||||
alt={`${name} icon`}
|
||||
/>
|
||||
@ -29,7 +29,7 @@ const Icon = memo(({
|
||||
<span className={fullClassName}>
|
||||
<img
|
||||
className={fullClassName}
|
||||
src={`/iris/assets/icons/${name}.gif`}
|
||||
src={`/assets/icons/${name}.gif`}
|
||||
onClick={onClick}
|
||||
alt={`${name} icon`}
|
||||
/>
|
||||
|
||||
@ -139,7 +139,7 @@ class MediaSession extends React.Component {
|
||||
// eslint-disable-next-line jsx-a11y/media-has-caption
|
||||
<audio
|
||||
id="media-session"
|
||||
src="/iris/assets/silence.mp3"
|
||||
src="/assets/silence.mp3"
|
||||
autoPlay
|
||||
loop
|
||||
style={{ display: 'none' }}
|
||||
|
||||
@ -65,7 +65,6 @@ const Track = ({
|
||||
getDragItem,
|
||||
events,
|
||||
}) => {
|
||||
return null;
|
||||
const index = getItemIndex();
|
||||
const [{ isDragging }, drag] = useDrag({
|
||||
type: 'TRACK',
|
||||
|
||||
@ -13,7 +13,7 @@ const root = createRoot(document.getElementById('app'));
|
||||
root.render(
|
||||
<Provider store={store}>
|
||||
<PersistGate loading={null} persistor={persistor}>
|
||||
<BrowserRouter basename="/iris">
|
||||
<BrowserRouter basename={window.location.pathname.indexOf('/iris') > -1 ? '/iris' : '/'}>
|
||||
<Routes>
|
||||
<Route path="*" element={<App />} />
|
||||
</Routes>
|
||||
|
||||
@ -55,7 +55,7 @@ const setFavicon = function (filename) {
|
||||
const new_link = document.createElement('link');
|
||||
new_link.className = link.className;
|
||||
new_link.rel = link.rel;
|
||||
new_link.href = `/iris/assets/${filename}`;
|
||||
new_link.href = `/assets/${filename}`;
|
||||
if (link.type) {
|
||||
new_link.type = link.type;
|
||||
}
|
||||
|
||||
@ -526,7 +526,7 @@ class Recommendations extends React.Component {
|
||||
|
||||
return (
|
||||
<div className="view discover-view preserve-3d">
|
||||
{theme === 'dark' && <Parallax image="/iris/assets/backgrounds/discover.jpg" />}
|
||||
{theme === 'dark' && <Parallax image="/assets/backgrounds/discover.jpg" />}
|
||||
<div className="intro preserve-3d">
|
||||
<div className="intro__liner">
|
||||
<h1><I18n path="discover.recommendations.body_title" /></h1>
|
||||
|
||||
@ -45,80 +45,80 @@ class Browse extends React.Component {
|
||||
for (const subdirectory of directory.subdirectories) {
|
||||
switch (subdirectory.name) {
|
||||
case 'Dirble':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-dirble.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-dirble.jpg'];
|
||||
break;
|
||||
|
||||
case 'Files':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-folders.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-folders.jpg'];
|
||||
break;
|
||||
|
||||
case 'Local media':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-folders.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-folders.jpg'];
|
||||
break;
|
||||
|
||||
case 'Spotify':
|
||||
case 'Spotify Browse':
|
||||
case 'Spotify Web Browse':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-spotify.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-spotify.jpg'];
|
||||
break;
|
||||
|
||||
case 'Spotify Tunigo':
|
||||
case 'Tunigo':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-tunigo.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-tunigo.jpg'];
|
||||
break;
|
||||
|
||||
case 'TuneIn':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-tunein.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-tunein.jpg'];
|
||||
break;
|
||||
|
||||
case 'SoundCloud':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-soundcloud.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-soundcloud.jpg'];
|
||||
break;
|
||||
|
||||
case 'Mixcloud':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-mixcloud.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-mixcloud.jpg'];
|
||||
break;
|
||||
|
||||
case 'iTunes Store: Podcasts':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-itunes.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-itunes.jpg'];
|
||||
break;
|
||||
|
||||
case 'SomaFM':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-somafm.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-somafm.jpg'];
|
||||
break;
|
||||
|
||||
case 'Jellyfin':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-jellyfin.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-jellyfin.jpg'];
|
||||
break;
|
||||
|
||||
case 'Podcasts':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-podcasts.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-podcasts.jpg'];
|
||||
break;
|
||||
|
||||
case 'Tidal':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-tidal.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-tidal.jpg'];
|
||||
break;
|
||||
|
||||
case 'Google':
|
||||
case 'Google Play':
|
||||
case 'Google Play Music':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-google.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-google.jpg'];
|
||||
break;
|
||||
|
||||
case 'YouTube Music':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-youtube.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-youtube.jpg'];
|
||||
break;
|
||||
|
||||
case 'bandcamp':
|
||||
case 'Bandcamp':
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-default.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-default.jpg'];
|
||||
break;
|
||||
|
||||
default:
|
||||
if (subdirectory.images?.medium) {
|
||||
subdirectory.icons = [subdirectory.images?.medium];
|
||||
} else {
|
||||
subdirectory.icons = ['/iris/assets/backgrounds/browse-default.jpg'];
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-default.jpg'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -140,7 +140,7 @@ class Reset extends React.Component {
|
||||
console.log('Reset complete, refreshing...');
|
||||
resetState(stateKeysToReset);
|
||||
setTimeout(
|
||||
() => closeModal(window.location = `/iris/settings${test_mode ? '?test_mode=0' : ''}`),
|
||||
() => closeModal(window.location = `/settings${test_mode ? '?test_mode=0' : ''}`),
|
||||
1000,
|
||||
);
|
||||
});
|
||||
|
||||
@ -4,27 +4,27 @@
|
||||
"name": "Iris",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/iris/assets/app-icon_64.png",
|
||||
"src": "/assets/app-icon_64.png",
|
||||
"type": "image/png",
|
||||
"sizes": "64x64"
|
||||
},
|
||||
{
|
||||
"src": "/iris/assets/app-icon_192.png",
|
||||
"src": "/assets/app-icon_192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "/iris/assets/app-icon_256.png",
|
||||
"src": "/assets/app-icon_256.png",
|
||||
"type": "image/png",
|
||||
"sizes": "256x256"
|
||||
},
|
||||
{
|
||||
"src": "/iris/assets/app-icon_512.png",
|
||||
"src": "/assets/app-icon_512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": "/iris/",
|
||||
"start_url": "/",
|
||||
"background_color": "#08d58f",
|
||||
"theme_color": "#181818",
|
||||
"display": "standalone",
|
||||
|
||||
Reference in New Issue
Block a user