Knah-Tsaeb/Minigalnano
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add close modal on cliking img

Browse source 
Hide link by default
This commit is contained in:
Knah Tsaeb 2021-08-03 13:57:33 +02:00
parent a59950db91
commit 0883e1a6b1
2 changed files with 69 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

100
index.php
View file

@ -10,23 +10,23 @@
error_reporting(-1);
/**
* Améliore la sortie print
*
* @author Tatane http://www.tatane.info/index.php/print_rn
* @author http://www.blog.cactuscrew.com/77-print_rn.html
* @param $data (array) tableau ou variable à examiner
* @param $name (string) nom a afficher
* @return false affiche les clef valeur du tableau $data
* @example n_print($array, 'Tableau de valeur');
*/
function n_print($data, $name = '') {
* Améliore la sortie print
*
* @author Tatane http://www.tatane.info/index.php/print_rn
* @author http://www.blog.cactuscrew.com/77-print_rn.html
* @param $data (array) tableau ou variable à examiner
* @param $name (string) nom a afficher
* @return false affiche les clef valeur du tableau $data
* @example n_print($array, 'Tableau de valeur');
*/
function n_print($data, $name = '') {
$aBackTrace = debug_backtrace();
echo '<h2>', $name, '</h2>';
echo '<fieldset style="border: 1px solid orange; padding: 5px;color: #333; background-color: #fff;">';
echo '<legend style="border:1px solid orange;padding: 1px;background-color:#eee;color:orange;">', basename($aBackTrace[0]['file']), ' ligne => ', $aBackTrace[0]['line'], '</legend>';
echo '<pre>', htmlentities(print_r($data, 1)), '</pre>';
echo '</fieldset><br />';
}
}
// Do not edit below this section unless you know what you are doing!
@ -35,8 +35,8 @@ $version = "0.4.0";
ini_set("memory_limit", "256M");
require "config-default.php";
if(file_exists('config.php')){
include "config.php";
if (file_exists('config.php')) {
include "config.php";
}
//-----------------------
@ -62,8 +62,7 @@ if (!function_exists('exif_read_data') && $display_exif == 1) {
//-----------------------
// FUNCTIONS
//-----------------------
function padstring($name, $length)
{
function padstring($name, $length) {
global $label_max_length;
if (!isset($length)) {
$length = $label_max_length;
@ -74,8 +73,7 @@ function padstring($name, $length)
return $name;
}
function getfirstImage($dirname)
{
function getfirstImage($dirname) {
$imageName = false;
$extensions = array("jpg", "png", "jpeg", "gif", "bmp");
if ($handle = opendir($dirname)) {
@ -98,8 +96,7 @@ function getfirstImage($dirname)
return $imageName;
}
function parse_fraction($v, $round = 0)
{
function parse_fraction($v, $round = 0) {
list($x, $y) = array_map('intval', explode('/', $v));
if (empty($x) || empty($y)) {
return $v;
@ -113,8 +110,7 @@ function parse_fraction($v, $round = 0)
return round($x / $y, $round);
}
function readEXIF($file)
{
function readEXIF($file) {
$exif_arr = array();
$exif_data = exif_read_data($file);
@ -150,8 +146,7 @@ function readEXIF($file)
return $exif_arr;
}
function checkpermissions($file)
{
function checkpermissions($file) {
global $messages;
if (!is_readable($file)) {
@ -162,13 +157,12 @@ function checkpermissions($file)
}
}
function guardAgainstDirectoryTraversal($path)
{
function guardAgainstDirectoryTraversal($path) {
$pattern = "/^(.*\/)?(\.\.)(\/.*)?$/";
$directory_traversal = preg_match($pattern, $path);
if ($directory_traversal === 1) {
die("ERROR: Could not open " . htmlspecialchars(stripslashes($current_dir)) . " for reading!");
die("ERROR: Could not open " . htmlspecialchars(stripslashes($path)) . " for reading!");
}
}
@ -199,7 +193,7 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
if (is_readable($caption_filename)) {
$caption_handle = fopen($caption_filename, "rb");
while (!feof($caption_handle)) {
$caption_line = fgetss($caption_handle);
$caption_line = fgets($caption_handle);
if (empty($caption_line)) {
continue;
}
@ -320,23 +314,23 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
$filename_caption = '';
}
if (is_file($current_dir . '/' . $file . '.html')) {
$imgComment = $img_captions[$file] = '<h4>'.$file . '</h4>' . htmlspecialchars(file_get_contents($current_dir . '/' . $file . '.html'), ENT_QUOTES);
$imgComment = $img_captions[$file] = '<h4>' . $file . '</h4>' . htmlspecialchars(file_get_contents($current_dir . '/' . $file . '.html'), ENT_QUOTES);
} else {
$imgComment = '<h4>'.$file . '</h4>';
$imgComment = '<h4>' . $file . '</h4>';
}
// JPG, GIF and PNG
if (preg_match("/.jpg$|.gif$|.bmp$|.png$/i", $file)) {
$path_parts = pathinfo($file);
if(file_exists($current_dir.'/'.$path_parts['filename'].'.mp4')){
$dataVideo = ' data-video="'.$current_dir.'/'.$path_parts['filename'].'.mp4'.'" ';
if (is_file($current_dir.'/'.$path_parts['filename'].'.info.json')) {
$infoContent = json_decode(file_get_contents($current_dir.'/'.$path_parts['filename'].'.info.json'));
$descContent = nl2br(htmlspecialchars('<span>Origin : </span>'.$infoContent->webpage_url.'<br><span>Description : </span>'.$infoContent->description));
$imgComment = $img_captions[$file] = '<h4>'.$file . '</h4>'.$descContent;
if (file_exists($current_dir . '/' . $path_parts['filename'] . '.mp4')) {
$dataVideo = ' data-video="' . $current_dir . '/' . $path_parts['filename'] . '.mp4' . '" ';
if (is_file($current_dir . '/' . $path_parts['filename'] . '.info.json')) {
$infoContent = json_decode(file_get_contents($current_dir . '/' . $path_parts['filename'] . '.info.json'));
$descContent = nl2br(htmlspecialchars('<span>Origin : </span>' . $infoContent->webpage_url . '<br><span>Description : </span>' . $infoContent->description));
$imgComment = $img_captions[$file] = '<h4>' . $file . '</h4>' . $descContent;
} else {
$imgComment = '<h4>'.$file . '</h4>';
$imgComment = '<h4>' . $file . '</h4>';
}
$videoWithComment = true;
} else {
@ -363,7 +357,8 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
$imgParams = http_build_query(
array('filename' => "$thumbdir/$file", 'size' => $thumb_size),
'',
'&amp;');
'&amp;'
);
$imgUrl = GALLERY_ROOT . "createthumb.php?$imgParams";
if ($lazyload) {
$imgopts = "class=\"b-lazy\" src=data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw== data-src=\"$imgUrl\"";
@ -377,11 +372,12 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
"html" => '
<div>
<p class="w3-black">
<a onclick="onClick(this);return false;" '.$dataVideo.' href="'.$linkUrl.'" data-desc="'.$imgComment.'" title="' . htmlentities($img_captions[$file]) . '">
<img '.$imgopts.' alt="'.$label_loading.'" class="w3-round" />
</a>'. $filename_caption . '
<a onclick="onClick(this);return false;" ' . $dataVideo . ' href="' . $linkUrl . '" data-desc="' . $imgComment . '" title="' . htmlentities($img_captions[$file]) . '">
<img ' . $imgopts . ' alt="' . $label_loading . '" class="w3-round" />
</a>' . $filename_caption . '
</p>
</div>');
</div>'
);
}
// Other filetypes
$extension = "";
@ -418,9 +414,9 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
}
// Excel
if (preg_match("/\.ogv$|\.mp4$|\.mpg$|\.mpeg$|\.mov$|\.avi$|\.wmv$|\.flv$|\.webm$/i", $file) && empty($videoWithComment)) {
$extension = "VIDEO";
}
// video files
$extension = "VIDEO";
}
// video files
if (preg_match("/\.aiff$|\.aif$|\.wma$|\.aac$|\.flac$|\.mp3$|\.ogg$|\.m4a$/i", $file)) {
$extension = "AUDIO";
}
@ -433,11 +429,12 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
"html" => '
<div>
<p>
<a href="'.$current_dir.'/'.$file.'" title="'.$file.'">
<img src="' . GALLERY_ROOT .'images/filetype_' . $extension . '.png" alt="'.$file.'" width="'.$thumb_size.'" height="'.$thumb_size.'"/>
</a>'.$filename_caption.'
<a href="' . $current_dir . '/' . $file . '" title="' . $file . '">
<img src="' . GALLERY_ROOT . 'images/filetype_' . $extension . '.png" alt="' . $file . '" width="' . $thumb_size . '" height="' . $thumb_size . '"/>
</a>' . $filename_caption . '
</p>
</div>');
</div>'
);
}
}
}
@ -500,7 +497,7 @@ if ($_GET["page"] == "all" || $lazyload) {
if (!$lazyload && $nbDir + $nbFile > $thumbs_pr_page) {
for ($i = 1; $i <= ceil(($nbFile + $nbDir) / $thumbs_pr_page); $i++) {
if ($_GET["page"] == $i) {
$page_navigation .= '<a href="#" class="w3-button w3-theme">'.$i.'</a>';
$page_navigation .= '<a href="#" class="w3-button w3-theme">' . $i . '</a>';
} else {
$page_navigation .= '<a href="?dir=' . $requestedDir . '&amp;page=' . $i . '" class="w3-button w3-hover-theme">' . $i . '</a>';
}
@ -508,13 +505,12 @@ if (!$lazyload && $nbDir + $nbFile > $thumbs_pr_page) {
if ($i != ceil(($nbFile + $nbDir) / $thumbs_pr_page)) {
//$page_navigation .= " | ";
}
}
//Insert link to view all images
if ($_GET["page"] == "all") {
$page_navigation .= "$label_all";
} else {
$page_navigation .= '<a href="?dir=' . $requestedDir . '&amp;page=all" class="w3-button w3-hover-theme">'.$label_all.'</a>';
$page_navigation .= '<a href="?dir=' . $requestedDir . '&amp;page=all" class="w3-button w3-hover-theme">' . $label_all . '</a>';
}
}
@ -581,7 +577,7 @@ if ($i < 0) {
}
for ($y = $i; $y < $nbFile; $y++) {
if(empty($img_captions[$files[$y]['name']])){
if (empty($img_captions[$files[$y]['name']])) {
$img_captions[$files[$y]['name']] = $files[$y]['name'];
}
$page_navigation .= '<a href="' . $current_dir . '/' . $files[$y]['name'] . '" class="hidden" title="' . $img_captions[$files[$y]['name']] . '"></a>';

27
templates/NeoKT.html
View file

@ -134,7 +134,7 @@
#modal-content-img img,
#video01 video {
max-width: 98%;
max-height: 72vh;
max-height: 73vh;
padding: 4px;
}
@ -145,14 +145,17 @@
box-shadow: 0px 5px rgba(89, 0, 46, 0.5);
text-align: left;
width: 85vw;
font-size: .9rem;
}
#comment01 span {
font-size: 1rem;
font-size: .8rem;
font-weight: bold;
}
.modal-content .w3-theme-d3 ul {
font-size: .9rem;
}
.fas {
font-size: 2.5em;
}
@ -161,13 +164,17 @@
font-size: 2.5em;
font-weight: bolder;
text-align: right;
margin: 0;
margin: 0 1rem 0 0;
padding: 0;
}
.closeModal a {
text-decoration: none;
}
.toggle {
display: none;
}
</style>
</head>
@ -199,12 +206,13 @@
<div id="modal01" class="w3-modal w3-animate-zoom">
<p class="closeModal"><a href="#" onclick="closeModal(); return false;">X</a></p>
<div class="modal-content">
<div id="modal-content-img"><img id="img01"></div>
<div id="modal-content-img" onclick="closeModal(); return false;"><img id="img01"></div>
<div id="video01"></div>
<div class="w3-theme-d3 w3-shadow">
<p id="comment01"></p>
<p>
<ul style="text-align: left;">
<a href="#" id="toggle">View sharelink</a>
<ul style="text-align: left;" id="shareLink">
<li id="thumburl"></li>
<li id="fullurl"></li>
<li id="markdown"></li>
@ -226,9 +234,16 @@
<script src="<% gallery_root %>js/lazy.js"></script>
<script src="<% gallery_root %>js/script.js"></script>
<script>
document.querySelector('#shareLink').classList.toggle('toggle');
document.querySelector('#toggle').onclick = function() {
console.log('here');
document.querySelector('#shareLink').classList.toggle('toggle');
}
function closeModal() {
document.getElementById("modal01").style.display = "none"
document.getElementById("video01").innerHTML = null;
document.getElementById("img01").src = null;
}
function onClick(element) {