Page Index Toggle Pages: 1 2 [3] 4  Send TopicPrint
Very Hot Topic (More than 25 Replies) CSS Buttons 4 YaBB 2.4 (and 2.3.1) (beta 0.1.5) (Read 1603 times)
Cable
Junior Member
**
Offline


I love YaBB 1G - SP1.2!

Posts: 97
Joined: Sep 28th, 2007
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #30 - May 4th, 2009 at 12:58am
Print Post  
That 'splains that.  I use FF 3.0

  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #31 - May 11th, 2009 at 11:42pm
Print Post  
There seems to be some confusion about how this mod works - so let me try to explain the basics:

Problem to solve: When using "Buttons only" we need more than 70 graphics. If you want a different look of your buttons you'll have to create 70 new graphics. For every language you want to add to your forum you also need 70 new graphics. "CSS Buttons" can do all that with what we already have + 2 new graphics. Meaning we can actually get rid of all the buttons th the "yabbfiles/Buttons/English" folder (and any other language folders too).

Basically a YaBB Button consists of 3 elements:

- an icon
- a text
- a body

The icons and text are different for each button while the body is the same with the exception of the width.

We already have all the icons in the default template folder and all the text in the Menu language file - all we need is a flexible body. This problem is solved by 'breaking' the body graphic into two parts - one left part and one right part - and make them "slide" into the needed size. Now we have all 3 elements and all we need to do is to have the script combine them in the right way. The two body parts are used as background images and the icon and text are placed on top of them and voila: A Button is born.

The button parts must be stored in the "yabbfiles/Buttons" folder (not in a language sub folder!!). To make sure the button parts are combined in correct pairs they must have the same name with different additions "_left" and "_right" - see attached example.

So far so good.

In YaBB we have 3 different menu modes: "Icon + Text", "Text only" and "Buttons Only". These modes are defined in 3 different files: Menu0.def, Menu1.def and Menu2.def. Icons and text are in use in the first two modes and Buttons are used in the third mode. Now that CSS Buttons re-use the same text and icon elements for buttons as the other two modes, why not boile all 3 definition files down to just one - I give you: The "Menu.def" file!!

Now to the 'heavy duty serious' part. This is where my limited english vocabulary comes to it's test. Lets break down one of the existing definitions - The "Home" menu item from the "Menu0.def" file. A Hash structure is used to store the definitions. For speed and read/write reasons i've chosen to format the new definitions using a comma to separate the key and value parts and pipes to separate the value elements.

Code
Select All
'home' => "<img src=\"$imagesdir/home.$imgext\" alt=\"$img_txt{'103'}\" border=\"0\" /> <span class=\"imgmenu\">$img_txt{'103'}</span>", 


As you can tell the 'key' for this element is 'home' - let's take out that one:

home

Next you see the icon in the img tag used here is "home.gif" ($imgext = 'gif') - we take only the name out as all icons are .gif - and add it to what we already have using a comma as separator as explained above:

home,home

Now we need the text for the menu item. Here it's found inside the span tag: $img_txt{'103'}. To save it in a file read/write friendly format we split it up in two - the name: img_txt and the key: 103 - again we add them to what we have, this time using pipes as already explained:

home,home|img_txt|103

The next information we need is the 'alt/title' text.Very often the same as the menu item text in which case you can leave them out - but not the pipes!! For the example we choose to add them here - same format as the text:

home,home|img_txt|103|img_txt|103

Almost there! We now want the css class for this item - in this case the 'imgmenu' selector - add it:

home,home|img_txt|103|img_txt|103|imgmenu

Finally - pew! We need to tell the script wether this is an item from the existing template or if it comes from a mod: "tmp" for template or "mod" for - guess what...

home,home|img_txt|103|img_txt|103|imgmenu|tmp

If the icon comes from a mod, it's should be stored in a "yabbfiles/ModImages" sub folder. In this case we need to add that sub folder to the the icon name. Example from YaMMS mod where the "map.gif" is stored in the "yamms" sub folder:

membermap,yamms/map|maptxt|01|||imgmenu|mod

In this example the observant reader will notice that the item text alt/title text is the same.

Now we have what could be seen as the lowest common denominator for all 3 menu modes and the "Menu.pl" script will combine the elements according to the selected mode. That's all folks!!
  

