Upload website
This commit is contained in:
301
dist/projects/biogascontrollerapp/index.html
vendored
Normal file
301
dist/projects/biogascontrollerapp/index.html
vendored
Normal file
@@ -0,0 +1,301 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>BiogasControllerApp - Configure the microcontroller used in ENATECH at KSWO to control the Biogas Plant |
|
||||
janishutz.com</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="enatech, bga, controller, python" />
|
||||
<meta name="description"
|
||||
content="Control and configure the microcontroller used in ENATECH at Kantonsschule Wohlen using an easy to use user-interface with very clean code that you can use to study how it works" />
|
||||
<meta name="og:title"
|
||||
content="BiogasControllerApp - Configure the microcontroller used in ENATECH at KSWO to control the Biogas Plant" />
|
||||
<meta name="og:image" content="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects/biogascontrollerapp" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="content">
|
||||
<img src="https://raw.githubusercontent.com/janishutz/BiogasControllerApp/main/BiogasControllerAppLogo.png" alt="BiogasControllerApp logo"
|
||||
class="project-logo">
|
||||
<h1>Biogas­Controller­App</h1>
|
||||
|
||||
<a href="/projects" class="back-button">← All projects</a>
|
||||
<p>Control the microcontroller used in the subject ENATECH at Kantonsschule Wohlen</p>
|
||||
|
||||
<hr class="pullquote-lines">
|
||||
<h3 class="content-title-small">Easy to use, yet still features easy to understand code for beginners</h3>
|
||||
<hr class="pullquote-lines">
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<h2>GitHub Repository</h2>
|
||||
<p>BiogasControllerApp is available on GitHub, where you may also view its well-documented code, with
|
||||
beginner-friendliness in mind for the code.</p>
|
||||
<a href="https://github.com/janishutz/BiogasControllerApp" target="_blank" class="button">GitHub</a>
|
||||
|
||||
<h3 style="margin-top: 50px;">Features</h3>
|
||||
<ul>
|
||||
<li>
|
||||
Read out data from and configure the microcontroller in ENATECH
|
||||
</li>
|
||||
<li>
|
||||
Clean User Interface focusing on ease of use
|
||||
</li>
|
||||
<li>
|
||||
Tips to resolve erros baked directly into the app
|
||||
</li>
|
||||
<li>
|
||||
Easy to understand code
|
||||
</li>
|
||||
<li>
|
||||
A large focus on code quality and readability
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
439
dist/projects/index.html
vendored
Normal file
439
dist/projects/index.html
vendored
Normal file
@@ -0,0 +1,439 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/side-by-side.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>Projects | janishutz.com</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="projects" />
|
||||
<meta name="description" content="An overview of Janis Hutz's most important projects" />
|
||||
<meta name="og:title" content="Projects | janishutz.com" />
|
||||
<meta name="og:description" content="An overview of Janis Hutz's most important projects" />
|
||||
<meta name="og:image" content="https://static.janishutz.com/logo.jpg" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
|
||||
<style>
|
||||
#yt-embed {
|
||||
width: 70vw;
|
||||
height: 40vw;
|
||||
}
|
||||
|
||||
.side-by-side {
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="slider">
|
||||
<div class="slider-container">
|
||||
<div class="slider-element current"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-title.jpg' );">
|
||||
<a href="/projects/libreevent" class="button offset-button">libreǝvent</a>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/projects/conductorcalc-title.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>ConductorCalc</h2>
|
||||
<p>Professional Wire Calculation software</p>
|
||||
<a href="https://conductorcalc.com" class="button" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/projects/storagemanager-title.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>StorageManager</h2>
|
||||
<p>Solving your storage management issues</p>
|
||||
<a href="/projects/storagemanager" class="button">StorageManager</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/projects/qrscanner-title.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>QR & Barcode Insight</h2>
|
||||
<p>QR Scanner that makes you feel safer when scanning QR codes</p>
|
||||
<a href="/projects/qrscanner" class="button">QR & Barcode Insight</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/projects/musicplayer-title.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>MusicPlayer</h2>
|
||||
<p>Your one-stop solution for the music at your next party</p>
|
||||
<a href="/projects/musicplayer" class="button">MusicPlayer</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="slider-controls slider-control-left material-symbols-outlined"
|
||||
onclick="sliderControl( 'previous' )">arrow_back</span>
|
||||
<span class="slider-controls slider-control-right material-symbols-outlined"
|
||||
onclick="sliderControl( 'next' )">arrow_forward
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content" style="margin-top: 50px;">
|
||||
<h1>Projects</h1>
|
||||
|
||||
<p>Discover my software projects</p>
|
||||
|
||||
<hr class="divider" style="margin-top: 50px;">
|
||||
|
||||
<h2 id="foss">Open Source Projects</h2>
|
||||
<p>Projects you can use for free, that have their source code publicly available and you can help develop</p>
|
||||
<p>You may find all of them <a href="https://github.com/janishutz?tab=repositories" target="_blank">here</a></p>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://libreevent.janishutz.com/assets/logo.png" alt="libreevent logo"
|
||||
class="project-logo small-logo">
|
||||
<h3>libreevent</h3>
|
||||
<p>Tired of paying for event management software and want to gain control over your data? libreevent is
|
||||
a powerful tool to sell tickets for your next event. Complete with mobile apps for entry control</p>
|
||||
<a href="/projects/libreevent" class="button">Details</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png"
|
||||
alt="musicplayer logo" class="project-logo small-logo">
|
||||
<h3>MusicPlayer</h3>
|
||||
<p>A browser-based Music Player with remote playlist sharing and support for your local playlists, as
|
||||
well as Apple Music</p>
|
||||
<a href="/projects/musicplayer" class="button">Details</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://static.janishutz.com/assets/logos/impress.jpg" alt="impress.js logo" class="project-logo small-logo">
|
||||
<h3>impress</h3>
|
||||
<p>A JavaScript library to create fancy browser-based presentations in 3D. Not my own project, but one I occasionally contribute to</p>
|
||||
<a href="https://github.com/impress/impress.js" class="button" target="_blank">GitHub</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo">
|
||||
<h3>Arch-Dev-VM</h3>
|
||||
<p>Looking for an easy to set up Arch Linux virtual machine for development? The scripts here allow you
|
||||
to set up an Arch Linux Virtual Machine in under 1 hour, of which most time is waiting for downloads
|
||||
to finish.</p>
|
||||
<a href="https://github.com/janishutz/arch-dev-vm" class="button" target="_blank">GitHub</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://raw.githubusercontent.com/janishutz/BiogasControllerApp/refs/heads/main/BiogasControllerAppLogo.png"
|
||||
alt="biogascontrollerapp logo" class="project-logo small-logo">
|
||||
<h3>BiogasControllerApp</h3>
|
||||
<p>A small KivyMD-based application to control a small Biogas Plant in the subject ENATECH at
|
||||
Kantonsschule Wohlen</p>
|
||||
<a href="/projects/biogascontrollerapp" class="button">Details</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo">
|
||||
<h3>Configurations, etc</h3>
|
||||
<p>Various configuration files I personally use are available on my personal Gitea instance</p>
|
||||
<a href="https://git.janishutz.com/janishutz?tab=repositories" class="button" target="_blank">Git</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider" style="margin-top: 75px;">
|
||||
|
||||
<h2 id="ios">iOS Apps</h2>
|
||||
<p>Apps designed for your phone and tablet</p>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://static.janishutz.com/assets/logos/storagemanager.jpg" alt="StorageManager logo" class="project-logo small-logo">
|
||||
<h3>StorageManager</h3>
|
||||
<p>Missing stock keeping in your home storage? Keep throwing food away because it went bad?
|
||||
StorageManager aims to help you with this by providing easy to use tools to keep track of what you
|
||||
have</p>
|
||||
<a href="/projects/storagemanager" class="button">Details</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://static.janishutz.com/assets/logos/qrscanner.jpg" alt="QR & Barcode Insight logo" class="project-logo small-logo">
|
||||
<h3>QR & Barcode Insight</h3>
|
||||
<p>QR Codes have become a massive security risk. QR & Barcode Insight helps protect you by showing
|
||||
you the unfiltered content of QR codes as well as the option to check the scanned links with
|
||||
Google's Safe Search API</p>
|
||||
<a href="/projects/qrscanner" class="button">Details</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider" style="margin-top: 75px;">
|
||||
|
||||
<h2 id="proprietary">Proprietary Software</h2>
|
||||
<p>Cross-Platform apps, available in browsers or even app stores!</p>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://cdn.conductorcalc.com/logo.jpg" alt="impress.js logo" class="project-logo small-logo">
|
||||
<h3>ConductorCalc</h3>
|
||||
<p>Your all-in-one solution for calculating parameters when designing high-voltage lines</p>
|
||||
<a href="https://conductorcalc.com" target="_blank" class="button">Details</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo">
|
||||
<h3>Store</h3>
|
||||
<p>The way to buy my software and support the development of my open source software</p>
|
||||
<a href="https://store.janishutz.com" class="button" target="_blank">Store</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="project-logo small-logo">
|
||||
<h3>Accounts</h3>
|
||||
<p>Tired of creating lots of accounts? All my services rely on a single account backend, not requiring
|
||||
you to create a new account for each</p>
|
||||
<a href="https://account.janishutz.com" class="button" target="_blank">Account</a>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<img src="https://static.janishutz.com/assets/logos/lsh.png" alt="Language School Hossegor logo" class="project-logo small-logo">
|
||||
<h3>Language School Hossegor Booking System</h3>
|
||||
<p>A fully featured booking system for a French language school, written from scratch specifically for
|
||||
their purposes with a highly customizable booking process.</p>
|
||||
<a href="/projects/languageschoolhossegor-booking" class="button">Details</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/yt-embed.js"></script>
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
304
dist/projects/languageschoolhossegor-booking/index.html
vendored
Normal file
304
dist/projects/languageschoolhossegor-booking/index.html
vendored
Normal file
@@ -0,0 +1,304 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/side-by-side.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>Language School Hossegor Booking | janishutz.com</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="content">
|
||||
<img src="https://static.janishutz.com/assets/logos/lsh.png" alt="Language School Hossegor logo"
|
||||
class="project-logo">
|
||||
<h1>Language School Hossegor Booking</h1>
|
||||
|
||||
<a href="/projects" class="back-button">← All projects</a>
|
||||
<p>A booking system to handle the complex demands of this French language school. It features an advanced admin
|
||||
panel where the entire offering can be changed with incredible flexibility.</p>
|
||||
|
||||
<a href="https://booking.languageschoolhossegor.com" class="button" target="_blank">Check it out</a>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<h2>Features</h2>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>User accounts</h3>
|
||||
<p>There are user accounts where users can retrieve their invoices and view the status of their orders
|
||||
</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Very flexible main page</h3>
|
||||
<p>The main page dynamically loads its configuration from the backend and can thus be updated even
|
||||
during normal operation. Almost all fields displayed on the start page are dynamically rendered
|
||||
based on the configuration</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Extensive admin panel</h3>
|
||||
<p>The admin panel offers all kinds of settings, ranging from the courses offered (with the complex
|
||||
handling of combinations of multiple courses all adjustable in a user interface) to accommodation
|
||||
offered, transfer, privacy policy and terms of service. Even newsletters, invoices and general mail
|
||||
can be sent using it, all using their branding</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Multi-Language Support</h3>
|
||||
<p>The entire content is available in currently two languages, with instant switch in languages thanks
|
||||
to clever design of the localization system and the use of a web-app instead of a traditional
|
||||
webpage</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<p>A system like this could be possible for your own adventure.</p>
|
||||
|
||||
<a href="https://support.janishutz.com/index.php?a=add&category=1" target="_blank" class="button"
|
||||
style="margin-top: 50px;">Interested?</a>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
354
dist/projects/libreevent/index.html
vendored
Normal file
354
dist/projects/libreevent/index.html
vendored
Normal file
@@ -0,0 +1,354 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>libreevent - free and open source event management solution | janishutz.com</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="libreevent, event management, ticketing, seat plan editor, free and open source" />
|
||||
<meta name="description"
|
||||
content="libreevent is a free and open source event management solution that enables you to sell tickets for your next event, including a seat plan and many more settings." />
|
||||
<meta name="og:title" content="libreevent - free and open source event management solution" />
|
||||
<meta name="og:description"
|
||||
content="libreevent is a free and open source event management solution that enables you to sell tickets for your next event, including a seat plan and many more settings." />
|
||||
<meta name="og:image" content="https://static.janishutz.com/projects/libreevent-title.jpg" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects/libreevent" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
|
||||
<style>
|
||||
#yt-embed {
|
||||
width: 90vw;
|
||||
height: 50vw;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 999px) {
|
||||
#yt-embed {
|
||||
width: 70vw;
|
||||
height: 40vw;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="slider">
|
||||
<div class="slider-container">
|
||||
<div class="slider-element current"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-title.jpg' );">
|
||||
<a href="https://libreevent.janishutz.com" class="button offset-button">Project Website</a>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-eventsettings.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Create Events with Ease</h2>
|
||||
<p>Using libreǝvent's powerful admin panel</p>
|
||||
<a href="https://libreevent.janishutz.com/docs/admin-panel/" class="button">Docs</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-seatplan-editor.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Create seat plans</h2>
|
||||
<p>libreǝvent's seat plan editor is designed to make this as easy as possible</p>
|
||||
<a href="https://libreevent.janishutz.com/docs/admin-panel/seatplan-editor" class="button">Docs</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-all-events.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Order Tickets</h2>
|
||||
<p>on this page and give users all important data</p>
|
||||
<a href="https://libreevent.janishutz.com/download" class="button">Install today</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-login.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>User Accounts</h2>
|
||||
<p>Your customers can do everything in self-service!</p>
|
||||
<a href="https://libreevent.janishutz.com/download" class="button">Install today</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-ticket-sel.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Open Source Project</h2>
|
||||
<p>Free Software, developed by Janis Hutz & the community</p>
|
||||
<a href="https://github.com/janishutz/libreevent" class="button">GitHub</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="slider-controls slider-control-left material-symbols-outlined"
|
||||
onclick="sliderControl( 'previous' )">arrow_back</span>
|
||||
<span class="slider-controls slider-control-right material-symbols-outlined"
|
||||
onclick="sliderControl( 'next' )">arrow_forward
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<!-- <img src="https://libreevent.janishutz.com/assets/logo.png" alt="libreevent logo" class="project-logo"> -->
|
||||
<h1>libreǝvent</h1>
|
||||
|
||||
<a href="/projects" class="back-button">← All projects</a>
|
||||
<p>Free & Open Source Event Management & Ticketing Solution</p>
|
||||
|
||||
<hr class="pullquote-lines">
|
||||
<h3 class="content-title-small">Why use a commercial event management solution, if you can host a more flexible
|
||||
one yourself?</h3>
|
||||
<hr class="pullquote-lines">
|
||||
</div>
|
||||
|
||||
<div id="yt-embed"></div>
|
||||
|
||||
<div class="content">
|
||||
<h2>Project Website</h2>
|
||||
<p>libreevent has its own project website, where you can learn more about the project, find documentation and a
|
||||
guide on how to install it.</p>
|
||||
<a href="https://libreevent.janishutz.com" target="_blank" class="button">Project Website</a>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/yt-embed.js"></script>
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
YTEmbed('yt-embed', 'UYMa-xTyZYo');
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
371
dist/projects/musicplayer/index.html
vendored
Normal file
371
dist/projects/musicplayer/index.html
vendored
Normal file
@@ -0,0 +1,371 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/side-by-side.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>MusicPlayer - Fully browser based with built-in remote playlist display with animations | janishutz.com
|
||||
</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="browser-based, music player, remote display" />
|
||||
<meta name="description"
|
||||
content="Want to show off what the currently playing song is for your next party? MusicPlayer has a lot of party-oriented features built in!" />
|
||||
<meta name="og:title"
|
||||
content="MusicPlayer - Fully browser based with built-in remote playlist display with animations" />
|
||||
<meta name="og:description"
|
||||
content="Want to show off what the currently playing song is for your next party? MusicPlayer has a lot of party-oriented features built in!" />
|
||||
<meta name="og:image" content="https://static.janishutz.com/projects/musicplayer-title.jpg" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects/musicplayer" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="slider">
|
||||
<div class="slider-container">
|
||||
<div class="slider-element current"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/musicplayer/library-local.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Sources</h2>
|
||||
<p>Play your local music or use Apple Music (Apple Music Subscription required)</p>
|
||||
<a href="https://music.janishutz.com/" class="button">Website</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/musicplayer/fancy.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Shared Playlists</h2>
|
||||
<p>Seamlessly sync and display what you are currently playing on other devices. Perfect for your
|
||||
next party!</p>
|
||||
<a href="https://music.janishutz.com/get" class="button">Get it today</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/musicplayer/player.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Browser based</h2>
|
||||
<p>No need to install anything. Runs on any platform</p>
|
||||
<a href="https://music.janishutz.com/get" class="button">Get it today</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/musicplayer/main.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Hosted for you</h2>
|
||||
<p>Need the convenience of an already set up version?</p>
|
||||
<a href="https://music.janishutz.com/" class="button">Website</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://static.janishutz.com/assets/projects/musicplayer-title.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Open Source</h2>
|
||||
<p>Developed by Janis Hutz & the community</p>
|
||||
<a href="https://github.com/janishutz/MusicPlayerV2" class="button">GitHub</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="slider-element"
|
||||
style="background-image: url( 'https://store-cdn.janishutz.com/assets/musicplayer/library-dark.jpg' );">
|
||||
<div class="slider-info">
|
||||
<h2>Self-Hostable</h2>
|
||||
<p>Host it yourself. You need to be member of the Apple Developer Program for access to the Apple
|
||||
Music API</p>
|
||||
<a href="https://github.com/janishutz/MusicPlayerV2/wiki/Installation" class="button">Docs</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="slider-controls slider-control-left material-symbols-outlined"
|
||||
onclick="sliderControl( 'previous' )">arrow_back</span>
|
||||
<span class="slider-controls slider-control-right material-symbols-outlined"
|
||||
onclick="sliderControl( 'next' )">arrow_forward
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<img src="https://github.com/janishutz/MusicPlayerV2/raw/master/assets/logo.png" alt="MusicPlayer logo"
|
||||
class="project-logo">
|
||||
<h1>Music­Player</h1>
|
||||
|
||||
<a href="/projects" class="back-button">← All projects</a>
|
||||
<p>Play music fully in the browser and remotely share what you are currently playing. Perfect for your next
|
||||
party!</p>
|
||||
<a href="https://music.janishutz.com" target="_blank" class="button">Get it today</a>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<h2>Features</h2>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Remote Playback Status</h3>
|
||||
<p>Remotely display what is currently playing via a link you can share. There is an additional link that
|
||||
can be used to display the same information, but with animations that sync to the music (Microphone
|
||||
access required on the target device and animations will sync up to the sound audible on that
|
||||
device)</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Two Sources</h3>
|
||||
<p>You can choose between two sources for audio: Your local disk or Apple Music and you can mix the two
|
||||
in a single playlist. Cover Art and song information is fetched from the Apple Music API
|
||||
automatically if you are using the hosted version or have configured the Apple Music API
|
||||
authentication tokens</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Fully Featured Player</h3>
|
||||
<p>All the features you'd expect from a Music Player are present in MusicPlayer. Shuffle, Repeat,
|
||||
Playlist support, adding more songs to queue, just to name a few, are all present.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Browser based</h3>
|
||||
<p>There is no need to install anything. MusicPlayer runs fully in your browser and is thus cross
|
||||
platform. You could even run it off of your phone, if you wish!</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<a href="https://music.janishutz.com" target="_blank" class="button" style="margin-top: 50px;">Get it today</a>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
297
dist/projects/qrscanner/index.html
vendored
Normal file
297
dist/projects/qrscanner/index.html
vendored
Normal file
@@ -0,0 +1,297 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/side-by-side.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>QR & Barcode Insight - Be safer when scanning QR codes | janishutz.com
|
||||
</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="browser-based, music player, remote display" />
|
||||
<meta name="description"
|
||||
content="Be safer when scanning QR codes, as the entire link will be shown to you when scanning. The app also provides the ability to scan from your photo library" />
|
||||
<meta name="og:title" content="QR & Barcode Insight - Be safer when scanning QR codes | janishutz.com" />
|
||||
<meta name="og:description"
|
||||
content="Be safer when scanning QR codes, as the entire link will be shown to you when scanning. The app also provides the ability to scan from your photo library" />
|
||||
<meta name="og:image" content="https://static.janishutz.com/projects/qrscanner-title.jpg" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects/qrscanner" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="content">
|
||||
<img src="https://static.janishutz.com/assets/logos/qrscanner.jpg" alt="MusicPlayer logo" class="project-logo">
|
||||
<h1>QR & Barcode Insight</h1>
|
||||
|
||||
<a href="/projects" class="back-button">← All projects</a>
|
||||
<p>QR codes have become ever more present and they can pose significant risk. QR & Barcode Insight shows the
|
||||
full, unfiltered link to you so you can better judge if the link you are trying to open is safe. And with
|
||||
the Safe Scanning In-App-Purchase, you can be even safer, as your link is automatically looked up in
|
||||
Google's Safe Search database.</p>
|
||||
<a href="https://apps.apple.com/us/app/qr-barcode-insight/id6443884642" target="_blank" class="button">Get it today</a>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<h2>Features</h2>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Scan from your library</h3>
|
||||
<p>Ever had to scan a QR Code displayed on your phone screen? Annoying, right? Simply take a screenshot, open QR & Barcode Insight and select the screenshot from your library to scan it.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>SafeScanning</h3>
|
||||
<p>For a small one-off fee of just CHF 1.00, you can purchase access to SafeScanning, providing you with added security - and you support the development of my software</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Scan Barcodes</h3>
|
||||
<p>You can also scan barcodes, for the times, where typing them out is just too annoying.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Various code formats</h3>
|
||||
<p>QR & Barcode Insight supports various code formats, including QR, Mini-QR, EAN-8, EAN-13 and many more.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<a href="https://apps.apple.com/us/app/qr-barcode-insight/id6443884642" target="_blank" class="button" style="margin-top: 50px;">Get it today</a>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
353
dist/projects/storagemanager/index.html
vendored
Normal file
353
dist/projects/storagemanager/index.html
vendored
Normal file
@@ -0,0 +1,353 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/side-by-side.css">
|
||||
|
||||
<!-- SEO -->
|
||||
<title>Storage Manager - get organized | janishutz.com</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=7" />
|
||||
<meta name="keywords" content="storagemanager, management, home use, business use" />
|
||||
<meta name="description" content="The perfect utility to keep track of your home or business storage" />
|
||||
<meta name="og:title" content="StorageManager - get organized | janishutz.com" />
|
||||
<meta name="og:image" content="https://static.janishutz.com/projects/storagemanager-title.jpg" />
|
||||
<meta name="og:type" content="website" />
|
||||
<meta name="og:url" content="https://janishutz.com/projects/storagemanager" />
|
||||
<meta name="og:locale" content="en_GB" />
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta name="theme-color" content="#152b5c">
|
||||
|
||||
<style>
|
||||
#yt-embed {
|
||||
width: 70vw;
|
||||
height: 40vw;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav><script>
|
||||
// Themeing
|
||||
let loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
var theme = loadedTheme;
|
||||
let loadTheme = () => {
|
||||
loadedTheme = localStorage.getItem( 'theme' ) ?? 'auto';
|
||||
if ( loadedTheme === 'auto' ) {
|
||||
if ( window.matchMedia( '(prefers-color-scheme: dark)' ).matches ) {
|
||||
theme = 'dark_mode';
|
||||
} else {
|
||||
theme = 'light_mode';
|
||||
}
|
||||
}
|
||||
if ( theme === 'dark_mode' ) {
|
||||
document.documentElement.classList.remove( 'light' );
|
||||
document.documentElement.classList.add( 'dark' );
|
||||
} else {
|
||||
document.documentElement.classList.add( 'light' );
|
||||
document.documentElement.classList.remove( 'dark' );
|
||||
theme === 'light_mode';
|
||||
}
|
||||
}
|
||||
loadTheme();
|
||||
|
||||
setTimeout( () => {
|
||||
document.querySelector( 'body' ).classList.add( 'loaded' );
|
||||
}, 500 );
|
||||
|
||||
function changeTheme () {
|
||||
theme = document.getElementById( 'theme-select' ).value;
|
||||
localStorage.setItem( 'theme', theme );
|
||||
loadTheme();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="nav-placeholder"></div>
|
||||
|
||||
<div class="nav-top-bar">
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
<!-- <img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo"> -->
|
||||
<div class="nav-toggle" onclick="openMenu( 'toggle' )">
|
||||
<span class="line" id="line1"></span>
|
||||
<span class="line" id="line2"></span>
|
||||
<span class="line" id="line3"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-menu">
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/projects">
|
||||
<span class="material-symbols-outlined nav-icon">lightbulb</span>
|
||||
<div>Projects</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="https://conductorcalc.com" target="_blank">ConductorCalc</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/services">
|
||||
<span class="material-symbols-outlined nav-icon">build</span>
|
||||
<div>Services</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://store.janishutz.com">Store</a>
|
||||
<a href="https://account.janishutz.com">Account</a>
|
||||
<a href="https://development.janishutz.com">Custom Websites</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/" class="logo-wrapper">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
</a>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/about">
|
||||
<span class="material-symbols-outlined nav-icon">info</span>
|
||||
<div>About</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<a href="https://blog.janishutz.com" target="_blank">Blog</a>
|
||||
<a href="/legal">Legal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="nav-link-wrapper">
|
||||
<a class="nav-link-header" href="/support">
|
||||
<span class="material-symbols-outlined nav-icon">support_agent</span>
|
||||
<div>Support</div>
|
||||
</a>
|
||||
<div class="nav-link-dropdown">
|
||||
<a href="https://support.janishutz.com" target="_blank">Support Hub</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php" target="_blank">Knowledgebase</a>
|
||||
<a href="/support/old">Old websites</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const toggle = document.getElementsByClassName( 'nav-toggle' )[ 0 ];
|
||||
const menu = document.getElementsByClassName( 'nav-menu' )[ 0 ];
|
||||
const bar = document.getElementsByClassName( 'nav-top-bar' )[ 0 ];
|
||||
|
||||
function openMenu( action ) {
|
||||
if ( action === 'toggle' ) {
|
||||
if ( menu.classList.contains( 'active' ) ) {
|
||||
openMenu( 'close' );
|
||||
} else {
|
||||
openMenu( 'open' );
|
||||
}
|
||||
} else if ( action === 'close' ) {
|
||||
menu.classList.remove( 'active' );
|
||||
toggle.classList.remove( 'active' );
|
||||
document.body.classList.remove( 'no-scroll' );
|
||||
} else if ( action === 'open' ) {
|
||||
document.body.classList.add( 'no-scroll' );
|
||||
toggle.classList.add( 'active' );
|
||||
menu.classList.add( 'active' );
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
}
|
||||
|
||||
let oldScroll = 0;
|
||||
document.addEventListener( 'scroll', () => {
|
||||
if ( oldScroll < window.scrollY && window.innerHeight * 0.2 < window.scrollY ) {
|
||||
bar.classList.add( 'slide-up' );
|
||||
menu.classList.add( 'slide-up' );
|
||||
} else if ( oldScroll > window.scrollY ) {
|
||||
bar.classList.remove( 'slide-up' );
|
||||
menu.classList.remove( 'slide-up' );
|
||||
}
|
||||
oldScroll = window.scrollY;
|
||||
} );
|
||||
|
||||
// TODO: Hide menu on when scrolling down
|
||||
</script>
|
||||
</nav>
|
||||
|
||||
<div class="content">
|
||||
<img src="https://static.janishutz.com/assets/logos/storagemanager.jpg" alt="storage manager logo"
|
||||
class="project-logo">
|
||||
<h1>Storage Manager</h1>
|
||||
|
||||
<p>Managing storage can be a challenging task, especially when the volume of items stored becomes large. If
|
||||
products in that storage can go bad, you are very likely to produce quite a bit of waste. StorageManager is
|
||||
an iOS app that can send you notifications such that you do not forget about products that are about to
|
||||
expire.</p>
|
||||
|
||||
<a href="https://apps.apple.com/us/app/storagemanager/id6443832297" target="_blank" class="button">Get it today</a>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<h2>Features</h2>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Notifications</h3>
|
||||
<p>StorageManager can send you notifications when a product is about to expire so you don't forget about
|
||||
the product. Notifications time can be customised in settings.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Adding products</h3>
|
||||
<p>You can add products by simply scanning the product's barcode and adding some data on the product.
|
||||
The app will remember the product such that the next time you scan it, it will autofill all relevant
|
||||
data.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Editing products</h3>
|
||||
<p>Products can be edited straight from the products details page. You can edit every aspect of the
|
||||
product data to the extent that you can make it an entirely different kind.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Removing products</h3>
|
||||
<p>You can remove products by simply swiping to delete. Alternatively you can delete products by hitting
|
||||
the delete icon in the details page or even better, by scanning the product's barcode.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Organisation</h3>
|
||||
<p>StorageManager allows you to create product categories and one storage location. If you purchase the
|
||||
full version, you can add an infinite amount of storage locations. The In-App-Purchase is sharable
|
||||
with up to five people in your family.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Filtering & sorting</h3>
|
||||
<p>You can sort and filter all the data. Many different sorting options and filters are available, as
|
||||
well as a powerful search function, that finds all your products within milliseconds.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>iCloud-Sync</h3>
|
||||
<p>StorageManager has iCloud-Sync built in and enabled for ALL users. Simply allow iCloud access for
|
||||
StorageManager and you are off to the races. Your storage data syncs magically between all your
|
||||
Apple-Devices.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Free <sup>*</sup></h3>
|
||||
<p>You can use StorageManager for free, with one small exception being adding an unlimited amount of
|
||||
storage locations. For this you will need to make an In-App-Purchase. Please check the AppStore for
|
||||
the exact pricing as this is dependent on your country.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="side-by-side">
|
||||
<div class="side-by-side-item left">
|
||||
<h3>Easy setup</h3>
|
||||
<p>StorageManager features an easy to use, guided setup such that you can be up and running within just
|
||||
one or two minutes of downloading the app.</p>
|
||||
</div>
|
||||
<div class="side-by-side-item right">
|
||||
<h3>Display settings</h3>
|
||||
<p>Choose what is displayed on the main page of the app with simple toggles in the app's settings page.
|
||||
This allows you to see everything you want at a glance or have more items on the screen at once.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="divider">
|
||||
|
||||
<a href="https://apps.apple.com/us/app/storagemanager/id6443832297" target="_blank" class="button" style="margin-top: 50px;">Get it today</a>
|
||||
</div>
|
||||
|
||||
|
||||
<footer><div class="footer-container">
|
||||
<img src="https://static.janishutz.com/logo.jpg" alt="janishutz.com logo" class="logo">
|
||||
<div class="footer-text-container">
|
||||
<div class="footer-category">
|
||||
<h3>Projects</h3>
|
||||
<a href="/projects">View all</a>
|
||||
<a href="/projects/storagemanager">StorageManager</a>
|
||||
<a href="/projects/qrscanner">QR & Barcode Insight</a>
|
||||
<a href="/projects/libreevent">libreǝvent</a>
|
||||
<a href="/projects/musicplayer">MusicPlayer</a>
|
||||
<a href="/projects/biogascontrollerapp">BiogasControllerApp</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Info</h3>
|
||||
<a href="/about">About janishutz.com</a>
|
||||
<a href="/about/aboutme">About Janis Hutz</a>
|
||||
<div class="theme-selector">
|
||||
<span class="material-symbols-outlined" id="theme-switcher-icon">light_mode</span>
|
||||
<select id="theme-select" onchange="changeTheme()">
|
||||
<option value="auto">Auto</option>
|
||||
<option value="light_mode">Light</option>
|
||||
<option value="dark_mode">Dark</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Support</h3>
|
||||
<a href="https://support.janishutz.com">Get support</a>
|
||||
<a href="https://support.janishutz.com/knowledgebase.php">Knowledgebase</a>
|
||||
<a href="/support/support-status">Support status</a>
|
||||
</div>
|
||||
<div class="footer-category">
|
||||
<h3>Legal</h3>
|
||||
<a href="/legal/privacy">Privacy Policy</a>
|
||||
<a href="/legal/tos">Terms of Service</a>
|
||||
<a href="/legal/returns">Return policy</a>
|
||||
<a href="/support/support-status">Support Status</a>
|
||||
<div onclick="showAnalytics()" style="cursor: pointer;">Analytics</div>
|
||||
</div>
|
||||
|
||||
<div class="analytics-notice" id="analytics">
|
||||
<h2>Analytics</h2>
|
||||
<p>This website uses privacy preserving product analytics allowing me to analyze aggregated statistics for this website. All data collected will not allow me to uniquely identify you. <br><a href="/legal/privacy">Privacy Policy</a></p>
|
||||
<!-- Matomo stuff -->
|
||||
<div id="matomo-opt-out">
|
||||
Loading...
|
||||
</div>
|
||||
<script src="https://analytics.janishutz.com/index.php?module=CoreAdminHome&action=optOutJS&divId=matomo-opt-out&language=auto&fontColor=000000&fontSize=12px&fontFamily=monospace&showIntro=1"></script>
|
||||
<!-- Matomo Image Tracker-->
|
||||
<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.janishutz.com/matomo.php?idsite=2&rec=1" style="border:0" alt="" />
|
||||
<!-- End Matomo -->
|
||||
|
||||
<button class="analytics-button" onclick="closeAnalytics()"><span class="material-symbols-outlined">close</span></button>
|
||||
|
||||
<div class="small-symbol" onclick="showAnalytics()" title="Change your analytics preferences"><span class="material-symbols-outlined">Analytics</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function closeAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.remove( 'show' );
|
||||
localStorage.setItem( 'analytics-dismissed', 'true' );
|
||||
}
|
||||
|
||||
function showAnalytics () {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
if ( !localStorage.getItem( 'analytics-dismissed' ) ) {
|
||||
document.getElementById( 'analytics' ).classList.add( 'show' );
|
||||
}
|
||||
|
||||
// Show which theme is loaded
|
||||
document.getElementById( 'theme-select' ).value = loadedTheme;
|
||||
</script>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
|
||||
<script src="https://static.janishutz.com/js/yt-embed.js"></script>
|
||||
<script src="https://static.janishutz.com/js/slider.js"></script>
|
||||
<script>
|
||||
activateSlider(7500);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user