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

Modules

  • Home
  • Featured
  • Popular
  • New
  • All

Documentation

  • FAQ
  • Developer FAQ
  • Developer Guide
  • Module Setup

Context Navigation

    Setup Info for: My Custom Module

    Your module is now pending review. 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
    • YUIDoc
    • YUICompressor
    • YUILibrary.com
    • YUI Build Tool
    • YUI PHP Loader
    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