root/main/trunk/greenstone2/macros/style.dm @ 27294

Revision 27294, 13.3 KB (checked in by ak19, 8 years ago)

1. Basic authentication when adding user comments. 2. Rearranged some divs to do with adding user comments. 3. A few default css statements for the form.

  • Property svn:executable set to *
  • Property svn:keywords set to Author Date Id Revision
Line 
1# this file must be UTF-8 encoded
2#######################################################################
3# PAGE STYLES
4#######################################################################
5
6package Style
7
8# to use this style system output
9# _header_
10# all your page content, then
11# _footer_
12
13# use the page parameter 'style' to choose the appropriate style
14
15# Current values: "html" and "xhtml"
16_compliance_ {html}
17
18# the style system uses
19# _pagetitle_  - what gets displayed at the top of the browser window
20# _pagescriptextra_ - any extra javascript you want included in the header
21# _pagebannerextra_ - anything extra you want displayed in the page banner
22# _pagefooterextra_ - anything extra you want displayed in the footer
23
24# defaults for the above macros
25_pagetitle_ {_collectionname_}
26_pagescriptfileextra_ {}
27_pagescriptextra_ {}
28_pagebannerextra_ {}
29_pagefooterextra_ {}
30
31# collection specific style and script may be set in collection's extra.dm
32# using the following macros
33_collectionspecificstyle_ {}
34_collectionspecificscript_ {}
35
36# it also relies on lots of Globals, the most important of these are:
37# _cookie_ - put in the cgi header
38# _globalscripts_ - javascript stuff
39# _imagecollection_
40# _imagehome_
41# _imagehelp_
42# _imagepref_
43# _imagethispage_ (this is now not an image, but text. should be renamed?)
44# _linkotherversion_
45
46# _httpiconchalk_ - the image down the left of the page - is now done
47# by the style sheet.
48
49_header_ {_cgihead_
50_htmlhead_(class="bgimage")_startspacer__pagebanner_
51}
52
53_header_[v=1] {_cgihead_
54_htmlhead__pagebanner_
55}
56
57# _cgihead_ {Content-type: text/html
58# _cookie_
59#
60# }
61_cgihead_{}
62
63
64# any declarations relating to CSS that should go in the html head part.
65# declarations containing images are done here so the path is correct
66# at runtime.
67
68_csslink_{
69  <link rel="stylesheet" href="_cssfilelink_" type="text/css"
70   title="Greenstone Style" charset="UTF-8" _linktagend_
71  <link rel="alternate stylesheet" href="_httpstyle_/style-print.css"
72   type="text/css" title="Printer" charset="UTF-8" media="print, screen" _linktagend_
73  <link rel="stylesheet" href="_httpstyle_/style-print.css" type="text/css"
74   title="Printer" charset="UTF-8" media="print" _linktagend_
75  _cssfilelinkextra_
76}
77
78_cssheader_ {
79_csslink_
80<style type="text/css">
81body.bgimage \{ background: url("_httpimages_/chalk.gif") scroll repeat-y left top; \}
82div.navbar \{ background-image: url("_httpimages_/bg_green.png"); \}
83div.divbar \{ background-image: url("_httpimages_/bg_green.png"); \}
84a.navlink \{ background-image: url("_httpimages_/bg_off.png"); \}
85a.navlink_sel \{ background-image: url("_httpimages_/bg_green.png"); \}
86a.navlink:hover \{ background-image: url("_httpimages_/bg_on.png"); \}
87p.bannertitle \{background-image: url("_httpimages_/banner_bg.png"); \}
88p.collectiontitle \{background-image: url("_httpimages_/banner_bg.png"); \}
89</style>
90_collectionspecificstyle_
91
92}
93
94# separate macro so it can be easily overridden for customised collections
95_cssfilelink_ {_httpstyle_/style.css}
96
97# separate macro so additional stylesheets (to those included by default) can be specified
98_cssfilelinkextra_ {}
99
100# Languages that should be displayed right-to-left
101_htmlextra_ [l=ar] { dir=rtl }
102_htmlextra_ [l=fa] { dir=rtl }
103_htmlextra_ [l=he] { dir=rtl }
104_htmlextra_ [l=ur] { dir=rtl }
105_htmlextra_ [l=ps] { dir=rtl }
106_htmlextra_ [l=prs] { dir=rtl }
107
108# htmlhead uses:
109# _1_ - extra parameters for the body tag
110# _pagetitle_
111# _globalscripts_
112_htmlhead_ {<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
113"http://www.w3.org/TR/html4/loose.dtd">
114
115<html_htmlextra_>
116<head>
117<title>_pagetitle_</title>
118<meta name="_status:textversion_" content="_versionnum_" _metatagend_
119_globalscripts_
120_cssheader_
121_document:documentheader_
122</head>
123
124<body _1_>
125}
126
127# Link and meta tags must be closed differently for HTML/XHTML validation
128_linktagend_ {_If_("_compliance_" eq "xhtml",/>,>)}
129_metatagend_ {_If_("_compliance_" eq "xhtml",/>,>)}
130
131_spacerwidth_ {65}
132
133# _startspacer_ is a spacer that gives pages a left-hand margin.
134# It must eventually be closed by _endspacer_.
135_startspacer_ {
136<div id="page">
137}
138
139# If you want to move the home/help/pref buttons, override this to be empty
140# and then explicitly include _globallinks_ somewhere else
141# on the page
142_optgloballinks_ {_globallinks_}
143
144# _bannertitle_ is defined in nav_css/ns4.dm, and is either text or
145# a banner image
146_pagebanner_ {
147<!-- page banner (\_style:pagebanner\_) -->
148<div id="banner">
149<div class="pageinfo"> 
150<p class="bannerlinks">_optgloballinks_</p>
151_bannertitle_
152</div>
153<div class="collectimage">_imagecollection_</div>
154</div>
155<div class="bannerextra">_pagebannerextra_</div>
156<!-- end of page banner -->
157_If_("_activateweb20_" eq "2",
158  _If_("_activatetalkback_" eq "1",_talkback:uploadForm_)
159)
160}
161
162_pagebanner_[v=1] {
163<!-- page banner - text version [v=1] (\_style:pagebanner\_) -->
164<center><h2><b><u>_imagecollection_</u></b></h2></center><p>
165_optgloballinks_
166_pagebannerextra_
167<p>
168<!-- end of page banner -->
169_If_("_activateweb20_" eq "2",
170  _If_("_activatetalkback_" eq "1",_talkback:uploadForm_)
171)
172}
173
174# note we no longer close off one of the startspacer tables here!!
175_footer_ {
176_If_("_cgiargtalkback_" eq "1",_talkback:monitorUpload_)
177<!-- page footer (\_style:footer\_) -->
178_pagefooterextra__endspacer__htmlfooter_
179}
180
181# v=1 footer: not using startspacer in the header, so dont put it in the footer
182_footer_ [v=1]{
183_If_("_cgiargtalkback_" eq "1",_talkback:monitorUpload_)
184<!-- page footer [v=1] (\_style:footer\_) -->
185_pagefooterextra_
186_htmlfooter_
187}
188
189# close off anything opened by startspacer
190_endspacer_ {   
191</div> <!-- id=page -->
192}   
193
194
195_htmlfooter_ {
196</body>
197</html>
198}
199
200_loginscript_ {
201   function appendUsernameArgs(id,addOn)
202   \{
203     var a=document.getElementById(id);
204     var url = a.getAttribute("href");
205     if (url == "") \{
206       url = document.location.toString();
207     \}
208
209     //alert("url before = " + url);
210
211     // clear out any earlier user name/authentication values
212     url = url.replace(/(&|\\\\?)uan=\\d\{0,1\}/g,"");
213     url = url.replace(/(&|\\\\?)un=[a-z0-9:\\-]*/g,"");
214     url = url.replace(/(&|\\\\?)pw=[a-z0-9:\\-]*/g,"");
215
216     //alert("url after = " + url);
217
218     var gwcgi = "_gwcgi_";
219
220     var tailUrl = url.substr(url.length-gwcgi.length);
221
222     url += (tailUrl == "_gwcgi_") ? "?" : "&";
223     url += addOn;
224
225     //alert("url with add on = " + url);
226
227     a.setAttribute("href",url);
228   \}
229}
230
231
232# imagescript only used in nav_ns4.dm
233_globalscripts_{
234  <script type="text/javascript" src="_httpscript_/gsajaxapi.js"></script>
235
236  <script language="javascript" type="text/javascript">
237    function gsdefined(val)
238    \{
239       return (typeof(val) != "undefined");
240    \}
241
242    var gsapi = new GSAjaxAPI("_gwcgi_","_cgiargc_");
243   
244    // http://stackoverflow.com/questions/6312993/javascript-seconds-to-time-with-format-hhmmss
245    // Call as: alert(timestamp.printTime());
246    function formatTime(timestamp) \{
247      var int_timestamp    = parseInt(timestamp, 10); // don't forget the second param
248      var date = new Date(int_timestamp);
249      return date.toLocaleDateString() + " " + date.toLocaleTimeString();   
250   \}
251
252
253    function loadUserComments() \{
254
255        // don't bother loading comments if we're not on a document page (in which case there's no usercommentdiv)
256        var usercommentdiv = document.getElementById("usercomments");
257    if(usercommentdiv == undefined || usercommentdiv == null) \{
258    return;
259    \}
260
261    // else, if we have a usercommentdiv, we would have a docid. Get toplevel section of the docid
262    var doc_id = "_cgiargd_"; //escape("_cgiargd_");
263    var period = doc_id.indexOf(".");
264    if(period != -1) \{
265        doc_id = doc_id.substring(0, period);
266    \}
267   
268    var metapos=0; // counter variable
269    var username = null;
270    var timestamp = null;
271    var comment = null;
272   
273    var comments_arraymap = []; // array of comment records with timestamp, username and comment fields
274
275    // First retrieve all the usercomments (usernames, associated usertimestamps and usercomments)
276    // from the archives folder, where it is arranged easier than in index because it's in sequence already.
277
278    username = gsapi.getArchivesMetadata(doc_id, "username", metapos);
279   
280    // Keep looping, retrieving username, comment and timestamp
281    // Store each triplet in the comments array. Stop when there's no further usernames in archives
282
283    while(username) \{  //&& !username.indexOf("ERROR") == -1) \{
284   
285        var errorIndex = username.indexOf("ERROR");
286        if(errorIndex != -1) \{
287           var endIndex = username.indexOf("(");
288           var error = username.substring(errorIndex,endIndex);
289           var errormessage=document.createTextNode("Error retrieving comments. " + error);
290           usercommentdiv.appendChild(errormessage);
291           //alert(username);
292           break;
293        \}
294   
295        timestamp = gsapi.getArchivesMetadata(doc_id, "usertimestamp", metapos);
296        comment = gsapi.getArchivesMetadata(doc_id, "usercomment", metapos);
297
298        //alert("username: " + username + "\\ntime: " + timestamp + "\\ncomment: " + comment);
299
300        // array of records (arraymap)
301        // http://stackoverflow.com/questions/8190658/sorting-objects-in-a-javascript-array-by-a-key-value
302        // http://stackoverflow.com/questions/4969121/in-javascript-is-there-an-easy-way-to-sort-key-value-pairs-by-the-value-and-re
303        // http://stackoverflow.com/questions/6298169/how-to-create-a-map-object-in-a-javascript
304
305        // object with member vars t, u and c.
306        var comment_record = \{
307            t: timestamp,
308            u: username,
309            c: comment
310        \};
311
312        comments_arraymap.push(comment_record);
313           
314        metapos++;
315        username = gsapi.getArchivesMetadata(doc_id, "username", metapos);//, "_cgiargun_", "_cgiargpw_");
316    \}
317
318    // No need to sort by time,
319    // as the array is already stored sorted and hence retrieved in the right order by using metapos counter
320    // If sorting the array of comment records, which would be by timestamp, see
321    // https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/sort
322
323    //comments_arraymap.sort(function(rec1, rec2) \{
324    // return rec1.t-rec2.t; // sort by timestamp
325    //\});
326   
327    //alert("Found " + metapos + " number of comments in the archives folder for doc " + doc_id);
328   
329    // create the output HTML for all comments in one go now
330    // (we do this here for all values together to hopefully avoid reloading the page for each comment)
331
332    if(metapos > 0) \{
333        var heading=document.createElement("div");
334        var attr=document.createAttribute("class");
335        attr.nodeValue="usercommentheading";
336        heading.setAttributeNode(attr);
337        var txt=document.createTextNode("_text-usercomments-section_");
338        heading.appendChild(txt);
339        usercommentdiv.appendChild(heading);
340    \}
341
342    for(var i = 0; i < metapos; i++) \{
343        var comment_record = comments_arraymap[i];
344
345        username = comment_record.u;
346        timestamp = comment_record.t;
347        comment = comment_record.c;
348
349        // for each usercomment, create a child div with the username, timestamp and comment
350        displayInUserCommentList(usercommentdiv, username, timestamp, comment);
351    \}
352
353   
354    \}
355
356    function displayInUserCommentList(usercommentdiv, username, timestamp, comment) \{
357
358        var divgroup=document.createElement("div");
359    var attr=document.createAttribute("class");
360    attr.nodeValue="usercomment";
361    divgroup.setAttributeNode(attr);
362
363    var divuser=document.createElement("div");
364    var divtime=document.createElement("div");
365    var divcomment=document.createElement("div");
366
367   
368    divgroup.appendChild(divuser);
369    var txt=document.createTextNode(username);
370    divuser.appendChild(txt);
371
372    divgroup.appendChild(divtime);
373    txt=document.createTextNode(formatTime(timestamp)); // format timestamp for date/time display
374    divtime.appendChild(txt);
375
376    divgroup.appendChild(divcomment);
377    txt=document.createTextNode(comment);
378    divcomment.appendChild(txt);
379
380    usercommentdiv.appendChild(divgroup);
381             
382    \}
383
384    // http://stackoverflow.com/questions/807878/javascript-that-executes-after-page-load
385    // ensure we don't replace any other onLoad() functions, but append the loadUserComments()
386    // function to the existing onLoad handlers
387
388    if(window.onload) {\
389        var curronload = window.onload;
390        var newonload = function() {\
391            curronload();
392            loadUserComments();
393        \};
394        window.onload = newonload;
395    \} else {\
396        window.onload = loadUserComments;
397    \}
398  </script>
399
400_If_("_activatejquery_" eq "1",_jqueryScriptAndStyle_)
401
402_If_("_activateweb20_" eq "2",
403  _If_("_activateseaweed_" eq "1",_seaweedscript_)
404  _If_("_activatetalkback_" eq "1",_talkbackscript_)
405)
406_If_(_pagescriptfileextra_,_pagescriptfileextra_)
407<script language="javascript" type="text/javascript">
408_loginscript_
409_If_(_pagescriptextra_,_pagescriptextra_)
410_collectionspecificscript_
411_imagescript_
412</script>
413}
414
415_globalscripts_ [v=1] {
416
417_If_("_activatejquery_" eq "1",_jqueryScriptAndStyle_)
418
419_If_("_activateweb20_" eq "2",
420  <script type="text/javascript" src="_httpscript_/gsajaxapi.js"></script>
421  _If_("_activateseaweed_" eq "1",_seaweedscript_)
422  _If_("_activatetalkback_" eq "1",_talkbackscript_)
423)
424_If_(_pagescriptfileextra_,_pagescriptfileextra_)
425<script language="javascript" type="text/javascript">
426<!--
427_loginscript_
428_If_(_cgiargx_,_scriptdetach_)
429_If_(_pagescriptextra_,_pagescriptextra_)
430_collectionspecificscript_
431// -->
432</script>
433}
434
435_scriptdetach_ {
436    function close\_detach() \{
437    close();
438    \}
439}
440
441
442_jqueryScriptAndStyle_ {
443<link type="text/css" href="_httpstyle_/max-video/jquery-ui-1.8.4.custom.css" rel="stylesheet" />
444<script type="text/javascript" src="_httpscript_/jquery-1.4.2.min.js"></script>
445<script type="text/javascript" src="_httpscript_/jquery-ui-1.8.4.custom.min.js"></script>
446}
447
Note: See TracBrowser for help on using the browser.