Button22green_left.png ( 0 KB | Downloads )
Button22green_left.png
Button22green_right.png ( 0 KB | Downloads )
Button22green_right.png

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Cable
Junior Member
**
Offline


I love YaBB 1G - SP1.2!

Posts: 97
Joined: Sep 28th, 2007
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #32 - May 12th, 2009 at 12:00am
Print Post  
Thanks for that great (and easy) explanation, Carsten.

Quote:
This is where my limited english vocabulary comes to it's test.


Huh Nothing wrong with your English.  It's almost perfect!  Better than mine at times  Grin Grin
  
Back to top
 
IP Logged
 
Derek Barnstorm
God Member
*****
Offline



Posts: 1146
Location: Warwickshire
Joined: Mar 23rd, 2008
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #33 - May 12th, 2009 at 5:29pm
Print Post  
Thanks for the post Carsten... I'm getting it now, it is a rather brilliant Mod.

I was thinking that I might have to add those three lines to Menu.def for extra contact buttons too, but obviously I haven't.

There is a slight conflict with adding new contact buttons/info though...

The CSS Buttons Mod searches and replaces this in Load.pl:

Code
Select All
<search for>
		$yimimg = qq~<img src="$yyhtml_root/Buttons/$language/yim.png" alt="${$uid.$user}{'yim'}" title="${$uid.$user}{'yim'}" border="0" />~;
		$aimimg = qq~<img src="$yyhtml_root/Buttons/$language/aim.png" alt="${$uid.$user}{'aim'}" title="${$uid.$user}{'aim'}" border="0" />~;
		$skypeimg = qq~<img src="$yyhtml_root/Buttons/$language/skype.png" alt="${$uid.$user}{'skype'}" title="${$uid.$user}{'skype'}" border="0" />~;
		$myspaceimg = qq~<img src="$yyhtml_root/Buttons/$language/myspace.png" alt="${$uid.$user}{'myspace'}" title="${$uid.$user}{'myspace'}" border="0" />~;
		$facebookimg = qq~<img src="$yyhtml_root/Buttons/$language/facebook.png" alt="${$uid.$user}{'facebook'}" title="${$uid.$user}{'facebook'}" border="0" />~;
		$msnimg = qq~<img src="$yyhtml_root/Buttons/$language/msn.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$themsnname" title="$themsnname" border="0" />~;
		$gtalkimg = qq~<img src="$yyhtml_root/Buttons/$language/gtalk.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$thegtalkname" title="$thegtalkname" border="0" />~;
		$icqimg = qq~<img src="$yyhtml_root/Buttons/$language/icq.png" alt="${$uid.$user}{'icq'}" title="${$uid.$user}{'icq'}" border="0" />~;
</search for>

