@param str: given string

    @param replace:char to find and replace multiple instances

    Examples::

    >>> recursive_replace("Mighty---Mighty-Bo--sstones",'-')

    'Mighty-Mighty-Bo-sstones'

    """

    if str.find(replace * 2) == -1:

        return str

    else:

        str = str.replace(replace * 2, replace)

        return recursive_replace(str, replace)  

class _ToolTip(object):

    def __call__(self, tooltip_title, trim_at=50):

        """

        Special function just to wrap our text into nice formatted autowrapped

        text

        @param tooltip_title:

        """

        return literal(wrap_paragraphs(tooltip_title, trim_at)\

                       .replace('\n', '<br/>')) 

    def activate(self):

        """

        Adds tooltip mechanism to the given Html all tooltips have to have 

        set class tooltip and set attribute tooltip_title.

        Then a tooltip will be generated based on that

        All with yui js tooltip

        """

        js = '''

        YAHOO.util.Event.onDOMReady(function(){

            function toolTipsId(){

                var ids = [];

                var tts = YAHOO.util.Dom.getElementsByClassName('tooltip');

                for (var i = 0; i < tts.length; i++) {

                    //if element doesn not have and id autgenerate one for tooltip

                    if (!tts[i].id){

                        tts[i].id='tt'+i*100;

                    }

                    ids.push(tts[i].id);

                }

                return ids        

            };

            var myToolTips = new YAHOO.widget.Tooltip("tooltip", { 

                context: toolTipsId(),

                monitorresize:false,

                xyoffset :[0,0],

                autodismissdelay:300000,

                hidedelay:5,

                showdelay:20,

            });

            //Mouse Over event disabled for new repositories since they dont

            //have last commit message

            myToolTips.contextMouseOverEvent.subscribe(

                function(type, args) {

                    var context = args[0];

                    var txt = context.getAttribute('tooltip_title');

                    if(txt){                                       

                        return true;

                    }

                    else{

                        return false;

                    }

                });

            // Set the text for the tooltip just before we display it. Lazy method

            myToolTips.contextTriggerEvent.subscribe( 

                 function(type, args) { 

                        var context = args[0]; 

                        var txt = context.getAttribute('tooltip_title');

                        this.cfg.setProperty("text", txt);

                        // positioning of tooltip

                        var tt_w = this.element.clientWidth;

                        var tt_h = this.element.clientHeight;

                        var context_w = context.offsetWidth;

                        var context_h = context.offsetHeight;

                        var pos_x = YAHOO.util.Dom.getX(context);

                        var pos_y = YAHOO.util.Dom.getY(context);

                        var display_strategy = 'top';

                        switch (display_strategy){

                            case 'top':

                                var cur_x = (pos_x+context_w/2)-(tt_w/2);

                                var cur_y = pos_y-tt_h-4;

                                xy_pos = [cur_x,cur_y];                                

                                break;

                            case 'bottom':

                                var cur_x = (pos_x+context_w/2)-(tt_w/2);

                                var cur_y = pos_y+context_h+4;

                                xy_pos = [cur_x,cur_y];                                

                                break;

                            case 'left':

                                var cur_x = (pos_x-tt_w-4);

                                var cur_y = pos_y-((tt_h/2)-context_h/2);

                                xy_pos = [cur_x,cur_y];                                

                                break;

                            case 'right':

                                var cur_x = (pos_x+context_w+4);

                                var cur_y = pos_y-((tt_h/2)-context_h/2);

                                xy_pos = [cur_x,cur_y];                                

                                break;

                        }

                        this.cfg.setProperty("xy",xy_pos);

                  });

            //Mouse out 

            myToolTips.contextMouseOutEvent.subscribe(

                function(type, args) {

                    var context = args[0];

                });

        });

        '''         

        return literal(js)

tooltip = _ToolTip()

class _FilesBreadCrumbs(object):

    def __call__(self, repo_name, rev, paths):

        url_l = [link_to(repo_name, url('files_home',

                                        repo_name=repo_name,

                                        revision=rev, f_path=''))]

        paths_l = paths.split('/')

        for cnt, p in enumerate(paths_l, 1):

            if p != '':

                url_l.append(link_to(p, url('files_home',

                                            repo_name=repo_name,

                                            revision=rev,

                                            f_path='/'.join(paths_l[:cnt]))))

        return literal(' / '.join(url_l))

files_breadcrumbs = _FilesBreadCrumbs()

def pygmentize(filenode, **kwargs):

    """

    pygmentize function using pygments

    @param filenode:

    """

    return literal(code_highlight(filenode.content, filenode.lexer, HtmlFormatter(**kwargs)))

def pygmentize_annotation(filenode, **kwargs):

    """

    pygmentize function for annotation

    @param filenode:

    """

    color_dict = g.changeset_annotation_colors

    def gen_color():

        import random

        return [str(random.randrange(10, 235)) for _ in xrange(3)]

    def get_color_string(cs):

        if color_dict.has_key(cs):

            col = color_dict[cs]

        else:

            color_dict[cs] = gen_color()

            col = color_dict[cs]

        return "color: rgb(%s) ! important;" % (', '.join(col))

    def url_func(changeset):

        tooltip_html = "<div style='font-size:0.8em'><b>Author:</b> %s<br/><b>Date:</b> %s</b><br/><b>Message:</b> %s<br/></div>" 

        tooltip_html = tooltip_html % (changeset.author,

                                               changeset.date,

                                               tooltip(changeset.message))

        lnk_format = 'r%s:%s' % (changeset.revision,

                                 changeset.raw_id)

        uri = link_to(

                lnk_format,

                url('changeset_home', repo_name='test',

                    revision=changeset.raw_id),

                style=get_color_string(changeset.raw_id),

                class_='tooltip',

                tooltip_title=tooltip_html

              )

        uri += '\n'

        return uri   

    return literal(annotate_highlight(filenode, url_func, **kwargs))

def repo_name_slug(value):

    """

    Return slug of name of repository

    """

    slug = urlify(value)

    for c in """=[]\;'"<>,/~!@#$%^&*()+{}|:""":

        slug = slug.replace(c, '-')

    slug = recursive_replace(slug, '-')

    return slug

