[[PageOutline(2-5,Contents,pullout)]]

= Tweak the Trac user interface

== Description

This plugin implements a Javascript deployment platform, which enables Trac administrators to easily tweak Trac pages by using Javascript.

Key features:
 * Apply different javascripts to different pages by matching regular expression.
 * Supports Trac web admin.

=== Admin Trac Tweak UI with addon javascript plugins

 1. Enter Trac's '''Web Admin''', select '''TracTweakUI Admin'''.
 1. Add url path(regular expression): '''/newticket'''.
 1. Select '''/newticket''', then select filter '''editcc'''.
 1. Click '''Load Default''', and edit filter javascript, then '''Save'''.
 1. Now click '''New Ticket''' to test the '''editcc''' Javascript plugin.
 
'''The administration page:'''

[[Image(trac_tweakui_demo_1.png, border=2)]]

'''The edit-cc feature:'''

[[Image(trac_editcc.png, border=2)]]

=== Admin Trac Tweak UI with any other Javascript plugins

 1. Take [http://plugins.jquery.com/project/ac autocomplete] for instance.
 1. Prepare autocomplete directory in the Trac environment:
  {{{#!sh
$ mkdir /path/to/trac/environment/htdocs/tractweakui/autocomplete
$ cp main.css /path/to/trac/environment/htdocs/tractweakui/autocomplete/
$ cp jquery.autocomplete.css /path/to/trac/environment/htdocs/tractweakui/autocomplete/
$ cp jquery.autocomplete.js /path/to/trac/environment/htdocs/tractweakui/autocomplete/
$ cp jquery.bgiframe.min.js /path/to/trac/environment/htdocs/tractweakui/autocomplete/
$ cp indicator.gif /path/to/trac/environment/htdocs/tractweakui/autocomplete/
$ touch /path/to/trac/environment/htdocs/tractweakui/autocomplete/__template__.js
}}}
 1. Edit `__template__.js` (optional):
 {{{#!js
jQuery(function($) {
	var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
	$("#field-cc").autocomplete(months);
});
}}}
 1. Now you can admin and test autocomplete Javascript plugins as described above.

Alternative: the AddStaticResourcesPlugin accomplishes many of the same goals of this plugin. Very simple deployment and trac.ini configuration, ie no webadmin screens. Doesn't require an environment upgrade.

See: '''ZoomQuiet''' ~ Collection KSPEG Trac hacking

== Bugs/Feature Requests

Existing bugs and feature requests for TracTweakUiPlugin are 
[report:9?COMPONENT=TracTweakUiPlugin here].

If you have any issues, create a 
[/newticket?component=TracTweakUiPlugin new ticket].

[[TicketQuery(component=TracTweakUiPlugin&group=type,format=progress)]]

== Download

Download the zipped source from [export:tractweakuiplugin here].

== Source

You can check out TracTweakUiPlugin from [/svn/tractweakuiplugin here] using Subversion, or [source:tractweakuiplugin browse the source] with Trac.

== Installation

General instructions on installing Trac plugins can be found on the [TracPlugins#InstallingaTracplugin TracPlugins] page.

Enable the plugin with the following rule:
{{{#!ini
[components]
tractweakui.* = enabled
}}}

== Recent Changes

[[ChangeLog(tractweakuiplugin, 3)]]

== Author/Contributors

'''Author:''' [wiki:richard] [[BR]]
'''Maintainer:''' [[Maintainer]] [[BR]]
'''Contributors:'''