Through a fun set of hacks for the whole family (it's amazing that this should

be so hard), make the fullscreen background become a clickable link, for easy
bookmarking, URL copying, etc. etc. etc..

diff --git a/files/pr0n-fullscreen.css b/files/pr0n-fullscreen.css
index a61676c8d25d255e636b2600a1c9ce1e82555884..8ea24bfbc384a096388de9dce8aae5f6c8fdd685 100644 (file)
--- a/files/pr0n-fullscreen.css
+++ b/files/pr0n-fullscreen.css
@@ -14,25 +14,39 @@ body {
 img, #text {
        vertical-align: middle;
 }
+img {
+       z-index: 1;
+}
 
 #previous {
        position: absolute;
        bottom: 0px;
        left: 0px;
-       z-index: 1;
+       z-index: 2;
 }
 #next {
        position: absolute;
        bottom: 0px;
        right: 0px;
-       z-index: 1;
+       z-index: 2;
 }
 #close {
        position: absolute;
        top: 0px;
        right: 0px;
-       z-index: 1;
+       z-index: 2;
+}
+#linkbg1, #linkbg2, #linkbg3 {
+       display: block;
+       position: absolute;
+       top: 0px;
+       right: 0px;
+       width: 100%;
+       height: 100%;
+       background-color: black;
 }
+#linkbg2 { z-index: -1; }
+#linkbg3 { z-index: -1; }
 
 #preload {
        position: absolute;

diff --git a/files/pr0n-fullscreen.js b/files/pr0n-fullscreen.js
index 1ec07e6f917af2dd34b4d736046a9f7c2a55390c..efacecc4364aec3c78b4a233a8ba2907f9ed174c 100644 (file)
--- a/files/pr0n-fullscreen.js
+++ b/files/pr0n-fullscreen.js
@@ -100,12 +100,12 @@ function pick_image_size(screen_size, image_size)
 
                if (screen_size[0] >= width && screen_size[1] >= height) {
                        // be sure _not_ to return a reference
-                       return [ fixed_sizes[i][0], fixed_sizes[i][1] ];
+                       return [ fixed_sizes[i][0], fixed_sizes[i][1], width, height ];
                }
        }
        return [ 80, 64 ];
 }
-       
+
 function display_image(width, height, evt, filename, element_id)
 {
        var url = "http://" + global_vhost + "/" + evt + "/" + width + "x" + height + "/" + global_infobox + filename;
@@ -142,9 +142,17 @@ function display_image_num(num, element_id)
        }
 
        var img = display_image(adjusted_size[0], adjusted_size[1], global_image_list[num][0], global_image_list[num][1], element_id);
+       
        if (element_id == "image") {
+               // we want to shrink the box as much as possible if we know the true
+               // size of the image
                center_image(num);
+               
+               document.getElementById('linkbg1').href = global_bookmark_url_base + (num+1);
+               document.getElementById('linkbg2').href = global_bookmark_url_base + (num+1);
+               document.getElementById('linkbg3').href = global_bookmark_url_base + (num+1);
        }
+
        return img;
 }
 
@@ -213,32 +221,28 @@ function set_opacity(id, amount)
 function center_image(num)
 {
        var screen_size = find_width();
-       var adjusted_size;
+       var width, height;
        
        if (global_image_list[num][2] == -1) {
                // no size information, use our pessimal guess
-               adjusted_size = max_image_size(screen_size);
+               var adjusted_size = max_image_size(screen_size);
+               width = adjusted_size[0];
+               height = adjusted_size[1];
        } else {
-               adjusted_size = pick_image_size(screen_size, [ global_image_list[num][2], global_image_list[num][3] ]);
-       }
-
-       // crop the div to the screen
-       if (adjusted_size[0] > screen_size[0]) {
-               adjusted_size[0] = screen_size[0];
-       }
-       if (adjusted_size[1] > screen_size[1]) {
-               adjusted_size[1] = screen_size[1];
+               // use the exact information
+               var adjusted_size = pick_image_size(screen_size, [ global_image_list[num][2], global_image_list[num][3] ]);
+               width = adjusted_size[2];
+               height = adjusted_size[3];
        }
 
        // center the image on-screen
        var main = document.getElementById("main");
        main.style.position = "absolute";
-       main.style.left = (screen_size[0] - adjusted_size[0]) / 2 + "px";
-       main.style.top = (screen_size[1] - adjusted_size[1]) / 2 + "px"; 
-       main.style.width = adjusted_size[0] + "px";
-       main.style.height = adjusted_size[1] + "px";
-       main.style.lineHeight = adjusted_size[1] + "px"; 
-
+       main.style.left = (screen_size[0] - width) / 2 + "px";
+       main.style.top = (screen_size[1] - height) / 2 + "px"; 
+       main.style.width = width + "px";
+       main.style.height = height + "px";
+       main.style.lineHeight = height + "px";
 }
 
 function relayout()
