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

32
index.php
View file

@ -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;
}
@ -363,7 +357,8 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
$imgParams = http_build_query(
array('filename' => "$thumbdir/$file", 'size' => $thumb_size),
'',
'&');
'&'
);
$imgUrl = GALLERY_ROOT . "createthumb.php?$imgParams";
if ($lazyload) {
$imgopts = "class=\"b-lazy\" src=data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw== data-src=\"$imgUrl\"";
@ -381,7 +376,8 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
<img ' . $imgopts . ' alt="' . $label_loading . '" class="w3-round" />
</a>' . $filename_caption . '
</p>
</div>');
</div>'
);
}
// Other filetypes
$extension = "";
@ -437,7 +433,8 @@ if (is_dir($current_dir) && $handle = opendir($current_dir)) {
<img src="' . GALLERY_ROOT . 'images/filetype_' . $extension . '.png" alt="' . $file . '" width="' . $thumb_size . '" height="' . $thumb_size . '"/>
</a>' . $filename_caption . '
</p>
</div>');
</div>'
);
}
}
}
@ -508,7 +505,6 @@ 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") {

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) {