Add support for image captions.

This commit is contained in:
Starbeamrainbowlabs 2016-05-29 20:34:34 +01:00
parent a09d8c0115
commit 4953b6f1fa
4 changed files with 101 additions and 19 deletions

View File

@ -7,7 +7,7 @@ $start_time = microtime(true);
* ================
* Inspired by Minty Wiki by am2064
* Link: https://github.com/am2064/Minty-Wiki
*
*
* Credits:
* Code by @Starbeamrainbowlabs
* Parsedown - by erusev and others on github from http://parsedown.org/
@ -328,6 +328,8 @@ input[type=button], input[type=submit] { cursor: pointer; }
.image-controls li { display: inline-block; margin: 5px; padding: 5px; }
.link-display { margin-left: 0.5rem; }
figcaption { text-align: center; }
.printable { padding: 2rem; }
h1 { text-align: center; }
@ -4643,22 +4645,25 @@ class PeppermintParsedown extends ParsedownExtra
protected function inlineExtendedImage($fragment)
{
if(preg_match('/^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*)(?:\|([^)]*))?)?\)/', $fragment["text"], $matches))
///^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*)(?:\|([^)]*))?)?\)/
if(preg_match('/^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*))?(?:\|([^|)]*))?(?:\|([^)]*))?\)/', $fragment["text"], $matches))
{
/*
* 0 - Everything
* 1 - Alt text
* 2 - Url
* 3 - First param (optional)
* 4 - Second Param (optional)
* 4 - Second param (optional)
* 5 - Third param (optional)
*/
$altText = $matches[1];
$imageUrl = str_replace("&", "&", $matches[2]); // Decode & to allow it in preview urls
$param1 = !empty($matches[3]) ? strtolower(trim($matches[3])) : false;
$param1 = empty($matches[3]) ? false : strtolower(trim($matches[3]));
$param2 = empty($matches[4]) ? false : strtolower(trim($matches[4]));
$param3 = empty($matches[5]) ? false : strtolower(trim($matches[5]));
$floatDirection = false;
$imageSize = false;
$imageCaption = false;
if($this->isFloatValue($param1))
{
@ -4672,6 +4677,11 @@ class PeppermintParsedown extends ParsedownExtra
$floatDirection = $param2;
$imageSize = $this->parseSizeSpec($param1);
}
else if($this->isFloatValue($param3))
{
$floatDirection = $param3;
$imageSize = $this->parseSizeSpec($param1);
}
else if($param1 === false and $param2 === false)
{
// Neither params were specified
@ -4686,6 +4696,11 @@ class PeppermintParsedown extends ParsedownExtra
$imageSize = $this->parseSizeSpec($param1);
}
if($param2 !== false && strtolower(trim($param2)) == "caption")
$imageCaption = true;
if($param3 !== false && strtolower(trim($param3)) == "caption")
$imageCaption = true;
$style = "";
if($imageSize !== false)
$style .= " max-width: " . $imageSize["x"] . "px; max-height: " . $imageSize["y"] . "px;";
@ -4694,10 +4709,11 @@ class PeppermintParsedown extends ParsedownExtra
$urlExtension = pathinfo($imageUrl, PATHINFO_EXTENSION);
$urlType = system_extension_mime_type($urlExtension);
$result = [];
switch(substr($urlType, 0, strpos($urlType, "/")))
{
case "audio":
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "audio",
@ -4710,8 +4726,9 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
case "video":
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "video",
@ -4724,11 +4741,11 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
case "image":
default:
// If we can't work out what it is, then assume it's an image
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "img",
@ -4740,7 +4757,31 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
}
if($imageCaption)
{
$rawStyle = $result["element"]["attributes"]["style"];
$containerStyle = preg_replace('/^.*float/', "float", $rawStyle);
$mediaStyle = preg_replace('/\s*float.*;/', "", $rawStyle);
$result["element"] = [
"name" => "figure",
"text" => [
$result["element"],
[
"name" => "figcaption",
"text" => htmlentities($altText)
],
],
"attributes" => [
"style" => $containerStyle
],
"handler" => "elements"
];
$result["element"]["text"][0]["attributes"]["style"] = $mediaStyle;
}
return $result;
}
}

View File

