git.infodrom.org Git - infodrom.org/service.infodrom.org/blob - src/InfoCon/sprit/list.wml

   1 #include <infocon.style>
   2
   3 <future>
   4 <page func=InfoCon title="Tankbuch">
   5 <script type="text/javascript" src="<root_prefix>jquery.autocomplete.min.js"></script>
   6 <script type="text/javascript" src="<root_prefix>jquery.editable.js"></script>
   7 <calendar_init -5>
   8 <style type="text/css">
   9 div#details {
  10     width: 270px;
  11 }
  12 div.bar {
  13     background-color: #98c5e5;
  14     border-bottom: 1px solid #AAA;
  15     font-size: 14px;
  16     font-weight: bold;
  17 }
  18 div.year {
  19     float: left;
  20 }
  21 table.spritlog tbody td {
  22     border-bottom: 1px solid #CCC;
  23 }
  24 table.spritlog thead th {
  25     border-bottom: 1px solid #AAA;
  26 }
  27 table.spritlog tfoot th {
  28     border-top: 1px solid #AAA;
  29 }
  30 table.spritlog tbody tr:hover {
  31     background-color: yellow;
  32 }
  33 </style>
  34
  35 <div id="details" class="popup" style="display:none;">
  36 <div class="popup_title" style="padding-bottom: 0.35ex;">Bearbeiten</div>
  37 <div class="popup_body" style="padding-left: 2px;">
  38 <input type="hidden" id="id" name="id" value="">
  39 <input type="hidden" id="machine" name="machine">
  40 <label for="date">Datum</label>
  41 <input type="text" id="date" name="date" size="8">
  42 <img class="calendar" src="<root_prefix>pix/calendar.gif" onclick="event.cancelBubble=true;popcalendar('date');">
  43
  44 <label for="city">Ort</label>
  45 <input type="text" id="city" name="city" size="30">
  46 <label for="tankstelle">Tankstelle</label>
  47 <input type="text" id="tankstelle" name="tankstelle" size="30">
  48
  49 <label for="price_liter">Preis pro Liter</label>
  50 <input type="text" id="price_liter" name="price_liter" size="30">
  51
  52 <label for="liter">Liter / Preis</label>
  53 <input type="text" id="liter" name="liter" size="13">
  54 <input type="text" id="price" name="price" size="13">
  55
  56 <label for="km">Tageskilometer / Gesamt</label>
  57 <input type="text" id="km" name="km" size="13">
  58 <input type="text" id="km_total" name="km_total" size="13">
  59
  60 <div style="margin-top: 8px; margin-bottom: 1ex; text-align: center;">
  61 <input type="submit" onclick="return log_save()" value="Speichern">
  62 &nbsp;&nbsp;&nbsp;
  63 <input type="submit" onclick="$('#details').hide();return false" value="Abbrechen">
  64 </div>
  65  </div>
  66 </div>
  67
  68 <?php
  69   $log = new SpritLog();
  70   $list = $log->distinctYears();
  71   foreach ($list as $row) {
  72     echo '<div class="bar">';
  73     printf('<div year="%d" class="year">%d</div>', $row->year, $row->year);
  74     printf('<div id="sum_%d" style="float:right;">&euro; %.2f&nbsp;&nbsp;%d km</div>', $row->year, $row->sum, $row->km);
  75     echo '<div style="clear:both;"></div></div>';
  76     printf('<div id="list_%d" style="display:none;"></div>', $row->year);
  77   }
  78   if (count($list)) {
  79     $out = <<<EOT
  80 <script type="text/javascript">
  81 $(function(){
  82     $('div.popup').udraggable({
  83         'handle': 'div.popup_title'
  84     })
  85     load_year({$list[0]->year});
  86     $('div.bar').click(toggle_year);
  87 });
  88 </script>
  89 EOT;
  90 echo $out;
  91   }
  92 ?>
  93 <div style="height:10px;"></div>
  94 </page>
  95 <protect><script text="text/javascript">
  96 $(function(){
  97     $('#city').autocomplete({
  98         deferRequestBy: 500,
  99         lookup: function(query, done){
 100             $.invoke('SpritLog/SuggestCity', {query: query}, function(data){
 101                 done(data);
 102             });
 103         }
 104     });
 105     $('#tankstelle').autocomplete({
 106         minChars: 0,
 107         deferRequestBy: 500,
 108         lookup: function(query, done){
 109             $.invoke('SpritLog/SuggestTankstelle', {query: query, city: $('#city').val()}, function(data){
 110                 done(data);
 111             });
 112         }
 113     });
 114     $('#price_liter').keydown(on_plus(function(){$('#liter').focus();}));
 115     $('#liter').keydown(on_plus(function(){$('#price').focus();}));
 116     $('#price').keydown(on_plus(function(){$('#km').focus();}));
 117     $('#km').keydown(on_plus(function(){$('#km_total').focus();}));
 118     $('#km_total').keydown(on_plus(function(){log_save();}));
 119 });
 120 var sprit_machine = <?=intval($_POST['machine'])?>;
 121 function on_plus(callback)
 122 {
 123     return function(e){
 124         // Plus sign
 125         if (e.keyCode == 107) {
 126             callback();
 127             return false;
 128         }
 129
 130     };
 131 }
 132 function log_new()
 133 {
 134     $('#details input').not('input[type="submit"]').val('');
 135     $('input#machine').val(sprit_machine);
 136     if ($('#details').css('left') == '0px')
 137       $('#details').css('left', ($(window).width()-280)+'px').css('top', '30px');
 138     $('#details').show();
 139     $('#date').focus();
 140     return false;
 141 }
 142
 143 function log_save()
 144 {
 145     $.invoke('SpritLog/Add', $('#details input').serialize(), function(data){
 146         load_year(data.year);
 147         $('#details').hide();
 148     });
 149
 150     return false;
 151 }
 152
 153 function toggle_year(event)
 154 {
 155     var year = $(this).find('div.year').attr('year');
 156
 157     if ($('div#list_'+year).is(':visible'))
 158         $('div#list_'+year).hide();
 159     else
 160         load_year(year);
 161 }
 162
 163 function load_year(year)
 164 {
 165     $('div#list_'+year).show();
 166     $.invoke('SpritLog/List', {year: year}, function(data){
 167         make_editable('div#list_'+year+' td span');
 168     });
 169 }
 170 </script></protect>