public/app/reservations/calendar.html

   1 <!DOCTYPE HTML>
   2 <html xmlns:ng="http://angularjs.org">
   3 <head>
   4 <meta charset="utf-8">
   5 <!--
   6 <script src="angular.js" ng:autobind></script>
   7 -->
   8 <script src="http://code.angularjs.org/0.9.15/angular-0.9.15.min.js"
   9    ng:autobind></script>
  10
  11 <script>
  12 Calendar.$inject = ['$xhr', '$resource','$log'];
  13
  14 function Calendar($xhr,$resource,$log){
  15         $log.info('Calendar');
  16         var self = this;
  17         $xhr("GET"
  18                 , "/reservations/get/www.google.com/calendar/ical/8tg8ecg285qshtp75813jktqa0%40group.calendar.google.com/private-b9d68b530fde2c6060979f8a05aa0865/basic.ics"
  19                 , function(code, response){
  20                         $log.log('xhr calendar', code, response);
  21                         self.data = response;
  22                 }
  23         );
  24
  25         var Reservation = $resource('/data/reservations/prijava/:id');
  26         this.reservation = new Reservation();
  27
  28         this.load_submited = function() {
  29                 $xhr("GET"
  30                         , "/reservations/events/submited"
  31                         , function(code, response){
  32                                 $log.log('xhr submited', code, response);
  33                                 self.submited = response;
  34                         }
  35                 );
  36         }
  37         this.load_submited();
  38
  39         self.reservation.status = 'event';
  40
  41         this.select_event = function(c) {
  42                 $log.info('select_event', c);
  43                 self.reservation.event = c;
  44                 self.reservation.status = 'changed';
  45                 if (self.submited) self.reservation.slot_nr = ++self.submited[c.UID];
  46         }
  47
  48         this.change_event = function() {
  49                 self.reservation.event = null;
  50                 self.reservation.status = 'event';
  51                 self.load_submited();
  52         }
  53
  54         this.save_submission = function() {
  55                 if ( self.reservation && self.reservation.event ) {
  56                         $log.info('submit save');
  57                         self.reservation.status = 'saved';
  58                         self.reservation.$save();
  59                         self.load_submited();
  60                 } else {
  61                         $log.info('submit ignored');
  62                 }
  63         }
  64
  65         this.event_full = function(e) {
  66                 if ( ! self.submited ) return 0;
  67
  68                 var count = self.submited[e.UID];
  69                 if ( count === undefined ) return 0;
  70                 if ( parseInt(count) < parseInt(e.slots) ) return 0;
  71                 return 1;
  72         }
  73 }
  74
  75 // http://groups.google.com/group/angular/browse_thread/thread/af68afb22fd2d2ab/18fc5e3216a77e53?show_docid=18fc5e3216a77e53
  76 </script>
  77
  78 <title>Reservations</title>
  79
  80 <style>
  81 li {
  82         margin-bottom: 1em;
  83 }
  84 </style>
  85
  86 </head>
  87 <body>
  88
  89 <div ng:controller="Calendar">
  90
  91 <h1>{{data.cal['X-WR-CALNAME']}}</h1>
  92
  93 <div>{{data.cal['X-WR-CALDESC'] | html}}</div>
  94
  95 <ul>
  96 <li ng:repeat="c in data.events" ng:show="reservation.status == 'event'">
  97 {{c.DTSTART}} - {{c.DTEND}}
  98
  99 <span ng:show="! event_full(c)">
 100  <a href="" ng:click="select_event(c)">{{c.SUMMARY}}</a>
 101  <em ng:show="submited[c.UID]">prijava: {{submited[c.UID]}}</em>
 102  <em ng:show="c.slots">mjesta: {{c.slots}}</em>
 103 </span>
 104
 105 <span ng:show="event_full(c)">
 106  <b>{{c.SUMMARY}}</b>
 107  <em>popunjena sva mjesta: {{c.slots}}</em>
 108 </span>
 109
 110 <div>{{c.LOCATION}}</div>
 111 <div ng:show="c.DESCRIPTION">
 112 {{c.DESCRIPTION}}
 113 </div>
 114 </li>
 115 </ul>
 116
 117 <div ng:show="reservation.error" style="background:#f88">{{reservation.error}}</div>
 118
 119 <form ng:show="reservation.status != 'event'">
 120
 121 <div ng:show="reservation.event" style="background: #ff8">
 122 Vaša <b>{{reservation.status}}</b> prijava za
 123 <b>{{reservation.event.SUMMARY}}</b>
 124 u terminu {{reservation.event.DTSTART}} u trajanju od {{reservation.event.hours}} sata
 125 <span ng:show="reservation.slot_nr">broj {{reservation.slot_nr}}</span>
 126 <span ng:show="reservation.saved">je spremljena.</span>
 127 <input type=button value="Potvrdi promjenu" ng:show="reservation.changed" ng:click="save_submission()">
 128
 129 <a href="" ng:click="change_event()">Promjeni termin</a>
 130 </div>
 131
 132
 133 ime: <input name="reservation.name" ng:required>
 134 <br>
 135 prezime: <input name="reservation.surname" ng:required>
 136 <br>
 137 e-mail: <input name="reservation.email" ng:required>
 138 <br>
 139 odsjek: <input name="reservation.odsjek" ng:required>
 140 <br>
 141 zvanje: <input name="reservation.zvanje">
 142 <br>
 143 područke/tema zaninimanja: <input name="reservation.porducje">
 144 <br>
 145 <input type=button ng:click="save_submission()" value="Prijavi me" ng:disable="$invalidWidgets.visible()">
 146 </form>
 147
 148 <input name=debug type=checkbox>
 149 <pre ng:show="debug">
 150 reservation={{reservation}}
 151 submited={{submited}}
 152 data={{data}}
 153 </pre>
 154
 155 </div>
 156
 157
 158 </body>
 159 </html>