YUILibrary - Open source JavaScript and CSS for building richly interactive software.
Fork YUI on GitHub
  • Home
  • Gallery
  • Forums
  • YUI 2
  • YUI 3
  • YUI Labs
  • YUI Compressor
  • More
  • Gallery Forums
  • Gallery Stats
  • Gallery Calendar
  • Register
  • Login

Modules

  • Home
  • Featured
  • Popular
  • New
  • All

Documentation

  • FAQ
  • Developer FAQ
  • Developer Guide
  • Module Setup

Tag Cloud

plugin event jacobfogg skinnable widget io jsonp caridy tivac foxxtrot port slideshow node jafl lsmith form overlay ajax adam ericf apipkin nzakas rgrove yui2 animation davglass

Context Navigation

    Setup Info for: My Custom Module

    Here are a few things you can do to get your module and its source code ready for the CDN.

    • If you have not already done so, you need to fork the yui3-gallery project on GitHub.

      If you are not familiar with the procedure for forking a project, Github provides a detailed guide on forking here.

    • You then need to clone the builder project as well. Note that this needs to be cloned in the same directory as your yui3-gallery fork.
      git clone git://github.com/yui/builder.git
    • You also need a working version of Java and Ant installed. You can test your configuration with these commands:
      ant -version
      //Prints something like:
      Apache Ant version 1.7.0 compiled on July 20 2009
      
      java -version
      //Prints something like:
      java version "1.6.0_15"       

    Build File Setup

    After you fork the yui3-gallery project, you need to configure your build files so you can create the files needed for a CDN push.

    cd yui3-gallery
    
    mkdir build/gallery-my.custom.module
    mkdir -p src/gallery-my.custom.module/js src/gallery-my.custom.module/tests
    mkdir -p sandbox/{username}/gallery-my.custom.module
    
    touch src/gallery-my.custom.module/build.xml
    
    touch src/gallery-my.custom.module/build.properties
    
    touch src/gallery-my.custom.module/js/my.custom.module.js
    

    Sample build.xml

    <?xml version="1.0" encoding="UTF-8"?>
    <!-- YUI 3 Gallery Component Build File -->
    <project name="My Custom Module" default="local">
        <description>My Custom Module Build File</description>
        <property file="build.properties" />
        <import file="${builddir}/3.x/bootstrap.xml" description="Default Build Properties and Targets" />
    </project>

    Sample build.properties

    # My Custom Module Build Properties
     
    # As long as the 'builder' project is cloned to the default folder
    # next to the 'yui3-gallery' project folder, the 'builddir' property does not 
    # need to be changed
    #
    # If the 'builder' project is checked out to an alternate location, this
    # property should be updated to point to the checkout location.
    builddir=../../../builder/componentbuild
     
    # The name of the component. E.g. event, attribute, widget 
    component=gallery-my.custom.module
     
    # The list of files which should be concatenated to create the component.
    # NOTE: For a css component (e.g. cssfonts, cssgrids etc.) use component.cssfiles instead. 
    # component.jsfiles=my.custom.module.js, my.custom.moduleHelperClass.js, my.custom.moduleSubComponentClass.js
    component.jsfiles=my.custom.module.js
     
    # The list of modules this component requires. Used to set up the Y.add module call for YUI 3.
    component.requires=node, event
     
    # The list of modules this component supersedes. Used to set up the Y.add module call for YUI 3.
    component.supersedes=another.custom.module
     
    # The list of modules that are optional for this module. Used to set up the Y.add module call for YUI 3.
    component.optional=
     

    Sample Javascript File

    /*
    * This wrapper code is added by the build system.
    * It's only here for informational purposes.
    */
    YUI.add('gallery-my.custom.module', function(Y) {
     
        //Add the code for your module here.
        //Here "Y" is the YUI instance this module was added to.
     
    }, '@VERSION@' ,{requires:['node',' event']});

    Building your module

    Building your module is as simple as running ant all from the source directory of your module.

    cd src/gallery-my.custom.module
    
    ant all
    
    YUI Projects
    • All YUI Downloads
    • YUI 2
    • YUI 3
    • YUI Doc
    • YUI Compressor
    • YUILibrary.com
    • YUI Build Tool
    • YUI PHP Loader
    YUI Labs
    • All YUI Labs Projects
    • Yeti
    Pages & Links
    • All YUI Downloads
    • Git FAQ
    • Graded Browser Support
    • Contribute to YUI
    • Forum Stats
    • Gallery Stats
    • YUI Calendar
    Contribute
    • Submit a Bug
    • Request a Feature
    • Write Code
    • Meet the Team
    Follow YUI
    • on GitHub
    • on Twitter
    • on FriendFeed
    • on Facebook
    • on IRC
    • YUI Blog
    • YUI Theater
    • YUI Forums

    © 2010 YUI Library - Site Credits