• State Resolved
  • Locked Locked
  • Replies 3 replies
  • Answers 1 answer
  • Subscribers 56 subscribers
  • Views 750 views
  • Users 0 members are here
Support feedback
Options
Options
Related

This thread has been locked.

If you have a related question, please click the "Ask a related question" button in the top right corner. The newly created question will be automatically linked to this question.

jquery scripts in gui composer for animations.

Manoj R
Intellectual 1595 points

Can I get some help on running JQUERY scripts in GUI composer.I am new to this tools as well as html

I need  animations in my GUI so i need to use jquery.

  • 0
    TI__Genius 15820 points

    Hi Manoj,

    We are very familiar with Jquery. GUI Composer is mostly leveraging DOJO toolkit libraries. However, I have found some tutorials on jquery website that should help you get started. http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

    You may also look at this topic http://docs.jquery.com/Using_jQuery_with_Other_Libraries to ensure that jquery does not conflict with Dojo. 

    You would need to add your javascript code to app.html, which is the main html page that contains widgets added through GUI Composer. 

    Martin

  • 0
    TI__Genius 16630 points

    Hi,

    You need to code this by hand, switch to source mode from the graphical editor or open up an external editor and include the jquery .js file into your app.html file. You should be able to call into jquery to perform animation. 

    You should be able to follow the example from this link to perform animation on GUI Composer widget.

    http://docs.jquery.com/Effects/animate

    Patrick

  • 0
    Prodigy 20 points

    Depending on your requirements, you may also be able to use Dojo's FX library.  More information (including a link to the animation tutorial) can be found in the Dojo Reference Guide, under dojo/fx: https://dojotoolkit.org/reference-guide/1.8/dojo/fx.html

    If you're set on using jQuery, open your app.html file and switch to the source editor as described by MartinS and patch.  Then add a script tag that points to the jQuery you'd like to use:

    For example, to use jQuery 1.7.1 (included in GUIComposer for some components), add the following line in the <head> section:

    <script type="text/javascript" src="lib/davinci.gc_1_0/WebContent/gc/dijit/libs/jquery/jquery.min.js"></script>

    To use a more recent jQuery from a CDN (Content Delivery Network), use something like:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

    After you've added the script tag to app.html, save the file and open app.js to add your custom functionality.