Difference between revisions of "Support/JavaScript frameworks"
AngelHerraez (talk | contribs) (→jQuery) |
(→Dojo Toolkit) |
||
| (6 intermediate revisions by 2 users not shown) | |||
| Line 3: | Line 3: | ||
=== jQuery === | === jQuery === | ||
| − | ==== | + | ==== resizable ==== |
The Jmol applet may be inserted in a <code>div</code> that receives jQuery <code>resizable</code> attribute. If the applet is given a 100% size, this makes an applet that may be resized at will by the user. (The container <code>div</code> '''must have''' explicit width and height.) | The Jmol applet may be inserted in a <code>div</code> that receives jQuery <code>resizable</code> attribute. If the applet is given a 100% size, this makes an applet that may be resized at will by the user. (The container <code>div</code> '''must have''' explicit width and height.) | ||
| Line 9: | Line 9: | ||
* jQuery basic library, e.g. {{file|jquery.min.js}} | * jQuery basic library, e.g. {{file|jquery.min.js}} | ||
* jQuery UI, e.g. {{file|jquery-ui.min.js}} and one of the associated themes like {{file|jquery-ui.css}} | * jQuery UI, e.g. {{file|jquery-ui.min.js}} and one of the associated themes like {{file|jquery-ui.css}} | ||
| + | |||
| + | ==== draggable ==== | ||
| + | The Jmol applet may be inserted in a <code>div</code> that receives jQuery <code>draggable</code> attribute. The user can thus move the applet around the page. | ||
| + | Uses | ||
| + | * jQuery basic library, e.g. {{file|jquery.min.js}} | ||
| + | * jQuery UI, e.g. {{file|jquery-ui.min.js}} and one of the associated themes like {{file|jquery-ui.css}} | ||
| + | |||
| + | ==== Jmol-JSO / JSmol ==== | ||
| + | The new [[Jmol JavaScript Object]] library ([[JSmol]]) includes part of jQuery, so it should be fully compatible. If you need extra jQuery functionality, you should be careful to avoid conflicts between duplicate jQuery calls. | ||
| + | |||
=== Prototype === | === Prototype === | ||
| Line 15: | Line 25: | ||
=== Dojo Toolkit === | === Dojo Toolkit === | ||
... | ... | ||
| + | |||
| + | Twirlymol, the 'inspiration' for JSmol lite (JSmolTM) uses Dojo. | ||
| + | |||
| + | === MochiKit=== | ||
| + | |||
| + | Uses the $ shorthand global which may conflict with JSmol and JQuery | ||
| + | |||
| + | Used used as the primary JavaScript framework (alongside jQuery) in the eportfolio/CMS Mahara | ||
| + | |||
| + | In Mahara, jQuery is loaded first, $j set as the global, then MochiKit loaded taking ownership of $ | ||
| + | |||
| + | === YUI3 === | ||
| + | |||
| + | Uses the YUI global. Y is the shorthand local. | ||
| + | |||
| + | jQuery-YUI Rosetta Stone [http://www.jsrosettastone.com/] | ||
Latest revision as of 23:47, 5 April 2013
Contents
Compatibility of Jmol applets with JavaScript frameworks
Please share here any experience with including Jmol applets in pages that use JavaScript frameworks or JavaScript libraries (both compatibilities and incompatibilities).
jQuery
resizable
The Jmol applet may be inserted in a div that receives jQuery resizable attribute. If the applet is given a 100% size, this makes an applet that may be resized at will by the user. (The container div must have explicit width and height.)
Uses
- jQuery basic library, e.g.
jquery.min.js - jQuery UI, e.g. jquery-ui.min.js and one of the associated themes like jquery-ui.css
draggable
The Jmol applet may be inserted in a div that receives jQuery draggable attribute. The user can thus move the applet around the page.
Uses
- jQuery basic library, e.g. jquery.min.js
- jQuery UI, e.g. jquery-ui.min.js and one of the associated themes like jquery-ui.css
Jmol-JSO / JSmol
The new Jmol JavaScript Object library (JSmol) includes part of jQuery, so it should be fully compatible. If you need extra jQuery functionality, you should be careful to avoid conflicts between duplicate jQuery calls.
Prototype
...
Dojo Toolkit
...
Twirlymol, the 'inspiration' for JSmol lite (JSmolTM) uses Dojo.
MochiKit
Uses the $ shorthand global which may conflict with JSmol and JQuery
Used used as the primary JavaScript framework (alongside jQuery) in the eportfolio/CMS Mahara
In Mahara, jQuery is loaded first, $j set as the global, then MochiKit loaded taking ownership of $
YUI3
Uses the YUI global. Y is the shorthand local.
jQuery-YUI Rosetta Stone [1]
