Documentation\Readme\Instructions?
ezra-g - May 2, 2007 - 22:48
| Project: | Craqbox |
| Version: | 5.x-1.x-dev |
| Component: | Documentation |
| Category: | feature request |
| Priority: | critical |
| Assigned: | Unassigned |
| Status: | active |
Jump to:
Description
It would be nice if there were a README.txt or some basic instructions on how to construct a craqbox url.
#1
it'll come soon. thanks.
#2
+1 for this.
I am completely in the dark as to how to use this module. But it looks very promising!
Thanks,
txcrew
#3
indeed documentation and features list would be welcome
does it offer something more than thickbox ? if not, is there really a need for another module ? somehow drupal is blurred by multiple modules achieving the same goals.
if you have same goals, join forces :)
regards.
#4
no this goes a completely different route.
I've been swamped with work on various other things and haven't gotten to getting someone to document it the properties.
This is at the top of the craqbox.js file but here im adding some quick comments..
// Configurable options for craqbox.var defaults = {
attachEvent: 'click', // Which DOM event to attach craqbox on.. default is click so onclick of a link or whatever..
animation: { opacity: 'toggle' }, // TODO: implement. (ability to configure the animations craqbox uses for coming in and out.)
cacheKey: null, // This is used basically more by the system itself in craqbox for caching display results for better performance.. dont worry about this one yet
closeButtonLabel: 'x', // i think the closeButton ones explain them selves..
closeButtonTitle: 'Close',
closeButtonClass: 'close_button',
closeButtonContainerClass: 'close_button_container',
completeCallback: function() { }, // When craqbox is done loading whatever content you wanted it to display, this callback function would be called to allow developers to do the extra things they need.
content: null, // whatever content you want to give craqbox.. could be straight up html, could be dom stuff.. etc..
contentClass: 'content', // the div in craqbox that the content is in.. its class name.. i tried to make everything configurable.
craqboxId: 'craqbox', // the craqbox containers #id value.
dragable: false, // This currently is not working properly so dragable should be false until i complete that feature.
ease: 'easein', // TODO: implement. (so the animations use a configurable ease)
heading: 3, // The heading in craqbox (title) is an <h> tag and the value here is which h tag to use.
hiderClass: 'craqbox_hider', // The hider is what makes the page "darken" which is really just a div that is background: #000; and opacity: 0.5 (bellow);
hiderOpacity: 0.5,
hiderSpeed: 'fast', // How fast the hider comes in and out. (jQuery has fast, medium, slow or it could be a straight up number like 100, 200, 300)
horizontalAlign: true, // If you want craqbox to horizontally align on the screen. (this has some quarks which I just havent committed all the fixes. is coming very soon)
iframeBorder: 0, // If in iFrame mode, (type = 'iframe') you can set its attribute border size.
iframeClass: 'frame_class', // its classname.
iframeScroll: 'no', // if you want the scroll bar.
inSpeed: 'normal', // craqbox's speed when it first displays
links: {}, // Totally cant remember this one..
outSpeed: 'fase', // craqbox's speed going out (hiding).
padding: 10, // Padding space around craqbox (like craqbox's margin)
removeCallback: function() { }, // When craqbox is removed from the screen, this callback is called.
title: null, // The title of craqbox.
titleBar: true, // If you want craqbox to display a titlebar.
titleBarClass: 'title_bar', // the titlebar's class name.
type: 'iframe', // iframe / image / dom / html (those are the current options craqbox supports for content types. will explain further down the page)
url: null, // Used for either ajax loads or type = 'iframe' || 'image';
width: 700, // craqbox's width.
verticalAlign: false // vertical align craqbox to the screen.
};
The main thing about craqbox is I built it to be more of an application window vs just a content display window. Thickbox does not give you the ability to control your window in the way most jQuery plugins would work.
This offers callbacks and options.
You can also actually use craqbox like a jQuery plugin vs thickbox you cant.
A good example of craqbox being used is how I use it in the Quick Search module.
Drupal.quicksearch.craqbox = $.craqbox(Drupal.quicksearch.input, {type: 'dom',
title: Drupal.settings.quicksearch.title,
attachEvent: null,
width: Drupal.settings.quicksearch.uiWidth,
closeButtonTitle: Drupal.settings.quicksearch.closeButton,
verticalAlign: false
});
Here we save the instance if craqbox to Drupal.quicksearch.craqbox so we can control it as the user does searches. We give it the general data it needs to start, and later on when the user actually types in the search textfield.. we do this..
Drupal.quicksearch.craqbox.build({content: $('<div>').append($(db.input)).append($('<div>').html(results)),
completeCallback: function() {
db.input.focus();
Drupal.quicksearch.pagerSetup(db);
Drupal.quicksearch.tabSetup(db);
},
removeCallback: function() {
Drupal.quicksearch.remove(db.input);
}
});
So here, I'm dynamically changing the content inside craqbox and the pagerSetup and tagSetup functions are simply use adding events and certain functionality to the content INSIDE craqbox. This you cannot do with thickbox.
This is the nice part about using $.craqbox('#element', {options}); instead of $('#element').craqbox({options});
One thing to note, You dont have to set attachEvent you can do attachEvent: null like I did with quicksearch and then as other things are going on, you can simply control your craqbox as needed.
Hope this helps people for a few weeks.. Hoping to get craqbox cleaned up more (its decently stable as is) and I have a few things I still want to add to it.