image scaling cookie

This commit is contained in:
Shish 2012-03-24 11:16:59 +00:00
parent ecad3b9891
commit eb705d29f5
3 changed files with 45 additions and 34 deletions

View File

@ -75,6 +75,19 @@ class PixelFileHandler extends DataHandlerExtension {
return $ok;
}
public function onImageAdminBlockBuilding(ImageAdminBlockBuildingEvent $event) {
$event->add_part("
<form>
<select id='zoomer'>
<option value='full'>Full Size</option>
<option value='width'>Fit Width</option>
<option value='height'>Fit Height</option>
<option value='both'>Fit Both</option>
</select>
</form>
", 20);
}
// IM thumber {{{
private function make_thumb_convert(/*string*/ $inname, /*string*/ $outname) {

View File

@ -0,0 +1,30 @@
$(function() {
$("#zoomer").change(function(e) {
zoom(this.options[this.selectedIndex].value);
$.cookie("ui-image-zoom", this.options[this.selectedIndex].value, {path: '/', expires: 365});
});
if($.cookie("ui-image-zoom")) {
zoom($.cookie("ui-image-zoom"));
}
});
function zoom(zoom) {
var img = $('#main_image');
if(zoom == "full") {
img.css('max-width', img.data('width') + 'px');
img.css('max-height', img.data('height') + 'px');
}
if(zoom == "width") {
img.css('max-width', '90%');
img.css('max-height', img.data('height') + 'px');
}
if(zoom == "height") {
img.css('max-width', img.data('width') + 'px');
img.css('max-height', (window.innerHeight * 0.9) + 'px');
}
if(zoom == "both") {
img.css('max-width', '90%');
img.css('max-height', (window.innerHeight * 0.9) + 'px');
}
}

View File

@ -5,7 +5,6 @@ class PixelFileHandlerTheme extends Themelet {
global $config;
$u_ilink = $image->get_image_link();
$html = "<img alt='main image' id='main_image' src='$u_ilink'>";
if($config->get_bool("image_show_meta") && function_exists("exif_read_data")) {
# FIXME: only read from jpegs?
$exif = @exif_read_data($image->get_image_filename(), 0, true);
@ -24,39 +23,8 @@ class PixelFileHandlerTheme extends Themelet {
}
}
$zoom_default = $config->get_bool("image_zoom", false) ? "scale(img);" : "";
$zoom = "<script type=\"text/javascript\">
img = document.getElementById(\"main_image\");
if(img) {
img.onclick = function() {scale(img);};
msg_div = document.createElement(\"div\");
msg_div.id = \"msg_div\";
msg_div.appendChild(document.createTextNode(\"Note: Image has been scaled to fit the screen; click to enlarge\"));
msg_div.style.display=\"none\";
img.parentNode.insertBefore(msg_div, img);
orig_width = $image->width;
$zoom_default
}
function scale(img) {
if(orig_width >= img.parentNode.clientWidth * 0.9) {
if(img.style.width != \"90%\") {
img.style.width = \"90%\";
msg_div.style.display = \"block\";
}
else {
img.style.width = orig_width + 'px';
msg_div.style.display = \"none\";
}
}
}
</script>";
$page->add_block(new Block("Image", $html.$zoom, "main", 10));
$html = "<img alt='main image' id='main_image' src='$u_ilink' data-width='{$image->width}' data-height='{$image->height}'>";
$page->add_block(new Block("Image", $html, "main", 10));
}
}
?>