<replace>
		if($cssbuttons) {
			$viewstyleleft = qq~style="height: 20px; border: 0px; margin: 1px 1px; background-position: top left; background-repeat: no-repeat; text-decoration: none; font-size: 18px; vertical-align: top; cursor: pointer; display: inline-block;"~;
			$viewstyleright = qq~style="height: 20px; border: 0px; margin: 0px; background-position: top right; background-repeat: no-repeat; text-decoration: none; font-size: 18px; vertical-align: top; display: inline-block;"~;
			$viewstyleimage = qq~height: 20px; border: 0px; margin: 0px; background-repeat: no-repeat; vertical-align: top; text-decoration: none; font-size: 18px; display: inline-block;~;
			$viewstyletext = qq~style="height: 20px; border: 0px; margin: 0px; padding: 0px; text-align: left; text-decoration: none; vertical-align: top; white-space: nowrap; display: inline-block;"~;
			$yimmsgimagedir = $imagesdir; if(!-e("$yimmsgimagedir/yim.gif")) { $yimmsgimagedir = $defaultimagesdir; }
			$aimmsgimagedir = $imagesdir; if(!-e("$aimmsgimagedir/aim.gif")) { $aimmsgimagedir = $defaultimagesdir; }
			$skymsgimagedir = $imagesdir; if(!-e("$skymsgimagedir/skype.gif")) { $skymsgimagedir = $defaultimagesdir; }
			$myspacemsgimagedir = $imagesdir; if(!-e("$myspacemsgimagedir/myspace.gif")) { $myspacemsgimagedir = $defaultimagesdir; }
			$facebookmsgimagedir = $imagesdir; if(!-e("$facebookmsgimagedir/facebook.gif")) { $facebookmsgimagedir = $defaultimagesdir; }
			$msnmsgimagedir = $imagesdir; if(!-e("$msnmsgimagedir/msn3.gif")) { $msnmsgimagedir = $defaultimagesdir; }
			$gtkmsgimagedir = $imagesdir; if(!-e("$gtkmsgimagedir/gtalk2.gif")) { $gtkmsgimagedir = $defaultimagesdir; }
			$icqmsgimagedir = $imagesdir; if(!-e("$icqmsgimagedir/icqadd.gif")) { $icqmsgimagedir = $defaultimagesdir; }
			$yimimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'yim'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($yimmsgimagedir/yim.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>YIM</span></span></span></span>~;
			$aimimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'aim'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($aimmsgimagedir/aim.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>AIM</span></span></span></span>~;
			$skypeimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'skype'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($skymsgimagedir/skype.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Skype</span></span></span></span>~;
			$myspaceimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'myspace'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($myspacemsgimagedir/myspace.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Myspace</span></span></span></span>~;
			$facebookimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'facebook'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($facebookmsgimagedir/facebook.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Facebook</span></span></span></span>~;
			$msnimg = qq~<span class="buttonleft" $viewstyleleft title="$themsnname" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($msnmsgimagedir/msn3.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>MSN</span></span></span></span>~;
			$gtalkimg = qq~<span class="buttonleft" $viewstyleleft title="$thegtalkname" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($gtkmsgimagedir/gtalk2.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Gtalk</span></span></span></span>~;
			$icqimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'icq'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($icqmsgimagedir/icqadd.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>ICQ</span></span></span></span>~;
		}
		else {
			$yimimg = qq~<img src="$yyhtml_root/Buttons/$language/yim.png" alt="${$uid.$user}{'yim'}" title="${$uid.$user}{'yim'}" border="0" />~;
			$aimimg = qq~<img src="$yyhtml_root/Buttons/$language/aim.png" alt="${$uid.$user}{'aim'}" title="${$uid.$user}{'aim'}" border="0" />~;
			$skypeimg = qq~<img src="$yyhtml_root/Buttons/$language/skype.png" alt="${$uid.$user}{'skype'}" title="${$uid.$user}{'skype'}" border="0" />~;
			$myspaceimg = qq~<img src="$yyhtml_root/Buttons/$language/myspace.png" alt="${$uid.$user}{'myspace'}" title="${$uid.$user}{'myspace'}" border="0" />~;
			$facebookimg = qq~<img src="$yyhtml_root/Buttons/$language/facebook.png" alt="${$uid.$user}{'facebook'}" title="${$uid.$user}{'facebook'}" border="0" />~;
			$msnimg = qq~<img src="$yyhtml_root/Buttons/$language/msn.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$themsnname" title="$themsnname" border="0" />~;
			$gtalkimg = qq~<img src="$yyhtml_root/Buttons/$language/gtalk.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$thegtalkname" title="$thegtalkname" border="0" />~;
			$icqimg = qq~<img src="$yyhtml_root/Buttons/$language/icq.png" alt="${$uid.$user}{'icq'}" title="${$uid.$user}{'icq'}" border="0" />~;
		}
</replace> 



Because there has to be a new line added for each new contact info, the YouTube, Twitter, XFire etc Mods can't find the line searched for in Load.pl because your Mod indents them further for the else statement. It might not look as readable, but if you changed that step to the following, then it wouldn't conflict with Contact Mods, and all I would have to do is make a one step patch for each Contact Mod to add a line for the CSS Buttons (rather than a whole separate Mod to make them compatible).

Code
Select All
<search for>
		$yimimg = qq~<img src="$yyhtml_root/Buttons/$language/yim.png" alt="${$uid.$user}{'yim'}" title="${$uid.$user}{'yim'}" border="0" />~;
		$aimimg = qq~<img src="$yyhtml_root/Buttons/$language/aim.png" alt="${$uid.$user}{'aim'}" title="${$uid.$user}{'aim'}" border="0" />~;
		$skypeimg = qq~<img src="$yyhtml_root/Buttons/$language/skype.png" alt="${$uid.$user}{'skype'}" title="${$uid.$user}{'skype'}" border="0" />~;
		$myspaceimg = qq~<img src="$yyhtml_root/Buttons/$language/myspace.png" alt="${$uid.$user}{'myspace'}" title="${$uid.$user}{'myspace'}" border="0" />~;
		$facebookimg = qq~<img src="$yyhtml_root/Buttons/$language/facebook.png" alt="${$uid.$user}{'facebook'}" title="${$uid.$user}{'facebook'}" border="0" />~;
		$msnimg = qq~<img src="$yyhtml_root/Buttons/$language/msn.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$themsnname" title="$themsnname" border="0" />~;
		$gtalkimg = qq~<img src="$yyhtml_root/Buttons/$language/gtalk.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$thegtalkname" title="$thegtalkname" border="0" />~;
		$icqimg = qq~<img src="$yyhtml_root/Buttons/$language/icq.png" alt="${$uid.$user}{'icq'}" title="${$uid.$user}{'icq'}" border="0" />~;
</search for>

<replace>
	if($cssbuttons) {
		$viewstyleleft = qq~style="height: 20px; border: 0px; margin: 1px 1px; background-position: top left; background-repeat: no-repeat; text-decoration: none; font-size: 18px; vertical-align: top; cursor: pointer; display: inline-block;"~;
		$viewstyleright = qq~style="height: 20px; border: 0px; margin: 0px; background-position: top right; background-repeat: no-repeat; text-decoration: none; font-size: 18px; vertical-align: top; display: inline-block;"~;
		$viewstyleimage = qq~height: 20px; border: 0px; margin: 0px; background-repeat: no-repeat; vertical-align: top; text-decoration: none; font-size: 18px; display: inline-block;~;
		$viewstyletext = qq~style="height: 20px; border: 0px; margin: 0px; padding: 0px; text-align: left; text-decoration: none; vertical-align: top; white-space: nowrap; display: inline-block;"~;
		$yimmsgimagedir = $imagesdir; if(!-e("$yimmsgimagedir/yim.gif")) { $yimmsgimagedir = $defaultimagesdir; }
		$aimmsgimagedir = $imagesdir; if(!-e("$aimmsgimagedir/aim.gif")) { $aimmsgimagedir = $defaultimagesdir; }
		$skymsgimagedir = $imagesdir; if(!-e("$skymsgimagedir/skype.gif")) { $skymsgimagedir = $defaultimagesdir; }
		$myspacemsgimagedir = $imagesdir; if(!-e("$myspacemsgimagedir/myspace.gif")) { $myspacemsgimagedir = $defaultimagesdir; }
		$facebookmsgimagedir = $imagesdir; if(!-e("$facebookmsgimagedir/facebook.gif")) { $facebookmsgimagedir = $defaultimagesdir; }
		$msnmsgimagedir = $imagesdir; if(!-e("$msnmsgimagedir/msn3.gif")) { $msnmsgimagedir = $defaultimagesdir; }
		$gtkmsgimagedir = $imagesdir; if(!-e("$gtkmsgimagedir/gtalk2.gif")) { $gtkmsgimagedir = $defaultimagesdir; }
		$icqmsgimagedir = $imagesdir; if(!-e("$icqmsgimagedir/icqadd.gif")) { $icqmsgimagedir = $defaultimagesdir; }
		$yimimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'yim'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($yimmsgimagedir/yim.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>YIM</span></span></span></span>~;
		$aimimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'aim'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($aimmsgimagedir/aim.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>AIM</span></span></span></span>~;
		$skypeimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'skype'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($skymsgimagedir/skype.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Skype</span></span></span></span>~;
		$myspaceimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'myspace'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($myspacemsgimagedir/myspace.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Myspace</span></span></span></span>~;
		$facebookimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'facebook'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($facebookmsgimagedir/facebook.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Facebook</span></span></span></span>~;
		$msnimg = qq~<span class="buttonleft" $viewstyleleft title="$themsnname" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($msnmsgimagedir/msn3.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>MSN</span></span></span></span>~;
		$gtalkimg = qq~<span class="buttonleft" $viewstyleleft title="$thegtalkname" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($gtkmsgimagedir/gtalk2.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Gtalk</span></span></span></span>~;
		$icqimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'icq'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($icqmsgimagedir/icqadd.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>ICQ</span></span></span></span>~;
	}
	else {
		$yimimg = qq~<img src="$yyhtml_root/Buttons/$language/yim.png" alt="${$uid.$user}{'yim'}" title="${$uid.$user}{'yim'}" border="0" />~;
		$aimimg = qq~<img src="$yyhtml_root/Buttons/$language/aim.png" alt="${$uid.$user}{'aim'}" title="${$uid.$user}{'aim'}" border="0" />~;
		$skypeimg = qq~<img src="$yyhtml_root/Buttons/$language/skype.png" alt="${$uid.$user}{'skype'}" title="${$uid.$user}{'skype'}" border="0" />~;
		$myspaceimg = qq~<img src="$yyhtml_root/Buttons/$language/myspace.png" alt="${$uid.$user}{'myspace'}" title="${$uid.$user}{'myspace'}" border="0" />~;
		$facebookimg = qq~<img src="$yyhtml_root/Buttons/$language/facebook.png" alt="${$uid.$user}{'facebook'}" title="${$uid.$user}{'facebook'}" border="0" />~;
		$msnimg = qq~<img src="$yyhtml_root/Buttons/$language/msn.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setmsn;msnname=$themsnuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$themsnname" title="$themsnname" border="0" />~;
		$gtalkimg = qq~<img src="$yyhtml_root/Buttons/$language/gtalk.png" style="cursor: pointer" onclick="window.open('$scripturl?action=setgtalk;gtalkname=$thegtalkuser','','height=80,width=340,menubar=no,toolbar=no,scrollbars=no'); return false" alt="$thegtalkname" title="$thegtalkname" border="0" />~;
		$icqimg = qq~<img src="$yyhtml_root/Buttons/$language/icq.png" alt="${$uid.$user}{'icq'}" title="${$uid.$user}{'icq'}" border="0" />~;
	}
</replace> 



Does that make sense?
« Last Edit: May 12th, 2009 at 7:32pm by Derek Barnstorm »  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #34 - May 12th, 2009 at 9:56pm
Print Post  
Derek Barnstorm wrote on May 12th, 2009 at 5:29pm:
Does that make sense?

Sure - new zip package attached to first post.  Smiley
  

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Derek Barnstorm
God Member
*****
Offline



Posts: 1146
Location: Warwickshire
Joined: Mar 23rd, 2008
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #35 - May 13th, 2009 at 12:04am
Print Post  
Cool. Thanks.

Before I make the patches though, would you mind just verifying that I am adding these two lines to your code correctly. It is working (so I'm guessing so), just want reassuring I'm doing the right thing...

For example, the Twitter Mod will have the images stored in ModImages/Twitter... So, is this the right way to do it?

For your added code in Load.pl:

Code
Select All
<search for>
	$facebookmsgimagedir = $imagesdir; if(!-e("$facebookmsgimagedir/facebook.gif")) { $facebookmsgimagedir = $defaultimagesdir; }
</search for>

<add after>
        $twittermsgimagedir = $modimgurl; if(!-e("$twittermsgimagedir/Twitter/twitter.gif")) { $twittermsgimagedir = $modimgurl; }
<add after> 



Code
Select All
<search for>
         $facebookimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'facebook'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($facebookmsgimagedir/facebook.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Facebook</span></span></span></span>~;
</search for>

<add after>
         $twitterimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'twitter'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($twittermsgimagedir/Twitter/twitter.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Twitter</span></span></span></span>~;
</add after> 



On the first line I'm not 100% sure where is should be defaulting back to, '$defaultimagesdir' or '$modimgurl'...

Forgive me if I'm being dumb. Smiley
  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #36 - May 13th, 2009 at 12:55am
Print Post  
I think a better way would be:

Code
Select All
<search for>
	$facebookmsgimagedir = $imagesdir; if(!-e("$facebookmsgimagedir/facebook.gif")) { $facebookmsgimagedir = $defaultimagesdir; }
</search for>

<add after>
	$twittermsgimagedir = $imagesdir; if(!-e("$twittermsgimagedir/twitter.gif")) { $twittermsgimagedir = qq~$modimgurl/Twitter~; }
<add after> 




Code
Select All
<search for>
	   $facebookimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'facebook'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($facebookmsgimagedir/facebook.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Facebook</span></span></span></span>~;
</search for>

<add after>
	   $twitterimg = qq~<span class="buttonleft" $viewstyleleft title="${$uid.$user}{'twitter'}"><span class="buttonright" $viewstyleright><span class="buttonimage" style="background-image: url($twittermsgimagedir/twitter.gif); $viewstyleimage"><span class="buttontext" $viewstyletext>Twitter</span></span></span></span>~;
</add after> 



Making "$modimgurl/Twitter;" the default dir because that's where you know for sure that the standard twitter icon is located. Then if somebody would create a new template with a different icon in it's template images dir it will use the new one.
« Last Edit: May 13th, 2009 at 1:58am by Carsten »  

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Derek Barnstorm
God Member
*****
Offline



Posts: 1146
Location: Warwickshire
Joined: Mar 23rd, 2008
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #37 - May 13th, 2009 at 1:45am
Print Post  
Ah, right. Got ya. Thanks (Again!)

I am getting an 'Illegal division by zero' error when using '$modimgurl/Twitter' for some reason though.

I think the best thing to do is for me to place the images in their default directories (I can't see any real reason to store them in ModImages anyway, just for contact icons).

I'll change the contact Mods to suit this.
  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #38 - May 13th, 2009 at 2:00am
Print Post  
Quote:
I am getting an 'Illegal division by zero' error when using '$modimgurl/Twitter' for some reason though.

Yeah - sorry, my bad. It should have been:
Code
Select All
<search for>
	$facebookmsgimagedir = $imagesdir; if(!-e("$facebookmsgimagedir/facebook.gif")) { $facebookmsgimagedir = $defaultimagesdir; }
</search for>

<add after>
	$twittermsgimagedir = $imagesdir; if(!-e("$twittermsgimagedir/twitter.gif")) { $twittermsgimagedir = qq~$modimgurl/Twitter~; }
<add after> 

  

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Derek Barnstorm
God Member
*****
Offline



Posts: 1146
Location: Warwickshire
Joined: Mar 23rd, 2008
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #39 - May 13th, 2009 at 2:10am
Print Post  
Great!

For my own reference and interest, what exactly does 'qq~' mean? Is is sort of like putting something in quotes?

  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #40 - May 13th, 2009 at 2:19am
Print Post  
Derek Barnstorm wrote on May 13th, 2009 at 2:10am:
For my own reference and interest, what exactly does 'qq~' mean? Is is sort of like putting something in quotes?

Yep. qq = dobbel quotes - q = single quotes  Smiley
  

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Derek Barnstorm
God Member
*****
Offline



Posts: 1146
Location: Warwickshire
Joined: Mar 23rd, 2008
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #41 - May 13th, 2009 at 2:25am
Print Post  
Right, cheers!

I really should go through some tutorials one day, I've just enjoyed looking and learning bits from the YaBB code. Bit of a copy and paster. Smiley


  
Back to top
 
IP Logged
 
Carsten
God Member
*****
Offline


...to much YaMS

Posts: 3281
Location: Langå
Joined: Aug 2nd, 2002
Gender: Male
Re: CSS Buttons 4 YaBB 2.4 (beta 0.1.4)
Reply #42 - May 16th, 2009 at 4:53pm
Print Post  
Added yabb 2.3.1 compatible mod file to the zip package in first post.
  

If you knock your head against a brick wall and hear a hollow sound, it's not necessarily coming from the wall.
Back to top
 
IP Logged
 
Zak
New Member
*
Offline


and the alien mindbenders

Posts: 7
Joined: Nov 30th, 2005
Re: CSS Buttons 4 YaBB 2.4 (and 2.3.1) (beta 0.1.5)
Reply #43 - Jun 16th, 2009 at 8:07pm
Print Post  
hi

thx for this great mod!

i have some probs with the syntax of the ircmod:
Code
Select All
'chatirc' => "<img src=\"$modimgurl/ChatIRC/irc.$imgext\" alt=\"$img_txt{'chatirc'}\" title=\"$img_txt{'chatirc'}\" border=\"0\" /> <span class=\"imgmenu\">$img_txt{'chatirc'}</span>", 



and my try dosn't work:
Code
Select All
chatirc,ChatIRC/irc|imgmenu|chatirc|||imgmenu|mod 



pls help

greets, zak
  
Back to top
 
IP Logged
 
Zak
New Member
*
Offline


and the alien mindbenders

Posts: 7
Joined: Nov 30th, 2005
Re: CSS Buttons 4 YaBB 2.4 (and 2.3.1) (beta 0.1.5)
Reply #44 - Jun 16th, 2009 at 8:48pm
Print Post  
i put both german language patches in a boardmod file. including the missing menu.lng fix (modversion 0.1.5)
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1 2 [3] 4 
Send TopicPrint