Javascript Tools and Backport: developer-interest modules
A couple of recent module postings coming in part from CivicSpace work that developers might wish to use: 1. Javascript Tools, http://drupal.org/node/57285, offers a number of js and AJAX tools that developers might wish to use in their modules. The aim is a toolkit that provides clean, Drupalish implementations of a full range of standardly-needed JS functionality, plus some extras. Included: * wforms.module, form features like multi-page client-side forms, including methods for generating them using the Forms API * tabs.module, client-side tabs, again with Forms API methods * activemenu.module, AJAX-based tree menu for standard Drupal menus (navigation, etc.). * jscalendar.module, popup calendar, added to textfields by including a 'jscalendar' class * etc. See the README.txt files with each component module for details on how to use these in your modules. Also, as you develop new JS tools, please consider adding them to this package :) 2. Backport, http://drupal.org/node/57119, makes Forms API and Drupal javascript available in 4.6. If you need to develop in 4.6 but want your code to be usable as well in 4.7, you can install Backport and code forms (and Javascript) using 4.7 methods. Probably this is more useful for custom modules than ones for general distribution. We're using this for Goodstorm to enhance the 4.6 site while making sure our code will work in 4.7 as well.
Also, as you develop new JS tools, please consider adding them to this
I just finished a "I'm totally not a JS developer" hover tooltips: http://cvs.drupal.org/viewcvs/drupal/contributions/modules/game/game.js?view... Example usage: drupal_add_js(drupal_get_path('module', 'game').'/game.js'); theme('game_tooltip', 'real', 'tooltip'); l('real', 'url', theme('game_tooltip_attributes', 'tooltip', 'block')) The final parameter of either approach (here 'block') sets the tooltip to use a different CSS ID, appended to 'tooltip_' (so, here, the final CSS ID set on the DIV would be 'tooltip_block'. Like I said, I suck at JavaScript, but this works for me. Demo here: http://feast-or-fa.mine.nu:8888/drupal/?q=node/123 The "robot" on the lefthand side is #tooltip_block, and the abbreviations on the right hand side are normal #tooltips. -- Morbus Iff ( you are nothing without your robot car, NOTHING! ) Culture: http://www.disobey.com/ and http://www.gamegrene.com/ O'Reilly Author, Weblog, Cook: http://www.oreillynet.com/pub/au/779 icq: 2927491 / aim: akaMorbus / yahoo: morbus_iff / jabber.org: morbus
Nedjo, looks really useful! Morbus, this would be really useful for making help tooltips, kind of like balloon help in the Mac OS. I'd be interested in using it to make a tooltip theme for theme designers that pops up what phptemplate variable is responsible for each part of the page, and maybe shows a border when hovering over the element. --- Morbus Iff <morbus@disobey.com> wrote:
Also, as you develop new JS tools, please consider adding them to this
I just finished a "I'm totally not a JS developer" hover tooltips:
http://cvs.drupal.org/viewcvs/drupal/contributions/modules/game/game.js?view...
Example usage:
drupal_add_js(drupal_get_path('module', 'game').'/game.js'); theme('game_tooltip', 'real', 'tooltip'); l('real', 'url', theme('game_tooltip_attributes', 'tooltip', 'block'))
The final parameter of either approach (here 'block') sets the tooltip to use a different CSS ID, appended to 'tooltip_' (so, here, the final CSS ID set on the DIV would be 'tooltip_block'.
Like I said, I suck at JavaScript, but this works for me. Demo here:
http://feast-or-fa.mine.nu:8888/drupal/?q=node/123
The "robot" on the lefthand side is #tooltip_block, and the abbreviations on the right hand side are normal #tooltips.
-- Morbus Iff ( you are nothing without your robot car, NOTHING! ) Culture: http://www.disobey.com/ and http://www.gamegrene.com/ O'Reilly Author, Weblog, Cook: http://www.oreillynet.com/pub/au/779 icq: 2927491 / aim: akaMorbus / yahoo: morbus_iff / jabber.org: morbus
__________________________________________________ Do You Yahoo!? Tired of spam? Yahoo! Mail has the best spam protection around http://mail.yahoo.com
"Farsheed" wrote:
this would be really useful for making help tooltips, kind of like balloon help in the Mac OS.
Tooltips of all kinds (as well as other small CSS-able windows like this) can be made with any one of: overlib.js a Lg, Med or Mini lib for producing hover pops 1k.js a faboo 1k js api <-- my fave psCrossbrowser.js a nice, compact lib (but not 1k ;)
I'd be interested in using it to make a tooltip theme for theme designers that pops up what phptemplate variable is responsible for each part of the page, and maybe shows a border when hovering over the element.
Check out a few of the replacement CSS files for Mozilla (or IE, or other) browsers, where you can easily border all elements. By borrowing this method, you could have a theme debug toggle (js) that switched your CSS file from the theme's CSS to your debug.css, which would show the outlines and such. Or switch to a specific debug.tpl.php file, with the overlib.js attached, to do your hover pops. This CSS trick is pretty old, and this is how the "View Rendered Source" feature of the Firefox Web Developer plug-in works also. But you don't need the plugin. You just need to replace your Mozilla "user.css" file. (Search Google for "mozilla and user.css" and you will find loads of examples to do just what you describe. Maybe that will save you some time, since the theme-specific stuff sounds useful.) Good idea, Farsheed. -- Gary
Nedjo Rogers wrote:
Also, as you develop new JS tools, please consider adding them to this package :)
Would some sort of dynamic table JS stuff be useful? Like buttons to move up/down/copy/delete rows... I have some basic functions for that but they're not in module format at the moment.
Rowan Kerr wrote:
Nedjo Rogers wrote:
Also, as you develop new JS tools, please consider adding them to this package :)
Would some sort of dynamic table JS stuff be useful? Like buttons to move up/down/copy/delete rows...
I have some basic functions for that but they're not in module format at the moment.
Please please please please. Anyone who uses views UI would love you if the tools are something I can easily integrate. =)
Earl Miles wrote:
Please please please please.
Anyone who uses views UI would love you if the tools are something I can easily integrate. =)
Since Merlin & Amazon asked so nicely... :) http://cvs.drupal.org/viewcvs/drupal/contributions/sandbox/rkerr/table.js A module that uses this will need to add a new column to tables with the links in it to call these functions. Something like this: <td> <a href="#" onclick="tableRowUp(this); return false;">up</a> <a href="#" onclick="tableRowDown(this); return false;">dn</a> <a href="#" onclick="tableRowDelete(this); return false;">x</a> <a href="#" onclick="tableRowCopy(this); return false;">+</a> </td> -Rowan
On 24 Apr 2006, at 9:36 PM, Rowan Kerr wrote:
Would some sort of dynamic table JS stuff be useful? Like buttons to move up/down/copy/delete rows...
I would like these tools, but for divs. The primary thing i would like to be able to implement is rulesets. IE: think of the interface to filter incoming mail in your mail client. You add constraints, and each constraint has several paramaters / it's own form. -- Adrian Rossouw Drupal developer and Bryght Guy http://drupal.org | http://bryght.com
On Mon, 2006-04-24 at 16:53 -0400, Rowan Kerr wrote:
Adrian Rossouw wrote:
I would like these tools, but for divs.
I suppose they could be abstracted or simplified to operating on a dom "parent" element so many levels up the tree...
With well structured xhtml... moving nodes horizontally (at the same depth of the tree), and moving them up and down to different depths of the tree... can take on some fun meaning.. and probably all sorts of fun writing css for... So you could move div.row around other div.rows.... or mov div.row div.col up the tree to be the container for the div.rows... go back to chasing drunk monkeys now..
On 24 Apr 2006, at 10:53 PM, Rowan Kerr wrote:
Adrian Rossouw wrote:
I would like these tools, but for divs.
I suppose they could be abstracted or simplified to operating on a dom "parent" element so many levels up the tree...
at which point you can use them for block placement too. -- Adrian Rossouw Drupal developer and Bryght Guy http://drupal.org | http://bryght.com
participants (8)
-
Adrian Rossouw -
Darrel O'Pry -
Earl Miles -
Farsheed -
Gary (Lists) -
Morbus Iff -
Nedjo Rogers -
Rowan Kerr