@@ -247,8 +251,6 @@ function relayout()
        if (can_go_next()) {
                prepare_preload(img, global_image_num + 1);
        }
-       
-       center_image(global_image_num);
 
        set_opacity("previous", can_go_previous() ? 0.7 : 0.1);
        set_opacity("next", can_go_next() ? 0.7 : 0.1);

diff --git a/perl/Sesse/pr0n/Index.pm b/perl/Sesse/pr0n/Index.pm
index 8bd8aba7f57871ab8e5c4ba7089c2357ff860d03..0fbd82893b41051d8a944eecbf3228844a899e10 100644 (file)
--- a/perl/Sesse/pr0n/Index.pm
+++ b/perl/Sesse/pr0n/Index.pm
@@ -214,14 +214,27 @@ sub handler {
 
                my $returnurl = "http://" . $r->get_server_name . "/" . $event . "/" .
                        Sesse::pr0n::Common::get_query_string(\%settings_no_fullscreen, \%defsettings);
+               
+               my %settings_bookmark = %settings;
+               $settings_bookmark{'start'} = $defsettings{'start'};
+               my $bookmark_url_base = "http://" . $r->get_server_name . "/" . $event . "/" .
+                       Sesse::pr0n::Common::get_query_string(\%settings_bookmark, \%defsettings);
+
+               if ($bookmark_url_base =~ /\?/) {
+                       $bookmark_url_base .= ';start=';
+               } else {
+                       $bookmark_url_base .= '?start=';
+               }
 
                # *whistle*
                $returnurl =~ s/&/&/g;
+               $bookmark_url_base =~ s/&/&/g;
 
                Sesse::pr0n::Templates::print_template($r, "fullscreen-footer", {
                        vhost => $r->get_server_name,
                        start => $settings{'start'} - 1,
                        returnurl => $returnurl,
+                       bookmarkurlbase => $bookmark_url_base,
                        sel => $settings{'sel'},
                        infobox => $infobox
                });

diff --git a/templates/default/fullscreen-footer b/templates/default/fullscreen-footer
index 353f3d2028d3215a2d074f8a3cbc548a6314d4e5..04ed5c1c9ea9739abe986950a5c8bcc334357bbf 100644 (file)
--- a/templates/default/fullscreen-footer
+++ b/templates/default/fullscreen-footer
@@ -2,6 +2,7 @@
 var global_vhost = "%VHOST%";
 var global_infobox = "%INFOBOX%";
 var global_return_url = "%RETURNURL%";
+var global_bookmark_url_base = "%BOOKMARKURLBASE%";
 var global_image_num = %START%;
 var global_select = %SEL%;
 // end generated
@@ -10,7 +11,8 @@ var global_select = %SEL%;
   </head>
   <body onresize="relayout();" onload="init_ajax(); relayout();" onkeydown="key_down(event.keyCode);" onkeyup="key_up(event.keyCode);">
     <div>
-      <div class="container" id="main"><div id="iehack"></div></div>
+      <a id="linkbg1"></a>
+      <div class="container" id="main"><a id="linkbg2"></a><div id="iehack"><a id="linkbg3"></a></div></div>
       <img id="previous" src="/previous.png" alt="&lt;-" onmousedown="if (can_go_previous()) set_opacity('previous', 1.0)" onmouseup="if (can_go_previous()) { set_opacity('previous', 0.7); go_previous(); }" onmouseout="if (can_go_previous()) { set_opacity('previous', 0.7); }" />
       <img id="next" src="/next.png" alt="-&gt;" onmousedown="if (can_go_next()) set_opacity('next', 1.0)" onmouseup="if (can_go_next()) { set_opacity('next', 0.7); go_next(); }" onmouseout="if (can_go_next()) { set_opacity('next', 0.7); }" />
       <img id="close" src="/close.png" alt="x" onmousedown="set_opacity('close', 1.0)" onmouseup="set_opacity('close', 0.7); do_close();" onmouseout="set_opacity('close', 0.7);" />