Merge pull request #578 from im-mi/enhance-zoom

Enhance zoom
This commit is contained in:
Shish 2016-10-09 22:21:39 +01:00 committed by GitHub
commit 7548c66a0b
5 changed files with 28 additions and 8 deletions

View File

@ -4,7 +4,8 @@ class IcoFileHandlerTheme extends Themelet {
public function display_image(Page $page, Image $image) { public function display_image(Page $page, Image $image) {
$ilink = $image->get_image_link(); $ilink = $image->get_image_link();
$html = " $html = "
<img id='main_image' src='$ilink'> <img id='main_image' class='shm-main-image' alt='main image' src='$ilink'
data-width='{$image->width}' data-height='{$image->height}'>
"; ";
$page->add_block(new Block("Image", $html, "main", 10)); $page->add_block(new Block("Image", $html, "main", 10));
} }

View File

@ -1,5 +1,7 @@
$(function() { $(function() {
function zoom(zoom_type) { function zoom(zoom_type, save_cookie) {
save_cookie = save_cookie === undefined ? true : save_cookie;
var img = $('.shm-main-image'); var img = $('.shm-main-image');
if(zoom_type == "full") { if(zoom_type == "full") {
@ -21,14 +23,21 @@ $(function() {
$(".shm-zoomer").val(zoom_type); $(".shm-zoomer").val(zoom_type);
if (save_cookie) {
Cookies.set("ui-image-zoom", zoom_type, {expires: 365}); Cookies.set("ui-image-zoom", zoom_type, {expires: 365});
} }
}
$(".shm-zoomer").change(function(e) { $(".shm-zoomer").change(function(e) {
zoom(this.options[this.selectedIndex].value); zoom(this.options[this.selectedIndex].value);
}); });
$(window).resize(function(e) {
$(".shm-zoomer").each(function (e) {
zoom(this.options[this.selectedIndex].value, false)
});
});
$(".shm-main-image").click(function(e) { $("img.shm-main-image").click(function(e) {
switch(Cookies.get("ui-image-zoom")) { switch(Cookies.get("ui-image-zoom")) {
case "full": zoom("width"); break; case "full": zoom("width"); break;
default: zoom("full"); break; default: zoom("full"); break;

View File

@ -101,6 +101,9 @@ class MiniSVGParser {
/** @var int */ /** @var int */
public $height=0; public $height=0;
/** @var int */
private $xml_depth=0;
/** @param string $file */ /** @param string $file */
function __construct($file) { function __construct($file) {
$xml_parser = xml_parser_create(); $xml_parser = xml_parser_create();
@ -110,13 +113,15 @@ class MiniSVGParser {
} }
function startElement($parser, $name, $attrs) { function startElement($parser, $name, $attrs) {
if($name == "SVG") { if($name == "SVG" && $this->xml_depth == 0) {
$this->width = int_escape($attrs["WIDTH"]); $this->width = int_escape($attrs["WIDTH"]);
$this->height = int_escape($attrs["HEIGHT"]); $this->height = int_escape($attrs["HEIGHT"]);
} }
$this->xml_depth++;
} }
function endElement($parser, $name) { function endElement($parser, $name) {
$this->xml_depth--;
} }
} }

View File

@ -5,8 +5,8 @@ class SVGFileHandlerTheme extends Themelet {
$ilink = make_link("get_svg/{$image->id}/{$image->id}.svg"); $ilink = make_link("get_svg/{$image->id}/{$image->id}.svg");
// $ilink = $image->get_image_link(); // $ilink = $image->get_image_link();
$html = " $html = "
<object data='$ilink' type='image/svg+xml' width='{$image->width}' height='{$image->height}'> <object data='$ilink' type='image/svg+xml' data-width='{$image->width}' data-height='{$image->height}' id='main_image' class='shm-main-image'>
<embed src='$ilink' type='image/svg+xml' width='{$image->width}' height='{$image->height}' /> <embed src='$ilink' type='image/svg+xml' />
</object> </object>
"; ";
$page->add_block(new Block("Image", $html, "main", 10)); $page->add_block(new Block("Image", $html, "main", 10));

View File

@ -42,7 +42,12 @@ class VideoFileHandlerTheme extends Themelet {
$html .= $html_fallback; $html .= $html_fallback;
} else { } else {
$html .= " $html .= "
<video controls " . ($autoplay ? 'autoplay' : '') . " width=\"100%\" " . ($loop ? 'loop' : '') . "> <video controls class='shm-main-image' id='main_image' alt='main image'"
. ($autoplay ? ' autoplay' : '')
. ($loop ? ' loop' : '')
. " data-width='{$image->width}' "
. " data-height='{$image->height}'>
<source src='{$ilink}' type='{$supportedExts[$ext]}'> <source src='{$ilink}' type='{$supportedExts[$ext]}'>
<!-- If browser doesn't support filetype, fallback to flash --> <!-- If browser doesn't support filetype, fallback to flash -->