Skip to content

Developing

Jump to bottom
bittner edited this page Jul 1, 2012 · 19 revisions

Source Code

The Pyjs project repositories are now hosted on Github. For read-only access, e.g. to Pyjs' main repository, use the following:

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

Contributing is easy with GitHub: Simply fork the project, apply your changes, and make a pull request. (If you are not yet familiar with GitHub, you'll find the "Fork" and "Pull Request" buttons on the top right of the Pyjs project page.) Your pull request will then be reviewed and merged into Pyjs' main repository by one of the project administrators.

Pyjs Developer Guidelines

In the Pyjs repository is a file DEVELOPER.RULES. As long as you follow those rules, you can do what you like. The trickiest part about Pyjs is remembering that it is several separate projects. For example: modifying the javascript compiler has absolutely nothing to do with Pyjs Desktop. But, modifying a Pyjs UI Widget requires testing on eight platforms (five web and three desktop) including compiling and testing using both --strict and -O on the five web platforms, and testing under nearly ten web browsers (Firefox 2 to 4; Opera 9 to 10.5; Safari 3 and 4; Google Chrome; IE 6 and above, and so on). Clearly, this is an impossible task but you should make the best efforts and use your judgement, and ask for help on the mailing list.

Lastly - please use the bugtracker to report bugs (regardless of how trivial or small); the mailing list to coordinate discussions; the Pyjs wiki to create HOWTOs and so on.

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.

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/
Just ignore that for now
/contrib/
Miscellaneous helper scripts
/dev/
Just ignore that for now
/doc/
The content of pyjs.org is here
/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)
/tests/
Just ignore that for now
bootstrap
The script through which everything starts
/test.py
Very useful to easily launch unit-tests (especially libtest) on several engines

Key points to remember:

  • the "/pyjs" part is only used in translated mode, other libraries are used both for translated (browser, pyv8, pysm...) and non-translated (pyjd) modes
  • each widget is split between "/library/pyjamas/ui/" and "/library/gwt/ui/" trees, to differenciate legacy and Pyjs-added features
  • for testing, "/test.py" and compiled "/examples/libtest" are your best allies
Clone this wiki locally