diff --git a/public/css/dynamic.css b/public/css/dynamic.css
index 59ae92eab1fb8ecdb5c6c7a8c8289c6f5cb19def..c402efa1693a9f539c71c59c7a34aa621f04b36b 100644
--- a/public/css/dynamic.css
+++ b/public/css/dynamic.css
@@ -18,4 +18,21 @@
#columns[data-columns]::before {
content: '4 .col-md-3';
}
- }
\ No newline at end of file
+ }
+ /* Responsive iFrame */
+ .responsive-iframe-container {
+ position: relative;
+ padding-bottom: 56.25%;
+ padding-top: 30px;
+ height: 0;
+ overflow: hidden;
+ }
+ .responsive-iframe-container iframe,
+ .vresponsive-iframe-container object,
+ .vresponsive-iframe-container embed {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ }
\ No newline at end of file
diff --git a/public/css/logo-nav.css b/public/css/logo-nav.css
index fb83c60c3ff3d17f80837d56c726ff421d0247a2..2fbcc15bbf7f37c2bc3196ceaec3e6ce1c94f5ae 100644
--- a/public/css/logo-nav.css
+++ b/public/css/logo-nav.css
@@ -6,6 +6,7 @@
body {
padding-top: 70px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
+ padding-bottom: 16px;
}
.navbar-fixed-top .nav {
diff --git a/public/index.html b/public/index.html
index 56b98553e82b47a899d187c93aae55e3c63efd33..31a8e5c6ccb7225cab720ebf3b85e988db4cfde0 100644
--- a/public/index.html
+++ b/public/index.html
@@ -44,7 +44,7 @@
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
- <img src="res/AMIV_Logo_150_50.svg" alt="AMIV" height="80%">
+ <img src="res/AMIV_Logo_150_50.svg" alt="AMIV">
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
@@ -72,6 +72,15 @@
<div class="container-fluid">
<div class="grid">
<div class="grid-sizer"></div>
+
+<!-- Google Calendar -->
+ <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">
+ <div class="responsive-iframe-container big-container card">
+ <iframe src="https://calendar.google.com/calendar/embed?showTitle=0&showNav=0&showPrint=0&showTabs=0&showCalendars=0&mode=AGENDA&height=600&wkst=2&bgcolor=%23ffffff&src=amiv.an.der.eth%40gmail.com&color=%231B887A&src=o8mobocsom5ea8b0d00eidr6a4%40group.calendar.google.com&color=%23691426&src=n18j3pnpl65bp58fjfikvlkbn4%40group.calendar.google.com&color=%238C500B&src=5qbl733r12mejhaosqnqlohccg%40group.calendar.google.com&color=%23ef4ef6&src=5ef1jg56fiaoqbeqago5mbrpd4%40group.calendar.google.com&color=%230F4B38&src=rflnq53lsgj64evaiif691p280%40group.calendar.google.com&color=%2329527A&src=4a7g6cfm9shgpfvmce13aagovs%40group.calendar.google.com&color=%2323164E&src=mdk91hfvr18q8rrlh3sedlhgvo%40group.calendar.google.com&color=%23711616&src=1i7ubr4f35q6hrkond7o4dmtq0%40group.calendar.google.com&color=%23125A12&src=p38tc4mipcao4312oegcmvgkto%40group.calendar.google.com&color=%23711616&ctz=Europe%2FZurich" style="border-width:0" width="800" height="600" frameborder="0"></iframe>
+ </div>
+ </div>
+
+<!-- Twitter widget -->
<div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">
<div class="card">
<p>
@@ -84,69 +93,10 @@
</script>
</div>
</div>
+<!-- Facebook widget -->
</div>
</div>
-
- <script>
- function getEvents(callback) {
- callback = callback || function(ret) {
- console.log(ret);
- }
- $.getJSON('https://amiv-apidev.vsos.ethz.ch/events/', callback);
- }
-
- function addElement(item) {
- $('.grid')
- .append('<div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">' + item + '</div>');
- }
-
- $(document).ready(function() {
- $('.grid-item, .grid-sizer').addClass('col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2');
- $('.grid').masonry({
- itemSelector: '.grid-item',
- columnWidth: '.grid-sizer',
- percentPosition: true
- }).on('DOMSubtreeModified', function(){
- $(this).masonry('reloadItems').masonry();
- })
- getEvents(function(ret) {
- ret['_items'].forEach(function(item) {
- /*Is it Websitecontent?*/
- if (item.show_website == false){
- return;
- }
- console.log(item.title_de);
-
- /*Picture Checker*/
- if (item.img_banner == null){
- item.img_banner = "https://s-media-cache-ak0.pinimg.com/736x/9c/24/fd/9c24fdb71c67e31efef540efb141f96d.jpg";
- }
- /* Datum anpassen*/
- var datenum = new Date(item.time_start);
- var regstart = new Date(item.time_register_start);
- var regend = new Date(item.time_register_end);
- var heute = new Date(Date.now());
-
- /*Minuten immer Zweistellig*/
- var minutes = datenum.getMinutes();
- if (minutes < 10){
- minutes = "0" + minutes;
- }
- var month = ["Januar", "Februar", "MÃĪrz", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
-
- /*Anmeldung*/
- var register = "";
- if (/* amivcore.authenticated() && */item.spot >= 0 && regstart > heute && regend < heute){
- register = "Anmelden";
-
- }
- addElement('<div class="card"><div class="card-image"><img class="img-responsive" src="'+item.img_banner+'"><date><div class="month">'+month[datenum.getMonth()]+'</div><div class="day">'+datenum.getDate()+'</div><div class="starttime">'+datenum.getHours()+':'+minutes+'</div><date-overlay></date-overlay></date><span class="card-title">'+item.title_de+' @ '+item.location+'</span></div><div class="card-content">'+item.description_de+'</div><div class="card-action"><a href="#" target="new_blank">Zum Event</a><a href="#" target="new_blank">'+register+'</a><a href="#" target="new_blank">Im Kalender speichern</a></div></div>');
- });
- });
- });
- </script>
-
-<script src="js/main.js"></script>
+ <script src="js/main.js"></script>
</body>
</html>
diff --git a/public/js/main.js b/public/js/main.js
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..c79a193f1e0853d32d79b40d5eb3e219eb8f2ec7 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -0,0 +1,58 @@
+function getEvents(callback) {
+ callback = callback || function(ret) {
+ console.log(ret);
+ }
+ $.getJSON('https://amiv-apidev.vsos.ethz.ch/events/', callback);
+ }
+
+ function addElement(item) {
+ $('.grid')
+ .append('<div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">' + item + '</div>');
+ }
+
+ $(document).ready(function() {
+ $('.grid-item, .grid-sizer').addClass('col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2');
+ $('.grid').masonry({
+ itemSelector: '.grid-item',
+ columnWidth: '.grid-sizer',
+ percentPosition: true,
+ originLeft: false
+ }).on('DOMSubtreeModified', function(){
+ $(this).masonry('reloadItems').masonry();
+ })
+ getEvents(function(ret) {
+ ret['_items'].forEach(function(item) {
+ /*Is it Websitecontent?*/
+ if (item.show_website == false){
+ return;
+ }
+ console.log(item.title_de);
+
+ /*Picture Checker*/
+ if (item.img_banner == null){
+ item.img_banner = "https://s-media-cache-ak0.pinimg.com/736x/9c/24/fd/9c24fdb71c67e31efef540efb141f96d.jpg";
+ }
+ /* Datum anpassen*/
+ var datenum = new Date(item.time_start);
+
+
+ /*Minuten immer Zweistellig*/
+ var minutes = datenum.getMinutes();
+ if (minutes < 10){
+ minutes = "0" + minutes;
+ }
+ var month = ["Januar", "Februar", "MÃĪrz", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
+
+ /*Anmeldung*/
+ var regstart = new Date(item.time_register_start);
+ var regend = new Date(item.time_register_end);
+ var heute = new Date(Date.now());
+ var register = "";
+ if (item.spots>=0 && regstart<=heute && regend>=heute){
+ register = "Anmelden";
+ }
+
+ addElement('<div class="card"><div class="card-image"><img class="img-responsive" src="'+item.img_banner+'"><date><div class="month">'+month[datenum.getMonth()]+'</div><div class="day">'+datenum.getDate()+'</div><div class="starttime">'+datenum.getHours()+':'+minutes+'</div><date-overlay></date-overlay></date><span class="card-title">'+item.title_de+' @ '+item.location+'</span></div><div class="card-content">'+item.description_de+'</div><div class="card-action"><a href="#" target="new_blank">Info</a><a href="#" target="new_blank">'+register+'</a><a href="#" target="new_blank">Im Kalender speichern</a></div></div>');
+ });
+ });
+ });