Creature page overhaul

Updates the creature pages to show more information. You will need to reload your creatures. -modifies database with migration 31 -small customisations are allowed via config file. -functions added, getMonsterLink, getItemRarity, getCreatureImgPath, left, right, -added functions to twig. -view elements, immunities, summons, voices, loot, pushables, canpush, canwalk, runonhealth,hostile,attackable,rewardboss,defense,armor -filter bosses -show list as picture preview or names list
2025-10-30 23:46:24 +01:00 · 2020-12-28 16:37:03 +00:00
parent 7e0fded595
commit 8e6bc73ca6
11 changed files with 559 additions and 156 deletions
--- a/common.php
+++ b/common.php
@@ -28,7 +28,7 @@ session_start();

 define('MYAAC', true);
 define('MYAAC_VERSION', '0.9.0-dev');
-define('DATABASE_VERSION', 30);
+define('DATABASE_VERSION', 31);
 define('TABLE_PREFIX', 'myaac_');
 define('START_TIME', microtime(true));
 define('MYAAC_OS', stripos(PHP_OS, 'WIN') === 0 ? 'WINDOWS' : (strtoupper(PHP_OS) === 'DARWIN' ? 'MAC' : 'LINUX'));
--- a/config.php
+++ b/config.php
@@ -84,12 +84,23 @@ $config = array(
 		//'2' => 'Your Second World Name'
 	),

+	// loot
+	'loot_show_percentage' => true, // to true to show tooltip percent
+
+	// links
+	'items_url' => 'https://tibia.fandom.com/wiki/', // set to website which shows details about items.
+
 	// images
 	'outfit_images_url' => 'https://outfit-images.ots.me/outfit.php', // set to animoutfit.php for animated outfit
 	'outfit_images_wrong_looktypes' => [75, 126, 127, 266, 302], // this looktypes needs to have different margin-top and margin-left because they are wrong positioned
 	'item_images_url' => 'https://item-images.ots.me/1092/', // set to images/items if you host your own items in images folder
 	'item_images_extension' => '.gif',

+	// creatures
+	'creature_images_url' => 'images/monsters/', // set to images/monsters if you host your own creatures in images folder
+	'creature_images_extension' => '.gif',
+	'creature_images_preview' => false,  // set to true to allow picture previews for creatures
+
 	// account
 	'account_management' => true, // disable if you're using other method to manage users (fe. tfs account manager)
 	'account_create_auto_login' => false, // auto login after creating account?
--- a/index.php
+++ b/index.php
@@ -102,6 +102,7 @@ else {
 			'/^changelog\/[0-9]+\/?$/' => array('subtopic' => 'changelog', 'page' => '$1'),
 			'/^commands\/add\/?$/' => array('subtopic' => 'commands', 'action' => 'add'),
 			'/^commands\/edit\/?$/' => array('subtopic' => 'commands', 'action' => 'edit'),
+			'/^creatures\/[A-Za-z0-9-_%+\']+$/' => array('subtopic' => 'creatures', 'creature' => '$1'),
 			'/^faq\/add\/?$/' => array('subtopic' => 'faq', 'action' => 'add'),
 			'/^faq\/edit\/?$/' => array('subtopic' => 'faq', 'action' => 'edit'),
 			'/^forum\/add_board\/?$/' => array('subtopic' => 'forum', 'action' => 'add_board'),#
--- a/system/functions.php
+++ b/system/functions.php
@@ -95,6 +95,16 @@ function getPlayerLink($name, $generate = true)
 	return generateLink($url, $name);
 }

+function getMonsterLink($name, $generate = true)
+{
+	global $config;
+
+	$url = BASE_URL . ($config['friendly_urls'] ? '' : '?') . 'creatures/' . urlencode($name);
+
+	if(!$generate) return $url;
+	return generateLink($url, $name);
+}
+
 function getHouseLink($name, $generate = true)
 {
 	global $db, $config;
@@ -154,6 +164,23 @@ function getItemImage($id, $count = 1)
 	return '<img src="' . $config['item_images_url'] . $file_name . config('item_images_extension') . '"' . $tooltip . ' width="32" height="32" border="0" alt="' .$id . '" />';
 }

