update

a3ffe8f9 · Santhanavanich · 63b0c450 · a3ffe8f9 · 63b0c450 · 63b0c450
Commit a3ffe8f9 authored 3 years ago by Santhanavanich
Expand all Hide whitespace changes
Inline Side-by-side

Showing

with 5422 additions and 271 deletions
+5422 -271
--- a/public/fme/citygml_aggregator_joe_2022_04_08.fmw
+++ b/public/fme/citygml_aggregator_joe_2022_04_08.fmw
--- a/public/home/audio.mp3
+++ b/public/home/audio.mp3
--- a/public/home/bau1.jpg
+++ b/public/home/bau1.jpg
--- a/public/home/index.html
+++ b/public/home/index.html
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <meta name="generator" content="GitLab Pages">
-  <title></title>
-  <link rel="stylesheet" href="../assets/css/style.css">
-  <link rel="stylesheet" href="../assets/css/mobile.css">
-</head>
-<body>
-  <header id="header">
-    <div class="row">
-      <div class="logo" id="logo"></div>
-      <div class="hamburger">
-        <div class="line"></div>
-        <div class="line"></div>
-        <div class="line"></div>
-      </div>
-      <nav></nav>
-    </div>
-    <div id="projectlogo"></div>
-    <div id="projectname"></div>
-  </header>
-  <div class="content">
-    <h1>Here goes a title</h1>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque pellentesque diam ipsum, nec
-      ultricies sem mollis et. Phasellus porttitor nec felis quis ultricies. In venenatis faucibus nisl
-      sed facilisis. Cras sapien nibh, dignissim at eros quis, commodo lobortis eros. Sed a massa
-      eleifend, dictum elit at, blandit magna. Nullam auctor enim nec orci luctus sagittis. Nunc blandit
-      quam nec laoreet egestas. Nulla feugiat nisl lacus, a viverra nisi hendrerit vitae. In nibh arcu,
-      sodales in enim tincidunt, tempus imperdiet ex. Aliquam fermentum augue magna, vel accumsan augue
-      consequat et. Vestibulum id interdum orci, a aliquam sapien. Vivamus eu ipsum sollicitudin, aliquet
-      arcu ut, ornare massa. Suspendisse tincidunt lectus a odio ultrices interdum. Praesent vitae sodales
-      urna, vitae sagittis ex. Vivamus tincidunt nisi ultrices lectus dapibus, at placerat nisl elementum.
-      Fusce cursus, sapien in tincidunt pellentesque, mi erat mollis nibh, ut maximus tortor magna vitae
-      nibh.
-    </p>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque pellentesque diam ipsum, nec
-      ultricies sem mollis et. Phasellus porttitor nec felis quis ultricies. In venenatis faucibus nisl
-      sed facilisis. Cras sapien nibh, dignissim at eros quis, commodo lobortis eros. Sed a massa
-      eleifend, dictum elit at, blandit magna. Nullam auctor enim nec orci luctus sagittis. Nunc blandit
-      quam nec laoreet egestas. Nulla feugiat nisl lacus, a viverra nisi hendrerit vitae. In nibh arcu,
-      sodales in enim tincidunt, tempus imperdiet ex. Aliquam fermentum augue magna, vel accumsan augue
-      consequat et. Vestibulum id interdum orci, a aliquam sapien. Vivamus eu ipsum sollicitudin, aliquet
-      arcu ut, ornare massa. Suspendisse tincidunt lectus a odio ultrices interdum. Praesent vitae sodales
-      urna, vitae sagittis ex. Vivamus tincidunt nisi ultrices lectus dapibus, at placerat nisl elementum.
-      Fusce cursus, sapien in tincidunt pellentesque, mi erat mollis nibh, ut maximus tortor magna vitae
-      nibh.
-    </p>
-    <h1>Here goes a title</h1>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
-      incididunt ut labore et dolore magna aliqua. Ornare massa eget egestas purus viverra.
-      Molestie nunc non blandit massa enim nec dui. Arcu ac tortor dignissim convallis aenean
-      et tortor at. Nisi quis eleifend quam adipiscing vitae. Eget nunc lobortis mattis aliquam.
-      Integer vitae justo eget magna. Sed risus pretium quam vulputate dignissim suspendisse.
-      Nunc scelerisque viverra mauris in aliquam sem fringilla ut morbi.
-      Venenatis lectus magna fringilla urna porttitor rhoncus. Lectus vestibulum mattis ullamcorper velit sed.
-    </p>
-    <h1>Here goes a title</h1>
-    <p>
-      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
-      incididunt ut labore et dolore magna aliqua. Ornare massa eget egestas purus viverra.
-      Molestie nunc non blandit massa enim nec dui. Arcu ac tortor dignissim convallis aenean
-      et tortor at. Nisi quis eleifend quam adipiscing vitae. Eget nunc lobortis mattis aliquam.
-      Integer vitae justo eget magna. Sed risus pretium quam vulputate dignissim suspendisse.
-      Nunc scelerisque viverra mauris in aliquam sem fringilla ut morbi.
-      Venenatis lectus magna fringilla urna porttitor rhoncus. Lectus vestibulum mattis ullamcorper velit sed.
-    </p>
-    <h1>Figure demo</h1>
-    <p>
-      <img src="bau1.jpg">
-    </p>
-    <h1>Audio demo</h1>
-    <p>
-      <audio controls src="audio.mp3" type="audio/mp3"></audio>
-    </p>
-    <h1>Embed Youtube video</h1>
-    <p>
-      <div class="video-container">
-        <iframe width="560" height="315" src="https://www.youtube.com/embed/AZjduAZwm6w" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope" allowfullscreen></iframe>
-      </div>
-    </p>
-    <h1>List of external links</h1>
-    <p>
-      <ul>
-        <li><a href="https://stadtlabor.podigee.io">HFT Stadtlabor</a></li>
-        <li><a href="https://stadtlabor.podigee.io/5-05-vergessen-in-der-stadt-wie-die-stadtplanung-menschen-mit-demenz-helfen-kann">Vergessen in der Stadt</a></li>
-      </ul>
-    </p>
-  </div>
-  <div class="footer"></div>
-  <div class="legal"></div>
-  <script src="../settings.js"> </script>
-  <script src="../main.js"> </script>
-</body>
-</html>
\ No newline at end of file
--- a/public/images/data.jpg
+++ b/public/images/data.jpg
--- a/public/images/fme.jpg
+++ b/public/images/fme.jpg
--- a/public/images/fme2.jpg
+++ b/public/images/fme2.jpg
--- a/public/index.html
+++ b/public/index.html
 <!DOCTYPE html>
