6a4988c379929266bee47e6e572eb797ba3f4300
[infodrom.org/service.infodrom.org] / 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 style="float:right;">&euro; %.2f&nbsp;&nbsp;%d km</div>', $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 });
115 var sprit_machine = <?=intval($_POST['machine'])?>;
116 function log_new()
117 {
118     $('#details input').not('input[type="submit"]').val('');
119     $('input#machine').val(sprit_machine);
120     if ($('#details').css('left') == '0px')
121       $('#details').css('left', ($(window).width()-280)+'px').css('top', '30px');
122     $('#details').show();
123     $('#date').focus();
124     return false;
125 }
126
127 function log_save()
128 {
129     $.invoke('SpritLog/Add', $('#details input').serialize(), function(data){
130         load_year(data.year);
131         $('#details').hide();
132     });
133
134     return false;
135 }
136
137 function toggle_year(event)
138 {
139     var year = $(this).find('div.year').attr('year');
140
141     if ($('div#list_'+year).is(':visible'))
142         $('div#list_'+year).hide();
143     else
144         load_year(year);
145 }
146
147 function load_year(year)
148 {
149     $('div#list_'+year).show();
150     $.invoke('SpritLog/List', {year: year}, function(data){
151         make_editable('div#list_'+year+' td span');
152     });
153 }
154 </script></protect>