+function getItemRarity($chance) {
+	if ($chance >= 21) {
+		return "common";
+	} elseif (between($chance, 8, 21)) {
+		return "uncommon";
+	} elseif (between($chance, 1.1, 8)) {
+		return "semi rare";
+	} elseif (between($chance, 0.4, 1.1)) {
+		return "rare";
+	} elseif (between($chance, 0.8, 0.4)) {
+		return "very rare";
+	} elseif ($chance <= 0.8) {
+		return "extremely rare";
+	}
+	return '';
+}
+
 function getFlagImage($country)
 {
 	if(!isset($country[0]))
@@ -1309,6 +1336,7 @@ function getPlayerNameByAccount($id)

 	return '';
 }
+
 function echo_success($message)
 {
 	echo '<div class="col-12 success mb-2">' . $message . '</div>';
@@ -1357,6 +1385,29 @@ function Outfits_loadfromXML()
 	return array('id' => $looktype, 'type' => $type, 'name' => $lookname, 'premium' => $premium, 'unlocked' => $unlocked, 'enabled' => $enabled);
 }

+function left($str, $length) {
+	return substr($str, 0, $length);
+}
+
+function right($str, $length) {
+	return substr($str, -$length);
+}
+
+function getCreatureImgPath($creature){
+	$creature_path = config('creature_images_url');
+	$creature_gfx_name = trim(strtolower($creature)) . config('creature_images_extension');
+	if (!file_exists($creature_path . $creature_gfx_name)) {
+		$creature_gfx_name = str_replace(" ", "", $creature_gfx_name);
+		if (file_exists($creature_path . $creature_gfx_name)) {
+			return $creature_path . $creature_gfx_name;
+		} else {
+			return $creature_path . 'nophoto.png';
+		}
+	} else {
+		return $creature_path . $creature_gfx_name;
+	}
+}
+
 // validator functions
 require_once LIBS . 'validator.php';
 require_once SYSTEM . 'compat.php';
