diff --git a/public/deramiv.html b/public/deramiv.html new file mode 100644 index 0000000000000000000000000000000000000000..e7f57d92f5a2161523c0bd78428092971e2673b8 --- /dev/null +++ b/public/deramiv.html @@ -0,0 +1,174 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>AMIV</title> + + <link href="bs/css/bootstrap.min.css" rel="stylesheet"> + + <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> + <script src="bs/js/bootstrap.min.js"></script> + <script src="https://npmcdn.com/masonry-layout@4.0/dist/masonry.pkgd.min.js"></script> + + <link href="css/logo-nav.css" rel="stylesheet"> + <link href="css/cards.css" rel="stylesheet"> + <link href="css/dynamic.css" rel="stylesheet"> + <style> + .grid-item-content { + height: 100px; + background: #D26; + border: 2px solid hsla(0, 0%, 0%, 0.5); + border-radius: 5px; + } + + .grid-item-content--height2 { + height: 200px; + } + </style> +</head> + + +<body> + <!-- Navigation --> + <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> + <div class="container"> + <!-- Brand and toggle get grouped for better mobile display --> + <div class="navbar-header"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> + <span class="sr-only">Toggle navigation</span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + </button> + <a class="navbar-brand" href="#"> + <img src="res/AMIV_Logo_150_50.svg" alt="AMIV" height="80%"> + </a> + </div> + <!-- Collect the nav links, forms, and other content for toggling --> + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> + <ul class="nav navbar-nav"> + <li> + <a href="#">Home</a> + </li> + <li> + <a href="#">Der AMIV</a> + </li> + <li> + <a href="#">Studium</a> + </li> + <li> + <a href="#">Jobbörse</a> + </li> + <form class="navbar-form navbar-left" role="search"> + <div class="form-group"> + <input type="text" class="form-control" placeholder="Search"> + </div> + <button type="submit" class="btn btn-default">Search</button> + </form> + </ul> + </div> + <!-- /.navbar-collapse --> + </div> + <!-- /.container --> + </nav> + + <div class="container-fluid"> + <div class="grid"> + <div class="grid-sizer"></div> + + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <div class="card-image"> + <img class="img-responsive" src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcTWlKmVgsFszoyjRfd258A2yx_DbI_5GLSd_VxRcRJvEup5tbxReA"> + </div> + + <div class="card-content"> + <p>Das ist der AMIV </p> + </div> + + <div class="card-action"> + <a href="#" target="new_blank">Der AMIV</a> + </div> + </div> + </div> + + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <div class="card-image"> + <img class="img-responsive" src="http://www.5amtag.ch/wp-content/uploads/2010/03/5amtag_banane_m.jpg"> + </div> + + <div class="card-content" > + <p>Du suchst etwas Abwechslung vom Studienalltag? Du möchtest dich im AMIV oder einer Kommission engagieren? Dann bist du hier richtig!</p> + </div> + + <div class="card-action"> + <a href="#" target="new_blank">Get involved!</a> + </div> + </div> + </div> + + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <div class="card-image"> + <img class="img-responsive" src="http://www.5amtag.ch/wp-content/uploads/2010/03/5amtag_banane_m.jpg"> + </div> + + <div class="card-content" > + <p> Hier werden aktuelle und alte Vorstände und ihre Funktionen aufgelistet</p> + </div> + + <div class="card-action"> + <a href="#" target="new_blank">Vorstand</a> + </div> + </div> + </div> + + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <div class="card-image"> + <img class="img-responsive" src="http://www.5amtag.ch/wp-content/uploads/2010/03/5amtag_banane_m.jpg"> + </div> + + <div class="card-content"> + <p> jflglruhldkjfhlkrhdlkjfhlkjlkm <br> <br> <br> <br></p> + </div> + + <div class="card-action"> + <a href="#" target="new_blank">Protokolle</a> + </div> + </div> + </div> + + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <div class="card-image"> + <img class="img-responsive" src="http://img.funcloud.com/original/2016/03/6673151175913860553464650-374591.jpg"> + </div> + + <div class="card-content"> + <p>ihgfd</p> + </div> + + <div class="card-action"> + <a href="#" target="new_blank">Impessum/kontakt</a> + </div> + </div> + </div> + + </div> + </div> + +<script> + $('.grid').masonry({ + itemSelector: '.grid-item', + originLeft: false + }); +</script> + + + </body> +</html> diff --git a/public/index.html b/public/index.html index 5523635138db0a2236550dc84fb42358624f87de..56b98553e82b47a899d187c93aae55e3c63efd33 100644 --- a/public/index.html +++ b/public/index.html @@ -138,6 +138,7 @@ 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>'); }); diff --git a/public/joboffers.html b/public/joboffers.html new file mode 100644 index 0000000000000000000000000000000000000000..2c6fa15c2a98fad4a4a0f3d2280ca0f1e0e6a83d --- /dev/null +++ b/public/joboffers.html @@ -0,0 +1,136 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>AMIV</title> + + <link href="bs/css/bootstrap.min.css" rel="stylesheet"> + + <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> + <script src="bs/js/bootstrap.min.js"></script> + <script src="https://npmcdn.com/masonry-layout@4.0/dist/masonry.pkgd.min.js"></script> + + <link href="css/logo-nav.css" rel="stylesheet"> + <link href="css/cards.css" rel="stylesheet"> + <link href="css/dynamic.css" rel="stylesheet"> + <style> + .grid-item-content { + height: 100px; + background: #D26; + border: 2px solid hsla(0, 0%, 0%, 0.5); + border-radius: 5px; + } + + .grid-item-content--height2 { + height: 200px; + } + </style> +</head> + + +<body> + <!-- Navigation --> + <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> + <div class="container"> + <!-- Brand and toggle get grouped for better mobile display --> + <div class="navbar-header"> + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> + <span class="sr-only">Toggle navigation</span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + <span class="icon-bar"></span> + </button> + <a class="navbar-brand" href="#"> + <img src="res/AMIV_Logo_150_50.svg" alt="AMIV" height="80%"> + </a> + </div> + <!-- Collect the nav links, forms, and other content for toggling --> + <div class="collapse navbar-collapse nav-collapse collapse" id="bs-example-navbar-collapse-1"> + <ul class="nav navbar-nav"> + <li> + <a href="#">Home</a> + </li> + <li> + <a href="#">Der AMIV</a> + </li> + <li> + <a href="#">Studium</a> + </li> + <li> + <a href="#">Jobbörse</a> + </li> + </ul> + </div> + <!-- /.navbar-collapse --> + </div> + <!-- /.container --> + </nav> + + <div class="container-fluid"> + <div class="grid"> + <div class="grid-sizer"></div> + <div class="grid-item col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2"> + <div class="card"> + <script type="text/javascript"> + !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); + </script> + </div> + </div> + </div> + </div> + + <script> + function getEvents(callback) { + callback = callback || function(ret) { + console.log(ret); + } + $.getJSON('https://amiv-apidev.vsos.ethz.ch/joboffers/', 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) { + console.log(item.title_de); + + /*Logo Checker*/ + if (item.logo == null){ + item.logo = "https://s-media-cache-ak0.pinimg.com/736x/9c/24/fd/9c24fdb71c67e31efef540efb141f96d.jpg"; + } + /* Datum anpassen*/ + if (item.time_end != null){ + var regend = new Date(item.time_end); + var heute = new Date(Date.now()); + + /*Anmeldung*/ + var register = ""; + if (regend < heute){ + return; + } + } + + addElement('<div class="card"><div class="card-image"><img class="img-responsive" src="'+item.logo+'"><span class="card-title">'+item.title_de+' bei '+item.company+'</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">Anmelden</a><a href="#" target="new_blank">Im Kalender speichern</a></div></div>'); + }); + }); + }); + </script> +<script src="js/main.js"></script> +</body> + +</html>