Skip to content

X:DevelopersHeadsUp

Jump to bottom
Nicolas Rannou edited this page Apr 30, 2014 · 10 revisions

The following steps show how to actively contribute to the X Toolkit (XTK). A good place to check for potential contributions is the Future Development page.

Also, best would be to sent an email to [email protected] and tell us about your plans or send us your questions. We would also like to add you to this mailing list to better coordinate the overall development.

For some help with GIT, check this: http://book.git-scm.com/

Get the code

1. Fork XTK on Github to get the latest sources 

 http://github.com/XTK/X

2. Clone it to your hard drive 

 git clone [email protected]:<YOURUSERNAME>/X.git

3. Update the git submodules 

 cd X
 git submodule init
 git submodule update

4. Create a branch named after the planned contribution, check it out and work on this branch

Running XTK during development

  • Re-build the xtk-deps.js file in your XTK source tree after introducing new files/classes.
 cd utils/
 ./deps.py
  • The following .html page is a small example showing how to run the sources directly without compilation. Therefore, we include the base.js for Google Closure and the xtk-deps.js for XTK at the top of the code.
<html>
<head>
<title>XTK TEST WITHOUT COMPILATION</title>

<script type="text/javascript" src="../X/lib/google-closure-library/closure/goog/base.js"></script>
<script type="text/javascript" src="../X/xtk-deps.js"></script>

<script type="text/javascript">

  // include all used X-classes here
  // this is only required when using the xtk-deps.js file
  goog.require('X.renderer3D');
  goog.require('X.cube');

  var run = function() {
    
    var r = new X.renderer3D();
    r.container = 'r';
    r.init();
    
    var cube = new X.cube();
    
    r.add(cube);

    r.render();
     
  };
</script>

<body onload="run()">
  
  
  <div id="r" style="background-color: #000000; width: 100%; height: 100%;"></div>
    
</body>
  • Now it is possible to change the XTK sources and just reload the HTML code from above to immediately test it. Perfect for development :)

Testing the compiled version of XTK

  • After a development milestone has been reached, it makes sense to try the modified XTK source as a compiled xtk.js file. This checks f.e. for proper @jsdoc-annotations and runs a couple of tests. The following commands use the Google Closure Compiler to create an experimental build and send the results to the XTK dashboard.
 cd utils
 ./build.py
 ./test.py -b
 ./upload.py
  • If no errors and warnings appear you're good to go and test the example from above against the compiled and minified xtk.js file. Move the xtk.js file to the folder of the HTML code and modify the latter like this:
<html>
<head>
<title>XTK TEST COMPILED!</title>

<script type="text/javascript" src="xtk.js"></script>

<script type="text/javascript">
  var run = function() {
    
    var r = new X.renderer3D();
    r.container = 'r';
    r.init();
    
    var cube = new X.cube();
    
    r.add(cube);

    r.render();
     
  };
</script>

<body onload="run()">
  
  
  <div id="r" style="background-color: #000000; width: 100%; height: 100%;"></div>
    
</body>

Sending it upstream

  • Finally, after the modified sources of XTK are feature-complete and well-tested :), merge your development branch back to your (freshly pulled) master and send a pull request using github.
Thanks!
Clone this wiki locally