@ -194,7 +194,7 @@
"author": "Emanuil Rusev & Starbeamrainbowlabs",
"description": "An upgraded (now default!) parser based on Emanuil Rusev's Parsedown Extra PHP library (https:\/\/github.com\/erusev\/parsedown-extra), which is licensed MIT. Please be careful, as this module adds some weight to your installation, and also *requires* write access to the disk on first load.",
"id": "parser-parsedown",
"lastupdate": 1460442444,
"lastupdate": 1464550150,
"optional": false
}
]

View File

@ -331,22 +331,25 @@ class PeppermintParsedown extends ParsedownExtra
protected function inlineExtendedImage($fragment)
{
if(preg_match('/^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*)(?:\|([^)]*))?)?\)/', $fragment["text"], $matches))
///^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*)(?:\|([^)]*))?)?\)/
if(preg_match('/^!\[(.*)\]\(([^ |)]+)\s*(?:\|([^|)]*))?(?:\|([^|)]*))?(?:\|([^)]*))?\)/', $fragment["text"], $matches))
{
/*
* 0 - Everything
* 1 - Alt text
* 2 - Url
* 3 - First param (optional)
* 4 - Second Param (optional)
* 4 - Second param (optional)
* 5 - Third param (optional)
*/
$altText = $matches[1];
$imageUrl = str_replace("&", "&", $matches[2]); // Decode & to allow it in preview urls
$param1 = !empty($matches[3]) ? strtolower(trim($matches[3])) : false;
$param1 = empty($matches[3]) ? false : strtolower(trim($matches[3]));
$param2 = empty($matches[4]) ? false : strtolower(trim($matches[4]));
$param3 = empty($matches[5]) ? false : strtolower(trim($matches[5]));
$floatDirection = false;
$imageSize = false;
$imageCaption = false;
if($this->isFloatValue($param1))
{
@ -360,6 +363,11 @@ class PeppermintParsedown extends ParsedownExtra
$floatDirection = $param2;
$imageSize = $this->parseSizeSpec($param1);
}
else if($this->isFloatValue($param3))
{
$floatDirection = $param3;
$imageSize = $this->parseSizeSpec($param1);
}
else if($param1 === false and $param2 === false)
{
// Neither params were specified
@ -374,6 +382,11 @@ class PeppermintParsedown extends ParsedownExtra
$imageSize = $this->parseSizeSpec($param1);
}
if($param2 !== false && strtolower(trim($param2)) == "caption")
$imageCaption = true;
if($param3 !== false && strtolower(trim($param3)) == "caption")
$imageCaption = true;
$style = "";
if($imageSize !== false)
$style .= " max-width: " . $imageSize["x"] . "px; max-height: " . $imageSize["y"] . "px;";
@ -382,10 +395,11 @@ class PeppermintParsedown extends ParsedownExtra
$urlExtension = pathinfo($imageUrl, PATHINFO_EXTENSION);
$urlType = system_extension_mime_type($urlExtension);
$result = [];
switch(substr($urlType, 0, strpos($urlType, "/")))
{
case "audio":
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "audio",
@ -398,8 +412,9 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
case "video":
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "video",
@ -412,11 +427,11 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
case "image":
default:
// If we can't work out what it is, then assume it's an image
return [
$result = [
"extent" => strlen($matches[0]),
"element" => [
"name" => "img",
@ -428,7 +443,31 @@ class PeppermintParsedown extends ParsedownExtra
]
]
];
break;
}
if($imageCaption)
{
$rawStyle = $result["element"]["attributes"]["style"];
$containerStyle = preg_replace('/^.*float/', "float", $rawStyle);
$mediaStyle = preg_replace('/\s*float.*;/', "", $rawStyle);
$result["element"] = [
"name" => "figure",
"text" => [
$result["element"],
[
"name" => "figcaption",
"text" => htmlentities($altText)
],
],
"attributes" => [
"style" => $containerStyle
],
"handler" => "elements"
];
$result["element"]["text"][0]["attributes"]["style"] = $mediaStyle;
}
return $result;
}
}

View File

@ -4,7 +4,7 @@
* ================
* Inspired by Minty Wiki by am2064
* Link: https://github.com/am2064/Minty-Wiki
*
*
* Credits:
* Code by @Starbeamrainbowlabs
* Parsedown - by erusev and others on github from http://parsedown.org/
@ -325,6 +325,8 @@ input[type=button], input[type=submit] { cursor: pointer; }
.image-controls li { display: inline-block; margin: 5px; padding: 5px; }
.link-display { margin-left: 0.5rem; }
figcaption { text-align: center; }
.printable { padding: 2rem; }
h1 { text-align: center; }