Hello,

I’ve just spent some time developing a simple web-based picture tagging page, where you can upload pictures and tag them. It was just an exercise in writing some good ol’ Perl and learning a bit more about Javascript, Ajax, jQuery et al. At the moment it’s only really suitable on your local machine, hence the Apache etc set up below, it needs some tweeking to go live somewhere, but that wasn’t really the point …

Tagski allows you to upload pictures (JPGs only at the moment), then create tag names and select pictures for that tag name. Pictures can have no or many tags, tags can have no or many pictures. The database is just three tables – tag, picture and picturetag. Simples.

Tags and pictures can be deleted, tags can be renamed, pictures can be untagged. There is a nice progress bar for the file upload, because it does take some time. If you click on a tag link (above a picture or in the tags container) then those tagged pictures are shown. A set of pictures with the same tag can be downloaded as a zip file (with another lovely Ajax progress bar).

Written in Perl (CGI, Class::DBI – who needs dBIx …? :)), JavaScript (moving HTML/CSS elements about) with a hint of jQuery. Click on a picture and you get a fancybox gallery viewer showing the pictures currently on display.

Fancy box

It’s on GitHub. As another exercise, I thought I’d write down all the steps to install it from a fresh Ubuntu 16.04 base. Here are the install instructions, including having to fix a bug in Class::DBI …

Install freshly aired Ubuntu 16.04 then set about doing all this from the command line (Ctrl+Alt+T then Pin to task bar):

Install and configure Apache

Really simple these days :

$ sudo apt-get install apache2 $ sudo systemctl enable apache2 $ systemctl start apache2

Create a virtual host (ie point your browser at https://tagski/…), for convenience mostly (note that I use ‘vi’ as my fave text editor, other text editors are available, apparently):
$ sudo cp /etc/apache2/sites-available/000-default.conf /etc/apache2/sites-available/tagski.conf $ sudo vi /etc/apache2/sites-available/tagski.conf :

change the defaults on these lines only :

ServerName tagski

ServerAdmin you@yourgaff.ninja
DocumentRoot /var/www/tagski

Enable the virtual apache host and enable CGI :

$ sudo a2ensite tagski $ sudo a2enmod cgi $ sudo service apache2 reload

Edit the system hosts file so the browser knows where to go :

$ sudo vi /etc/hosts 127.0.0.1 caesuramedia.org 127.0.1.1 probably-your-machine-name 127.0.0.1 tagski

Install MySQL and phpadmin (easy web-based database config)

$ sudo apt-get install mysql-server mysql-client $ sudo service mysql start $ sudo apt-get install phpmyadmin

Installing DBD::mysql later seems to require this, we set it back later.

$ mysql -u root -p password : the one setup when installed mysql> grant all privileges on test.* to 'root'@'caesuramedia.org' identified by 's3kr1t';

Get Tagski from GitHub

https://github.com/CaesuraMedia/tagski | Clone or Download | Download Zip

Unzip and install in the expected directories for Apache, then set permissions as tight as possible :

$ cd ~/Downloads $ unzip tagski-master.zip $ cd tagski-master/ $ sudo cp -r usr/lib/cgi-bin/tagski /usr/lib/cgi-bin/ $ sudo chown -R www-data:www-data /usr/lib/cgi-bin/tagski/ $ sudo cp -r var/www/tagski /var/www/ $ sudo mkdir -p /var/www/tagski/img $ sudo mkdir -p /var/www/tagski/zipped $ sudo chown -R www-data:www-data /var/www/tagski $ sudo chmod u=rwX,g=srX,o=rX -R /var/www/tagski

Import Tagski SQL to MySQL : https://caesuramedia.org/phpmyadmin | import | /var/www/tagski/sql/tagski.sql

Now get some pre-requisites for Tagski – a really, really fast thumbnailer.

$ sudo apt-get install build-essential cmake nasm $ sudo apt install git $ git clone https://github.com/koofr/epeg.git $ cd epeg $ mkdir build $ cd build/ $ cmake .. $ sudo make install $ sudo apt install libjpeg-dev $ sudo apt install libmysqlclient-dev

Part of the Tagski thing is to show tagged pictures in a gallery, I nicked this one from FancyApps, nice :

https://fancyapps.com/fancybox/#license $ cd /var/www/tagski/ $ sudo mv ~/Downloads/fancyapps-fancyBox-v2.1.5-0-ge2248f4.zip . $ sudo unzip fancyapps-fancyBox-v2.1.5-0-ge2248f4.zip $ sudo mv fancyapps-fancyBox-18d1712/ fancybox $ sudo chown -R www-data:www-data /var/www/tagski/fancybox

Now for the fun CPAN dependencies:

$ cpan — follow setup with all yes usually.
$ sudo cpan install Class::DBI $ sudo cpan install File::Find::Rule $ sudo cpan install Image::Epeg $ sudo cpan install Image::JpegTran::AutoRotate #I really like this, only one function and it works very well indeed
$ sudo cpan install Template $ sudo cpan install Archive::Zip::SimpleZip $ sudo cpan install DBD::mysql

Reset the mysql password :

$ mysql -u root -p Password as above, then mysql> grant all privileges on test.* to 'root'@'caesuramedia.org' identified by 'somethingbetterthanthat'; mysql> exit

Change the MySQL password in this file:
$ sudo vi /usr/lib/cgi-bin/tagski/Tagski.pm

Now, I seem, single handedly, found a bug in Class::DBI : here, and it showed up when I did a fresh install of Ubuntu and CPAN modules as above, no-one has responded to the bug on rt.cpan.org yet, sniff. You’ll have to go and see what my fix was and edit DBI.pm accordingly :

$ sudo vi /usr/local/share/perl/5.22.1/Class/DBI.pm

That’s it, you should have Tagski up an running : https://tagski/cgi-bin/tagski/tagski.cgi

Here are some more screenshots [click for a bigger picture ] :