static.html

   1 <html>
   2 <head>
   3
   4 <title>PigeBox</title>
   5 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   6
   7 <link rel="stylesheet" type="text/css" href="pige.css" />
   8 <link rel="stylesheet" type="text/css" href="css/datePicker.css" />
   9 <script type="text/javascript" src="js/jquery.js"></script>
  10 <script type="text/javascript" src="js/bgiframe/jquery.bgiframe.min.js"></script>
  11 <script type="text/javascript" src="js/methods/date.js"></script>
  12 <script type="text/javascript" src="js/methods/date_fr.js"></script>
  13 <script type="text/javascript" src="js/datePicker/jquery.datePicker.js"></script>
  14 <script type="text/javascript" src="js/jquery.simplemodal.js"></script>
  15
  16 </head>
  17 <body>
  18
  19 <h1>PigeBox</h1>
  20
  21 <form method="post">
  22
  23 <p>
  24 Récupérer un extrait de la pige ...
  25 </p>
  26
  27
  28 <label for="date">Date</label>
  29 <!--<input name="date" id="date" maxlength="10" type="text" class="date-pick" size="10" />-->
  30 <select name="date" id="date">
  31   <option value="2009-07-28">28 juillet</option>
  32   <option value="2009-07-29" selected="selected">29 juillet</option>
  33   <option value="2009-07-30">30 juillet</option>
  34   <option value="2009-07-31">31 juillet</option>
  35   <option value="2009-08-01">1er août</option>
  36   <option value="2009-08-02">2 août</option>
  37 </select>
  38
  39 <label for="start_time">Heure de début</label>
  40 <input name="start_time" id="start_time" maxlength="5" size="5" type="text" />
  41
  42 <label for="end_time">Heure de fin</label>
  43 <input name="end_time" id="end_time" maxlength="5" size="5" type="text" />
  44
  45 <button disabled="disabled">Valider</button>
  46
  47 </form>
  48
  49 <div id="status">
  50 </div>
  51
  52 <ul id="downloads">
  53 </ul>
  54
  55 </body>
  56 </html>
  57
  58 <script type="text/javascript">
  59 Date.format = 'dd/mm/yyyy';
  60
  61
  62 function updateDownloads()
  63 {
  64         $.get(document.URL, {cmd: 'list'},
  65                 function (data) {
  66                         data = $.trim(data);
  67                         data = data.split('\n');
  68                         s = '';
  69                         for (i=0; i < data.length; i++) {
  70                                 if (data[i].length == 0) continue;
  71                                 s += '<li><a href="' + data[i] + '">';
  72                                 s += data[i].substring(14, 16);
  73                                 s += '/';
  74                                 s += data[i].substring(12, 14);
  75                                 s += '/';
  76                                 s += data[i].substring(8, 12);
  77                                 s += ' ';
  78                                 s += data[i].substring(17, 19);
  79                                 s += ':';
  80                                 s += data[i].substring(19, 21);
  81                                 s += ' -> ';
  82                                 s += data[i].substring(22, 24);
  83                                 s += ':';
  84                                 s += data[i].substring(24, 26);
  85                                 s += '</a></li>\n';
  86                         }
  87                         $('#downloads').html(s);
  88                 }
  89         );
  90 }
  91
  92 function updateStatus(job_number)
  93 {
  94         console.log('update status');
  95         $('#status').addClass('throbber');
  96         $.get(document.URL, { cmd: 'status', job: job_number},
  97                 function (data) {
  98                         $('#status').removeClass('throbber');
  99                         data = $.trim(data);
 100                         if (data == 'available') {
 101                                 $('#status').text('');
 102                                 return;
 103                         }
 104                         if (data.split(':')[0] == 'done') {
 105                                 updateDownloads();
 106                                 console.log(document.URL + data.split(':')[1])
 107                                 $.modal.close();
 108                                 $('#status').text('').hide();
 109                                 document.location.href = document.URL + data.split(':')[1];
 110                                 return;
 111                         }
 112
 113                         $('#status').text(data);
 114                         window.setTimeout(updateStatus, 2500, job_number);
 115                 }
 116         );
 117 }
 118
 119
 120 $(function() {
 121         var endDate = new Date();
 122         endDate.addDays(-2);
 123         var startDate = new Date();
 124         startDate.addDays(-92);
 125         // XXX: get start and end date from server
 126         /*
 127         $('#date').datePicker({
 128                 startDate: startDate.asString(),
 129                 endDate: endDate.asString(),
 130                 }).next().html(
 131                     '<img src="js/calendar.png" width="16" height="16" />');
 132         */
 133         $('form').submit(
 134                 function () {
 135                         if ($('#start_time').val().indexOf(':') == -1 ||
 136                                 $('#end_time').val().indexOf(':') == -1) {
 137                             $('#status').text('Les heures doivent avoir le format hh:mm');
 138                             return false;
 139                         }
 140                         $('#status').addClass('throbber').text('Envoi ...');
 141                         $.get(document.URL, {
 142                                 cmd: 'new',
 143                                 date_val: $('#date').val(),
 144                                 start_val: $('#start_time').val(),
 145                                 end_val: $('#end_time').val() },
 146                                 function (data) {
 147                                         data = $.trim(data);
 148                                         if (data.substring(0, 2) != 'ok') {
 149                                                 $('#status').removeClass('throbber').text(
 150                                                         'Erreur : ' + data);
 151                                         } else {
 152                                                 job_number = data.substring(3, 35);
 153                                                 $('#status').show().modal();
 154                                                 updateStatus(job_number);
 155                                         }
 156                                 }
 157                         );
 158                         //console.log('submit');
 159                         return false;
 160                 }
 161         );
 162
 163         $('input').change(
 164                 function () {
 165                         if ($('#date').val() != '' &&
 166                                         $('#start_time').val() != '' &&
 167                                         $('#end_time').val() != '') {
 168                                 $('button').attr('disabled', false);
 169                         } else {
 170                                 $('button').attr('disabled', true);
 171                         }
 172                 }
 173         );
 174         $('#date').trigger('change');
 175
 176         updateDownloads();
 177 });
 178
 179 </script>