-<meta charset="utf-8">
+<html>
-<title>Redirecting...</title>
+  <head>
-<meta http-equiv="refresh" content="0; URL=home/">
+    <meta charset="utf-8">
-<link rel="canonical" href="home/">
+    <meta name="generator" content="GitLab Pages">
+    <title>IQG4iCity</title>
+    <!-- <link rel="stylesheet" href="style.css"> -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
+    <link rel="shortcut icon" href="favicon.ico" />
+  </head>
+  <body>
+    <div id="topbar" style="display: none;">
+        <div id="menu" class="navbar"></div>
+    </div>
+    <header>
+      <div class="navbar navbar-light shadow-sm" style="background-color: #ffffff;">
+        <div class="container d-flex justify-content-between">
+          <img src="https://www.hft-stuttgart.de/typo3conf/ext/hft_sitepackage/Resources/Public/img/hft_logo_footer.svg" class="hftlogo" width="100px" >
+        </div>
+      </div>
+    </header>
+    <div class="px-4 pt-5 my-5 text-center border-bottom">
+      <h1 class="display-4 fw-bold">Data Workflows</h1>
+      <!-- <h2 class="text-muted">Digitization of Heating Networks for AI-based Operational Optimization</h2> -->
+    </div>
+    <div class="container mt-4 mb-2">
+      <h3>Integration of GIS Data to the CityGML</h3>
+      There are plenty of available GIS datasets available in e.g. Shapefile, GeoPackage, CSV. Those dataset can be used to enrich the existing CityGML 3D building models.
+      <br><b>Download: </b>  <a href="./fme/citygml_aggregator_joe_2022_04_08.fmw">FME workbench</a>
+      <div class="text-center">
+        <img src='./images/fme2.jpg' style='width: 100%;'/>
+      </div>
+    </div>
+    <footer class="footer mt-auto py-3">
+      <div class="container d-flex justify-content-between">
+        <div class="mb-3 text-secondary">
+          <p class="fs-sm mb-0"><span class="opacity-50 me-1">© All rights reserved. 2022 HFT Stuttgart <br> 
+          <p class="fs-sm mb-0"><span class="opacity-50 me-1">Other projects from our team: <a href="https://ugl.hft-stuttgart.de/" target="_blank">UGL@HFT Stuttgart</a><br> 
+          Contact Person: </span><a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich" target="_blank">Joe Thunyathep S.</a>
+        </p>
+        </div>
+      </div>
+    </footer>
+  </body>
+</html>
--- a/public/main.js
+++ b/public/main.js
-let portal=function(){let e=(e,t,l={},a=null)=>{let i=document.createElement(e);for(cls of t)i.classList.add(cls);return Object.keys(l).forEach(e=>{i.setAttribute(e,l[e])}),a&&(i.innerText=a),i},t={title:()=>{document.title=settings.pageTitle},hftLogo:()=>{let t=document.querySelector("#logo"),l=e("a",[],{href:"https://hft-stuttgart.de",title:"hft-stuttgart.de"}),a=e("img",[],{src:`${BASE_URL}/assets/images/hft_logo.svg`});l.appendChild(a),t.appendChild(l)},legal:()=>{let t=document.querySelector(".legal"),l=e("div",["legal-text-container"]),a=e("div",["legal-text"],{},"Hochschule für Technik Stuttgart"),i=e("a",["legal-text"],{href:"https://www.hft-stuttgart.de/impressum"},"Impressum"),o=e("a",["legal-text"],{href:"https://www.hft-stuttgart.de/datenschutz"},"Datenschutz"),r=e("div",["top"],{}),p=e("a",[],{href:"#header",title:"Top"}),n=e("img",[],{src:`${BASE_URL}/assets/images/top.png`});p.appendChild(n),r.appendChild(p),l.appendChild(a),l.appendChild(i),l.appendChild(o),t.appendChild(l),t.appendChild(r)}};Object.keys(t).forEach(e=>{t[e]()});let l=t=>{let l=e("div",["participant-social"]);for(i of t){let t=e("a",["social"],{title:i.agent,href:i.profile}),a=e("img",[],{src:i.icon});t.appendChild(a),l.appendChild(t)}return l},a={projectLogo:()=>{let t=e("img",[],{src:settings.projectLogo});document.querySelector("#projectlogo").append(t)},projectName:()=>{document.querySelector("#projectname").innerHTML=settings.projectName},menu:()=>{let t=document.createElement("ul");for(m of settings.menu){let l=document.createElement("li"),a=e("a",[],{href:m.link},m.menuText);l.appendChild(a),t.appendChild(l)}let l=document.querySelector("nav");l.appendChild(t);let a=document.querySelector(".hamburger");a.style.display="flex";let i=document.querySelector("header");a.addEventListener("click",()=>{a.classList.toggle("slide-hamburger"),l.classList.toggle("slide-nav"),i.classList.toggle("overflow-visible")})},participants:()=>{let t=document.querySelector(".footer"),a=e("ul",["footer-participants-container"]);for(p of settings.participants){let t=e("li",["participant"]),i=e("div",["participant-avatar"]),o=e("img",[],{src:p.avatar}),r=e("div",[],{},p.name),n=e("div",[],{},p.email);i.appendChild(o),t.appendChild(i),t.appendChild(r),t.appendChild(n),t.appendChild(l(p.social)),a.appendChild(t)}t.appendChild(a)},footerLogos:()=>{let t=document.querySelector(".footer"),l=e("ul",["footer-logo-container"]);for(fl of settings.footerLogos){let t=e("li",["footer-logo"]),a=e("a",[],{title:fl.title,href:fl.href}),i=e("img",[],{src:fl.logo});a.appendChild(i),t.appendChild(a),l.appendChild(t)}t.appendChild(l)}};for(swt of settings.switches)swt.state==ON&&a[swt.name]()}();
\ No newline at end of file
--- a/public/settings.js
+++ b/public/settings.js
-/*
-███████╗██╗███╗   ██╗ ██████╗ ███████╗██████╗     ██╗    ██╗███████╗ ██████╗ 
-██╔════╝██║████╗  ██║██╔════╝ ██╔════╝██╔══██╗    ██║    ██║██╔════╝██╔════╝ 
-█████╗  ██║██╔██╗ ██║██║  ███╗█████╗  ██████╔╝    ██║ █╗ ██║█████╗  ██║  ███╗
-██╔══╝  ██║██║╚██╗██║██║   ██║██╔══╝  ██╔══██╗    ██║███╗██║██╔══╝  ██║   ██║
-██║     ██║██║ ╚████║╚██████╔╝███████╗██║  ██║    ╚███╔███╔╝███████╗╚██████╔╝
-╚═╝     ╚═╝╚═╝  ╚═══╝ ╚═════╝ ╚══════╝╚═╝  ╚═╝     ╚══╝╚══╝ ╚══════╝ ╚═════╝ 
-*/
-const BASE_URL = `${window.location.origin}/${window.location.pathname.split('/').filter((e, i)=>{return i>0 & i<4}).join('/')}`;
-const ON = true;
-const OFF = false;
-const EMPTY_LINK = "javascript:undefined";
-const DEFAULT = {
-  social: {
-    twitter: {
-      icon: `${BASE_URL}/assets/images/twitter.png`,
-      profile: "https://twitter.com/InnolabM4"
-    },
-    facebook: {
-      icon: `${BASE_URL}/assets/images/facebook.png`,
-      profile: "https://www.facebook.com/HfTStuttgart"
-    },
-    linkedin: {
-      icon: `${BASE_URL}/assets/images/linkedin.png`,
-      profile: "https://www.linkedin.com/school/hochschule-f%C3%BCr-technik-stuttgart-%E2%80%93-university-of-applied-sciences"
-    },
-    webpage: {
-      icon: `${BASE_URL}/assets/images/webpage.png`,
-      profile: "https://www.hft-stuttgart.de"
-    }
-  },
-  avatar: `${BASE_URL}/assets/images/avatar.png`
-};
-/*
-███████╗███████╗████████╗████████╗██╗███╗   ██╗ ██████╗ ███████╗
-██╔════╝██╔════╝╚══██╔══╝╚══██╔══╝██║████╗  ██║██╔════╝ ██╔════╝
-███████╗█████╗     ██║      ██║   ██║██╔██╗ ██║██║  ███╗███████╗
-╚════██║██╔══╝     ██║      ██║   ██║██║╚██╗██║██║   ██║╚════██║
-███████║███████╗   ██║      ██║   ██║██║ ╚████║╚██████╔╝███████║
-╚══════╝╚══════╝   ╚═╝      ╚═╝   ╚═╝╚═╝  ╚═══╝ ╚═════╝ ╚══════╝
-*/
-let settings = {
-  pageTitle: "M4_LAB Page Title",
-  switches: [
-    {
-      name: "projectLogo",
-      state: ON
-    },
-    {
-      name: "projectName",
-      state: ON
-    },
-    {
-      name: "participants",
-      state: ON
-    },
-    {
-      name: "footerLogos",
-      state: ON
-    }
-  ],
-  projectLogo: `${BASE_URL}/assets/logos/M4_LAB_tr.png`,
-  projectName: "M4_LAB Page Demo",
-  participants: [
-    {
-      name: "John Doe",
-      avatar: DEFAULT.avatar,
-      email: "john.doe@lalaland.com",
-      social: [
-        {
-          agent: "twitter",
-          icon: DEFAULT.social.twitter.icon,
-          profile: DEFAULT.social.twitter.profile
-        },
-        {
-          agent: "facebook",
-          icon: DEFAULT.social.facebook.icon,
-          profile: DEFAULT.social.facebook.profile
-        },
-        {
-          agent: "linkedin",
-          icon: DEFAULT.social.linkedin.icon,
-          profile: DEFAULT.social.linkedin.profile
-        },
-        {
-          agent: "webpage",
-          icon: DEFAULT.social.webpage.icon,
-          profile: "https://johndoe.com"
-        }
-      ]
-    },
-    {
-      name: "Charlotte Doe",
-      avatar: `${BASE_URL}/assets/images/charlotte.jpg`,
-      email: "charlotte.doe@lalaland.com",
-      social: [
-        {
-          agent: "twitter",
-          icon: DEFAULT.social.twitter.icon,
-          profile: DEFAULT.social.twitter.profile
-        },
-        {
-          agent: "facebook",
-          icon: DEFAULT.social.facebook.icon,
-          profile: DEFAULT.social.facebook.profile
-        },
-        {
-          agent: "linkedin",
-          icon: DEFAULT.social.linkedin.icon,
-          profile: DEFAULT.social.linkedin.profile
-        }
-      ]
-    }
-  ],
-  footerLogos: [
-    {
-      logo: `${BASE_URL}/assets/logos/Logo_M4_LAB.jpg`,
-      href: EMPTY_LINK,
-      title: "M4_LAB"
-    },
-    {
-      logo: `${BASE_URL}/assets/logos/logo1.png`,
-      href: "http://www.innovative-hochschule.de",
-      title: "Innovative Hochschule"
-    },
-    {
-      logo: `${BASE_URL}/assets/logos/logo2.png`,
-      href: "https://www.bmbf.de",
-      title: "Bundesministerium für Bildung und Forschung"
-    },
-    {
-      logo: `${BASE_URL}/assets/logos/logo3.png`,
-      href: "https://www.gwk-bonn.de",
-      title: "Die Gemeinsame Wissenschaftskonferenz"
-    }
-  ]
-};
\ No newline at end of file
--- a/public/style.css
+++ b/public/style.css
+/* body {
+  font-family: sans-serif;
+  margin: auto;
+  max-width: 1280px;
+  margin-left:2%; 
+  margin-right:2%;
+} */
+.navbar {
+  background-color: #cc3125;
+  border-radius: 2px;
+/*   max-width: 800px; */
+}
+.navbar a {
+  color: #aaa;
+  display: inline-block;
+  font-size: 15px;
+  padding: 10px;
+  text-decoration: none;
+}
+.navbar a:hover {
+  color: #ffffff;
+}
+#topbar img{
+    max-width:15%;
+    margin-right:20px;
+}
+.content{
+    margin-left:2%;
+    margin-right:2%;
+}
+.header{
+    font-weight: bold;
+}
+.news{
+   background-color: #f5f5f5;
+   margin-bottom: 20px;
+   padding-top:10px;
+   padding-bottom: 10px;
+}