mirror of
https://github.com/slawkens/myaac.git
synced 2026-02-06 21:26:22 +01:00
Better gallery
Replaced complex gallery with simple script Slideshow loaded from images/gallery folder Credits: https://www.w3schools.com/howto/howto_js_slideshow.asp
This commit is contained in:
slawkens
11
system/migrations/50-gallery.sql
Normal file
11
system/migrations/50-gallery.sql
Normal file
@@ -0,0 +1,11 @@
|
||||
CREATE TABLE IF NOT EXISTS `myaac_gallery`
|
||||
(
|
||||
`id` int NOT NULL AUTO_INCREMENT,
|
||||
`comment` varchar(255) NOT NULL DEFAULT '',
|
||||
`image` varchar(255) NOT NULL,
|
||||
`thumb` varchar(255) NOT NULL,
|
||||
`author` varchar(50) NOT NULL DEFAULT '',
|
||||
`ordering` int NOT NULL DEFAULT 0,
|
||||
`hide` tinyint NOT NULL DEFAULT 0,
|
||||
PRIMARY KEY (`id`)
|
||||
) ENGINE=InnoDB DEFAULT CHARACTER SET=utf8mb4;
|
||||
16
system/migrations/50.php
Normal file
16
system/migrations/50.php
Normal file
@@ -0,0 +1,16 @@
|
||||
<?php
|
||||
/**
|
||||
* @var OTS_DB_MySQL $db
|
||||
*/
|
||||
|
||||
$up = function () use ($db) {
|
||||
if ($db->hasTable(TABLE_PREFIX . 'gallery')) {
|
||||
$db->dropTable(TABLE_PREFIX . 'gallery');
|
||||
}
|
||||
};
|
||||
|
||||
$down = function () use ($db) {
|
||||
if (!$db->hasTable(TABLE_PREFIX . 'gallery')) {
|
||||
$db->query(file_get_contents(__DIR__ . '/50-gallery.sql'));
|
||||
}
|
||||
};
|
||||
@@ -9,316 +9,25 @@
|
||||
*/
|
||||
|
||||
use MyAAC\Cache\Cache;
|
||||
use MyAAC\Models\Gallery as ModelsGallery;
|
||||
|
||||
defined('MYAAC') or die('Direct access not allowed!');
|
||||
$title = 'Gallery';
|
||||
|
||||
$canEdit = hasFlag(FLAG_CONTENT_GALLERY) || superAdmin();
|
||||
if($canEdit) {
|
||||
if(function_exists('imagecreatefrompng')) {
|
||||
if (!empty($action)) {
|
||||
if ($action == 'delete' || $action == 'edit' || $action == 'hide' || $action == 'moveup' || $action == 'movedown')
|
||||
$id = $_REQUEST['id'];
|
||||
const ALLOWED_EXTENSIONS = ['jpg', 'jpeg', 'png', 'gif', 'webp'];
|
||||
|
||||
if (isset($_REQUEST['comment']))
|
||||
$comment = stripslashes($_REQUEST['comment']);
|
||||
$images = Cache::remember('gallery', 5 * 60, function () {
|
||||
$images = glob(BASE . GALLERY_DIR . '*.*');
|
||||
|
||||
if (isset($_REQUEST['image']))
|
||||
$image = $_REQUEST['image'];
|
||||
$images = array_filter($images, function ($image) {
|
||||
$ext = pathinfo($image, PATHINFO_EXTENSION);
|
||||
|
||||
if (isset($_REQUEST['author']))
|
||||
$author = $_REQUEST['author'];
|
||||
return (in_array($ext, ALLOWED_EXTENSIONS) && !str_contains($image, '_thumb'));
|
||||
});
|
||||
|
||||
$errors = array();
|
||||
|
||||
if ($action == 'add') {
|
||||
if (Gallery::add($comment, $image, $author, $errors))
|
||||
$comment = $image = $author = '';
|
||||
} else if ($action == 'delete') {
|
||||
Gallery::delete($id, $errors);
|
||||
} else if ($action == 'edit') {
|
||||
if (isset($id) && !isset($name)) {
|
||||
$tmp = Gallery::get($id);
|
||||
$comment = $tmp['comment'];
|
||||
$image = $tmp['image'];
|
||||
$author = $tmp['author'];
|
||||
} else {
|
||||
Gallery::update($id, $comment, $image, $author);
|
||||
$action = $comment = $image = $author = '';
|
||||
}
|
||||
} else if ($action == 'hide') {
|
||||
Gallery::toggleHide($id, $errors);
|
||||
} else if ($action == 'moveup') {
|
||||
Gallery::move($id, -1, $errors);
|
||||
} else if ($action == 'movedown') {
|
||||
Gallery::move($id, 1, $errors);
|
||||
}
|
||||
|
||||
if (!empty($errors))
|
||||
$twig->display('error_box.html.twig', array('errors' => $errors));
|
||||
}
|
||||
|
||||
if(!isset($_GET['image'])) {
|
||||
$twig->display('gallery.form.html.twig', array(
|
||||
'link' => getLink('gallery/' . ($action == 'edit' ? 'edit' : 'add')),
|
||||
'action' => $action,
|
||||
'id' => isset($id) ? $id : null,
|
||||
'comment' => isset($comment) ? $comment : null,
|
||||
'image' => isset($image) ? $image : null,
|
||||
'author' => isset($author) ? $author : null
|
||||
));
|
||||
}
|
||||
}
|
||||
else
|
||||
echo 'You cannot edit/add gallery items as it seems your PHP installation doesnt have GD support enabled. Visit <a href="http://be2.php.net/manual/en/image.installation.php">PHP Manual</a> for more info.';
|
||||
}
|
||||
|
||||
if(isset($_GET['image']))
|
||||
{
|
||||
$image = $db->query('SELECT * FROM `' . TABLE_PREFIX . 'gallery` WHERE `id` = ' . $db->quote($_GET['image']) . ' ORDER by `ordering` LIMIT 1;');
|
||||
if($image->rowCount() == 1)
|
||||
$image = $image->fetch();
|
||||
else
|
||||
{
|
||||
echo 'Image with this id does not exists.';
|
||||
return;
|
||||
}
|
||||
|
||||
$previous_image = $db->query('SELECT `id` FROM `' . TABLE_PREFIX . 'gallery` WHERE `id` = ' . $db->quote($image['id'] - 1) . ' ORDER by `ordering`;');
|
||||
if($previous_image->rowCount() == 1)
|
||||
$previous_image = $previous_image->fetch();
|
||||
else
|
||||
$previous_image = NULL;
|
||||
|
||||
$next_image = $db->query('SELECT `id` FROM `' . TABLE_PREFIX . 'gallery` WHERE `id` = ' . $db->quote($image['id'] + 1) . ' ORDER by `ordering`;');
|
||||
if($next_image->rowCount() == 1)
|
||||
$next_image = $next_image->fetch();
|
||||
else
|
||||
$next_image = NULL;
|
||||
|
||||
$twig->display('gallery.get.html.twig', array(
|
||||
'previous' => $previous_image ? $previous_image['id'] : null,
|
||||
'next' => $next_image ? $next_image['id'] : null,
|
||||
'image' => $image
|
||||
));
|
||||
return;
|
||||
}
|
||||
|
||||
$images = Cache::remember('gallery_' . ($canEdit ? '1' : '0'), 60, function () use ($db, $canEdit) {
|
||||
return $db->query('SELECT `id`, `comment`, `image`, `author`, `thumb`' .
|
||||
($canEdit ? ', `hide`, `ordering`' : '') .
|
||||
' FROM `' . TABLE_PREFIX . 'gallery`' .
|
||||
(!$canEdit ? ' WHERE `hide` != 1' : '') .
|
||||
' ORDER BY `ordering`;')->fetchAll(PDO::FETCH_ASSOC);
|
||||
return array_map(function ($image) {
|
||||
return basename($image);
|
||||
}, $images);
|
||||
});
|
||||
|
||||
$last = count($images);
|
||||
if(!$last)
|
||||
{
|
||||
?>
|
||||
There are no images added to gallery yet.
|
||||
<?php
|
||||
return;
|
||||
}
|
||||
|
||||
$twig->display('gallery.html.twig', array(
|
||||
$twig->display('gallery.html.twig', [
|
||||
'images' => $images,
|
||||
'last' => $last,
|
||||
'canEdit' => $canEdit
|
||||
));
|
||||
|
||||
class Gallery
|
||||
{
|
||||
static public function add($comment, $image, $author, &$errors)
|
||||
{
|
||||
global $db;
|
||||
if(isset($comment[0]) && isset($image[0]) && isset($author[0]))
|
||||
{
|
||||
$query =
|
||||
$db->query(
|
||||
'SELECT `ordering`' .
|
||||
' FROM `' . TABLE_PREFIX . 'gallery`' .
|
||||
' ORDER BY `ordering`' . ' DESC LIMIT 1'
|
||||
);
|
||||
|
||||
$ordering = 0;
|
||||
if($query->rowCount() > 0) {
|
||||
$query = $query->fetch();
|
||||
$ordering = $query['ordering'] + 1;
|
||||
}
|
||||
|
||||
$pathinfo = pathinfo($image);
|
||||
$extension = strtolower($pathinfo['extension']);
|
||||
$thumb_filename = GALLERY_DIR . $pathinfo['filename'] . '_thumb.' . $extension;
|
||||
$filename = GALLERY_DIR . $pathinfo['filename'] . '.' . $extension;
|
||||
if($db->insert(TABLE_PREFIX . 'gallery', array(
|
||||
'comment' => $comment,
|
||||
'image' => $filename, 'author' => $author,
|
||||
'thumb' => $thumb_filename,
|
||||
'ordering' => $ordering))) {
|
||||
if(self::generateThumb($db->lastInsertId(), $image, $errors))
|
||||
self::resize($image, 650, 500, $filename, $errors);
|
||||
}
|
||||
}
|
||||
else
|
||||
$errors[] = 'Please fill all inputs.';
|
||||
|
||||
return !count($errors);
|
||||
}
|
||||
|
||||
static public function get($id) {
|
||||
return ModelsGallery::find($id)->toArray();
|
||||
}
|
||||
|
||||
static public function update($id, $comment, $image, $author) {
|
||||
$pathinfo = pathinfo($image);
|
||||
$extension = strtolower($pathinfo['extension']);
|
||||
$filename = GALLERY_DIR . $pathinfo['filename'] . '.' . $extension;
|
||||
|
||||
if(ModelsGallery::where('id', $id)->update([
|
||||
'comment' => $comment,
|
||||
'image' => $filename,
|
||||
'author' => $author
|
||||
])) {
|
||||
if(self::generateThumb($id, $image, $errors))
|
||||
self::resize($image, 650, 500, $filename, $errors);
|
||||
}
|
||||
}
|
||||
|
||||
static public function delete($id, &$errors)
|
||||
{
|
||||
if(isset($id))
|
||||
{
|
||||
$row = ModelsGallery::find($id);
|
||||
if($row)
|
||||
if (!$row->delete()) {
|
||||
$errors[] = 'Fail during delete Gallery';
|
||||
}
|
||||
else
|
||||
$errors[] = 'Image with id ' . $id . ' does not exists.';
|
||||
}
|
||||
else
|
||||
$errors[] = 'id not set';
|
||||
|
||||
return !count($errors);
|
||||
}
|
||||
|
||||
static public function toggleHide($id, &$errors)
|
||||
{
|
||||
if(isset($id))
|
||||
{
|
||||
$row = ModelsGallery::find($id);
|
||||
if($row) {
|
||||
$row->hide = $row->hide == 1 ? 0 : 1;
|
||||
if (!$row->save()) {
|
||||
$errors[] = 'Fail during toggle hide Gallery';
|
||||
}
|
||||
} else
|
||||
$errors[] = 'Image with id ' . $id . ' does not exists.';
|
||||
}
|
||||
else
|
||||
$errors[] = 'id not set';
|
||||
|
||||
return !count($errors);
|
||||
}
|
||||
|
||||
static public function move($id, $i, &$errors)
|
||||
{
|
||||
global $db;
|
||||
$query = self::get($id);
|
||||
if($query !== false)
|
||||
{
|
||||
$ordering = $query['ordering'] + $i;
|
||||
$old_record = $db->select(TABLE_PREFIX . 'gallery', array('ordering' => $ordering));
|
||||
if($old_record !== false) {
|
||||
ModelsGallery::where('ordering', $ordering)->update([
|
||||
'ordering' => $query['ordering'],
|
||||
]);
|
||||
}
|
||||
|
||||
ModelsGallery::where('id', $id)->update([
|
||||
'ordering' => $ordering,
|
||||
]);
|
||||
}
|
||||
else
|
||||
$errors[] = 'Image with id ' . $id . ' does not exists.';
|
||||
|
||||
return !count($errors);
|
||||
}
|
||||
|
||||
static public function resize($file, $new_width, $new_height, $new_file, &$errors)
|
||||
{
|
||||
$pathinfo = pathinfo($file);
|
||||
$extension = strtolower($pathinfo['extension']);
|
||||
|
||||
switch ($extension)
|
||||
{
|
||||
case 'gif': // GIF
|
||||
$image = imagecreatefromgif($file);
|
||||
break;
|
||||
case 'jpg': // JPEG
|
||||
case 'jpeg':
|
||||
$image = imagecreatefromjpeg($file);
|
||||
break;
|
||||
case 'png': // PNG
|
||||
$image = imagecreatefrompng($file);
|
||||
break;
|
||||
default:
|
||||
$errors[] = 'Unsupported file format.';
|
||||
return false;
|
||||
}
|
||||
|
||||
$width = imagesx($image);
|
||||
$height = imagesy($image);
|
||||
|
||||
// create a new temporary image
|
||||
$tmp_img = imagecreatetruecolor($new_width, $new_height);
|
||||
|
||||
// copy and resize old image into new image
|
||||
imagecopyresized($tmp_img, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
|
||||
|
||||
// save thumbnail into a file
|
||||
switch($extension)
|
||||
{
|
||||
case 'gif':
|
||||
imagegif($tmp_img, $new_file);
|
||||
break;
|
||||
|
||||
case 'jpg':
|
||||
case 'jpeg':
|
||||
imagejpeg($tmp_img, $new_file);
|
||||
break;
|
||||
|
||||
case 'png':
|
||||
imagepng($tmp_img, $new_file);
|
||||
break;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
static public function generateThumb($id, $file, &$errors)
|
||||
{
|
||||
$pathinfo = pathinfo($file);
|
||||
$extension = strtolower($pathinfo['extension']);
|
||||
$thumb_filename = GALLERY_DIR . $pathinfo['filename'] . '_thumb.' . $extension;
|
||||
|
||||
if(!self::resize($file, 170, 110, $thumb_filename, $errors))
|
||||
return false;
|
||||
|
||||
if(isset($id))
|
||||
{
|
||||
$row = ModelsGallery::find($id);
|
||||
if($row) {
|
||||
$row->thumb = $thumb_filename;
|
||||
$row->save();
|
||||
} else
|
||||
$errors[] = 'Image with id ' . $id . ' does not exists.';
|
||||
}
|
||||
else
|
||||
$errors[] = 'id not set';
|
||||
|
||||
return !count($errors);
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
@@ -1,18 +0,0 @@
|
||||
<?php
|
||||
|
||||
namespace MyAAC\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
class Gallery extends Model {
|
||||
|
||||
protected $table = TABLE_PREFIX . 'gallery';
|
||||
|
||||
public $timestamps = false;
|
||||
|
||||
protected $fillable = [
|
||||
'comment', 'image', 'thumb',
|
||||
'author', 'ordering', 'hide',
|
||||
];
|
||||
|
||||
}
|
||||
@@ -1,33 +0,0 @@
|
||||
<form method="post" action="{{ link }}">
|
||||
{{ csrf() }}
|
||||
{% if action == 'edit' %}
|
||||
<input type="hidden" name="id" value="{{ id }}" />
|
||||
{% endif %}
|
||||
<table width="100%" border="0" cellspacing="1" cellpadding="4">
|
||||
<tr>
|
||||
<td bgcolor="{{ config.vdarkborder }}" class="white"><b>{% if action == 'edit' %}Edit{% else %}Add{% endif %} image</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td bgcolor="{{ config.darkborder }}">
|
||||
<table border="0" cellpadding="1">
|
||||
<tr>
|
||||
<td>Comment:</td>
|
||||
<td><textarea name="comment" maxlength="255" cols="50" rows="5">{% if comment is not null %}{{ comment }}{% endif %}</textarea></td>
|
||||
<tr/>
|
||||
<tr>
|
||||
<td>Image URL:</td>
|
||||
<td><input name="image" value="{% if image is not null %}{{ image }}{% endif %}" size="50" maxlength="255"/></td>
|
||||
<tr/>
|
||||
<tr>
|
||||
<td>Author:</td>
|
||||
<td><input name="author" value="{% if author is not null %}{{ author }}{% endif %}" size="50" maxlength="50"/></td>
|
||||
<tr/>
|
||||
<tr>
|
||||
<td colspan="2" align="center"><input type="submit" value="Submit"/>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
<br/><br/>
|
||||
@@ -1,15 +0,0 @@
|
||||
<div style="position: relative; height: 15px; width: 100%;">
|
||||
{% if next is not null %}
|
||||
<a style="float: right;" href="{{ getLink('gallery') ~ '/' ~ next }}" >next <img src="images/arrow_right.gif" width=15 height=11 border=0 ></a>
|
||||
{% endif %}
|
||||
{% if previous is not null %}
|
||||
<a style="position: absolute;" href="{{ getLink('gallery') ~ '/' ~ previous }}"><img src="images/arrow_left.gif" width=15 height=11 border=0 > previous</a>
|
||||
{% endif %}
|
||||
<div style="position: absolute; width: 80%; margin-left: 10%; margin-right: 10%; text-align: center;">
|
||||
<a href="{{ getLink('gallery') }}" ><img src="images/arrow_up.gif" width=11 height=15 border=0 > back</a>
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: relative; text-align: center; top: 20px; ">
|
||||
<img src="{{ image.image }}" />
|
||||
<div style="margin-top: 15px; margin-bottom: 35px; ">{{ image.comment }}</div>
|
||||
</div>
|
||||
@@ -1,38 +1,31 @@
|
||||
Click on the image to enlarge.<br/><br/>
|
||||
{% set i = 0 %}
|
||||
{% for image in images %}
|
||||
{% set i = i + 1 %}
|
||||
<table>
|
||||
<tr>
|
||||
<td style="height: 120px;" >
|
||||
<a href="{{ getLink('gallery') ~ '/' ~ image.id }}" >
|
||||
<img src="{{ image.thumb }}" border="0" />
|
||||
</a>
|
||||
</td>
|
||||
<td>{{ image.comment }}</td>
|
||||
{% if canEdit %}
|
||||
<td>
|
||||
<a href="?subtopic=gallery&action=edit&id={{ image.id }}" title="Edit">
|
||||
<img src="images/edit.png"/>Edit
|
||||
</a>
|
||||
<a id="delete" href="?subtopic=gallery&action=delete&id={{ image.id }}" onclick="return confirm('Are you sure?');" title="Delete">
|
||||
<img src="images/del.png"/>Delete
|
||||
</a>
|
||||
<a href="?subtopic=gallery&action=hide&id={{ image.id }}" title="{% if image.hide != 1 %}Hide{% else %}Show{% endif %}">
|
||||
<img src="images/{% if image.hide != 1 %}success{% else %}error{% endif %}.png"/>{% if image.hide != 1 %}Hide{% else %}Show{% endif %}
|
||||
</a>
|
||||
{% if i != 1 %}
|
||||
<a href="?subtopic=gallery&action=moveup&id={{ image.id }}" title="Move up">
|
||||
<img src="images/icons/arrow_up.gif"/>Move up
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if i != last %}
|
||||
<a href="?subtopic=gallery&action=movedown&id={{ image.id }}" title="Move down">
|
||||
<img src="images/icons/arrow_down.gif"/>Move down
|
||||
</a>
|
||||
{% endif %}
|
||||
</td>
|
||||
{% endif %}
|
||||
</tr>
|
||||
</table>
|
||||
{% endfor %}
|
||||
<!-- Slideshow container -->
|
||||
<div class="slideshow-container">
|
||||
|
||||
{% set i = 1 %}
|
||||
{% for image in images %}
|
||||
<div class="mySlides fade-effect">
|
||||
<div class="numbertext">{{ i }} / {{ images|length }}</div>
|
||||
<img src="{{ constant('GALLERY_DIR') }}{{ image }}" style="width:100%">
|
||||
</div>
|
||||
|
||||
{% set i = i + 1 %}
|
||||
{% endfor %}
|
||||
|
||||
<!-- Next and previous buttons -->
|
||||
<a class="prev" onclick="plusSlides(-1)">❮</a>
|
||||
<a class="next" onclick="plusSlides(1)">❯</a>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- The dots/circles -->
|
||||
<div style="text-align:center">
|
||||
{% set i = 1 %}
|
||||
|
||||
{% for image in images %}
|
||||
<span class="dot" onclick="currentSlide({{ i }})"></span>
|
||||
{% set i = i + 1 %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="{{ constant('BASE_URL') }}tools/css/gallery.css" />
|
||||
<script type="text/javascript" src="{{ constant('BASE_URL') }}tools/js/gallery.js"></script>
|
||||
|
||||
Reference in New Issue
Block a user