Link to Mod (http://custom.simplemachines.org/mods/index.php?mod=1140)
Usage:
[tooltip=I have a Simple Machines Forum myself, you should get one too]SMF Forum[/tooltip] (comma is ok here)
[linktip=http://simplemachines.org/community,Simple Machines; the best friggin forum in the world!]Simple Machines[/linktip] (comma seperates url from text in bubble, so no comma in the actual text)
Linebreaks will keep formatting for the bubble, so for multi line text:
[tooltip=I have a Simple Machines Forum myself,
you should get one too]SMF Forum[/tooltip] -- this will put 2 line breaks in the bubble
Description:
This is a little more advanced version of the [abbr and acronym], where instead of an alt text it gives a "Chat bubble" when you mouseover the linked text (either a span with double underline, or an actual link that you can click going to a website with double underline, indicating it is special.
There is:
- 1 theme change to index.template
- 1 change to subs.php
- 1 css file for the styling of the bubble
- 2 image files
- 1 folder containing .js files (6)
very simple for manual or package install
Compatibility:
Compatable with:
- versions up to 1.1.4
- 2.0 Beta 3 Public
Credits:
based on request of: ameo (http://www.simplemachines.org/community/index.php?action=profile;u=107404)
found here (http://www.simplemachines.org/community/index.php?topic=229401.0)
If you have any suggestions for improvement or bugs please let me know, I will do my best to correct right away
~ Kender
Hi Kender! nice mod! the only thing is that it didn't work for me until I moved the
array(
'tag' => 'tooltip',
'type' => 'unparsed_equals',
'before' => '<span class="autoTooltip" title="$1">',
'after' => '</span>',
'quoted' => 'optional',
'disabled_after' => ' ($1)',
),
array(
'tag' => 'linktip',
'type' => 'unparsed_commas',
'before' => '<a href="$1" title="$2" class="autoTooltip" target="_blank">',
'after' => '</a>',
'quoted' => 'optional',
'disallow_children' => array('email', 'ftp', 'url', 'iurl'),
'disabled_after' => ' ($1)',
),
Where all the bbc are located in the Subs.php... so they will appear in the /index.php?action=postsettings;sa=bbc otherwise I just got [tooltip=whatever]aa[/tooltip] written out as a nobbc.
Any ideas why?
Thanks for the mod!
the install should place this code in the bbc section of subs.php, not sure why it didnt do so on your install
I was looking at my Subs.php and I know what happened... I have two mods, the custom bbc and a table from CSV and they moved the original ); that should be the end, up and the autoTooltip got after it.
Thanks for replying, my mistake!
I'm glad it wasn't anything I did, but I am sorry that you had issues!
have fun using the mod!
hi Kender.
I wonder where could I change font shown in bubble and color of bubble, and how 2 do it?
it has its own stylesheet
forumurl/Themes/default/autoTooltips.css
it is in the default theme, not in any custom theme, so no need to copy it over to another directory
there you can set the width of the bubble, font (size type and color), and background color (under base tooltip styles)
you can also set a transparency here, but i did not
* note, if you change the background color of the bubble, you need to change the 2 image files also (these have transparent backgrounds so you need to use an editor that can handle this)
I have an idea... I use this basic code to have popup windows for the bbc codes, like the URL or the IMG.
The only thing is that it will launch a single line and it'll be nice to have a text area to write instead of the single line.
Also, to use BBC in the tooltip part, somebody wanted to put [b]...[/b] but couln't and I don't know how to add that.
Well, here is the code, it works fine, just need to write the code for the Post.php so there is a buttom in the Post.template.php
This goes in the Post.template.php
// Java script to handle tooltip input boxes ...
echo '<script language="JavaScript" type="text/javascript">
// <!' . '--
function tooltipINPT()
{
// Enter tooltip .........................................
var tooltipLINK = prompt("This is the bubble text");
if (tooltipLINK == null )
{
//cancel pressed . . .
}
else if (tooltipLINK == "" || tooltipLINK == " ")
{
//ok pressed but with Notext . . .
alert("Sorry no text entered!");
}
else
{
//ok pressed and there is something :)
// Enter Description ...................................
var tooltipNAME = prompt("This is the text to hover with the mouse","");
if (tooltipNAME == null )
{
//cancel pressed . . .
}
else if (tooltipNAME == "" || tooltipNAME == " ")
{
//ok pressed but with notext so use URL only!
surroundText(\'[tooltip]\'+tooltipLINK+\'\', \'[tooltip]\', document.', $context['post_form'], '.', $context['post_box_name'], ');
}
else //ok pressed with text so use URL and Name!
surroundText(\'[tooltip=\'+tooltipLINK+\']\'+tooltipNAME+\'\', \'[/tooltip]\', document.', $context['post_form'], '.', $context['post_box_name'], ');
}
}
// --' . '>
</script>';
// only replace the tooltip tag! . . . . . . . . . . .
if (isset($tag['code']) && $tag['code'] == 'tooltip')
{
echo '<a href="javascript:void(0);" onclick="tooltipINPT(); return false;"><img onmouseover="bbc_highlight(this, true);" onmouseout="if (window.bbc_highlight) bbc_highlight(this, false);" src="', $settings['images_url'], '/bbc/', $image, '.gif" align="bottom" width="23" height="22" alt="', $tag['description'], '" title="', $tag['description'], '" border="0" style="background-image: url(', $settings['images_url'], '/bbc/bbc_bg.gif); margin: 1px 2px 1px 1px;" /></a>';
continue;
}
Thanks!
My goal in making this was to provide something that could do the job without major theme changes
if you would like to write a proper find/replace i will gladly add it for people who want to add that functionality though
please be advised though that when adding text strings you should add them as
var tooltipNAME = prompt(" , ' $tootTip['promot'] ' ,","");
and add a line to Themes/default/languages/modifications.english.php
$toolTip['prompt'] = 'This is the text to hover with the mouse';
Yes of course, the text strings... I usually put stuff and don't bother to make it $txt but if your goal was to make it simple then we can just leave it like that, is easy enough to work as it is.
Thanks thought!
I
Quote from: dannbass on March 24, 2008, 12:28:18 PM
Hi Kender! nice mod! the only thing is that it didn't work for me until I moved the
array(
'tag' => 'tooltip',
'type' => 'unparsed_equals',
'before' => '<span class="autoTooltip" title="$1">',
'after' => '</span>',
'quoted' => 'optional',
'disabled_after' => ' ($1)',
),
array(
'tag' => 'linktip',
'type' => 'unparsed_commas',
'before' => '<a href="$1" title="$2" class="autoTooltip" target="_blank">',
'after' => '</a>',
'quoted' => 'optional',
'disallow_children' => array('email', 'ftp', 'url', 'iurl'),
'disabled_after' => ' ($1)',
),
Where all the bbc are located in the Subs.php... so they will appear in the /index.php?action=postsettings;sa=bbc otherwise I just got [tooltip=whatever]aa[/tooltip] written out as a nobbc.
Any ideas why?
Thanks for the mod!
I had the identical issue, and was left wondering why this thing is not working even after a clean install. But this post addresses this issue. thanks a lot for the fix and this mod. love it.
Quote from: samvirtual on March 27, 2008, 12:02:09 PM
I had the identical issue, and was left wondering why this thing is not working even after a clean install. But this post addresses this issue. thanks a lot for the fix and this mod. love it.
Thats what i love to hear, glad you like the mod!
Quote from: samvirtual on March 27, 2008, 12:02:09 PMI had the identical issue, and was left wondering why this thing is not working even after a clean install.
The problem is that if you have another mod that also modifies the
<search for>
);
// This is mainly for the bbc manager, so it's easy to add tags above. Custom BBC should be added above this line.
</search for>
<add before>
that part then the last the " ); " is pushed up and the array is not contained there.
Kender, maybe a way to solve this have a <replace> in the mod file instead of <add before>
and a place to replace could be this one...
<search for>
array(
'tag' => 'time',
'type' => 'unparsed_content',
'content' => '$1',
'validate' => create_function('&$tag, &$data, $disabled', '
if (is_numeric($data))
$data = timeformat($data);
else
$tag[\'content\'] = \'[time]$1[/time]\';'),
),
</search for>
<replace>
array(
'tag' => 'time',
'type' => 'unparsed_content',
'content' => '$1',
'validate' => create_function('&$tag, &$data, $disabled', '
if (is_numeric($data))
$data = timeformat($data);
else
$tag[\'content\'] = \'[time]$1[/time]\';'),
),
array(
'tag' => 'tooltip',
'type' => 'unparsed_equals',
'before' => '<span class="autoTooltip" title="$1">',
'after' => '</span>',
'quoted' => 'optional',
'disabled_after' => ' ($1)',
),
array(
'tag' => 'linktip',
'type' => 'unparsed_commas',
'before' => '<a href="$1" title="$2" class="autoTooltip" target="_blank">',
'after' => '</a>',
'quoted' => 'optional',
'disallow_children' => array('email', 'ftp', 'url', 'iurl'),
'disabled_after' => ' ($1)',
),
</replace>Anyway, that could avoid the conflict with the rest of the mods.
I am working on another modificaiton for this mod to give it a little more useability and functionality, i will be sure to add the replace instead of before on the update
thanks for the idea
could you please, if possible, at least include Sweet titles of Dustin Diaz (http://www.dustindiaz.com/sweet-titles-finalized) as one of styles in new modification of mod? I'd really look forward to see this as default.
to get the look of this, in the stylesheet - style.css
look for :
/* Base Tooltip Styles */
.tt { ....
change the "background-color" to :: #000000; // (black)
for text change the "color" to the desired color you want
to add transparency to it so that you can see through it add the following lines
.tt {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
this will give a 50% transparency, if its TOO seethrough than make the numbers larger, if its not see through enough then make the number smaller
what should be changed to take effect in custom themes, and not only in default?
nothing in this mod changes custom themes, except for the css/js addition, it should work the same for every theme
yes, but it doesn't show in every theme by default. what needs to be done so it could be shown in custom theme?
did you insert the code to display the JS pages on your themes index.template.php ?
please don't kill me for asking, but, what code?
ok
open tooltips.mod (in the zip file you downloaded)
line 41 - 48 between the words <add before> and </add before>
this bit of information should be added to your index.template.php file between the <head> and </head>
there is 1 line that says,
<link rel="stylesheet"...
and 6 lines that say,
<script language="JavaScript"...
add all of those lines above the line where it says </head>
(make sure its in the html of the page - not in the php part)
Hey Kender
I installed your mod and like the other guys I had a clean install but it doesnt work
I read all the postings
and I went and looked in the subs.php file but I am afraid I am lost
could you possible help me on this
was there any errors in the install
are you using custom themes
gothic_rose 1.1.4
installed fine but doesnt work :( where can i add the text?
im confused now lol
open tooltips.mod (in the zip file you downloaded)
line 41 - 48 between the words <add before> and </add before>
this bit of information should be added to your index.template.php file between the <head> and </head> (in your theme directory)
there is 1 line that says,
<link rel="stylesheet"...
and 6 lines that say,
<script language="JavaScript"...
add all of those lines above the line where it says </head>
(make sure its in the html of the page - not in the php part)
unfortunatelly, I got parse error after adding.
could you tell us number of line where we could put it.
also, I believe you should have this explanation in the first post of this topic,
people usually add it, because most of users have various themes, and not the default one.
thank u.
Quote from: Kender on April 07, 2008, 09:54:26 PM
was there any errors in the install
are you using custom themes
Yes Im using several themes
Quote from: robbie93unfortunatelly, I got parse error after adding.
could you tell us number of line where we could put it.
also, I believe you should have this explanation in the first post of this topic,
people usually add it, because most of users have various themes, and not the default one.
thank u.
I also got the parse error
I have included the index template file so yo can see where I put it and maybe direct me as to what is wrong
I put it in line 138-146Quote<link rel="stylesheet" type="text/css" href="', $settings['default_theme_url'], '/autoTooltips.css" />
this is the line it craped out on
@Garry : Attached is the modified file, I only needed to add an ECHO statement, earlier in the thread i pointed out to make sure it was in the html of the page, not in the php, so thats what I had to fix, this should work for you now
@ameo & @robbie93 :
If you would like to attach your index.template.php for your theme files i can see where the problem is
Quote from: Kender on April 08, 2008, 07:37:06 AM
@Garry : Attached is the modified file, I only needed to add an ECHO statement, earlier in the thread i pointed out to make sure it was in the html of the page, not in the php, so thats what I had to fix, this should work for you now
I see what you did but still no go
now this is a custom theme I am working on
I had to put all the JS files in and css in the correct spots based on the xml file I read
should I be working on the default theme at first to get this working ( i dont see where anything was installed for it also )
first, what is the error message
second, when you installed was there any errors with the installer
Quote from: Kender on April 08, 2008, 08:13:49 AM
first, what is the error message
second, when you installed was there any errors with the installer
There is no error message
and there were no errors with the installer
and I copied your demo stuff to try it out
[tooltip=I have a Simple Machines Forum myself, you should get one too]SMF Forum[/tooltip] (comma is ok here)
[linktip=http://simplemachines.org/community,Simple Machines; the best friggin forum in the world!]Simple Machines[/linktip] (comma seperates url from text in bubble, so no comma in the actual text)
Linebreaks will keep formatting for the bubble, so for multi line text:
[tooltip=I have a Simple Machines Forum myself,
you should get one too]SMF Forum[/tooltip] -- this will put 2 line breaks in the bubble
and this is how it looks on my forum
okay, please attach your Subs.php file, ill look to see if the mod applied correctly
k here it is
here you go, please also make sure that your index.template has the 6 javascript lines and the CSS line as well,
lso make sure the javascript (Themes/default/autoTooltipsJS/) folder (plus 6 files) is in your DEFAULT theme folder along with the
css (Themes/default/autoTooltips.css) file and
images (Themes/default/images/autoTooltipsBL.gif & Themes/default/images/autoTooltipsTL.gif)
Good morning
Bingo
(http://www.simplemachines.org/community/index.php?action=dlattach;topic=230326.0;attach=53365)
attached is my index.php
I dont see the code in there , I will enter it in ( somewhere ) and see if it works
I added it right at the end
for the subs.php
Quotearray(
'tag' => 'tooltip',
'type' => 'unparsed_equals',
'before' => '<span class="autoTooltip" title="$1">',
'after' => '</span>',
'quoted' => 'optional',
'disabled_after' => ' ($1)',
),
array(
'tag' => 'linktip',
'type' => 'unparsed_commas',
'before' => '<a href="$1" title="$2" class="autoTooltip" target="_blank">',
'after' => '</a>',
'quoted' => 'optional',
'disallow_children' => array('email', 'ftp', 'url', 'iurl'),
'disabled_after' => ' ($1)',
),
I assume this is what you added in
for the index.template.php
Quoteecho '
<link rel="stylesheet" type="text/css" href="', $settings['default_theme_url'], '/autoTooltips.css" />
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/yahoo.js"></script>
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/dom.js"></script>
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/event.js"></script>
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/container.js"></script>
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/utilities.js"></script>
<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/autoTooltipsJS/autoTooltips.js"></script>';
I assume this is what was added in
I am going to want this working in other themes as well so I am just trying to figure out what I need
I want to thank you for your time as this has been a very enjoyable learning experence .
its the "index.template.php" file from your theme, and yes, those lines are what was added, the only other change is subs.php, and it needs to be in with the other bbc code tags
I'm having a problem with this mod. When I try to use both the tooltip or linktip all it shows is an unstyled box.
(http://img329.imageshack.us/img329/3290/tooltipac1.th.png) (http://img329.imageshack.us/my.php?image=tooltipac1.png)
Line breaks don't work, too, all it does is showing the BR tag.
(http://img329.imageshack.us/img329/6638/linebreakcq6.th.png) (http://img329.imageshack.us/my.php?image=linebreakcq6.png)
I've installed it correctly (though I had to do a manual edit for Subs.php since it failed in the package manager) and then I did all the manual edit for my custom theme (put all the necessary files in my theme directory and edited index.template). The cursors are showing as they should, BTW (I mention it because it can't be seen in the screenshots). Another thing I noticed is that if I try to uninstall and reinstall the mod, the box works for a while then it gives the problem again.
My custom theme is Phobos and SMF version is 1.1.4. It's pretty heavily modded too, I don't know if this might be the problem. Thanks for any help.
it will work for a while, and then stop working ?
Yes. I've attached my Subs.php, my index.template and the stylesheet, maybe they can be of help.
can you link me to your forum?
Okay, the address is www.evoyugi.com
Thankx for this great script ! I played around with it ..
also tried to make it look a little Transprnt i have had no luck this is what i added the opacity code --- but it doesnt work
Any help Mates :)
/* Base Tooltip Styles */
.tt {
font: 11px Verdana, Helvetica, sans-serif;
width: 250px;
margin: 0;
padding: 0;
line-height: 15px;
border: none;
visibility:hidden;
position:absolute;
color:#FFFFFF;
background-color:#000000;
padding:2px;
}
.tt {
filter:alpha(opacity=20);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
.tt .bd {
padding: 5px;
Hello everyone...
Very nice mod...and though it was listed as compatible up to 1.1.4, 2.0 Beta 3 Public...
I installed it via the Package Manager with no issues on upload, or install for 1.1.5.
I do have two issues, though...
1. How do you stop the tooltip from disappearing after a certain amount of time? I want it to remain visible, as long as the mouse pointer is over the link.
2. Please see attached images. I'm not getting the line breaks...instead it's showing the html <br /> tags within the tooltip.
Other than those two issues...all is well.
I'd like to thank those, in advance, for replying to this post.
Hmmmm...anyone home? Is this thing on? :D
Just thought I'd give the above post a nice little "bump"...or "nudge", if you will.
You may have wanted to start a new topic on this..
Based off how the pictures look on your forum it appears to me as if the autoTooltip and autoLinktip is either not installed properly and/or you're not implementing it properly with the customprofile mod. You're trying to interface it with. Try testing it out first, by creating a message and using the tooltip tag as shown below.
[tooltip=This is a test]Test[/tooltip]
If that's working but not in your customprofile then you just need to enable BBC code in the customprofile and insert the [tooltip= in the front and the ]whatever[/tooltip] at the end.
If it's not working then the autotooltip mod is not installed properly.
As far as getting it to last longer, this mod is relying on the Yahoo opensource widget, you'll need to edit the autotooltips.js and edit the autodismissdelay: line. If you're wanting it to look like how Computer Hope forum is I set the line to: autodismissdelay: 40 * 1000,
Well...
I uninstalled/deleted the mod via Package Manager. Uploaded/Edited contents manually.
At first it appeared to work...now it's back doing the same thing.
I have adjusted the display settings to your recommendations mrhope, but I have the following issues.
If I use IE7...it works just great...no issues...at all. If I use any other browser, it's back to square one. However...using any other browser on your site...and the mod on your site works like a charm.
This is, actually, the strangest thing I've ever run across.
Any suggestions?
Hmm not sure on that one. If you want to try again and let me look at it when it's enabled on your site let me know and I'll be happy to try to assist you. Probably better that you contact me on the Computer Hope forums though instead of here, since I don't watch these forums often.
Looks like Kender left us. I wonder if anyone would be willing to take over development of this mod and put it on another level.
What I had in mind is turning it into Coda Bubble (http://jqueryfordesigners.com/coda-popup-bubbles/).
I have resolved the issue I was having myself.
Quote from: The Saviour on September 06, 2008, 05:47:42 PM
I have resolved the issue I was having myself.
It's like - if you want to get job be done well you have to do it yourself.
Quote from: ameo on September 06, 2008, 01:23:14 PM
Looks like Kender left us. I wonder if anyone would be willing to take over development of this mod and put it on another level.
What I had in mind is turning it into Coda Bubble (http://jqueryfordesigners.com/coda-popup-bubbles/).
This mod would actually be much better if it were used as a drop down box instead of a tip window. Say for a users computer specs...like I have on my site.
Instead of a text link it would be an image link with a drop down box that lists each user's hardware item on a separate line...when clicked on. Click again and the drop down box disappears.
I have 2 disagree. That's what spoilers are for.
I want something like this mod , but a bit different...
A word banner mod would be great...
For example, i'll enter a word "Asus" from admin panel,and the Asus words in the posts will be shown like this mod, and when i hover the mouse on it, the advertisement will show up.....
http://forum.donanimhaber.com/m_28496007/tm.htm
Look at here, you'll understand what i mean...
Any chance to make a mod like this on SMF O:)
Can this mod work with smf 1.1.8 and if it cant, sould you make it pls because this mod id very good ;) :)
Btw it works great with smf 1.1.8 :) :)
is this mod still alive and if so can you embed images in the tooltip?
I like to know if someone can get this to work in RC2 please
I'm bumping this thread because I mentioned this mod to someone this morning (since it parses for 1.1.11). I noted that there are no BBC buttons for it. I tweaked the code to provide them, if anyone is using the mod and would like buttons, to keep from having to type in the tags manually.
The following is, of course, if you already have the mod installed and it is for the default theme:
Subs.php
Find:
'<span class="autoTooltip" title="$1">',
Replace with:
'<span class="autoTooltip" title="$1" style="text-decoration: tooltip;">',
Find:
'<a href="$1" title="$2" class="autoTooltip" target="_blank">',
Replace with:
'<a href="$1" title="$2" class="autoTooltip" style="text-decoration: linktip;" target="_blank">',
Post.template.php
Find:
'list' => array('code' => 'list', 'before' => '[list]\n[li]', 'after' => '[/li]\n[li][/li]\n[/list]', 'description' => $txt[261]),
Add after:
'tooltip' => array('code' => 'tooltip', 'before' => '[tooltip]', 'after' => '[/tooltip]', 'description' => $txt['tooltip']),
'linktip' => array('code' => 'linktip', 'before' => '[linktip]', 'after' => '[/linktip]', 'description' => $txt['linktip']),
Modifications.english.php
Find:
?>
Add before:
$txt['tooltip'] = 'Tooltip';
$txt['linktip'] = 'Linktip';
File Operations:
Un-archive the zip (attached), open the folder and move the images to ..../Themes/default/images/bbc
As always, back up your files before uploading edited ones, in case you need to re-upload your originals.
:)
Is there any way to get this mod to work with 2.0.7? It works, it's just that the bubble doesn't show.
The bubble that appears is nothing like the one in the screenshot. Mine is the "default" version of my computer...white background, black text.