Develop

Source Code

The pyjs repositories are hosted on Github. For read-only access to pyjs' main repository use the following:

git clone https://github.com/pyjs/pyjs.git

If you want to add contributions to the project source code see Contribute for details.

How to set up a Web development environment

Web application development can be tricky: it can come as a bit of a shock when compared to Python app development to learn that web browsers do not come with any proper debugging assistance whatsoever, by default. You will need to install and/or enable a debugger in the browsers that you use:

For debug output using pyjs' logging module is recommended (see below for details).

You should also note that the pyjs compiler has a -d option which will enable a Python-like stack trace when a JavaScript exception occurs. The amount of JavaScript generated can be FIVE times larger, so only enable this during development.

Lastly, it is worth reiterating that pyjs Desktop runs as pure Python: you should give serious consideration to running the application under pyjs Desktop alongside developing it for the browser. The availability of Python runtime stack traces and the simple fact that the standard Python interpreter is much better at catching certain kinds of errors than (brain-damaged) browsers has generally found to make life much much easier.

Debug Output

With pyjs you can use full Python-style logging (Python's flexible event logging module has been ported to pyjs). Additional handlers allow you to display log messages in a dedicated div element in the HTML document, in the Web browser's error console, and with JavaScript's alert() function.

from pyjamas import logging
log = logging.getConsoleLogger()   # other loggers: Alert, Append, Print ...
...
log.error("Hello, here is an %s error", err_name)

For a good understanding of the logging module read the Python Logging HOWTO; most of it directly applies to pyjs. Additional loggers provided by pyjs, and how you'd use them:

  1. AlertLogger: log = logging.getAlertLogger() shows a browser alert popup dialog for each log message.
  2. AppendLogger: log = logging.getAppendLogger() appends text to the end of the HTML document body. The div element holding the log messages can be accessed by its element ID ('logging_<loggername>', which defaults to 'logging_pyjs') for styling.
  3. ConsoleLogger: log = logging.getConsoleLogger() passes log messages on to the error console of Firebug/Chrome/Opera/IE8+ using the console logging functions.
  4. PrintLogger: log = logging.getPrintLogger() prints text to cerr, the default error output stream. This is a good choice when developing/testing with pyjs Desktop.
  5. NullLogger: log = logging.getNullLogger() disable logging completely and safely.

Enable additional debug information in JavaScript

pyjsbuild command line switch -d, --enable-debug generates a vast amount of extra information for every single line of code in JavaScript. This blows up your code size drastically, use it as the last resort.

Building User Interfaces with pyjs

To become familiar with the user interface side of pyjs, you might like to refer to the examples online and also compile and run them locally.

You might find the ui module class hierarchy useful. The ui module contains all of the main classes you need to create your user interface. At first, this module can be a quite confusing because of the number of classes defined. However, there is API documentation, along with a tutorial on how to create your own interactive widget.

You might also have a look at the GWT Documentation for widgets that have been ported to pyjs.

Sources Overview

The pyjs repo contains both shared libraries (usable in Python or JavaScript mode), and "runners" that execute the code (Python or JavaScript) on a particular engine. Here is a quick what-is-what.

/addons/
Contributed libraries, added to the pythonpath when translating code to js
/bin/
Executables created when bootstrapping appear here
/builder/
Boilerplate files etc. for pyjs_build's building process
/contrib/
Miscellaneous helper scripts
/doc/
Documentation, tutorials, and scripts that build them
/examples/
Lots of examples with their build scripts (also used to test all is ok)
/examples/libtest/
Used for unit-testing, build it and launch it to have in-browser tests performed
/library/
All common widgets and utilities, with platform overides when necessary
/library/gwt/
libs tracking original gwt sources, without improvements
/library/pyjamas/
libs mirroring and cross-linking gwt/ ones, to add pyjs-specific features
/pgen/
Python parsing suite recoded in python
/pygtkweb/
Just ignore that for now
/pyjd/
Desktop runner (executes non-translated code, on several possible backends)
/pyjs/
Actual python-to-js tools: translator, browser linker, python builtins and stdlib recoded for javascript
/pysm/
Spidermonkey runner (executes js code on that js engine)
/pyv8/
Google V8 runner (executes js code on that js engine)
/bootstrap.py
The script through which everything starts
/test.py
Very useful to easily launch unit-tests (especially libtest) on several engines

Key points to remember: