First, before I forget, the inspiration for this block is here: http://bollklubben.mine.nu/Community/
I can't read a word of that, but it's pretty. :)
Anyway, here is a block to display WoW progress that is easily customizable for new content.
// SMF-TinyPortal WoW Progress Block - ver. 0.1
// Author: Raugturi (Raugturi@gmail.com)
// Created: April 02, 2009
// Last Update: April 02, 2009
// Code to display Boss Progress for multiple instances for WoW.
// Lists each instance you define (in the order you define them)
// as well as counts for currently cleared/total bosses for that instance.
// Tooltip on mouseover shows list of bosses with strikethrough over
// the cleared ones.
//
// Requires wz_tooltip to be loaded in the page
// http://www.walterzorn.com/tooltip/tooltip_e.htm
// ******************
// * Config Section *
// ******************
// Progress Page: Path to Progress page if you have one and want
// to link to it. Using javascript:void(0); will cause the links
// to be disabled but still allow the tooltip. If you want them to
// look like the rest of your links you will also want to remove
// this: style="text-decoration: none;" in the code at the bottom.
$progress_page = 'javascript:void(0);';
// Instance Arrays
// Variables:
// Name - Type: Text, Value: Instance name
// Bosses - Type: Array, Element Format: Key = Name, Value = Boolean (true=cleared,false=not cleared)
$instancelist = array(
array(
'name' => 'Naxxramas-10',
'bosses' => array(
'AnubÃ,´Rekhan' => true,
'Grand Widow Faerlina' => true,
'Maexxna' => true,
'Noth the Plaguebringer' => true,
'Heigan the Unclean' => true,
'Loatheb' => true,
'Instructor Razuvious' => true,
'Gothik the Harvester' => true,
'The Four Horsemen' => true,
'Patchwerk' => true,
'Grobbulus' => true,
'Gluth' => true,
'Thaddius' => true,
'Sapphiron' => true,
'KelÃ,´Thuzad' => true)),
array(
'name' => 'Naxxramas-25',
'bosses' => array(
'AnubÃ,´Rekhan' => true,
'Grand Widow Faerlina' => true,
'Maexxna' => true,
'Noth the Plaguebringer' => true,
'Heigan the Unclean' => true,
'Loatheb' => true,
'Instructor Razuvious' => true,
'Gothik the Harvester' => true,
'The Four Horsemen' => true,
'Patchwerk' => true,
'Grobbulus' => true,
'Gluth' => true,
'Thaddius' => true,
'Sapphiron' => true,
'KelÃ,´Thuzad' => true)),
array(
'name' => 'Eye of Eternity-10',
'bosses' => array(
'Malygos' => true)),
array(
'name' => 'Eye of Eternity-25',
'bosses' => array(
'Malygos' => true)),
array(
'name' => 'Obsidian Sanctum-10',
'bosses' => array(
'Sartharion' => true,
'Sartharion + 1 Drake' => true,
'Sartharion + 2 Drakes' => true,
'Sartharion + 3 Drakes' => false)),
array(
'name' => 'Obsidian Sanctum-25',
'bosses' => array(
'Sartharion' => true,
'Sartharion + 1 Drake' => true,
'Sartharion + 2 Drakes' => true,
'Sartharion + 3 Drakes' => false)),
array(
'name' => 'Vault of Archavon-10',
'bosses' => array(
'Archavon the Stone Watcher' => true)),
array(
'name' => 'Vault of Archavon-25',
'bosses' => array(
'Archavon the Stone Watcher' => true))
);
//**********************
//* END Config Section *
//**********************
//*********************************
//* Do not edit below here unless *
//* you know what you are doing!! *
//*********************************
echo '
<table width="100%">';
foreach ($instancelist as $instance) {
// Used to display overall progress in front of instance name.
$clear_count = 0;
$total_count = 0;
$tooltip = '<table width=100% cellpadding=0 cellspacing=0>';
foreach ($instance['bosses'] as $key => $value) {
$tooltip .= '<tr><td>';
if ($value) {
++$clear_count;
$tooltip .= '<s>' . $key . '</s>';
} else {
$tooltip .= $key;
}
$tooltip .= '</td></tr>';
++$total_count;
}
$tooltip .= '</table>';
echo '
<tr><td><a style="text-decoration: none;" href="' . $progress_page . '" onmouseover="Tip(\'' . $tooltip . '\')" onmouseout="UnTip()">[' . $clear_count . '/' . $total_count . '] ' . $instance['name'] . '</a></td></tr>';
}
echo '
<tr><td align="center"><hr /><font size="-2">Mouseover instance<br />for details.</font></td></tr>
</table>
';
Hopefully the array definitions are fairly straightforward. I suck at comments.
Based off the same code as my Recruitment block here:
http://www.tinyportal.net/index.php/topic,19751.msg232164.html#msg232164
If you want to see it in action, check out my guild's new website (a work in progress):
http://www.summit-wow.com/
That is some awesome blocks!
BUT OMG How did you get that DKP link working like that to show with using the forum headers/footer style! I so can't figure that out and I would love to be able to have that function on my website. Can you share :D :D
Quote from: GreenX on April 03, 2009, 10:36:29 AM
That is some awesome blocks!
BUT OMG How did you get that DKP link working like that to show with using the forum headers/footer style! I so can't figure that out and I would love to be able to have that function on my website. Can you share :D :D
Create new HTML article in TP
Use:
<iframe id="myframe" src="/your_EQDKP_Path/" marginwidth="0" marginheight="0" vspace="0" hspace="0" scrolling="no" width="100%" frameborder="0">none</iframe>
Additionally with that code you can put:
<script type="text/javascript">
/***********************************************
* IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/
//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
var iframeids=["myframe"]
//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}
function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}
function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}
function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
</script>
So the complete code is:
<script type="text/javascript">
/***********************************************
* IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/
//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
var iframeids=["myframe"]
//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}
function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}
function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}
function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
</script>
<iframe id="myframe" src="/your_EQDKP_Path/" marginwidth="0" marginheight="0" vspace="0" hspace="0" scrolling="no" width="100%" frameborder="0">none</iframe>
Don't forget to change the path in the iframe tag
Quote from: GreenX on April 03, 2009, 10:36:29 AM
That is some awesome blocks!
BUT OMG How did you get that DKP link working like that to show with using the forum headers/footer style! I so can't figure that out and I would love to be able to have that function on my website. Can you share :D :D
Thanks! And I did exactly what Inny said pretty much. The only change I had to make was to add an onload to the iframe telling it to call the resizeCaller function. For some reason when I first went to the site it wouldn't resize, but then using back/forward would get it to jump to the right height. Adding the resize call on the iframe onload fixed it though.
Once you get that working just modify the DKP system to not display its own headers and logos and crap. My next goal is to use the integration hooks to automatically log users into the DKP page when they login to SMF and grant anyone who is an admin on the forum admin priveledges in eqDKP-plus as well. It's umm...not going well so far.
If I could ask how did you make the it so all the links inside your iframe stay inside the frame? When I do the above and I click on any member or top menu part of eqdkp it jumps me out and away from SMF unlike your, Im pretty sure there are some files I need to mod in eqdkp but I dunno which ones or the code.
Thanks!
its in eqdkp.php dont remember where, i will find out and reply to your PM.
It works! I am so in your debt!
Quote from: Raugturi on April 03, 2009, 07:50:21 PM
My next goal is to use the integration hooks to automatically log users into the DKP page when they login to SMF and grant anyone who is an admin on the forum admin priveledges in eqDKP-plus as well. It's umm...not going well so far.
Much more easier since you already removed the headers and footer to implement a block to only shown for admins with the EQDKP menu. That will need some php includes i guess but instead of messing with fetching the membergroups from smf tables is better to use the TP block instead.
Or you can do it simpler and just use admin links in the block using (above Iframe script is needed):
<a href="javascript:loadintoIframe('myframe', 'external.htm')">Link</a>
Those are just my ideas, im using EQDKP the last 3 years and i never had anyone with an account besides me and the DKP Officer. (pretty much useless for me to have accounts for guild members :P)
Quote from: GreenX on April 03, 2009, 09:35:53 PM
It works! I am so in your debt!
No problem.
I just hate beeing a newb..
But i made a PHP block in TP and downloaded that tooltip thing, but i just can't figure out where the hell to put that line it says i should put in some file at the start of the Body tag.
Cuz i can't find any body tacs :O!
CAll me a newb, but i just started using TP today! :)
Quote from: Kazie on April 12, 2009, 07:33:53 PM
I just hate beeing a newb..
But i made a PHP block in TP and downloaded that tooltip thing, but i just can't figure out where the hell to put that line it says i should put in some file at the start of the Body tag.
Cuz i can't find any body tacs :O!
CAll me a newb, but i just started using TP today! :)
I'm assuming you mean where to put the links to the javascript that comes with the WoW Tooltip mod for SMF. If so, you go to your Templates section, Modify Themes, find your them and click to browse the files. Index.template.php is the one to edit.
Very Nice Raugturi :)
How can you change the color of the text in the popup when you mouseover the instances?
with my current theme it is very very hard to read with the text color.
ah nvm found it in the wz tooltip js file
Where is Ignis the Furnace Master?
Quote from: Starrbuck on May 28, 2009, 07:00:52 PM
Where is Ignis the Furnace Master?
Just across the hall from Razorscale. After you kill Leviathan go down the hall, he's the first door on the left. But watch out as you round the corner. He's got some scary fire-rock giant type friends guarding the door. ;D
To add him (and all the other Ulduar bosses) to the progression block, you just make a new Array for it, just like the Naxx ones.
So just after $instancelist = array( on the next line put in something like this:
array(
'name' => 'Ulduar-25',
'bosses' => array(
'Flame Leviathan' => true,
'Ignis the Furnace Master' => true,
'Razorscale' => true,
'XT-002 Deconstructor' => true,
'The Assembly of Iron' => true,
'Kologarn' => true,
'Auriaya' => true,
'Freya' => true,
'Thorim' => true,
'Hodir' => true,
'Mimiron' => true,
'General Vezax' => false,
'Yogg-Saron' => false,
'Algalon the Observer' => false)),You can also remove any of the instance arrays you don't want listed. The script just loops through whatever arrays you define and displays the value you give for "name" in the list and the bosses you define below it in the tooltip (with strikethrough if set to true, indicating you've killed them). The numbers are calculated based on the number of entries in the array and how many of them are marked as true.
LOL! No, I know where Ignis is in-game, just wondering why he wasn't in the block.
Thanks for explaining how to add him.
Ok, noob question. This should be in a PHPblock, correct? My block is displaying fine, but the mouse over isn't working. Any help is appreciated.
The tooltip requires wz_tooltip.
http://www.walterzorn.com/tooltip/tooltip_e.htm
Ah, that would explain it. Many thanks!
Edit: On mouseover the popup appears but is empty. Any suggestions?
Quote from: Railhead on July 03, 2009, 07:30:46 PM
Edit: On mouseover the popup appears but is empty. Any suggestions?
Two posts up...
Quote from: Raugturi on May 30, 2009, 04:16:06 AM
The tooltip requires wz_tooltip.
http://www.walterzorn.com/tooltip/tooltip_e.htm
Yeah I have that already, apparently im slightly retarded and the boxes aren't empty, they are just so light in color that I can barely see them on my screen. /facepalm I was checking it on another computer and I can see them fine. Now looking on my computer very closely I can see it.
So I guess my next question would be does any have an idea on how to change the colors so that it is more noticeable?
Quote from: Railhead on July 04, 2009, 08:52:36 AM
So I guess my next question would be does any have an idea on how to change the colors so that it is more noticeable?
You need to spend some time reading the instructions:
http://www.walterzorn.com/tooltip/tooltip_e.htm
It's beyond the scope of what we support here, but if you look at my home page, under the left block
Zetan's Choice Cuts / Current Choice Cuts, You'll see that I've used it to good effect, it needs a little work.
Here's the format of the code for that section of the block.
Note, I have formatted it my way, it's not necessarily the best way for you because I've incorporated it into List Items with formatted bullet points, but you'll get the general idea for borders, colors and opacity.
// sample from list item 4
<li onmouseover="TagToTip('Span4',
TITLE, 'NAPALM DEATH - Time Waits For No Slave',
TITLEFONTCOLOR, '#AFAFAF',
TITLEFONTFACE, 'Verdana,sans-serif',
TITLEBGCOLOR, '#76010C',
TITLEALIGN, 'center',
TITLEFONTSIZE, '14px',
CLOSEBTN, true,
CLOSEBTNTEXT, 'X',
CENTERWINDOW, true, CENTERALWAYS, true,
SHADOW, true,
SHADOWCOLOR, '#0F0F0F',
SHADOWWIDTH, 2,
FONTCOLOR, '#AFAFAF',
BGCOLOR, '#2F2F2F',
BGIMG, ' ',
BORDERCOLOR, '#76010C',
DELAY, '500',
FADEIN, '200',
FADEOUT, '500',
STICKY, 'true',
HEIGHT, '-200',
WIDTH, '-300',
OPACITY, '95',
PADDING, 10)"
onmouseout="UnTip()">NAPALM DEATH - Time Waits For No Slave</li>
<span id="Span4">
27 years of grindcore ultra-violence, 27 years of being one of the hardest working, hardest touring bands on this miserable planet, NAPALM DEATHââ,¬â,,¢s conviction, energy and belief in spontaneoust, outspoken yet extreme music is far from being watered down. ââ,¬Å"Time Waits For No Slaveââ,¬Â, the bandââ,¬â,,¢s 13th studio album (excluding the cover album ââ,¬Å"Leaders Not Followers Pt.2ââ,¬Â) marks no exception ââ,¬â€œ as long as this is a world gone wrong, NAPALM DEATH will be utilizing their artistic arsenal to attack those in charge, no matter if their fanaticism stems from a political, religious or simply greedy motivation.
<br /><br />
On ââ,¬Å"Time Waits For No Slaveââ,¬Â the legendary fathers of grindcore explore fundamental aspects of our so-called modern life and point out that ideas of servitude are still existent in the allegedly tolerant, liberal society we live in. Despite the old cliché that ââ,¬Å"we are living in the 21st centuryââ,¬Â for one thing, women are still sneered at, treated like second-class citizens and viewed in some quarters as baby machines rather than beings in their own right. Giving up our own ideals, wishes and desires to fit into the all too tight conventions still prevalent today might be a very general sounding subject, but the question is: if our freedom is true to the meaning of the word, this is something that affects us all!
</span>
// Prompt Text
<div align="center" style="padding: 2px; color: #4F4F4F;" class="smalltext">Hover titles for more info.<br /></div>
<hr />
</div>
// About section
<a href="/index.php" onmouseover="TagToTip('Span6',
TITLE, 'About our Amazon Player',
TITLEFONTCOLOR, '#000000',
TITLEBGCOLOR, '#017611',
TITLEALIGN, 'center',
TITLEFONTSIZE, '14px',
CLOSEBTN, true,
CLOSEBTNTEXT, 'X',
CENTERWINDOW, true, CENTERALWAYS, true,
SHADOW, true,
SHADOWCOLOR, '#0F0F0F',
SHADOWWIDTH, 2,
FONTSIZE, '12px',
FONTCOLOR, '#AFAFAF',
BGCOLOR, '#2F2F2F',
BORDERCOLOR, '#017611',
DELAY, '500',
FADEIN, '200',
FADEOUT, '500',
STICKY, 'true',
HEIGHT, '-200',
WIDTH, '-250',
OPACITY, '95',
PADDING, 10)"
onmouseout="UnTip()"><div align="center" style="padding: 2px;" class="smalltext"><strong>About</strong><br /></div></a>
<span id="Span6">
Each month, members can <a href='/?action=post;topic=2384.0' title='Click to post your selection | Members only.' alt='Click to post your selection | Members only.'><u>Post</u></a> a selection of 5 albums with 30 second samples from Amazon.
<br /><br />
We will add the selections to the player for you to preview here.
<br /><br />
Purchases made from Amazon using our Affiliate Links contribute to the running costs of this site.
<br /><br />
-Zetan
</span>
</ul>
I don't want this topic to stray too far OFF TOPIC, so I suggest that you read their doc's.
I want to use this on my wordpress blog. Does anyone here know how I could port that over so I could use it as a sidebar widget in wordpress?
Again, this is not a WP forum, you have t sek help from WP.