flash = _Flash()

}

.delete_icon{

    background: url("/images/icons/delete.png") no-repeat scroll 3px;

    height: 16px;

    padding-left: 20px;

    padding-top: 0px;

    text-align: left;

}

.action_button{

    border:0px;

    display: block;

}

.action_button:hover{

    border:0px;

    font-style:italic;

    cursor: pointer;

}

.flash_msg ul{

	margin:0;

	padding:25px 0px 0px 0px;

}

.error_msg {

	background-color:#FFCFCF;

	background-image: url("/images/icons/error_msg.png");

	border:1px solid #FF9595;

	color:#CC3300;

}

.warning_msg {

	background-color:#FFFBCC;

	background-image: url("/images/icons/warning_msg.png");

	border:1px solid #FFF35E;

	color:#C69E00;

}

.success_msg {

	background-color:#D5FFCF;

	background-image: url("/images/icons/success_msg.png");

	border:1px solid #97FF88;

	color:#009900;

}

.notice_msg {

	background-color:#DCE3FF;

	background-image: url("/images/icons/notice_msg.png");

	border:1px solid #93A8FF;

	color:#556CB5;

}

.success_msg, .error_msg, .notice_msg, .warning_msg{

	background-position:10px center;

	background-repeat:no-repeat;

	font-size:12px;

	font-weight:bold;

	min-height:14px;

	line-height:14px;

	margin-bottom:0px;

	margin-top:0px;

	padding:3px 10px 3px 40px;

	display:block;

	overflow: auto;

}        

#msg_close {

	background:transparent url("icons/cross_grey_small.png")	no-repeat scroll 0 0;

	cursor:pointer;

	height:16px;

	position:absolute;

	right:5px;

	top:5px;

	width:16px;

}

.error-message{

	color:#CC3300;

}

/**** Tooltip ****/

.yui-overlay,

.yui-panel-container {

    visibility:hidden;

    position:absolute;

    z-index: 2;

}

.yui-tt {

    visibility:hidden;

    position:absolute;

    color:#666666;

    background-color:#FFFFFF;

    font-family:arial,helvetica,verdana,sans-serif;

    padding:8px;

    border:2px solid #556CB5;

    font:100% sans-serif;

    width:auto;

}

.yui-tt-shadow {

    display: none;

}

/** end of Tooltip **/ 

div#main {

	padding: 5px;

}

div#container {

	background: #FFFFFF;

	position: relative;

	color: #666;

}

div.page-header {

	padding: 50px 20px 0;

	background: #556cb5 top left repeat-x;

	position: relative;

}

div.page-header h1 {

	margin: 10px 0 30px;

	font-size: 1.8em;

	font-weight: bold;

	font-family: sans-serif;

	letter-spacing: 1px;

	color: #FFFFFF;

}

div.page-header h1 a {

	font-weight: bold;

	color: #FFFFFF;

}

div.page-header a {

	text-decoration: none;

}

div.page-header form {

	position: absolute;

	margin-bottom: 2px;

	bottom: 0;

	right: 20px;

}

div.page-header form label {

	color: #DDD;

}

div.page-header form input {

	padding: 2px;

	border: solid 1px #DDD;

}

