Documentation inadequate to implement
dalehgeist - February 28, 2009 - 00:19
| Project: | Cluetip |
| Version: | 6.x-1.x-dev |
| Component: | Documentation |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Jump to:
Description
I have followed the four steps given to install the module. I don't know what to do next.
I followed the steps given in the Example part of the Readme file:
- I added the following code to my template.php file: jq_add('cluetip');
- I created the following HTML in a Drupal node:<div class="cluetip-title" title="Header|The body of the title">Hello world.</div>
Result: regular, non-Cluetip-style tooltip, containing the full title. There must be something else I need to do in order to implement Cluetips.
There is a phrase in the Example section that might be a clue, but I don't understand it: "In your module, use the cluetip_load() function to load a js file that includes the parameters for your cluetip." What module does this refer to?
#1
I struggled yesterday for hours with this... here's what I did to make it work. Note that for some odd reason (caching?), this very same code *didn't work* for a while... then just suddenly started working.
In my form function, I have the following code... ('...' means later in same file)...
// Hook cluetip and my function to specialize cluetip
jq_add('cluetip');
drupal_add_js(drupal_get_path('module', 'mymodule') .'/js/pub-cluetip.js');
...
// Here I add rows to a table... adding the cluetip to the TD element... focus only on the 'class' and 'title' parameters
$rows[] = array(
...
array('data' => l($my_title, $my_url, array('attributes' => array('target' => '_blank'))), 'class' => 'cluetip-title', 'title' => 'ClueTip Title|ClueTip Body'),
...
);
}
The file "pub-cluetip.js" looks like this...
if (Drupal.jsEnabled){
$(document).ready(function() {
$('.cluetip-title[@title]').cluetip({splitTitle: '|'});
});
};
Now I'm struggling to get the AJAX part to work... the script always times-out when fetching the page to display in the tooltip. Makes me want to rip my eyes out.
Mark
#2
Mark,
Thanks for your reply. I think my question was more basic. I can't get cluetips to work, period. And I think I am missing a step. ALL I have done is:
jq_add('cluetip');to template.php, per the Example section of the Readme file<div class="cluetip-title" title="Header|The body of the title">Hello world.</div>, per the Example section of the Readme fileThe Example section of the Readme file also contains two references to "your module," which are quite opaque to me. I don't have a module. I'm just trying to get cluetips to work on my html content. Your inclusion of the 'mymodule' parameter in your code snippet also seems to be a reference to, well, my module. Of which I have none.
I'm also not sure where your "form function" is, or why you are dealing with tables. I wonder if you may be solving a problem that I'm not having.
I DID find one thing that seemed to need changing: the references in cluetip.module are to
/cluetip/jquery.[file].js, but when the Cluetip plugin is unzipped into the Cluetip module directory, its directory is actually namedcluetip-0.9.8. I renamed it to "cluetip" so that those pathnames would resolve correctly. (Which did not solve my problem.)I also noticed an "example.js" file in the Cluetip module directory. I tried pasting its contents inside a
<script>tag in the<head>tag of page.tpl.php. Still no luck.Is it possible that you are assuming a higher level of sophistication among your users than may be the case? (Yes, that's another way of saying I'm clueless, if you'll forgive the pun.)
#3
Dale,
Heh... while Cluetip is a really cool piece of code... can't take credit for it. I'm not the author... just struggled a bit as you seem to be... trying to help you through the rough spots. I had to inspect the code to figure out what to do, so I agree that the documentation could use a boost.
So the first thing to know is that the Cluetip module doesn't really do anything "by itself" (as far as I could tell)... you need a JavaScript "hook" to tie it to your code. For example, there is no code out-of-the-box to interpret the "cluetip-title" class and take action. There is an example with "cluetip-title", but it is assumed you'll follow the example (probably too much to assume).
So nothing happens unless you...
1) Create a JS file (let's call it 'cluetip-title.js')... it can be very simple... to interpret "cluetip-title"... something like I showed in my "pub-cluetip.js" example in my last post.
2) Create a directory for this file... I suggest "sites/all/js"... put the file there.
3) Follow the line "jq_add('cluetip');" with "drupal_add_js('sites/js/cluetip-title.js');". Notice no "module" here... sorry I confused before.
4) Make sure you set up the "cluetip/cluetip" directory... as it sounds like you did.
This should work for you. You can see an example of this at my "hobby site" www.authorcollector.com... on the publications page (hover over a book title). [you don't need to register to see it working].
I did get the AJAX stuff working... fetching pages to display in the tooltip... but decided it would be too complex to add a special content type with appropriate formatting for tooltips. So I just construct the tooltip as an inline html string and then set "title=$my_html".
Best of luck,
Mark
#4
OK, I got it working.
Here's what I did:
1. Using alerts and "view source", I verified that adding
jq_add('cluetip');into template.php did indeed load all the necessary .js and .css files inside the<head>tag2. I added the example.js code inside the
<body>tag of page.tpl.php, just before the</body>tag. At this point it still wasn't working, until...3. I commented out
$(document).ready(function() {. Apparently this never fires, for some reason.Consulting the "Getting Started" page on the Cluetip plugin site (http://plugins.learningjquery.com/cluetip/#getting-started) helped clarify where the actual cluetip call needed to go - although they did say you could add it to the
<head>tag, which did not work.If I'm treading on thin ice with this kind of implementation, please let me know, because I'm plowing ahead with customizing it now.
#5
Mark,
Thanks a mil for the response, and sorry for mistaking you for the author. While I've done some JS work, I haven't done any in Drupal, so I was indeed pretty clueless about how it was handled. I get now that those "add" functions are how the php template sucks the .js file in. (I got the same result, of course, from simply adding
<script src="[path to js file]"></script>to the header of page.tpl.php.)As I mentioned, I have the actual Cluetip call,
$('.cluetip-title[@title]').cluetip({splitTitle: '|'};,) inside the ><body>tag because it didn't work inside the<head>tag, and, as I also mentioned,$(document).ready(function()never seemed to fire, no matter what tag it was inside . I'll try pulling it back out into an external script and see if I have better luck.Regarding AJAX, it sounds like you're trying to do what I would ideally like to do: suck HTML out of a node into the cluetip. It's a drag you couldn't get that to work. When you say "inline HTML string," you mean inside a .js file? The Cluetip plugin site seems to imply that you could also simply create an HTML doc, which I guess could sit inside your "files" folder. I may try that.
Thanks again,
Dale
#6
Dale,
No worries about anything, just glad I could help. I'm probably not expert enough to comment on whether you're treading on thin ice or not... no idea why jq_add would correctly insert a script reference into the header block and drupal_add_js would not, as both work for me. Thing is... it works... I say full speed ahead. Might want make sure it works in common browsers (FF, IE, Safari, ...)... other than that never look back... :)
As to the inline HTML... undoubtedly might be considered "hacky" by someone really savvy in web development (I'm just a hobbiest). But here's a code snippet to give you an idea (again, this is in a module... the idea would need to be adapted somehow for your approach). This is what I do to construct the tooltip seen when one hovers over a book title on the publications page at www.authorcollector.com.
... aw feh! When I paste the code here, the editor interprets the HTML as formatting and screws it up. I'd be willing to e-mail you the snippet if you'd like... my e-mail address is at the URL above.
As to reading a file... not much experience here using files from PHP... as it is just too easy to plug stuff into a database (aka "super" file). Unsure if using an URL reference to your file will work, as Drupal catches all references and tries to construct the page for you.
Mark
#7
Mark,
Using your example, the example that came with the Cluetip module, and the example from the Cluetip Plugin page, I have verified that
a) adding
drupal_add_js('sites/js/[example].js');to template.php does pull that script into the page's<head>tag, BUTb) the code doesn't work when it's inside the
<head>tag - for me.A wild guess is that it may have to do with my theme, which is based on the zen theme. (That's as far as my thinking has gotten.)
$(document).ready(function(){})never fires, and when I comment it out, the code doesn't work. (I've verified all of the above using my sophisticated "alert" troubleshooting method.)So it looks like my best bet here is the rather hacky method of putting my entire script inside the
<body>tag. I'll keep you posted on developments.Dale
#8
@markallenneil & dalehgeist
Thank you to both of you for putting the effort into finding out how to get this module working, its made my work so much easier
#9
BTW, I figured out what this is: it's what happens when you have your JS set to cache/compress (in Admin > Configuration > Performance). It creates one big compressed JS file, and confusion for slow types like myself.
#10
Ditto. Way too much work to get it to function. I'm moving on and searching elsewhere, surely there's a better module out there that has the same kind of functionality.