--- a/system/libs/creatures.php
+++ b/system/libs/creatures.php
@@ -79,6 +79,8 @@ class Creatures {

 			//load race
 			$race = $monster->getRace();
+			$armor = $monster->getArmor();
+			$defensev = $monster->getDefense();

 			//load monster flags
 			$flags = $monster->getFlags();
@@ -87,6 +89,28 @@ class Creatures {
 			if(!isset($flags['convinceable']))
 				$flags['convinceable'] = '0';

+			if(!isset($flags['pushable']))
+				$flags['pushable'] = '0';	
+			if(!isset($flags['canpushitems']))
+				$flags['canpushitems'] = '0';			
+			if(!isset($flags['canpushcreatures']))
+				$flags['canpushcreatures'] = '0';
+			if(!isset($flags['runonhealth']))
+				$flags['runonhealth'] = '0';
+			if(!isset($flags['canwalkonenergy']))
+				$flags['canwalkonenergy'] = '0';
+			if(!isset($flags['canwalkonpoison']))
+				$flags['canwalkonpoison'] = '0';
+			if(!isset($flags['canwalkonfire']))
+				$flags['canwalkonfire'] = '0';
+			if(!isset($flags['hostile']))
+				$flags['hostile'] = '0';
+			if(!isset($flags['attackable']))
+				$flags['attackable'] = '0';
+			if(!isset($flags['rewardboss']))
+				$flags['rewardboss'] = '0';
+		
+			$summons = $monster->getSummons();
 			$loot = $monster->getLoot();
 			foreach($loot as &$item) {
 				if(!Validator::number($item['id'])) {
@@ -106,10 +130,24 @@ class Creatures {
 						'use_haste' => $use_haste,
 						'voices' => json_encode($monster->getVoices()),
 						'immunities' => json_encode($monster->getImmunities()),	
+						'elements' => json_encode($monster->getElements()),
 						'summonable' => $flags['summonable'] > 0 ? 1 : 0,
 						'convinceable' => $flags['convinceable'] > 0 ? 1 : 0,
+						'pushable' => $flags['pushable'] > 0 ? 1 : 0,
+						'canpushitems' => $flags['canpushitems'] > 0 ? 1 : 0,
+						'canpushcreatures' => $flags['canpushcreatures'] > 0 ? 1 : 0,
+						'runonhealth' => $flags['runonhealth'] > 0 ? 1 : 0,
+						'canwalkonenergy' => $flags['canwalkonenergy'] > 0 ? 1 : 0,
+						'canwalkonpoison' => $flags['canwalkonpoison'] > 0 ? 1 : 0,
+						'canwalkonfire' => $flags['canwalkonfire'] > 0 ? 1 : 0,
+						'hostile' => $flags['hostile'] > 0 ? 1 : 0,
+						'attackable' => $flags['attackable'] > 0 ? 1 : 0,
+						'rewardboss' => $flags['rewardboss'] > 0 ? 1 : 0,
+						'defense' => $defensev,
+						'armor' => $armor,
 						'race' => $race,
-						'loot' => json_encode($loot)
+						'loot' => json_encode($loot),
+						'summons' => json_encode($summons)
 					));

 					if($show) {
--- a/system/libs/pot/OTS_Monster.php
+++ b/system/libs/pot/OTS_Monster.php
@@ -273,6 +273,92 @@ class OTS_Monster extends DOMDocument
        return $loot;
    }

+/**
+ * Returns all monster summons.
+ *
+ * @return array elements.
+ * @throws DOMException On DOM operation error.
+ */
+
+	public function getSummons()
+    {
+        $summons = array();
+
+        $element = $this->documentElement->getElementsByTagName('summons')->item(0);
+
+        // checks if it has any Summons
+        if( isset($element) )
+        {
+            // adds all summons
+            foreach( $element->getElementsByTagName('summon') as $item)
+            {
+	            $chance = $item->getAttribute('chance');
+                $id = $item->getAttribute('name');
+                $summons[] = array('name' => $id, 'chance' => $chance);
+            }
+        }
+        return $summons;
+    }
+
+/**
+ * Returns all monster elements.
+ *
+ * @return array elements.
+ * @throws DOMException On DOM operation error.
+ */
+    public function getElements()
+    {
+        $elements = array();
+
+        $element = $this->documentElement->getElementsByTagName('elements')->item(0);
+
+        // checks if it has any elements
+        if( isset($element) )
+        {
+            // read all elements
+            foreach( $element->getElementsByTagName('element') as $elementv)
+            {
+                $elementv = $elementv->attributes->item(0);
+
+                // checks if element is set
+                if($elementv->nodeValue > 0)
+                {
+					 $elements[] = array('name' => ucfirst(str_replace('Percent', '', $elementv->nodeName)), 'percent' => $elementv->nodeValue);
+                }
+            }
+        }
+
+        return $elements;
+    }
+
+/**
+ * Checks if monster has given element.
+ *
+ * @param string $name element to check.
+ * @return bool element state.
+ * @throws DOMException On DOM operation error.
+ */
+    public function hasElement($name)
+    {
+        $element = $this->documentElement->getElementsByTagName('elements')->item(0);
+
+        // if doesn't have any elements obviously doesn't have this one too
+        if( isset($element) )
+        {
+            // read all elements
+            foreach( $element->getElementsByTagName('element') as $element)
+            {
+                // checks if this is what we are searching for
+                if( $element->hasAttribute($name) )
+                {
+                    return $element->getAttribute($name) > 0;
+                }
+            }
+        }
+
+        return false;
+    }
+
 /**
 * Returns all monster immunities.
 *
--- a/system/migrations/31.php
+++ b/system/migrations/31.php
@@ -0,0 +1,18 @@
+<?php
+
+if(!$db->hasColumn(TABLE_PREFIX . 'monsters', 'elements')) {
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `elements` TEXT NOT NULL DEFAULT '' AFTER `immunities`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `pushable` TINYINT(1) NOT NULL DEFAULT '0' AFTER `convinceable`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `canpushitems` TINYINT(1) NOT NULL DEFAULT '0' AFTER `pushable`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `canpushcreatures` TINYINT(1) NOT NULL DEFAULT '0' AFTER `canpushitems`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `canwalkonenergy` TINYINT(1) NOT NULL DEFAULT '0' AFTER `canpushitems`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `canwalkonpoison` TINYINT(1) NOT NULL DEFAULT '0' AFTER `canwalkonenergy`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `canwalkonfire` TINYINT(1) NOT NULL DEFAULT '0' AFTER `canwalkonpoison`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `runonhealth` TINYINT(1) NOT NULL DEFAULT '0' AFTER `canwalkonfire`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `hostile` TINYINT(1) NOT NULL DEFAULT '0' AFTER `runonhealth`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `attackable` TINYINT(1) NOT NULL DEFAULT '0' AFTER `hostile`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `rewardboss` TINYINT(1) NOT NULL DEFAULT '0' AFTER `attackable`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `defense` INT(11) NOT NULL DEFAULT '0' AFTER `rewardboss`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `armor` INT(11) NOT NULL DEFAULT '0' AFTER `defense`;");
+	$db->exec("ALTER TABLE `" . TABLE_PREFIX . "monsters`  ADD `summons` TEXT NOT NULL DEFAULT '' AFTER `loot`;");
+}
--- a/system/pages/creatures.php
+++ b/system/pages/creatures.php
@@ -5,112 +5,27 @@
 * @package   MyAAC
 * @author    Gesior <jerzyskalski@wp.pl>
 * @author    Slawkens <slawkens@gmail.com>
- * @copyright 2019 MyAAC
+ * @author    Lee
+ * @copyright 2020 MyAAC
 * @link      https://my-aac.org
 */
 defined('MYAAC') or die('Direct access not allowed!');
 $title = "Creatures";

-?>
-<script type="text/javascript" src="tools/js/tipped.js"></script>
-<link rel="stylesheet" type="text/css" href="tools/css/tipped.css"/>
-<link rel="stylesheet" href="<?php echo BASE_URL; ?>tools/css/datatables.min.css">
-
-<script>
-	$(document).ready(function () {
-		Tipped.create('.item_image');
-	});
-</script>
-
-<?php
 if (empty($_REQUEST['creature'])) {
-	//send query to database
-	$monsters = $db->query('SELECT * FROM `' . TABLE_PREFIX . 'monsters` WHERE `hidden` != 1 ORDER BY name asc');
-	echo '<table id="creaturestb" class=""><thead>
-		<tr role="row"><th>Name</th><th>Health</th><th>Experience</th>
-	<th>Summonable Mana</th><th>Convinceable Mana</th><th>Race</th></tr>
-</thead><tbody>';
-
-	foreach ($monsters as $monster) {
-		echo '<tr><td><a href="?subtopic=creatures&creature=' . urlencode($monster['name']) . '">' . $monster['name'] . '</a></td>
-		<td>' . $monster['health'] . '</td>
-		<td>' . $monster['exp'] . '</td>
-		<td>' . ($monster['summonable'] ? $monster['mana'] : "---") . '</td>
-		<td>' . ($monster['convinceable'] ? $monster['mana'] : "---") . '</td>
-		<td>' . ucwords($monster['race']) . '</td></tr>';
-	}
-	echo '</tbody></table>';
+	$creatures = $db->query('SELECT * FROM `' . TABLE_PREFIX . 'monsters` WHERE `hidden` != 1 '.(empty($_REQUEST['boss']) ? '': 'AND `rewardboss` = 1').' ORDER BY name asc');
+	$twig->display('creatures.html.twig', array(
+		'creatures' => $creatures->fetchAll(),
+		'preview' => config('creature_images_preview'),
+	));

 } else {
-	$monster_name = stripslashes(trim(ucwords($_REQUEST['creature'])));
-	$monster = $db->query('SELECT * FROM `' . TABLE_PREFIX . 'monsters` WHERE `hidden` != 1 AND `name` = ' . $db->quote($monster_name) . ';')->fetch();
-	if (isset($monster['name'])) {
-		$title = $monster['name'] . " - Creatures";
+	$creature_name = urldecode(stripslashes(ucwords(strtolower($_REQUEST['creature']))));
+	$prep = $db->prepare('SELECT * FROM `' . TABLE_PREFIX . 'monsters` WHERE `hidden` != 1 AND `name` = ? LIMIT 1;');
+	$prep->execute([$creature_name]);
+	$creature = $prep->fetch();

-		echo '<div style="text-align:center"><h2>' . $monster['name'] . '</h2></div>';
-		echo '<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=4 WIDTH=100%><tr><td>
-	<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=4 WIDTH=60%>';
-		$number_of_rows = 0;
-		echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Health: </b></td><td>' . $monster['health'] . '</td></tr>';
-		$number_of_rows++;
-		echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Experience: </b></td><td>' . $monster['exp'] . '</td></tr>';
-		$number_of_rows++;
-		echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Speed like: </b></td><td>' . $monster['speed_lvl'] . ' level';
-		$number_of_rows++;
-		if ($monster['use_haste'])
-			echo ' (Can use haste)';
-
-		echo '</td></tr>';
-
-		$number_of_rows++;
-		if ($monster['summonable'] == 1)
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Summon: </b></td><td>' . $monster['mana'] . ' mana</td></tr>';
-		else {
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Summon: </b></td><td>Impossible</td></tr>';
-		}
-
-		$number_of_rows++;
-		if ($monster['convinceable'] == 1)
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Convince: </b></td><td>' . $monster['mana'] . ' mana</td></tr>';
-		else
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Convince: </b></td><td>Impossible</td></tr>';
-
-		echo '</TABLE></td><td align=left>
-	<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=4 WIDTH=40%>
-	<tr><td align=left>';
-		$monster['gfx_name'] = trim(strtolower($monster['name'])) . ".gif";
-		if (!file_exists('images/monsters/' . $monster['gfx_name'])) {
-			$gfx_name = str_replace(" ", "", $monster['gfx_name']);
-			if (file_exists('images/monsters/' . $gfx_name))
-				echo '<img src="images/monsters/' . $gfx_name . '" height="128" width="128">';
-			else
-				echo '<img src="images/monsters/nophoto.png" height="128" width="128">';
-		} else
-			echo '<img src="images/monsters/' . $monster['gfx_name'] . '" height="128" width="128">';
-
-		echo '</td></tr>
-	</TABLE></td></tr><tr><td>
-	<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=4 WIDTH=100%>';
-		$immunities = json_decode($monster['immunities'], true);
-		if (count($immunities) > 0) {
-			$number_of_rows++;
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Immunities: </b></td><td width="100%">' . implode(', ', $immunities) . '</td></tr>';
-		}
-
-		$voices = json_decode($monster['voices'], true);
-		if (count($voices) > 0) {
-			foreach ($voices as &$voice) {
-				$voice = '"' . $voice . '"';
-			}
-
-			$number_of_rows++;
-			echo '<tr BGCOLOR="' . getStyle($number_of_rows) . '"><td width="100"><b>Voices: </b></td><td width="100%">' . implode(', ', $voices) . '</td></tr>';
-		}
-		echo '</TABLE></td></tr>';
-
-		$loot = json_decode($monster['loot'], true);
-		if ($loot) {
-			echo '<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=4 WIDTH=100%><tr><td style="display: block;">';
+	if (isset($creature['name'])) {
 		function sort_by_chance($a, $b)
 		{
 			if ($a['chance'] == $b['chance']) {
@@ -119,35 +34,42 @@ if (empty($_REQUEST['creature'])) {
 			return ($a['chance'] > $b['chance']) ? -1 : 1;
 		}

+		$title = $creature['name'] . " - Creatures";
+
+		$creature['img_link']= getCreatureImgPath($creature_name);
+
+		$voices = json_decode($creature['voices'], true);
+		$summons = json_decode($creature['summons'], true);
+		$elements = json_decode($creature['elements'], true);
+		$immunities = json_decode($creature['immunities'], true);
+		$loot = json_decode($creature['loot'], true);
 		usort($loot, 'sort_by_chance');

-			$i = 0;
+		$loot_list = [];
 		foreach ($loot as $item) {
-				$name = getItemNameById($item['id']);
-				$tooltip = $name . '<br/>Chance: ' . round($item['chance'] / 1000, 2) . '%<br/>Max count: ' . $item['count'];
-
-				echo '<img src="' . $config['item_images_url'] . $item['id'] . config('item_images_extension') . '" class="item_image" title="' . $tooltip . '" width="32" height="32" border="0" alt=" ' . $name . '" />';
-				$i++;
+			$item['name'] = getItemNameById($item['id']);
+			$item['rarity_chance'] = round($item['chance'] / 1000, 2);
+			$item['rarity'] = getItemRarity($item['chance']);
+			$item['tooltip'] = ucfirst($item['name']) . '<br/>Chance: ' . $item['rarity'] . (config('loot_show_percentage') ? ' ('. $item['rarity_chance'] .'%)' : '') . '<br/>Max count: ' . $item['count'];
+			$loot_list[] =  $item;
 		}

-			echo '</td></tr></TABLE>';
-		}
+		$creature['loot'] = isset($loot_list) ? $loot_list : null;
+		$creature['voices'] = isset($voices) ? $voices : null;
+		$creature['summons'] = isset($summons) ? $summons : null;
+		$creature['elements'] = isset($elements) ? $elements : null;
+		$creature['immunities'] = isset($immunities) ? $immunities : null;
+
+		$twig->display('creature.html.twig', array(
+			'creature' => $creature,
+		));

-		echo '</td></tr>';
-		echo '</TABLE>';
 	} else {
-		echo "Monster with name <b>" . $monster_name . "</b> doesn't exist.";
+		echo "Creature with name <b>" . $creature_name . "</b> doesn't exist.";
 	}

 //back button
 	$twig->display('creatures.back_button.html.twig');
 }
 ?>
-<script>
-	$(document).ready(function () {
-		$('#creaturestb').DataTable();
-	});

-</script>
-
-<script src="<?php echo BASE_URL; ?>tools/js/datatables.min.js"></script>
--- a/system/templates/creature.html.twig
+++ b/system/templates/creature.html.twig
@@ -0,0 +1,164 @@
+<script type="text/javascript" src="tools/js/tipped.js"></script>
+<link rel="stylesheet" type="text/css" href="tools/css/tipped.css"/>
+<style>
+	.creature_img {
+		background-position: center center;
+		background-repeat: no-repeat;
+		width: 64px;
+		height: 64px;
+		padding: 5px;
+	}
+
+	.creature_name {
+		font-size: 18px;
+		font-weight: bold;
+		width: 100%;
+		text-align: center;
+		float: left;
+		box-sizing: border-box;
+		padding-top: 10px;
+		padding-bottom: 15px;
+	}
+
+	.creature_voice {
+		font-weight: bold;
+		font-size: 8pt;
+		color: #FE6500;
+		text-shadow: rgb(0, 0, 0) 1px 0px 0px, rgb(0, 0, 0) 0.540302px 0.841471px 0px, rgb(0, 0, 0) -0.416147px 0.909297px 0px, rgb(0, 0, 0) -0.989992px 0.14112px 0px, rgb(0, 0, 0) -0.653644px -0.756802px 0px, rgb(0, 0, 0) 0.283662px -0.958924px 0px, rgb(0, 0, 0) 0.96017px -0.279415px 0px;
+	}
+
+	.loot_image {
+		width: 32px;
+		height: 32px;
+		border: 0px;
+	}
+
+	.loot_amount {
+		position: absolute;
+		bottom: 0;
+		right: 2px;
+		color: white;
+		font-size: 8pt;
+		font-weight: bold;
+		text-shadow: 0.1em 0.1em black;
+	}
+
+	.loot_bg {
+		margin: 2px;
+		position: relative;
+		display: inline-block;
+		float: left;
+		background-image: url('{{ constant('BASE_URL') }}images/items/empty.gif');
+		opacity: 0.7;
+	}
+
+	.loot_bg:hover {
+		opacity: 1.0;
+	}
+</style>
+
+<script>
+	$(document).ready(function () {
+		Tipped.create('.loot_image');
+	});
+</script>
+
+<div class="creature_name">{{ creature.name }}</div>
+<table class="CreatureInfo" border="0" cellspacing="0" cellpadding="4" width="100%">
+	<thead>
+	<tr>
+		<th align="center" colspan="4"><b>General information</b></th>
+	</tr>
+	</thead>
+	<tbody>
+	<tr>
+		<td width="10%">
+			<div class="creature_img" style="background-image: url({{ creature.img_link }}"></div>
+		</td>
+		<td align="center" width="30%">
+			<strong>Health:</strong> {{ creature.health }}<br>
+			<strong>Experience:</strong> {{ creature.exp }}<br>
+			<strong>Speed:</strong> {{ creature.speed_lvl }} {{ (creature.use_haste) ? ' (+haste)' : '' }}
+		</td>
+		<td align="center" width="30%">
+			<b>Summonable:</b> {{ (creature.summonable) ? creature.mana ~ ' mana' : 'Impossible' }}<br>
+			<b>Convinceable:</b> {{ (creature.convinceable) ? creature.mana ~ ' mana' : 'Impossible' }}
+		</td>
+		<td width="30%" align="center">
+			<strong>Armor:</strong> {{ creature.armor }}<br>
+			<strong>Defense:</strong> {{ creature.defense }}
+		</td>
+	</tr>
+	</tbody>
+</table><br>
+
+{% if ( creature.voices is not empty or creature.summons is not empty) %}
+	<table class="CreatureVoice" border="0" cellspacing="0" cellpadding="4" width="100%">
+		<thead>
+		<tr>
+			{% if ( creature.summons is not empty) %}
+				<th width="50%"><b>Summons</b></th>
+			{% endif %}
+			{% if ( creature.voices is not empty) %}
+				<th width="50%"><b>Voices</b></th>
+			{% endif %}
+		</tr>
+		</thead>
+		<tbody>
+		<tr>
+			{% if ( creature.summons is not empty) %}
+				<td>
+					{% for summon in creature.summons %}
+						<span>{{ summon.chance }}% chance to summon a <b>{{ getMonsterLink(summon.name, true)|raw }}</b><br/></span>
+					{% endfor %}
+				</td>
+			{% endif %}
+			{% if ( creature.voices is not empty) %}
+				<td align="center">
+					<span class="creature_voice">
+						{% for voice in creature.voices %}
+							"{{ voice }}"<br/>
+						{% endfor %}
+					</span>
+				</td>
+			{% endif %}
+		</tr>
+		</tbody>
+	</table><br/>
+{% endif %}
+
+{% if (creature.elements|length > 0 or creature.immunities|length > 0 ) %}
+	<table class="CreatureElements" border="0" cellspacing="0" cellpadding="4" width="100%">
+		<tr>
+			<th colspan="{{ creature.elements|length }}">Elements and Immunities</th>
+		</tr>
+		{% if (creature.elements|length > 0) %}
+			<tr>{% for element in creature.elements %}
+					<td align="center"><b> {{ element.name }}</b><br/>{{ element.percent }}%</td>
+				{% endfor %}</tr>
+		{% endif %}
+		{% if (creature.immunities|length > 0 ) %}
+			<tr>
+				<td colspan="{{ creature.elements|length }}"><b>Immunities:</b> {{ creature.immunities|join(' | ') }}</td>
+			</tr>
+		{% endif %}
+	</table><br/>
+{% endif %}
+
+{% if (not creature.loot is empty) %}
+	<table class="CreatureLoot" border="0" cellspacing="0" cellpadding="4" width="100%">
+		<tr><th>Loot</th></tr>
+		<tr>
+			<td>
+				{% for item in creature.loot %}
+					<span class="loot_bg">
+					{% if (item.count > 1) %}
+						<span class="loot_amount">{{ item.count }}</span>
+					{% endif %}
+					<a href="{{ config.items_url }}{{ item.name|title }}"><img title="{{ item.tooltip }}" src="{{ config.item_images_url }}{{ item.id }}{{ config.item_images_extension }}" class="loot_image"/></a>
+				</span>
+				{% endfor %}
+			</td>
+		</tr>
+	</table>
+{% endif %}
--- a/system/templates/creatures.html.twig
+++ b/system/templates/creatures.html.twig
@@ -0,0 +1,97 @@
+{% if creatures is not empty %}
+
+	{% if preview %}
+		<style>
+			.creatureImages {
+				width: 100px;
+				height: 100px;
+				margin: 0px;
+				float: left;
+			}
+
+			.creatureBoss {
+				box-sizing: border-box;
+				border-radius: 10px;
+				border: 1px rgba(179, 179, 179, 0.50) solid;
+				background-color: rgba(235, 235, 235, 0.50);
+			}
+		</style>
+		<script type="text/javascript">
+			$(document).ready(function () {
+				$("#ciSearch").on("keyup", function () {
+					var value = $(this).val().toLowerCase();
+					$("#creatureiTable div").filter(function () {
+						$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
+					});
+				});
+			});
+		</script>
+		<div style="float: right;"><input id="ciSearch" type="text" placeholder="Search.."></div>
+		<div style="display: table; width: 100%; ">
+			<div style="text-align: center; " id="creatureiTable">
+				{% for creature in creatures %}
+					{% set i = i + 1 %}
+					<div class="creatureImages">
+						<a href="{{ getMonsterLink(creature.name, false)|raw }}">
+							<div class="creature_img " style="background-image: url({{ creature.img_link }}"></div>
+							<img class=" {{ (creature.rewardboss ? 'creatureBoss' : '') }}" src="{{ getCreatureImgPath(creature.name) }}" border="0"/>
+						</a>
+						<div>{{ creature.name }}</div>
+					</div>
+				{% endfor %}
+			</div>
+		</div>
+	{% else %}
+		<script type="text/javascript">
+			$(document).ready(function () {
+				$("#cSearch").on("keyup", function () {
+					var value = $(this).val().toLowerCase();
+					$("#creatureTable tr").filter(function () {
+						$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
+					});
+				});
+			});
+		</script>
+		{{ generateLink('?creatures', 'All', false)|raw }} - <a href="?subtopic=creatures&boss=view">Bosses</a>
+		<div style="float: right;"><input id="cSearch" type="text" placeholder="Search.."></div>
+		<table width="100%">
+			<thead>
+			<tr>
+				<th>Name</th>
+				<th>Boss</th>
+				<th>Health</th>
+				<th>Experience</th>
+				<th>Summonable Mana</th>
+				<th>Convinceable Mana</th>
+				<th>Race</th>
+			</tr>
+			</thead>
+			<tbody id="creatureTable">
+			{% set i = 0 %}
+			{% for creature in creatures %}
+				{% set i = i + 1 %}
+				<tr>
+					<td>{{ getMonsterLink(creature.name, true)|raw }}</td>
+					<td>{{ (creature.rewardboss) ? 'Yes' : '---' }}</td>
+					<td>{{ creature.health|number_format(0, '.', ',') }}</td>
+					<td>{{ creature.exp|number_format(0, '.', ',') }}</td>
+					<td>{{ (creature.convinceable) ? creature.mana : '---' }} </td>
+					<td>{{ (creature.summonable) ? creature.mana  : '---' }} </td>
+					<td>{{ creature.race|title }}</td>
+				</tr>
+			{% endfor %}
+			</tbody>
+		</table>
+	{% endif %}
+	<script src="tools/js/jquery.min.js"></script>
+{% else %}
+	<table width="100%">
+		<tr>
+			<th>Creatures</th>
+		</tr>
+		<tr>
+			<td>No Creatures on the server.</td>
+		</tr>
+	</table>
+{% endif %}
+
--- a/system/twig.php
+++ b/system/twig.php
@@ -24,16 +24,31 @@ $function = new TwigFunction('getStyle', function ($i) {
 });
 $twig->addFunction($function);

+$function = new TwigFunction('getCreatureImgPath', function ($i) {
+	return getCreatureImgPath($i);
+});
+$twig->addFunction($function);
+
 $function = new TwigFunction('getLink', function ($s) {
 	return getLink($s);
 });
 $twig->addFunction($function);

+$function = new TwigFunction('generateLink', function ($s, $n, $b = false) {
+	return generateLink($s, $n, $b);
+});
+$twig->addFunction($function);
+
 $function = new TwigFunction('getPlayerLink', function ($s, $p) {
 	return getPlayerLink($s, $p);
 });
 $twig->addFunction($function);

+$function = new TwigFunction('getMonsterLink', function ($s, $p) {
+	return getMonsterLink($s, $p);
+});
+$twig->addFunction($function);
+
 $function = new TwigFunction('getGuildLink', function ($s, $p) {
    return getGuildLink($s, $p);
 });