div.page-header form dl {

	overflow: hidden;

}

div.page-header form dl dt {

	font-size: 1.2em;

}

div.page-header form dl dt,div.page-header form dl dd {

	margin: 0 0 0 5px;

	float: left;

	height: 24px;

	line-height: 20px;

}

ul.page-nav {

	margin: 10px 0 0 0;

	list-style-type: none;

	overflow: hidden;

	width: 800px;

	padding: 0;

}

ul.page-nav li {

	margin: 0 4px 0 0;

	float: left;

	height: 24px;

	font-size: 1.1em;

	line-height: 24px;

	text-align: center;

	background: #556CB5;

}

ul.page-nav li.current {

	background: #FFF;

	padding-right: 5px;

	padding-left: 5px;

}

// branch_renderer.js - Rendering of branch DAGs on the client side

//

// Copyright 2008 Jesper Noehr <jesper AT noehr DOT org>

// Copyright 2008 Dirkjan Ochtman <dirkjan AT ochtman DOT nl>

// Copyright 2006 Alexander Schremmer <alex AT alexanderweb DOT de>

//

// derived from code written by Scott James Remnant <scott@ubuntu.com>

// Copyright 2005 Canonical Ltd.

//

// This software may be used and distributed according to the terms

// of the GNU General Public License, incorporated herein by reference.

var colors = [

	[ 1.0, 0.0, 0.0 ],

	[ 1.0, 1.0, 0.0 ],

	[ 0.0, 1.0, 0.0 ],

	[ 0.0, 1.0, 1.0 ],

	[ 0.0, 0.0, 1.0 ],

	[ 1.0, 0.0, 1.0 ],

	[ 1.0, 1.0, 0.0 ],

	[ 0.0, 0.0, 0.0 ]

];

function BranchRenderer() {

	this.canvas = document.getElementById("graph_canvas");

	this.ctx = this.canvas.getContext('2d');

	this.ctx.strokeStyle = 'rgb(0, 0, 0)';

	this.ctx.fillStyle = 'rgb(0, 0, 0)';

	this.cur = [0, 0];

	this.max_column = 1;

	this.line_width = 3;

	this.bg = [0, 4];

	this.cell = [2, 0];

	this.revlink = '';

	this.scale = function(height) {

		this.box_size = Math.floor(height/1.2);

		this.cell_height = this.box_size;

		this.bg_height = height;

	}

	this.setColor = function(color, bg, fg) {

		color %= colors.length;

		var red = (colors[color][0] * fg) || bg;

		var green = (colors[color][1] * fg) || bg;

		var blue = (colors[color][2] * fg) || bg;

		red = Math.round(red * 255);

		green = Math.round(green * 255);

		blue = Math.round(blue * 255);

		var s = 'rgb(' + red + ', ' + green + ', ' + blue + ')';

		this.ctx.strokeStyle = s;

		this.ctx.fillStyle = s;

	}

	this.render = function(data) {

		var idx = 1;

		var rela = document.getElementById('graph');

		var pad = 160;

		var scale = 20;

		for (var i in data) {

			this.scale(scale);

			var row = document.getElementById("chg_"+idx);

			var	next = document.getElementById("chg_"+idx+1);

			var extra = 0;

			//skip this since i don't have DATE in my app

			//if (next.is('.changesets-date')) {

			//	extra = next.outerHeight();

			//}

			this.cell[1] += row.clientWidth;

			this.bg[1] += this.bg_height;

			cur = data[i];

			nodeid = cur[0];

			node = cur[1];

			in_l = cur[2];

			for (var j in in_l) {

				line = in_l[j];

				start = line[0];

				end = line[1];

				color = line[2];

				if (start > this.max_column) {

					this.max_column = start;

				}

				if (end > this.max_column) {

					this.max_column = end;

				}

				this.setColor(color, 0.0, 0.65);

				y = row.offsetTop-rela.offsetTop+4;

				x = pad-((this.cell[0] + this.box_size * start - 1) + this.bg_height-2);

				this.ctx.beginPath();

				this.ctx.moveTo(x, y);

				//i don't know why it's +1 just fixes some drawing graph.

				y += row.clientHeight+1;

				x = pad-((1 + this.box_size * end) + this.bg_height-2);

				this.ctx.lineTo(x,y+extra);

				this.ctx.stroke();

			}

			column = node[0]

			color = node[1]

			radius = 4;

			y = row.offsetTop-rela.offsetTop+4;

			x = pad-(Math.round(this.cell[0] * scale/2 * column + radius) + 15 - (column*4));

			this.ctx.beginPath();

			this.setColor(color, 0.25, 0.75);

			this.ctx.arc(x, y, radius, 0, Math.PI * 2, true);

			this.ctx.fill();