diff --git a/server.js b/server.js index 9111ebc..8e9d81a 100755 --- a/server.js +++ b/server.js @@ -1,35 +1,89 @@ -var ejs = require('express') -var path = require('path') -var http = require('http') +/* +* +* janishutz.com - Backend +* server.js +* +* Developed 2023 by Janis Hutz +* +*/ + +var ejs = require( 'express' ); +var path = require( 'path' ); +var http = require( 'http' ); +var fs = require( 'fs' ); var app = ejs(); -app.get('/', (request, response) => { - response.sendFile(path.join(__dirname + '/ui/index.html')); +app.get( '/', ( request, response ) => { + response.sendFile( path.join( __dirname + '/ui/index.html' ) ); }); -app.get('/:filename', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/" + request.params.filename)); +app.get( '/:filename', ( request, response ) => { + let fileExtension = ''; + if ( request.params.filename.slice( request.params.filename.length - 5, request.params.filename.length ) == '.html' ) {} else { + fileExtension = '.html' + }; + fs.readFile( path.join(__dirname + '/ui/' + request.params.filename + fileExtension ), ( err, data ) => { + if ( err ) { + response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) ); + } else { + response.status( 200 ).sendFile( path.join( __dirname + '/ui/' + request.params.filename + fileExtension ) ); + }; + }); }); -app.get('/css/:file', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/css/" + request.params.file)); +app.get( '/css/:filename', ( request, response ) => { + fs.readFile( path.join( __dirname + '/ui/css/' + request.params.filename ), ( err, data ) => { + if ( err ) { + response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) ); + } else { + response.status( 200 ).sendFile( path.join( __dirname + '/ui/css/' + request.params.filename ) ); + }; + }); }); -app.get('/js/:file', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/js/" + request.params.file)); +app.get( '/js/:filename', ( request, response ) => { + fs.readFile(path.join(__dirname + '/ui/js/' + request.params.filename), (err, data) => { + if (err) { + response.status( 404 ).sendFile( path.join( __dirname + '/ui/404.html' ) ); + } else { + response.status( 200 ).sendFile( path.join( __dirname + '/ui/js/' + request.params.filename ) ); + }; + }); }); -app.get('/projects/:file', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/projects/" + request.params.file)); +app.get( '/projects/:filename', ( request, response ) => { + let fileExtension = ''; + if ( request.params.filename.slice( request.params.filename.length - 5, request.params.filename.length ) == '.html' ) {} else { + fileExtension = '.html' + }; + fs.readFile(path.join(__dirname + '/ui/projects/' + request.params.filename + fileExtension ), (err, data) => { + if (err) { + response.status(404).sendFile( path.join( __dirname + '/ui/404.html' ) ); + } else { + response.status(200).sendFile( path.join( __dirname + '/ui/projects/' + request.params.filename + fileExtension ) ); + }; + }); }); -app.get('/projects/css/:file', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/css/" + request.params.file)); +app.get( '/assets/:filename', ( request, response ) => { + fs.readFile(path.join(__dirname + '/ui/assets/' + request.params.filename), (err, data) => { + if (err) { + response.status(404).sendFile( path.join( __dirname + '/ui/404.html' ) ); + } else { + response.status(200).sendFile( path.join( __dirname + '/ui/assets/' + request.params.filename ) ); + }; + }); }); -app.get('/assets/:file', (request, response) => { - response.sendFile(path.join(__dirname + "/ui/assets/" + request.params.file)); + +// Serve 404 pages +app.use( ( req, res, next ) => { + if ( req.query.lang == 'en' ) { + res.status( 404 ).sendFile( path.join( __dirname + '/ui/en/errorResponses/404.html' ) ); + } else { + res.status( 404 ).sendFile( path.join( __dirname + '/ui/de/errorResponses/404.html' ) ); + }; }); diff --git a/ui/404.html b/ui/404.html index d9180fd..815f621 100755 --- a/ui/404.html +++ b/ui/404.html @@ -30,16 +30,15 @@ -
-
-
+
-
+

The page you are looking for was not found

The page you are looking for does not exist. It may have been moved, or removed altogether. Perhaps you can return back to the site's homepage and see if you can find what you are looking for.




- Go back + Go to homepage
+ \ No newline at end of file diff --git a/ui/about.html b/ui/about.html index 0b29c73..c88ca71 100755 --- a/ui/about.html +++ b/ui/about.html @@ -11,15 +11,20 @@
-

About me

-

My name is Janis Hutz, I am 18 years old and am learning to code in many different programming languages. By now I am quite fluent in a couple of programming languages, including Swift & SwiftUI (Apple's programming languages); Python (with three different Graphical User Interface Toolkits (Kivy (and KivyMD), PyQT5 and PyGTK); JavaScript, HTML and CSS. You may find my iOS Apps on the AppStore and most of my other projects as Free & Open Source Software over on GitHub. Usually, when I OpenSource a project, I tend to use the GNU General Public License V3.0 (GPL V3), as this allows you (if you are a FOSS-dev) to do the most with this code whilst not helping out big companies like Google, Micro$oft, etc.

-

I spend most of my freetime coding, as this is what I enjoy the most, other than that I am a passionate Archlinux user, so I spend occasionally some time troubleshooting something. Therefore I am not a big fan of Micro$oft, Google or Meta, but I quite adore the work that Apple does, surprisingly.

-

As I am still in my studies, my time to code is limited to what I can do outside of school, and sadly I cannot yet go to University, as I am too young and I haven't finished secondary school yet.

-

-
-Github -AppStore -
+
+

About me

+
+
+

My name is Janis Hutz, I am 18 years old and am learning to code in many different programming languages. By now I am quite fluent in a couple of programming languages, including Swift & SwiftUI (Apple's programming languages); Python (with three different Graphical User Interface Toolkits (Kivy (and KivyMD), PyQT5 and PyGTK); JavaScript, HTML and CSS. You may find my iOS Apps on the AppStore and most of my other projects as Free & Open Source Software over on GitHub. Usually, when I OpenSource a project, I tend to use the GNU General Public License V3.0 (GPL V3), as this allows you (if you are a FOSS-dev) to do the most with this code whilst not helping out big companies like Google, Micro$oft, etc.

+

I spend most of my freetime coding, as this is what I enjoy the most, other than that I am a passionate Archlinux user, so I spend occasionally some time troubleshooting something. Therefore I am not a big fan of Micro$oft, Google or Meta, but I quite adore the work that Apple does, surprisingly.

+

As I am still in my studies, my time to code is limited to what I can do outside of school, and sadly I cannot yet go to University, as I am too young and I haven't finished secondary school yet.

+

+
+
+ Github + AppStore +
+
diff --git a/ui/aboutPage.html b/ui/aboutPage.html new file mode 100644 index 0000000..0939679 --- /dev/null +++ b/ui/aboutPage.html @@ -0,0 +1,30 @@ + + + + About - janishutz.com + + + + + + +
+
+
+

About janishutz.com

+
+
+
+

Technology is a remarkably interesting topic, that many people take for granted.

+
+

Get support if you are stuck on a problem, purchase a new, fully customised PC, that is configured according to your needs* and get a webpage created for you.

+
+
+ About me + Privacy Policy + Services +
+
+ + + \ No newline at end of file diff --git a/ui/assets/Logo.png b/ui/assets/Logo.png index e0bddff..9676b88 100755 Binary files a/ui/assets/Logo.png and b/ui/assets/Logo.png differ diff --git a/ui/assets/codeSnippet.png b/ui/assets/codeSnippet.png new file mode 100644 index 0000000..b3e5b2e Binary files /dev/null and b/ui/assets/codeSnippet.png differ diff --git a/ui/css/mainstyle.css b/ui/css/mainstyle.css index b7f107a..fc22ead 100755 --- a/ui/css/mainstyle.css +++ b/ui/css/mainstyle.css @@ -1,58 +1,73 @@ +/* +* +* janishutz.com - mainstyle.css +* +* +* Created 2023 by Janis Hutz +*/ + +/* + Set size of html and body to full width +*/ html, body { - width: 100%; - height: 100%; - margin: 0; - padding: 0; - background-color: rgba(70, 72, 167, 0.5); - font-family: Arial, Helvetica, sans-serif; + width: 100%; + height: 100%; + margin: 0; + padding: 0; + background-color: rgba(70, 72, 167, 0.5); + font-family: sans-serif; } +/* + Style for quotes +*/ .bigquote { - width: 40%; - font-size: 300%; + width: 40%; + font-size: 300%; } .biggerquote { - font-size: 150%; + font-size: 150%; } +/* + Styling for the main content element +*/ .mainstyle { - margin-right: 10%; - margin-left: 10%; - margin-top: 2%; - margin-bottom: 2%; - padding: 10%; - padding-top: 5%; - padding-bottom: 5%; - border-color: black; - border-style: inset; - border-radius: 50px; - background-color:dimgray; -} - - -h1 { - font-size: 300%; + margin-right: 10%; + margin-left: 10%; + margin-top: 2%; + margin-bottom: 2%; + padding: 10%; + padding-top: 5%; + padding-bottom: 5%; + border-color: black; + border-style: inset; + border-radius: 50px; + background-color:dimgray; } +/* + Styling for links and buttons +*/ .textlink { - font-size: 100%; - text-decoration: none; - color: black; + font-size: 100%; + text-decoration: none; + color: black; } .textlink:hover { - color: darkblue; - font-size: 120%; + color: darkblue; + font-size: 120%; } .linkbutton { - text-decoration: none; - display: inline-block; - padding: 20px; - color: white; - background-color:blue; - border-radius: 20px; + text-decoration: none; + display: inline-block; + padding: 20px; + color: white; + background-color:blue; + border-radius: 20px; } .linkbutton:hover { @@ -61,4 +76,93 @@ h1 { .references { color: gray; +} + +/* + This styles the container for the home page +*/ +.title-container { + background-image: url('/assets/codeSnippet.png'); + background-repeat: no-repeat; + background-size: cover; + width: 100%; + height: 40vh; + border-radius: 20px; + color: white; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; +} + +.title { + font-size: 350%; +} + +.subtitle { + font-size: 200%; +} + +.content { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin-top: 5%; + margin-bottom: 10%; +} + +.content-title { + font-size: 300%; + text-align: center; +} + +.content-title-small { + font-size: 200%; + text-align: center; +} + +.pullquote-lines { + border-color: black; + margin-bottom: 2%; + margin-top: 2%; + width: 100%; +} + +/* + Align content side by side +*/ +.sidebyside { + width: 100%; + display: flex; + flex-grow: 1; + gap: 5%; +} + +.element { + width: 47%; + text-align: center; +} + +.itemsInline { + display: flex; + justify-content: center; + align-items: center; + width: 100%; + gap: 5%; + margin-top: 3%; + margin-bottom: 3%; +} + +/* + Bottom container styling +*/ + +.bottom { + display: flex; + width: 100%; + justify-content: center; + align-items: center; + flex-direction: column; } \ No newline at end of file diff --git a/ui/footer.html b/ui/footer.html index 6c192ac..0898371 100755 --- a/ui/footer.html +++ b/ui/footer.html @@ -10,7 +10,7 @@
- Privacy Policy + Privacy Policy
diff --git a/ui/getos.html b/ui/getos.html deleted file mode 100755 index 035b805..0000000 --- a/ui/getos.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - OS Detection - janishutz.com - - - - - - - -
-

This is just a testscript to get user's OS and Browser

- - - -


-Note: This website is not completed yet and some pages are still missing! - - \ No newline at end of file diff --git a/ui/index.html b/ui/index.html index ad3019a..beecfe3 100755 --- a/ui/index.html +++ b/ui/index.html @@ -4,21 +4,52 @@ Home - janishutz.com - - - + + +
-

Welcome to janishutz.com!

-

iOS Apps, PC apps, Websites

-

Learn more about my projects!

- Projects +
+

Welcome to janishutz.com!

+

iOS Apps, PC apps, Websites

+
+
+

My work

+
+
+

PC Building

+

Are you looking for a new gaming or work PC that is perfectly fitted for your needs and has an upgrade path in the future and you live in Switzerland? Here you can get your new, fully customised PC!

+ Learn more +
+
+

Custom Websites

+

Websites generally perform very well in Google searches when built from scratch using HTML, CSS & JavaScript. That's exactly what I do. Need more than just a static website with a blog and some contact forms? Depending on what it is, I might not be able to do it for you.

+ Learn more +
+
+
+
+

iOS Apps

+

My iOS apps mostly focus on things you use or do day-to-day. You can view and download my apps on the Apple AppStore

+ AppStore +
+
+

Open Source Software

+

As a huge Open Source fan, I also developed some software whose code you can freely use, if your project uses the GPL V3 License. I am also contributing to a JavaScript presentation framework called impress.js

+ GitHub +
+
+
+
+

Check out my projects!

+ Projects +



- Note: This website is not completed yet and some pages are still missing! The design will also change to something more appealing in the future + Note: This website is not completed yet and some pages are still missing! The design may also change in the future
diff --git a/ui/js/basicanimations.js b/ui/js/basicanimations.js index 2e64b09..5186785 100755 --- a/ui/js/basicanimations.js +++ b/ui/js/basicanimations.js @@ -1,34 +1,36 @@ $(document).ready(function() { -$("#ContentToInclude").load("/menu.html"); -$("#Footer").load("/footer.html"); - $(".linkbutton").mouseenter(function() { +$('#ContentToInclude').load('/menu.html'); +$('#Footer').load('/footer.html'); + $('.linkbutton').mouseenter(function() { $(this).stop() - $(this).animate({"border-radius": "0px", "background-color": "darkblue"}, 200) + $(this).animate({'border-radius': '0px', 'background-color': 'darkblue'}, 200) }) - $(".linkbutton").mouseleave(function() { + $('.linkbutton').mouseleave(function() { $(this).stop() - $(this).animate({"border-radius": "20px", "background-color": "rgba(0,0,0,0)"}, 200) + $(this).animate({'border-radius': '20px', 'background-color': 'rgba(0,0,0,0)'}, 200) }) - $(".textlink").mouseenter(function() { + $('.textlink').mouseenter(function() { $(this).stop() - $(this).animate({"color": "darkblue", "font-size": "120%"}, 200) + $(this).animate({'color': 'darkblue', 'font-size': '120%'}, 200) }) - $(".textlink").mouseleave(function() { + $('.textlink').mouseleave(function() { $(this).stop() - $(this).animate({"color": "black", "font-size": "100%"}, 200) + $(this).animate({'color': 'black', 'font-size': '100%'}, 200) }) setTimeout(highlightLocation, 200) }); function highlightLocation () { let pagename = $(location).attr('pathname') - if (pagename.slice(0, 8) == "/project") { - $('#projects').css("background-color", "darkblue") - } else if (pagename.slice(0, 6) == "/about" || pagename == "/privacypolicy.html") { - $('#about').css("background-color", "darkblue") - } else if (pagename == "/" || pagename == "/index.html") { - $('#home').css("background-color", "darkblue") - } else if (pagename == "/support.html") { - $('#support').css("background-color", "darkblue") - } + if ( pagename.slice(0, 8) == '/project' ) { + $('#projects').css('background-color', 'darkblue'); + } else if ( pagename.slice(0, 6) == '/about' || pagename == '/privacypolicy' ) { + $('#about').css('background-color', 'darkblue'); + } else if ( pagename == '/' || pagename == '/index.html' ) { + $('#home').css('background-color', 'darkblue'); + } else if ( pagename == '/support' ) { + $('#support').css('background-color', 'darkblue'); + } else if ( pagename == '/services' ) { + $('#services').css('background-color', 'darkblue'); + }; } \ No newline at end of file diff --git a/ui/menu.html b/ui/menu.html index 8eba25a..08ea7ef 100755 --- a/ui/menu.html +++ b/ui/menu.html @@ -11,23 +11,30 @@
  • Home
  • - Projects + Projects
  • - About + About
    • -
  • Support
    • +
  • + Services + +
    • +
  • Support
    • \ No newline at end of file diff --git a/ui/privacypolicy.html b/ui/privacypolicy.html index 17332db..55eb59f 100755 --- a/ui/privacypolicy.html +++ b/ui/privacypolicy.html @@ -1,24 +1,26 @@ - - Privacy Policy - janishutz.com - - - - - - - -
    -
    -

    Privacy Policy

    -

    Privacy in my iOS Apps

    -

    All of the apps developed by Janis Hutz follow strict privacy rules. As such, my Apps do not collect any data other than the standard data that is being collected by Apple to give me an idea on how many people use the app. You may opt out of that feature in the system settings. All of the data collected there is anonymised and I therefore cannot see anything other than a higher number on the active user data. Privacy is one of the most important factors in the development of my apps! This may have an impact on the stability of the apps, so please, if you would like, enable "Share with Developers" setting in the Settings app under "Privacy" > "Analytics & Improvements". This allows me to see an anonymised crash report if the app'd crash. - I do heavily rely on AppStore Reviews, Ratings and Beta feedback to improve my apps, as this is the least privacy invading option out there. Please also contact me, if you'd like to test this app as a beta!

    -

    Privacy on janishutz.com

    -

    This website does not collect any data on your interaction with it as it stands today. This may change in the future, but all data collected will not allow me to uniquely identify you as an individual. You may have a look at the source code of the data-collection module, if I end up adding one on this website, if you wish. The rest of the server backend will remain closed-source due to security concerns.

    -
    - - - + + Privacy Policy - janishutz.com + + + + + + +
    +
    +
    +

    Privacy Policy

    +
    +
    +

    Privacy in my iOS Apps

    +

    All of the apps developed by Janis Hutz follow strict privacy rules. As such, my Apps do not collect any data other than the standard data that is being collected by Apple to give me an idea on how many people use the app. You may opt out of that feature in the system settings. All of the data collected there is anonymised and I therefore cannot see anything other than a higher number on the active user data. Privacy is one of the most important factors in the development of my apps! This may have an impact on the stability of the apps, so please, if you would like, enable "Share with Developers" setting in the Settings app under "Privacy" > "Analytics & Improvements". This allows me to see an anonymised crash report if the app'd crash. + I do heavily rely on AppStore Reviews, Ratings and Beta feedback to improve my apps, as this is the least privacy invading option out there. Please also contact me, if you'd like to test this app as a beta!

    +

    Privacy on janishutz.com

    +

    This website does not collect any data on your interaction with it as it stands today. This may change in the future, but all data collected will not allow me to uniquely identify you as an individual. You may have a look at the source code of the data-collection module, if I end up adding one on this website, if you wish. The rest of the server backend will remain closed-source due to security concerns.

    +
    +
    + + diff --git a/ui/projects.html b/ui/projects.html index b5f6d85..e57cd07 100755 --- a/ui/projects.html +++ b/ui/projects.html @@ -1,35 +1,36 @@ - - Projects - janishutz.com - - - - - - - -
    -
    -

    My projects

    -

    Here you can get an overview of all my projects!

    -

    Swift & SwiftUI (iOS Apps)

    - -

    Python, Kivy, KivyMD, PyQT5, PyGTK (Desktop apps using different UI toolkits)

    - -

    JavaScript, HTML, CSS (Webapps / Websites)

    - -
    - - + + Projects - janishutz.com + + + + + + +
    +
    +
    +

    My projects

    +

    Here you can get an overview over all my projects!

    +
    +

    Swift & SwiftUI (iOS Apps)

    + +

    Python, Kivy, KivyMD, PyQT5, PyGTK (Desktop apps using different UI toolkits)

    + +

    JavaScript, HTML, CSS (Webapps / Websites)

    + +
    + + \ No newline at end of file diff --git a/ui/projects/storagemanager.html b/ui/projects/storagemanager.html index 8bc743d..b2307d3 100755 --- a/ui/projects/storagemanager.html +++ b/ui/projects/storagemanager.html @@ -2,7 +2,7 @@ StorageManager - janishutz.com - + diff --git a/ui/services.html b/ui/services.html new file mode 100644 index 0000000..a57d271 --- /dev/null +++ b/ui/services.html @@ -0,0 +1,30 @@ + + + + Services - janishutz.com + + + + + + +
    +
    +
    +

    Services

    +
    +
    +
    +

    Technology is a remarkably interesting topic, that many people take for granted.

    +
    +

    To make technology more accessible, I thrive to offer services that help people not that well versed in technology start to enjoy it. A first step for many people to discover their interest in technology is to have a decent PC, where they can play games and / or create videos and livestream. If you have a problem, you can also get PC support! For people trying to get an online presence, I offer creating static websites and websites featuring some more complex features.

    +
    +
    + PC Build service + PC Support + Website +
    +
    + + + \ No newline at end of file diff --git a/ui/support.html b/ui/support.html index 78535d9..9cd44b1 100755 --- a/ui/support.html +++ b/ui/support.html @@ -1,30 +1,33 @@ - - Support - janishutz.com - - - - - - -
    -
    -

    Support

    -

    Have you run into a problem with one of my apps? Please contact me by clicking the button below! I am here to help you out.

    -
    -

    Troubleshooting

    -

    You may try to fix the problem yourself, by trying these steps here:

    - -

    If nothing of the above helps or you'd like to give feedback, please click the button below! If you found an issue with my FOSS apps, please click here, search for the respective repository and create a new issue. Alternatively you may click the button below

    -






    -

    Before you contact me: Have you tried the troubleshooting steps above?

    -

    - Contact me -
    - - + + Support - janishutz.com + + + + + + +
    +
    +
    +

    Support

    +
    +
    +

    Have you run into a problem with one of my apps? Please contact me by clicking the button below! I am here to help you out.

    +
    +

    Troubleshooting

    +

    You may try to fix the problem yourself, by trying these steps here:

    + +

    If nothing of the above helps or you'd like to give feedback, please click the button below! If you found an issue with my FOSS apps, please click here, search for the respective repository and create a new issue. Alternatively you may click the button below

    +
    +

    Before you contact me: Have you tried the troubleshooting steps above?

    +

    + Contact me +
    + + \ No newline at end of file