correctly handle newlines in captions
[booh] / lib / booh / html-merges.rb
1 #
2 #                         *  BOOH  *
3 #
4 # A.k.a `Best web-album Of the world, Or your money back, Humerus'.
5 #
6 # The acronyn sucks, however this is a tribute to Dragon Ball by
7 # Akira Toriyama, where the last enemy beaten by heroes of Dragon
8 # Ball is named "Boo". But there was already a free software project
9 # called Boo, so this one will be it "Booh". Or whatever.
10 #
11 #
12 # Copyright (c) 2004 Guillaume Cottenceau <gc3 at bluewin.ch>
13 #
14 # This software may be freely redistributed under the terms of the GNU
15 # public license version 2.
16 #
17 # You should have received a copy of the GNU General Public License
18 # along with this program; if not, write to the Free Software
19 # Foundation, Inc., 675 Mass Ave, Cambridge, MA 02139, USA.
20
21 # holds static data to merge in the html "themes"
22
23 require 'gettext'
24 bindtextdomain("booh")
25
26 require 'booh/booh-lib'
27 include Booh
28
29 $image_head_code = <<'EOF'
30 <meta name="generator" content="Generated by Booh! http://zarb.org/~gc/html/booh.html">
31
32 <script language="JavaScript1.1" type="text/JavaScript">
33 var images = new Array(~~images~~);
34 ~~other_images~~
35 var other_sizes = new Array(~~other_sizes~~);
36 var captions = new Array(~~captions~~);
37
38 var images_ary = new Array();
39 var images_loaded = new Array();
40 var current = 0;
41 var slideshow = 0;
42 var slideshow_pause = null;
43 var slideshow_timer = null;
44
45 for (i = 0; i < images.length; i++) { 
46     /* this array will contain 0 if image not yet loaded, 1 when loading,
47      * 2 when complete */
48     images_loaded[i] = 0;
49 }
50
51 function dbg(t) {
52     document.getElementById('dbg_text').innerHTML += t + "\n";
53 }
54
55 /* load image, return 1 if image is finished loading */
56 function load(i) {
57     if (images_loaded[i] == 0) {
58         images_ary[i] = new Image();
59         images_ary[i].src = images[i];
60         images_loaded[i] = 1;
61     }
62     if (images_loaded[i] == 1) {
63         if (images_ary[i].complete) {
64             images_loaded[i] = 2;
65         } else {
66             return 0;
67         }
68     }
69     return 1;
70 }
71
72 function preload() { 
73
74     /* favor current image, if user clicked on `last' or something */
75     load(current);
76
77     /* don't blindly preload all images at the beginning,
78      * but rather load them one by one, in order to get
79      * next ones faster, beginning with next to current
80      */
81     for (i = current + 1; i < images.length && i <= current + 5; i++) { 
82         if (load(i) == 0) {
83             setTimeout("preload()", 500);
84             return;
85         }
86     }
87     for (i = current - 1; i >= current - 3; i--) { 
88         if (i >= 0) {
89             if (load(i) == 0) {
90                 setTimeout("preload()", 500);
91                 return;
92             }
93         }
94     }
95
96     setTimeout("preload()", 500);
97 }
98
99 function add_cookie(val) {
100     var expires = new Date(new Date().getTime() + (30 * 86400000));  // 30 days
101     document.cookie = val
102                       + '; expires=' + expires.toGMTString()
103                       + '; path=/';
104 }
105
106 function get_cookie(key) {
107     if (document.cookie) {
108         var index = document.cookie.indexOf(key);
109         if (index != -1) {
110             var oleft = (document.cookie.indexOf('=', index) + 1);
111             var oright = document.cookie.indexOf(';', index);
112             if (oright == -1) {
113                 oright = document.cookie.length;
114             }
115             return document.cookie.substring(oleft, oright);
116         }
117     }
118     return null;
119 }
120
121 function init() {
122
123     add_cookie('booh-preferred-size-~~theme~~=~~current_size~~')
124
125     /* retrieve GET parameters */
126     all_params = location.href.split("?")
127     if (all_params.length > 1) {
128         params = all_params[1].split("&");
129         for (i = 0; i < params.length; i++) {
130             keyvalue = params[i].split("=");
131             if (keyvalue[0] == "run_slideshow") {
132                 toggle_slideshow();
133             }
134             if (keyvalue[0] == "current") {
135                 for (i = 0; i < images.length; i++) {
136                     if (images[i] == keyvalue[1]) {
137                         current = i;
138                         break;
139                     }
140                 }
141             }
142         }
143     }
144
145     preload();
146     display_current();
147     if (images.length == 1) {
148         document.getElementById("b_slideshow").disabled = true;
149     }
150
151     preferred_pause = get_cookie('booh-slideshow-pause-~~theme~~');
152     if (preferred_pause != null) {
153         document.getElementById('secs').value = preferred_pause;
154     }
155
156     if (navigator.userAgent.indexOf('Opera') == -1) {
157         document.onkeydown = keyDownEvent;
158     }
159 }
160
161 function update_sensibilities() {
162     if (current == 0) {
163         document.getElementById("b_first").disabled = true;
164         document.getElementById("b_previous").disabled = true;
165     } else {
166         document.getElementById("b_first").disabled = false;
167         document.getElementById("b_previous").disabled = false;
168     }
169
170     if (current == images.length - 1) {
171         document.getElementById("b_next").disabled = true;
172         document.getElementById("b_last").disabled = true;
173     } else {
174         document.getElementById("b_next").disabled = false;
175         document.getElementById("b_last").disabled = false;
176     }
177 }
178
179 function set_cursor_(value, element) {
180
181     if (!element || !element.style) {
182         return;
183     }
184
185     element.style.cursor = value;
186
187     children = element.childNodes;
188     for (i = 0; i < children.length; i++) {
189         set_cursor_(value, children.item[i]);
190     }
191 }
192
193 function set_cursor(value) {
194     set_cursor_(value, document.getElementById('body'));
195 }
196
197 function show_current_text() {
198     /* don't show text if image not yet loaded because navigator
199      * won't refresh it during load */
200     if (images_loaded[current] == 2) {
201         document.getElementById('image_counter').innerHTML = ( current + 1 ) + "/" + images.length;
202         document.getElementById('main_text').innerHTML = captions[current] || images[current];
203         for (i = 0; i < other_sizes.length; i++) { 
204             if (other_sizes[i] == "original") {
205                 document.getElementById('link' + other_sizes[i]).href = eval("images_" + other_sizes[i] + "[current]");
206             } else {
207                 document.getElementById('link' + other_sizes[i]).href = 'image-' + other_sizes[i] + '.html?current=' + eval("images_" + other_sizes[i] + "[current]");
208             }
209         }
210         document.getElementById('thumbnails').href = 'thumbnails-~~current_size~~.html#' + images[current];
211         set_cursor("default");
212     } else {
213         setTimeout("show_current_text()", 100);
214         set_cursor("wait");
215     }
216 }
217
218 function display_current() {
219     eval("document.main_img.src = images[" + current + "]");
220     show_current_text();
221     update_sensibilities();
222 }
223
224 function first() {
225     if (slideshow == 1) {
226         toggle_slideshow(true);
227     }
228     
229     current = 0;
230     display_current();
231 }
232
233 function next() {
234     if (slideshow == 1) {
235         toggle_slideshow(true);
236     }
237
238     if (current < images.length - 1) {
239         current++;
240         display_current();
241     }
242 }
243
244 function previous() {
245     if (slideshow == 1) {
246         toggle_slideshow(true);
247     }
248
249     if (current > 0) {
250         current--;
251         display_current();
252     }
253 }
254
255 function last() {
256     if (slideshow == 1) {
257         toggle_slideshow(true);
258     }
259
260     current = images.length - 1;
261     display_current();
262 }
263
264 function keyDownEvent(key) {
265     if (!key) {
266         key = event;
267         key.which = key.keyCode;
268     }
269     switch (key.which) {
270       case 36: // home
271         first();
272         break;
273       case 35: // end
274         last();
275         break;
276       case 37: // left
277         previous();
278         break;
279       case 39: // right
280         next();
281         break;
282       case 38: // up
283         for (i = 0; i < 10; i++) { 
284             previous();
285         }
286         break;
287       case 40: // down
288         for (i = 0; i < 10; i++) { 
289             next();
290         }
291         break;
292     }
293 }
294
295 function toggle_slideshow(now) {
296     if (slideshow == 0) {
297         slideshow_pause = document.getElementById('secs').value;
298         add_cookie('booh-slideshow-pause-~~theme~~=' + slideshow_pause)
299         document.getElementById("b_slideshow").value = "~~stop_slideshow~~";
300         slideshow = 1;
301         if (current == images.length - 1) {
302             current = -1;
303         }
304         if (now) {
305             run_slideshow();
306         } else {
307             setTimeout("run_slideshow()", slideshow_pause * 1000);
308         }
309     } else {
310         clearTimeout(slideshow_timer);
311         document.getElementById("b_slideshow").value = "~~run_slideshow~~";
312         slideshow = 0;
313     }
314 }
315
316 function run_slideshow() {
317     if (slideshow == 0) {
318         return;
319     }
320
321     if (images_loaded[current + 1] == 2) {
322         current++;
323         display_current();
324         slideshow_timer = setTimeout("run_slideshow()", slideshow_pause * 1000);
325     } else {
326         slideshow_timer = setTimeout("run_slideshow()", 500);
327     }
328
329     if (current == images.length - 1) {
330         toggle_slideshow(true);
331     }
332 }
333 </script>
334 EOF
335
336 $image_head_code.sub!('~~run_slideshow~~', utf8(_('Run slideshow!')))
337 $image_head_code.sub!('~~stop_slideshow~~', utf8(_('Stop slideshow')))
338
339 $body_additions = <<'EOF'
340 onload="init()" id="body"
341 EOF
342
343 $button_first = '
344     <form><input type="button"
345                  onclick="first()"
346                  value="' + utf8(_('<<- First')) + '"
347                  id="b_first"/></form>'
348
349 $button_previous = '
350     <form><input type="button"
351                  onclick="previous()"
352                  value="' + utf8(_('<- Previous')) + '"
353                  id="b_previous"/></form>'
354
355 $button_next = '
356     <form><input type="button"
357                  onclick="next()"
358                  value="' + utf8(_('Next ->')) + '"
359                  id="b_next"/></form>'
360
361 $button_last = '
362     <form><input type="button"
363                  onclick="last()"
364                  value="' + utf8(_('Last ->>')) + '"
365                  id="b_last"/></form>'
366
367 $button_slideshow = '
368     <input type="button"
369            onclick="toggle_slideshow(true)"
370            value="' + utf8(_('Run slideshow!')) + '"
371            id="b_slideshow"/>'
372
373 $pause_slideshow = '
374     <font size="-2">' + utf8(_('pause:')) + '<input type="text" id="secs" size="1" value="3"/>' + utf8(_('secs')) + '</font>'
375
376
377 $image = <<'EOF'
378   <img name="main_img">
379 EOF
380
381 $image_counter_additions = <<'EOF'
382   id="image_counter"
383 EOF
384
385 $caption_additions = <<'EOF'
386   id="main_text"
387 EOF
388
389 $body_code = <<'EOF'
390 EOF
391
392
393 $thumbnails_head_code = <<'EOF'
394 <meta name="generator" content="Generated by Booh! http://zarb.org/~gc/html/booh.html">
395
396 <script language="JavaScript1.1" type="text/JavaScript">
397     var expires = new Date(new Date().getTime() + (30 * 86400000));  // 30 days
398     document.cookie = 'booh-preferred-size-~~theme~~=~~current_size~~'
399                       + '; expires=' + expires.toGMTString()
400                       + '; path=/';
401 </script>
402 EOF
403
404
405 $preferred_size_reloader = <<'EOF'
406 <html>
407     <head>
408         <script language="JavaScript1.1" type="text/JavaScript">
409
410 function getPreferredSize() {
411     if (document.cookie) {
412         var index = document.cookie.indexOf('booh-preferred-size-~~theme~~');
413         if (index != -1) {
414             var oleft = (document.cookie.indexOf('=', index) + 1);
415             var oright = document.cookie.indexOf(';', index);
416             if (oright == -1) {
417                 oright = document.cookie.length;
418             }
419             return 'thumbnails-' + document.cookie.substring(oleft, oright) + '.html';
420         }
421     }
422     return 'thumbnails-~~default_size~~.html';
423 }
424
425 window.location.href = getPreferredSize();
426
427         </script>
428     </head>
429 </html>
430 EOF