test page item, for tooltip test
This commit is contained in:
parent
82f223cb63
commit
c4519fbdcf
@ -6,4 +6,5 @@ require_once dirname(__FILE__).'/default_impressum/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_login/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_serverlist/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_beta/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_article/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_article/autoload.inc';
|
||||
require_once dirname(__FILE__).'/default_item/autoload.inc';
|
||||
2
mojotrollz/page/default_item/autoload.inc
Normal file
2
mojotrollz/page/default_item/autoload.inc
Normal file
@ -0,0 +1,2 @@
|
||||
<?php
|
||||
\SYSTEM\autoload::registerFolder(dirname(__FILE__));
|
||||
367
mojotrollz/page/default_item/css/default_item.scss
Normal file
367
mojotrollz/page/default_item/css/default_item.scss
Normal file
@ -0,0 +1,367 @@
|
||||
$border: #a7a7ad;
|
||||
$bg: rgba(10,0,5,0.8);
|
||||
$shadow: transparentize( $bg , 0.3 );
|
||||
|
||||
$gap: 3px;
|
||||
|
||||
$crafting: #f4d403;
|
||||
$trash: #999;
|
||||
$common: white;
|
||||
$uncommon: #24ee10;
|
||||
$rare: #0070DD;
|
||||
$epic: #ad23ed;
|
||||
$legendary: #fa7c18;
|
||||
$heirloom: #e5d9c5;
|
||||
$flavour: #FFD100;
|
||||
|
||||
@mixin socket( $color: "meta" ) {
|
||||
|
||||
$srcUrl: "http://wowimg.zamimg.com/images/";
|
||||
$socket: $srcUrl + "icons/socket-#{$color}.gif";
|
||||
|
||||
background-image: url( $socket );
|
||||
background-repeat: no-repeat;
|
||||
background-position: left top;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.wow-icon {
|
||||
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
display: inline-block;
|
||||
background-image: url( http://wow.zamimg.com/images/wow/icons/medium/inv_misc_questionmark.jpg );
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
border-width: 4px;
|
||||
|
||||
position: relative;
|
||||
margin: 2px 2px;
|
||||
|
||||
box-shadow:
|
||||
-1px -1px 1px $shadow,
|
||||
-1px 1px 1px $shadow,
|
||||
1px 1px 1px $shadow,
|
||||
1px -1px 1px $shadow;
|
||||
|
||||
.stack {
|
||||
|
||||
color: white;
|
||||
font-size: 13px;
|
||||
font-style: normal;
|
||||
text-align: right;
|
||||
|
||||
text-shadow:
|
||||
0 0 2px black,
|
||||
0 0 2px black,
|
||||
0 0 3px black,
|
||||
0 0 3px black,
|
||||
0 0 1px black,
|
||||
0 0 1px black;
|
||||
|
||||
position: absolute;
|
||||
right: -1px;
|
||||
bottom: -4px;
|
||||
|
||||
}
|
||||
|
||||
&:after {
|
||||
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
left: -4px;
|
||||
top: -4px;
|
||||
|
||||
border-radius: 4px;
|
||||
box-shadow: inset 0 0 5px black;
|
||||
|
||||
transition: all 0.1s ease;
|
||||
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
||||
&:after {
|
||||
|
||||
box-shadow:
|
||||
inset 0 0 9px rgba(30,180,230,0.9),
|
||||
inset 0 0 5px rgba(30,180,230,0.6);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.wow-icon,
|
||||
.wow-item {
|
||||
|
||||
|
||||
border-style: solid;
|
||||
border-width: 5px;
|
||||
border-image: url(http://files.simey.me/wow-tooltip-border-2.png) 5 repeat;
|
||||
border-radius: 4px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.wow-item {
|
||||
|
||||
position: absolute;
|
||||
|
||||
color: white;
|
||||
background-color: $bg;
|
||||
|
||||
font-family: "friz", serif;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
padding: 0.5em 0.6em;
|
||||
text-shadow: 0 1px 0 rgba(0,0,0,1);
|
||||
|
||||
box-shadow:
|
||||
-1px -1px 1px $shadow,
|
||||
-1px 1px 1px $shadow,
|
||||
1px 1px 1px $shadow,
|
||||
1px -1px 1px $shadow;
|
||||
|
||||
max-width: 24em;
|
||||
|
||||
transition:
|
||||
opacity 0.05s ease-out 0.05s,
|
||||
transform 0.1s ease-out 0.05s;
|
||||
|
||||
&.hidden {
|
||||
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transform: scale(0.95);
|
||||
|
||||
transition:
|
||||
opacity 0.05s ease-out 0.05s,
|
||||
transform 0.1s ease-out 0.05s,
|
||||
visibility 0.01s linear 0.15s;
|
||||
|
||||
}
|
||||
|
||||
p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&[data-quality=crafting] {
|
||||
.header__title {
|
||||
color: $crafting;
|
||||
}
|
||||
}
|
||||
&[data-quality=heirloom] {
|
||||
.header__title {
|
||||
color: $heirloom;
|
||||
}
|
||||
}
|
||||
&[data-quality=trash] {
|
||||
.header__title {
|
||||
color: $trash;
|
||||
}
|
||||
}
|
||||
&[data-quality=common] {
|
||||
.header__title {
|
||||
color: $common;
|
||||
}
|
||||
}
|
||||
&[data-quality=uncommon] {
|
||||
.header__title {
|
||||
color: $uncommon;
|
||||
}
|
||||
}
|
||||
&[data-quality=rare] {
|
||||
.header__title {
|
||||
color: $rare;
|
||||
}
|
||||
}
|
||||
&[data-quality=epic] {
|
||||
.header__title {
|
||||
color: $epic;
|
||||
}
|
||||
}
|
||||
&[data-quality=legendary] {
|
||||
.header__title {
|
||||
color: $legendary;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.wow-item__header {
|
||||
|
||||
.header__title {
|
||||
|
||||
margin-bottom: $gap;
|
||||
font-size: 1.12em;
|
||||
margin-right: 1em;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.wow-item__type {
|
||||
|
||||
overflow: hidden;
|
||||
margin-top: $gap;
|
||||
|
||||
.type {
|
||||
|
||||
&__slot,
|
||||
&__item {
|
||||
|
||||
float: left;
|
||||
|
||||
}
|
||||
|
||||
&__item {
|
||||
|
||||
float: right;
|
||||
text-align: right;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.wow-item__stats {
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
.stats {
|
||||
|
||||
&__damage-armor {
|
||||
float: left;
|
||||
margin-right: 5em;
|
||||
}
|
||||
|
||||
&__speed {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
&__list-item:first-child {
|
||||
margin-top: $gap;
|
||||
}
|
||||
|
||||
&__dps {
|
||||
float: none;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
&__secondary {
|
||||
color: $uncommon;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.wow-item__enchantments {
|
||||
|
||||
margin: $gap*2 0;
|
||||
|
||||
.enchantments {
|
||||
|
||||
&__enchant {
|
||||
|
||||
color: $uncommon;
|
||||
|
||||
}
|
||||
|
||||
&__socket {
|
||||
|
||||
@include socket();
|
||||
text-indent: 1.8em;
|
||||
text-transform: capitalize;
|
||||
|
||||
&.socket--meta {
|
||||
@include socket( "meta" );
|
||||
}
|
||||
|
||||
&.socket--blue {
|
||||
@include socket( "blue" );
|
||||
}
|
||||
|
||||
&.socket--red {
|
||||
@include socket( "red" );
|
||||
}
|
||||
|
||||
&.socket--yellow {
|
||||
@include socket( "yellow" );
|
||||
}
|
||||
|
||||
&.socket--prismatic {
|
||||
@include socket( "prismatic" );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&__sockets {
|
||||
|
||||
margin: $gap 0;
|
||||
|
||||
}
|
||||
|
||||
&__socket,
|
||||
&__socket-bonus {
|
||||
|
||||
color: $trash;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.wow-item__info {
|
||||
|
||||
.info {
|
||||
|
||||
&__chance-on-hit {
|
||||
|
||||
color: $uncommon;
|
||||
|
||||
}
|
||||
|
||||
&__flavour-text {
|
||||
|
||||
color: $flavour;
|
||||
margin-top: $gap;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.wow-item__bonuses {
|
||||
|
||||
margin-top: $gap;
|
||||
|
||||
.bonuses {
|
||||
|
||||
&__bonus {
|
||||
|
||||
color: $uncommon;
|
||||
margin: $gap 0 0;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
15
mojotrollz/page/default_item/default_item.php
Normal file
15
mojotrollz/page/default_item/default_item.php
Normal file
@ -0,0 +1,15 @@
|
||||
<?php
|
||||
class default_item extends \SYSTEM\PAGE\Page {
|
||||
public static function js(){
|
||||
return array( \SYSTEM\WEBPATH(new PPAGE(),'default_item/js/default_item.js'));}
|
||||
public static function css(){
|
||||
return array( \SYSTEM\WEBPATH(new PPAGE(),'default_item/css/default_item.scss'));}
|
||||
public function html(){
|
||||
$vars = array();
|
||||
$vars['css'] = \SYSTEM\HTML\html::link(\SYSTEM\WEBPATH(new PPAGE(),'default_item/css/default_item.scss'));
|
||||
$vars['js'] = \SYSTEM\HTML\html::script(\LIB\lib_jquery::js()).
|
||||
\SYSTEM\HTML\html::script(\SYSTEM\WEBPATH(new PPAGE(),'default_item/js/handlebars-v4.0.5.js')).
|
||||
\SYSTEM\HTML\html::script(\SYSTEM\WEBPATH(new PPAGE(),'default_item/js/default_item.js'));
|
||||
return \SYSTEM\PAGE\replace::replaceFile(SYSTEM\SERVERPATH(new PPAGE(),'default_item/tpl/default_item.tpl'),$vars);
|
||||
}
|
||||
}
|
||||
501
mojotrollz/page/default_item/js/default_item.js
Normal file
501
mojotrollz/page/default_item/js/default_item.js
Normal file
@ -0,0 +1,501 @@
|
||||
|
||||
var items = {
|
||||
|
||||
"hearthstone": {
|
||||
|
||||
icon: "inv_misc_rune_01",
|
||||
quality: "common",
|
||||
name: "Hearthstone",
|
||||
binds: "when picked up",
|
||||
unique: true,
|
||||
bonuses: [
|
||||
{ description: "Use: Returns you to The Crossroads. Speak to an Innkeeper in a different place to change your home location." }
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"shiny-red-apple": {
|
||||
|
||||
icon: "inv_misc_food_19",
|
||||
quality: "common",
|
||||
name: "Shiny Red Apple",
|
||||
stack: 20,
|
||||
bonuses: [
|
||||
{ description: "Use: Restores 90 health over 18 sec. Must remain seated while eating." }
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"melon-juice": {
|
||||
|
||||
icon: "inv_drink_09",
|
||||
quality: "common",
|
||||
name: "Melon Juice",
|
||||
stack: 20,
|
||||
bonuses: [
|
||||
{ description: "Use: Restores 72 mana over 24 sec. Must remain seated while drinking." }
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"red-linen-shirt": {
|
||||
|
||||
icon: "inv_shirt_red_01",
|
||||
quality: "common",
|
||||
name: "Red Linen Shirt",
|
||||
slot: "Shirt"
|
||||
|
||||
},
|
||||
|
||||
"medicine-staff-of-the-monkey": {
|
||||
|
||||
icon: "inv_staff_31",
|
||||
quality: "uncommon",
|
||||
name: "Medicine Staff of the Monkey",
|
||||
binds: "when equipped",
|
||||
unique: false,
|
||||
slot: "Two-Hand",
|
||||
type: "Staff",
|
||||
|
||||
damage: {
|
||||
min: 25,
|
||||
max: 39,
|
||||
extras: {
|
||||
min: [],
|
||||
max: []
|
||||
},
|
||||
speed: 2.50
|
||||
},
|
||||
|
||||
stats: [
|
||||
{ stat: "Agility", value: 4, type: "primary" },
|
||||
{ stat: "Stamina", value: 4, type: "primary" }
|
||||
],
|
||||
|
||||
enchantments: {
|
||||
|
||||
enchants: [
|
||||
{ description: "Flametongue" }
|
||||
],
|
||||
|
||||
},
|
||||
|
||||
durability: 65,
|
||||
level: 14,
|
||||
ilevel: 19
|
||||
|
||||
},
|
||||
|
||||
"deepdive-helmet": {
|
||||
|
||||
icon: "inv_helmet_49",
|
||||
quality: "uncommon",
|
||||
name: "Deepdive Helmet",
|
||||
binds: "when equipped",
|
||||
unique: false,
|
||||
slot: "Head",
|
||||
type: "Cloth",
|
||||
armor: 96,
|
||||
|
||||
stats: [
|
||||
{ stat: "Stamina", value: 15, type: "primary" }
|
||||
],
|
||||
durability: 70,
|
||||
level: 0,
|
||||
ilevel: 0,
|
||||
tradelevel: {
|
||||
trade: "Engineering",
|
||||
level: 230
|
||||
},
|
||||
|
||||
bonuses: [
|
||||
{ description: "Equip: Allows underwater breathing" }
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"hanzo-sword": {
|
||||
|
||||
icon: "inv_sword_10",
|
||||
quality: "rare",
|
||||
name: "Hanzo Sword",
|
||||
binds: "when equipped",
|
||||
unique: false,
|
||||
slot: "One-Hand",
|
||||
type: "Sword",
|
||||
|
||||
damage: {
|
||||
min: 45,
|
||||
max: 86,
|
||||
extras: {
|
||||
min: [],
|
||||
max: []
|
||||
},
|
||||
speed: 1.8
|
||||
},
|
||||
|
||||
durability: 90,
|
||||
chanceOnHit: [
|
||||
{ description: "Wounds the target for 75 damage." }
|
||||
],
|
||||
|
||||
level: 50,
|
||||
ilevel: 0
|
||||
|
||||
},
|
||||
|
||||
"boots-of-the-petrified-forest": {
|
||||
|
||||
icon: "inv_boots_leather_02",
|
||||
quality: "epic",
|
||||
name: "Boots of the Petrified Forest",
|
||||
binds: "when picked up",
|
||||
unique: false,
|
||||
slot: "Feet",
|
||||
type: "Leather",
|
||||
armor: 798,
|
||||
|
||||
stats: [
|
||||
{ stat: "Stamina", value: 116, type: "primary" },
|
||||
{ stat: "Intellect", value: 79, type: "primary" },
|
||||
{ stat: "Spirit", value: 52, type: "primary" },
|
||||
{ stat: "Haste", value: 53, type: "secondary" }
|
||||
],
|
||||
durability: 80,
|
||||
level: 80,
|
||||
ilevel: 0
|
||||
|
||||
},
|
||||
|
||||
"the-2-ring": {
|
||||
|
||||
icon: "inv_jewelry_ring_34",
|
||||
quality: "epic",
|
||||
name: "The 2 Ring",
|
||||
binds: "when equipped",
|
||||
unique: false,
|
||||
slot: "Finger",
|
||||
type: "",
|
||||
armor: 96,
|
||||
|
||||
stats: [
|
||||
{ stat: "Strength", value: 22, type: "primary" },
|
||||
{ stat: "Agility", value: 22, type: "primary" },
|
||||
{ stat: "Stamina", value: 22, type: "primary" },
|
||||
{ stat: "Intellect", value: 22, type: "primary" },
|
||||
{ stat: "Spirit", value: 22, type: "primary" }
|
||||
],
|
||||
|
||||
flavour: "Vastly superior to the 1 ring."
|
||||
|
||||
},
|
||||
|
||||
"dragonwrath-tarecgosas-rest": {
|
||||
|
||||
icon: "stave_2h_tarecgosa_e_01stagefinal",
|
||||
quality: "legendary",
|
||||
name: "Dragonwrath, Tarecgosa's Rest",
|
||||
binds: "when picked up",
|
||||
slot: "Two-Hand",
|
||||
type: "Staff",
|
||||
|
||||
damage: {
|
||||
min: 2344,
|
||||
max: 3518,
|
||||
// extras is for stuff like additional fire dmg
|
||||
extras: {
|
||||
min: [],
|
||||
max: []
|
||||
},
|
||||
speed: 3.30
|
||||
},
|
||||
|
||||
stats: [
|
||||
{ stat: "Stamina", value: 730, type: "primary" },
|
||||
{ stat: "Intellect", value: 426, type: "primary" },
|
||||
{ stat: "Hit", value: 314, type: "secondary" },
|
||||
{ stat: "Haste", value: 271, type: "secondary" },
|
||||
{ stat: "Spell Power", value: 2786, type: "secondary" }
|
||||
],
|
||||
|
||||
enchantments: {
|
||||
|
||||
sockets: [
|
||||
{ color: "red" },
|
||||
{ color: "red" },
|
||||
{ color: "red" }
|
||||
],
|
||||
|
||||
socketBonus: "+30 Intellect"
|
||||
|
||||
},
|
||||
|
||||
durability: 145,
|
||||
|
||||
level: 85,
|
||||
ilevel: 397,
|
||||
|
||||
bonuses: [
|
||||
{ description: "Equip: When you deal damage, you have a chance to gain the Wrath of Tarecgosa, duplicating the harmful spell." },
|
||||
{ description: "Use: Transforms you into Tarecgosa's Visage, allowing you to fly very fast." }
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"hoggers-trousers": {
|
||||
|
||||
icon: "inv_pants_02",
|
||||
quality: "rare",
|
||||
name: "Hogger's Trousers",
|
||||
binds: "when picked up",
|
||||
unique: false,
|
||||
slot: "Legs",
|
||||
type: "Leather",
|
||||
armor: 102,
|
||||
|
||||
stats: [
|
||||
{ stat: "Agility", value: 9, type: "primary" },
|
||||
{ stat: "Hit", value: 9, type: "secondary" }
|
||||
],
|
||||
durability: 95,
|
||||
level: 20,
|
||||
ilevel: 0
|
||||
|
||||
},
|
||||
|
||||
"green-hills-of-stranglethorn-11": {
|
||||
|
||||
icon: "inv_misc_note_06",
|
||||
quality: "common",
|
||||
name: "Green Hills of Stranglethorn - Page 11",
|
||||
stack: 10,
|
||||
|
||||
bonuses: [
|
||||
{
|
||||
description: "Right Click to Read"
|
||||
}
|
||||
]
|
||||
|
||||
},
|
||||
|
||||
"hopeglow-spaulders": {
|
||||
|
||||
icon: "inv_shoulder_leather_raidmonk_n_01",
|
||||
quality: "epic",
|
||||
name: "Hopeglow Spaulders",
|
||||
binds: "when picked up",
|
||||
unique: false,
|
||||
slot: "Shoulder",
|
||||
type: "Leather",
|
||||
armor: 2623,
|
||||
|
||||
stats: [
|
||||
{ stat: "Stamina", value: 2452, type: "primary" },
|
||||
{ stat: "Intellect", value: 1474, type: "primary" },
|
||||
{ stat: "Spirit", value: 1010, type: "primary" },
|
||||
{ stat: "Haste", value: 1010, type: "secondary" }
|
||||
],
|
||||
|
||||
enchantments: {
|
||||
|
||||
sockets: [
|
||||
{ color: "yellow" },
|
||||
{ color: "yellow" }
|
||||
],
|
||||
|
||||
socketBonus: "+120 Intellect"
|
||||
|
||||
},
|
||||
|
||||
durability: 100,
|
||||
level: 90,
|
||||
ilevel: 559,
|
||||
}
|
||||
}
|
||||
|
||||
Handlebars.registerHelper("speed", function( speed ) {
|
||||
return speed.toFixed(2);
|
||||
});
|
||||
|
||||
Handlebars.registerHelper("dps", function( damage ) {
|
||||
var damageTotal = damage.max + damage.min;
|
||||
if( damage.extras ) {
|
||||
for( var i = 0; i < damage.extras.min.length; i++ ) {
|
||||
damageTotal += damage.extras.min[i];
|
||||
}
|
||||
for( var i = 0; i < damage.extras.max.length; i++ ) {
|
||||
damageTotal += damage.extras.max[i];
|
||||
}
|
||||
}
|
||||
return ((damageTotal/2) / damage.speed).toFixed(1);
|
||||
});
|
||||
|
||||
Handlebars.registerHelper("classes", function( array ) {
|
||||
var classes = array.toString().replace(/\s/g," ").replace(/,/g,", ");
|
||||
return new Handlebars.SafeString( classes );
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var source = $("#wow-item-template").html();
|
||||
var template = Handlebars.compile(source);
|
||||
var $body = $("body");
|
||||
var $wowIcons = $(".wow-icon");
|
||||
var lastHovered;
|
||||
|
||||
$wowIcons.each(function(k,v) {
|
||||
|
||||
var $this = $(this);
|
||||
var id = $this.data("item-id");
|
||||
obj = items[id];
|
||||
|
||||
if( obj ) {
|
||||
|
||||
if( obj.icon ) {
|
||||
|
||||
$this.css({
|
||||
"background-image": "url(http://wow.zamimg.com/images/wow/icons/medium/"+ obj.icon +".jpg)"
|
||||
});
|
||||
}
|
||||
|
||||
if( obj.stack ) {
|
||||
|
||||
$this.append("<span class='stack'>"+obj.stack+"</span>");
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$wowIcons.on("mouseover.wow", function(e) {
|
||||
|
||||
var $this = $(this);
|
||||
var $html;
|
||||
|
||||
if( !lastHovered || !lastHovered.is( $this ) ) {
|
||||
|
||||
var id = $this.data("item-id");
|
||||
$html = $( template(items[id]) );
|
||||
|
||||
$body.find(".wow-item").remove();
|
||||
$body.append( $html );
|
||||
|
||||
$html.css({
|
||||
left: e.clientX + 20,
|
||||
top: e.clientY - 10
|
||||
});
|
||||
|
||||
lastHovered = $this;
|
||||
|
||||
} else {
|
||||
$html = $(".wow-item");
|
||||
}
|
||||
|
||||
setTimeout(function() {
|
||||
$html.removeClass("hidden");
|
||||
},10);
|
||||
|
||||
$this.on("mousemove.wow", function(e) {
|
||||
$html.css({
|
||||
left: e.clientX + 20,
|
||||
top: e.clientY - 30
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$wowIcons.on("mouseout.wow",function(e) {
|
||||
$body.find(".wow-item").addClass("hidden");
|
||||
$(this).off("mousemove.wow");
|
||||
});
|
||||
|
||||
$body.on("mouseover.wow", ".wow-item" , function(e) {
|
||||
//$(this).removeClass("hidden");
|
||||
});
|
||||
|
||||
$body.on("mouseout.wow", ".wow-item" , function(e) {
|
||||
$(this).addClass("hidden");
|
||||
});
|
||||
|
||||
/*var example = {
|
||||
|
||||
// most values can be left blank
|
||||
// or omitted if they aren't needed.
|
||||
|
||||
"example": {
|
||||
|
||||
icon: "icon_name"
|
||||
quality: "trash",
|
||||
name: "Example Tooltip",
|
||||
binds: "when picked up",
|
||||
unique: true,
|
||||
slot: "Two-Hand",
|
||||
type: "Axe",
|
||||
|
||||
damage: {
|
||||
min: 25,
|
||||
max: 39,
|
||||
// extras is for stuff like additional fire dmg
|
||||
extras: {
|
||||
min: [],
|
||||
max: []
|
||||
},
|
||||
speed: 2.50
|
||||
},
|
||||
|
||||
stats: [
|
||||
{ stat: "Agility", value: 4, type: "primary" },
|
||||
{ stat: "Stamina", value: 4, type: "primary" },
|
||||
{ stat: "Hit", value: 4, type: "secondary" },
|
||||
{ stat: "Haste", value: 4, type: "secondary" }
|
||||
],
|
||||
|
||||
enchantments: {
|
||||
|
||||
enchants: [
|
||||
{ description: "Flametongue" }
|
||||
],
|
||||
|
||||
sockets: [
|
||||
{ color: "red" },
|
||||
{ color: "blue" },
|
||||
{ color: "yellow" },
|
||||
{ color: "meta" },
|
||||
{ color: "prismatic" }
|
||||
],
|
||||
|
||||
socketBonus: "+12 Haste"
|
||||
|
||||
},
|
||||
|
||||
durability: 65,
|
||||
|
||||
chanceOnHit: [
|
||||
{ description: "Strike an enemy for an additional 2 fire damage." },
|
||||
{ description: "Explode." }
|
||||
],
|
||||
|
||||
classes: [ "Warrior", "Paladin", "Death Knight" ],
|
||||
|
||||
level: 14,
|
||||
ilevel: 19,
|
||||
|
||||
bonuses: [
|
||||
{ description: "Equip: Increases your PVP Power by 10." },
|
||||
{ description: "Use: Summon a basilisk as a buddy for 10 seconds." }
|
||||
]
|
||||
|
||||
}
|
||||
|
||||
};*/
|
||||
4608
mojotrollz/page/default_item/js/handlebars-v4.0.5.js
Normal file
4608
mojotrollz/page/default_item/js/handlebars-v4.0.5.js
Normal file
File diff suppressed because one or more lines are too long
180
mojotrollz/page/default_item/tpl/default_item.tpl
Normal file
180
mojotrollz/page/default_item/tpl/default_item.tpl
Normal file
@ -0,0 +1,180 @@
|
||||
<head>
|
||||
${css}
|
||||
</head>
|
||||
<boddy>
|
||||
<header class="page">
|
||||
<h2>Warcraft Tooltips</h2>
|
||||
<h3>with css, handlebars and some jQuery</h3>
|
||||
</header>
|
||||
|
||||
<div class="bag">
|
||||
|
||||
<header>Backpack</header>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="hearthstone">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="shiny-red-apple">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="melon-juice">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="red-linen-shirt">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="medicine-staff-of-the-monkey">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="hoggers-trousers">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="deepdive-helmet">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="hanzo-sword">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="boots-of-the-petrified-forest">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="the-2-ring">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="dragonwrath-tarecgosas-rest">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="green-hills-of-stranglethorn-11">
|
||||
</i>
|
||||
|
||||
<i class="wow-icon"
|
||||
data-item-id="hopeglow-spaulders">
|
||||
</i>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script id="wow-item-template" type="text/x-handlebars-template">
|
||||
|
||||
<aside class="wow-item hidden" data-quality="{{ quality }}">
|
||||
<header class="wow-item__header">
|
||||
<p class="header__title">{{ name }}</p>
|
||||
{{#if binds}}<p class="header__binds">Binds {{ binds }}</p>{{/if}}
|
||||
{{#if unique}}
|
||||
<p class="header__unique">Unique</p>
|
||||
{{/if}}
|
||||
</header>
|
||||
<section class="wow-item__type">
|
||||
<p class="type__slot">{{slot}}</p>
|
||||
<p class="type__item">{{type}}</p>
|
||||
</section>
|
||||
<section class="wow-item__stats">
|
||||
|
||||
{{#if damage}}
|
||||
<p class="stats__damage-armor"><span class="value">{{ damage.min }} - {{damage.max}}</span> Damage</p>
|
||||
<p class="stats__speed">Speed <span class="value">{{ speed damage.speed }}</span></p>
|
||||
<p class="stats__dps">(<span class="value">{{ dps damage }}</span> damage per second)</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if armor}}
|
||||
<p class="stats__armor">{{ armor }} Armor</p>
|
||||
{{/if}}
|
||||
|
||||
<div class="stats__list">
|
||||
{{#each stats}}
|
||||
<p class="stats__{{ type }} stats__list-item">+{{ value }} {{ stat }}</p>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
{{#if enchantments}}
|
||||
<section class="wow-item__enchantments">
|
||||
|
||||
{{#each enchantments.enchants}}
|
||||
<p class="enchantments__enchant">{{ description }}</p>
|
||||
{{/each}}
|
||||
|
||||
<div class="enchantments__sockets">
|
||||
|
||||
{{#each enchantments.sockets }}
|
||||
<p class="enchantments__socket socket--{{ color }}">{{ color }} socket</p>
|
||||
{{/each}}
|
||||
|
||||
{{#if enchantments.socketBonus}}
|
||||
<p class="enchantments__socket-bonus">Socket Bonus: {{ enchantments.socketBonus }}</p>
|
||||
{{/if}}
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
{{/if}}
|
||||
|
||||
<section class="wow-item__info">
|
||||
|
||||
{{#if durability}}
|
||||
<p class="info__durability">Durability: {{ durability }} / {{ durability }}</p>
|
||||
{{/if}}
|
||||
|
||||
{{#each chanceOnHit}}
|
||||
<p class="info__chance-on-hit">Chance on hit: {{ description }}</p>
|
||||
{{/each}}
|
||||
|
||||
{{#if classes}}
|
||||
<p class="info__class-requirement">Classes: <span class="value">{{ classes classes }}</span></p>
|
||||
{{/if}}
|
||||
|
||||
{{#if level}}
|
||||
<p class="info__level-requirement">Requires Level {{ level }}</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if ilevel}}
|
||||
<p class="info__item-level">Item Level {{ ilevel }}</p>
|
||||
{{/if}}
|
||||
|
||||
</section>
|
||||
|
||||
{{#if bonuses}}
|
||||
<section class="wow-item__bonuses">
|
||||
{{#each bonuses}}
|
||||
<p class="bonuses__bonus">{{ description }}</p>
|
||||
{{/each}}
|
||||
</section>
|
||||
{{/if}}
|
||||
|
||||
<section class="wow-item__info">
|
||||
|
||||
{{#if tradelevel }}
|
||||
<p class="info__trade-level">Requires {{ tradelevel.trade }} ({{ tradelevel.level }})</p>
|
||||
{{/if}}
|
||||
|
||||
{{#if flavour }}
|
||||
<p class="info__flavour-text">"{{ flavour }}"</p>
|
||||
{{/if}}
|
||||
|
||||
</section>
|
||||
|
||||
</aside>
|
||||
|
||||
</script>
|
||||
${js}
|
||||
</boddy>
|
||||
@ -27,4 +27,7 @@ class page_mojotrollz extends \SYSTEM\API\api_default {
|
||||
|
||||
public static function page_article($id){
|
||||
return (new default_article($id))->html();}
|
||||
|
||||
public static function page_item(){
|
||||
return (new default_item())->html();}
|
||||
}
|
||||
@ -1,3 +1,10 @@
|
||||
auxiliary.org-netbeans-modules-css-prep.less_2e_compiler_2e_options=
|
||||
auxiliary.org-netbeans-modules-css-prep.less_2e_enabled=false
|
||||
auxiliary.org-netbeans-modules-css-prep.less_2e_mappings=/less:/css
|
||||
auxiliary.org-netbeans-modules-css-prep.sass_2e_compiler_2e_options=
|
||||
auxiliary.org-netbeans-modules-css-prep.sass_2e_configured=true
|
||||
auxiliary.org-netbeans-modules-css-prep.sass_2e_enabled=false
|
||||
auxiliary.org-netbeans-modules-css-prep.sass_2e_mappings=/scss:/css
|
||||
auxiliary.org-netbeans-modules-php-smarty.smarty-framework=true
|
||||
include.path=${php.global.include.path}
|
||||
php.version=PHP_56
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user