put vertical space between events

[angular-mojolicious.git] / public / app / reservations / calendar.html

diff --git a/public/app/reservations/calendar.html b/public/app/reservations/calendar.html
index 0f5b2b2..5dec238 100644 (file)
--- a/public/app/reservations/calendar.html
+++ b/public/app/reservations/calendar.html
@@ -9,21 +9,59 @@
    ng:autobind></script>
 
 <script>
-Calendar.$inject = ['$xhr', '$resource']; 
+Calendar.$inject = ['$xhr', '$resource','$log'];
 
-function Calendar($xhr,$resource){ 
-       console.info('Calendar');
+function Calendar($xhr,$resource,$log){ 
+       $log.info('Calendar');
        var self = this;
        $xhr("GET"
                , "/reservations/get/www.google.com/calendar/ical/8tg8ecg285qshtp75813jktqa0%40group.calendar.google.com/private-b9d68b530fde2c6060979f8a05aa0865/basic.ics"
                , function(code, response){ 
-                       console.log('xhr JSON', code, response);
+                       $log.log('xhr calendar', code, response);
                        self.data = response;
                }
        );
+
        var Reservation = $resource('/data/reservations/prijava/:id');
        this.reservation = new Reservation();
 
+       this.load_submited = function() {
+               $xhr("GET"
+                       , "/reservations/events/submited"
+                       , function(code, response){ 
+                               $log.log('xhr submited', code, response);
+                               self.submited = response;
+                       }
+               );
+       }
+       this.load_submited();
+
+       self.reservation.status = 'event';
+
+       this.select_event = function(c) {
+               $log.info('select_event', c);
+               self.reservation.event = c;
+               self.reservation.status = 'changed';
+               if (self.submited) self.reservation.slot_nr = ++self.submited[c.UID];
+       }
+
+       this.change_event = function() {
+               self.reservation.event = null;
+               self.reservation.status = 'event';
+               self.load_submited();
+       }
+
+       this.save_submission = function() {
+               if ( self.reservation && self.reservation.event ) {
+                       $log.info('submit save');
+                       self.reservation.status = 'saved';
+                       self.reservation.$save();
+                       self.load_submited();
+               } else {
+                       $log.info('submit ignored');
+               }
+       }
+
 } 
 
 // http://groups.google.com/group/angular/browse_thread/thread/af68afb22fd2d2ab/18fc5e3216a77e53?show_docid=18fc5e3216a77e53
@@ -32,6 +70,9 @@ function Calendar($xhr,$resource){
 <title>Reservations</title>
 
 <style>
+li {
+       margin-bottom: 1em;
+}
 </style>
 
 </head>
@@ -44,11 +85,20 @@ function Calendar($xhr,$resource){
 <div>{{data.cal['X-WR-CALDESC'] | html}}</div>
 
 <ul>
-<li ng:repeat="c in data.events" ng:show="! reservation.UID || reservation.UID == c.UID">
-{{c.DTSTART}} - {{c.DTEND}} 
-<a href="" ng:click="reservation.UID = c.UID ; reservation.event = c">
-<b>{{c.SUMMARY}}</b>
-</a>
+<li ng:repeat="c in data.events" ng:show="reservation.status == 'event'">
+{{c.DTSTART}} - {{c.DTEND}}
+
+<span ng:show="! submited[c.UID] || submited[c.UID] < c.slots">
+ <a href="" ng:click="select_event(c)">{{c.SUMMARY}}</a>
+ <em ng:show="submited[c.UID]">prijava: {{submited[c.UID]}}</em>
+ <em ng:show="c.slots">mjesta: {{c.slots}}</em>
+</span>
+
+<span ng:show="submited[c.UID] >= c.slots">
+ <b>{{c.SUMMARY}}</b>
+ <em>popunjena sva mjesta: {{c.slots}}</em>
+</span>
+
 <div>{{c.LOCATION}}</div>
 <div ng:show="c.DESCRIPTION">
 {{c.DESCRIPTION}}
@@ -56,22 +106,22 @@ function Calendar($xhr,$resource){
 </li>
 </ul>
 
+<div ng:show="reservation.error" style="background:#f88">{{reservation.error}}</div>
 
-<form ng:show="reservation.UID">
+<form ng:show="reservation.status != 'event'">
 
-<div ng:show="! reservation._id">
-Popunite vašu prijavu za
+<div ng:show="reservation.event" style="background: #ff8">
+Vaša <b>{{reservation.status}}</b> prijava za
 <b>{{reservation.event.SUMMARY}}</b>
-<input type=button ng:click="reservation.UID = null" value="Odustani od prijave">
-</div>
+u terminu {{reservation.event.DTSTART}} u trajanju od {{reservation.event.hours}} sata
+<span ng:show="reservation.slot_nr">broj {{reservation.slot_nr}}</span>
+<span ng:show="reservation.saved">je spremljena.</span>
+<input type=button value="Potvrdi promjenu" ng:show="reservation.changed" ng:click="save_submission()">
 
-<div ng:show="reservation._id && reservation.UID" style="background: #ff8">
-Vaša prijava za
-<b>{{reservation.event.SUMMARY}}</b>
-<input type=button ng:click="reservation.UID = null" value="Promjeni termin">
+<a href="" ng:click="change_event()">Promjeni termin</a>
 </div>
 
-<br>
+
 ime: <input name="reservation.name" ng:required>
 <br>
 prezime: <input name="reservation.surname" ng:required>
@@ -84,14 +134,14 @@ zvanje: <input name="reservation.zvanje">
 <br>
 područke/tema zaninimanja: <input name="reservation.porducje">
 <br>
-<input type=button ng:click="reservation.$save()" value="Prijavi me">
-<pre>{{reservation}}</pre>
+<input type=button ng:click="save_submission()" value="Prijavi me" ng:disable="$invalidWidgets.visible()">
 </form>
 
 <input name=debug type=checkbox>
 <pre ng:show="debug">
-data={{data}}
 reservation={{reservation}}
+submited={{submited}}
+data={{data}}
 </pre>
 
 </div>