summary.html
646 lines
| 20.8 KiB
| text/html
|
HtmlLexer
| r547 | <%inherit file="/base/base.html"/> | ||
| <%def name="title()"> | |||
| r619 | ${c.repo_name} ${_('Summary')} - ${c.rhodecode_name} | ||
| r547 | </%def> | ||
| <%def name="breadcrumbs_links()"> | |||
| ${h.link_to(u'Home',h.url('/'))} | |||
| » | |||
| ${h.link_to(c.repo_name,h.url('summary_home',repo_name=c.repo_name))} | |||
| » | |||
| ${_('summary')} | |||
| </%def> | |||
| <%def name="page_nav()"> | |||
| ${self.menu('summary')} | |||
| </%def> | |||
| <%def name="main()"> | |||
| <div class="box box-left"> | |||
| <!-- box / title --> | |||
| <div class="title"> | |||
| ${self.breadcrumbs()} | |||
| </div> | |||
| <!-- end box / title --> | |||
| <div class="form"> | |||
| <div class="fields"> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Name')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| r637 | %if c.repo_info.dbrepo.repo_type =='hg': | ||
| <img style="margin-bottom:2px" class="icon" title="${_('Mercurial repository')}" alt="${_('Mercurial repository')}" src="/images/icons/hgicon.png"/> | |||
| %endif | |||
| %if c.repo_info.dbrepo.repo_type =='git': | |||
| <img style="margin-bottom:2px" class="icon" title="${_('Git repository')}" alt="${_('Git repository')}" src="/images/icons/giticon.png"/> | |||
| %endif | |||
| r636 | |||
| r547 | %if c.repo_info.dbrepo.private: | ||
| r636 | <img style="margin-bottom:2px" class="icon" title="${_('private repository')}" alt="${_('private repository')}" src="/images/icons/lock.png"/> | ||
| r547 | %else: | ||
| r636 | <img style="margin-bottom:2px" class="icon" title="${_('public repository')}" alt="${_('public repository')}" src="/images/icons/lock_open.png"/> | ||
| r547 | %endif | ||
| <span style="font-size: 1.6em;font-weight: bold;vertical-align: baseline;">${c.repo_info.name}</span> | |||
| r793 | %if c.rhodecode_user.username != 'default': | ||
| %if c.following: | |||
| <span id="follow_toggle" class="following" title="${_('Stop following this repository')}" | |||
| onclick="javascript:toggleFollowingRepo(${c.repo_info.dbrepo.repo_id},'${str(h.get_token())}')"> | |||
| </span> | |||
| %else: | |||
| <span id="follow_toggle" class="follow" title="${_('Start following this repository')}" | |||
| onclick="javascript:toggleFollowingRepo(${c.repo_info.dbrepo.repo_id},'${str(h.get_token())}')"> | |||
| </span> | |||
| %endif | |||
| %endif: | |||
| r547 | <br/> | ||
| %if c.repo_info.dbrepo.fork: | |||
| <span style="margin-top:5px"> | |||
| <a href="${h.url('summary_home',repo_name=c.repo_info.dbrepo.fork.repo_name)}"> | |||
| <img class="icon" alt="${_('public')}" | |||
| title="${_('Fork of')} ${c.repo_info.dbrepo.fork.repo_name}" | |||
| src="/images/icons/arrow_divide.png"/> | |||
| ${_('Fork of')} ${c.repo_info.dbrepo.fork.repo_name} | |||
| </a> | |||
| </span> | |||
| %endif | |||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Description')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| r690 | ${c.repo_info.dbrepo.description} | ||
| r547 | </div> | ||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Contact')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| <div class="gravatar"> | |||
| <img alt="gravatar" src="${h.gravatar_url(c.repo_info.dbrepo.user.email)}"/> | |||
| </div> | |||
| ${_('Username')}: ${c.repo_info.dbrepo.user.username}<br/> | |||
| ${_('Name')}: ${c.repo_info.dbrepo.user.name} ${c.repo_info.dbrepo.user.lastname}<br/> | |||
| ${_('Email')}: <a href="mailto:${c.repo_info.dbrepo.user.email}">${c.repo_info.dbrepo.user.email}</a> | |||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Last change')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| r635 | ${h.age(c.repo_info.last_change)} - ${c.repo_info.last_change} | ||
| r547 | ${_('by')} ${h.get_changeset_safe(c.repo_info,'tip').author} | ||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Clone url')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| <input type="text" id="clone_url" readonly="readonly" value="hg clone ${c.clone_repo_url}" size="70"/> | |||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| r763 | <label>${_('Trending source files')}:</label> | ||
| r547 | </div> | ||
| <div class="input-short"> | |||
| <div id="lang_stats"> | |||
| </div> | |||
| <script type="text/javascript"> | |||
| r763 | YUE.onDOMReady(function(e){ | ||
| id = 'clone_url'; | |||
| YUE.on(id,'click',function(e){ | |||
| YUD.get('clone_url').select(); | |||
| }) | |||
| }) | |||
| r547 | var data = ${c.trending_languages|n}; | ||
| var total = 0; | |||
| var no_data = true; | |||
| for (k in data){ | |||
| total += data[k]; | |||
| no_data = false; | |||
| } | |||
| var tbl = document.createElement('table'); | |||
| tbl.setAttribute('class','trending_language_tbl'); | |||
| r763 | var cnt =0; | ||
| r547 | for (k in data){ | ||
| r763 | cnt+=1; | ||
| var hide = cnt>2; | |||
| r547 | var tr = document.createElement('tr'); | ||
| r763 | if (hide){ | ||
| tr.setAttribute('style','display:none'); | |||
| tr.setAttribute('class','stats_hidden'); | |||
| } | |||
| r547 | var percentage = Math.round((data[k]/total*100),2); | ||
| var value = data[k]; | |||
| var td1 = document.createElement('td'); | |||
| td1.width=150; | |||
| var trending_language_label = document.createElement('div'); | |||
| trending_language_label.innerHTML = k; | |||
| td1.appendChild(trending_language_label); | |||
| var td2 = document.createElement('td'); | |||
| r693 | td2.setAttribute('style','padding-right:14px !important'); | ||
| r547 | var trending_language = document.createElement('div'); | ||
| r763 | var nr_files = value+" ${_('files')}"; | ||
| trending_language.title = k+" "+nr_files; | |||
| if (percentage>20){ | |||
| trending_language.innerHTML = "<b style='font-size:0.8em'>"+percentage+"% "+nr_files+ "</b>"; | |||
| } | |||
| else{ | |||
| trending_language.innerHTML = "<b style='font-size:0.8em'>"+percentage+"%</b>"; | |||
| } | |||
| r611 | trending_language.setAttribute("class", 'trending_language top-right-rounded-corner bottom-right-rounded-corner'); | ||
| r547 | trending_language.style.width=percentage+"%"; | ||
| td2.appendChild(trending_language); | |||
| tr.appendChild(td1); | |||
| tr.appendChild(td2); | |||
| tbl.appendChild(tr); | |||
| r763 | if(cnt == 2){ | ||
| var show_more = document.createElement('tr'); | |||
| var td=document.createElement('td'); | |||
| lnk = document.createElement('a'); | |||
| lnk.href='#'; | |||
| lnk.innerHTML = "${_("show more")}"; | |||
| lnk.id='code_stats_show_more'; | |||
| td.appendChild(lnk); | |||
| show_more.appendChild(td); | |||
| show_more.appendChild(document.createElement('td')); | |||
| tbl.appendChild(show_more); | |||
| } | |||
| r547 | |||
| } | |||
| if(no_data){ | |||
| var tr = document.createElement('tr'); | |||
| var td1 = document.createElement('td'); | |||
| r810 | td1.innerHTML = "${c.no_data_msg}"; | ||
| r547 | tr.appendChild(td1); | ||
| tbl.appendChild(tr); | |||
| } | |||
| r763 | YUD.get('lang_stats').appendChild(tbl); | ||
| YUE.on('code_stats_show_more','click',function(){ | |||
| l = YUD.getElementsByClassName('stats_hidden') | |||
| for (e in l){ | |||
| YUD.setStyle(l[e],'display',''); | |||
| }; | |||
| YUD.setStyle(YUD.get('code_stats_show_more'), | |||
| 'display','none'); | |||
| }) | |||
| r547 | </script> | ||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Download')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| %for cnt,archive in enumerate(c.repo_info._get_archives()): | |||
| %if cnt >=1: | |||
| | | |||
| %endif | |||
| ${h.link_to(c.repo_info.name+'.'+archive['type'], | |||
| h.url('files_archive_home',repo_name=c.repo_info.name, | |||
| r872 | fname='tip'+archive['extension']),class_="archive_icon")} | ||
| r547 | %endfor | ||
| </div> | |||
| </div> | |||
| <div class="field"> | |||
| <div class="label"> | |||
| <label>${_('Feeds')}:</label> | |||
| </div> | |||
| <div class="input-short"> | |||
| ${h.link_to(_('RSS'),h.url('rss_feed_home',repo_name=c.repo_info.name),class_='rss_icon')} | |||
| ${h.link_to(_('Atom'),h.url('atom_feed_home',repo_name=c.repo_info.name),class_='atom_icon')} | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div class="box box-right" style="min-height:455px"> | |||
| <!-- box / title --> | |||
| <div class="title"> | |||
| <h5>${_('Commit activity by day / author')}</h5> | |||
| </div> | |||
| <div class="table"> | |||
| r800 | |||
| %if c.no_data: | |||
| r917 | <div style="padding:0 10px 10px 15px;font-size: 1.2em;">${c.no_data_msg} | ||
| %if h.HasPermissionAll('hg.admin')('enable stats on from summary'): | |||
| [${h.link_to(_('enable'),h.url('edit_repo',repo_name=c.repo_name))}] | |||
| %endif | |||
| </div> | |||
| r800 | %endif: | ||
| r663 | <div id="commit_history" style="width:460px;height:300px;float:left"></div> | ||
| r547 | <div style="clear: both;height: 10px"></div> | ||
| r663 | <div id="overview" style="width:460px;height:100px;float:left"></div> | ||
| r547 | |||
| <div id="legend_data" style="clear:both;margin-top:10px;"> | |||
| <div id="legend_container"></div> | |||
| <div id="legend_choices"> | |||
| <table id="legend_choices_tables" style="font-size:smaller;color:#545454"></table> | |||
| </div> | |||
| </div> | |||
| <script type="text/javascript"> | |||
| /** | |||
| * Plots summary graph | |||
| * | |||
| * @class SummaryPlot | |||
| * @param {from} initial from for detailed graph | |||
| * @param {to} initial to for detailed graph | |||
| * @param {dataset} | |||
| * @param {overview_dataset} | |||
| */ | |||
| function SummaryPlot(from,to,dataset,overview_dataset) { | |||
| var initial_ranges = { | |||
| "xaxis":{ | |||
| "from":from, | |||
| "to":to, | |||
| }, | |||
| }; | |||
| var dataset = dataset; | |||
| var overview_dataset = [overview_dataset]; | |||
| r763 | var choiceContainer = YUD.get("legend_choices"); | ||
| var choiceContainerTable = YUD.get("legend_choices_tables"); | |||
| var plotContainer = YUD.get('commit_history'); | |||
| var overviewContainer = YUD.get('overview'); | |||
| r547 | |||
| var plot_options = { | |||
| bars: {show:true,align:'center',lineWidth:4}, | |||
| legend: {show:true, container:"legend_container"}, | |||
| points: {show:true,radius:0,fill:false}, | |||
| yaxis: {tickDecimals:0,}, | |||
| xaxis: { | |||
| mode: "time", | |||
| timeformat: "%d/%m", | |||
| min:from, | |||
| max:to, | |||
| }, | |||
| grid: { | |||
| hoverable: true, | |||
| clickable: true, | |||
| autoHighlight:true, | |||
| color: "#999" | |||
| }, | |||
| //selection: {mode: "x"} | |||
| }; | |||
| var overview_options = { | |||
| legend:{show:false}, | |||
| bars: {show:true,barWidth: 2,}, | |||
| shadowSize: 0, | |||
| xaxis: {mode: "time", timeformat: "%d/%m/%y",}, | |||
| r801 | yaxis: {ticks: 3, min: 0,tickDecimals:0,}, | ||
| r547 | grid: {color: "#999",}, | ||
| selection: {mode: "x"} | |||
| }; | |||
| /** | |||
| *get dummy data needed in few places | |||
| */ | |||
| function getDummyData(label){ | |||
| return {"label":label, | |||
| "data":[{"time":0, | |||
| "commits":0, | |||
| "added":0, | |||
| "changed":0, | |||
| "removed":0, | |||
| }], | |||
| "schema":["commits"], | |||
| "color":'#ffffff', | |||
| } | |||
| } | |||
| /** | |||
| * generate checkboxes accordindly to data | |||
| * @param keys | |||
| * @returns | |||
| */ | |||
| function generateCheckboxes(data) { | |||
| //append checkboxes | |||
| var i = 0; | |||
| choiceContainerTable.innerHTML = ''; | |||
| for(var pos in data) { | |||
| data[pos].color = i; | |||
| i++; | |||
| if(data[pos].label != ''){ | |||
| choiceContainerTable.innerHTML += '<tr><td>'+ | |||
| '<input type="checkbox" name="' + data[pos].label +'" checked="checked" />' | |||
| +data[pos].label+ | |||
| '</td></tr>'; | |||
| } | |||
| } | |||
| } | |||
| /** | |||
| * ToolTip show | |||
| */ | |||
| function showTooltip(x, y, contents) { | |||
| var div=document.getElementById('tooltip'); | |||
| if(!div) { | |||
| div = document.createElement('div'); | |||
| div.id="tooltip"; | |||
| div.style.position="absolute"; | |||
| div.style.border='1px solid #fdd'; | |||
| div.style.padding='2px'; | |||
| div.style.backgroundColor='#fee'; | |||
| document.body.appendChild(div); | |||
| } | |||
| r763 | YUD.setStyle(div, 'opacity', 0); | ||
| r547 | div.innerHTML = contents; | ||
| div.style.top=(y + 5) + "px"; | |||
| div.style.left=(x + 5) + "px"; | |||
| var anim = new YAHOO.util.Anim(div, {opacity: {to: 0.8}}, 0.2); | |||
| anim.animate(); | |||
| } | |||
| /** | |||
| r730 | * This function will detect if selected period has some changesets | ||
| for this user if it does this data is then pushed for displaying | |||
| Additionally it will only display users that are selected by the checkbox | |||
| r547 | */ | ||
| function getDataAccordingToRanges(ranges) { | |||
| var data = []; | |||
| var keys = []; | |||
| for(var key in dataset){ | |||
| var push = false; | |||
| r730 | |||
| r547 | //method1 slow !! | ||
| r730 | //* | ||
| r547 | for(var ds in dataset[key].data){ | ||
| commit_data = dataset[key].data[ds]; | |||
| if (commit_data.time >= ranges.xaxis.from && commit_data.time <= ranges.xaxis.to){ | |||
| push = true; | |||
| break; | |||
| } | |||
| } | |||
| r730 | //*/ | ||
| r547 | /*//method2 sorted commit data !!! | ||
| r730 | |||
| r547 | var first_commit = dataset[key].data[0].time; | ||
| var last_commit = dataset[key].data[dataset[key].data.length-1].time; | |||
| if (first_commit >= ranges.xaxis.from && last_commit <= ranges.xaxis.to){ | |||
| push = true; | |||
| } | |||
| r730 | //*/ | ||
| r547 | if(push){ | ||
| data.push(dataset[key]); | |||
| } | |||
| } | |||
| if(data.length >= 1){ | |||
| return data; | |||
| } | |||
| else{ | |||
| //just return dummy data for graph to plot itself | |||
| return [getDummyData('')]; | |||
| } | |||
| } | |||
| /** | |||
| * redraw using new checkbox data | |||
| */ | |||
| function plotchoiced(e,args){ | |||
| var cur_data = args[0]; | |||
| var cur_ranges = args[1]; | |||
| var new_data = []; | |||
| var inputs = choiceContainer.getElementsByTagName("input"); | |||
| //show only checked labels | |||
| for(var i=0; i<inputs.length; i++) { | |||
| var checkbox_key = inputs[i].name; | |||
| if(inputs[i].checked){ | |||
| for(var d in cur_data){ | |||
| if(cur_data[d].label == checkbox_key){ | |||
| new_data.push(cur_data[d]); | |||
| } | |||
| } | |||
| } | |||
| else{ | |||
| //push dummy data to not hide the label | |||
| new_data.push(getDummyData(checkbox_key)); | |||
| } | |||
| } | |||
| r730 | |||
| r547 | var new_options = YAHOO.lang.merge(plot_options, { | ||
| xaxis: { | |||
| min: cur_ranges.xaxis.from, | |||
| max: cur_ranges.xaxis.to, | |||
| mode:"time", | |||
| timeformat: "%d/%m", | |||
| r730 | }, | ||
| r547 | }); | ||
| if (!new_data){ | |||
| new_data = [[0,1]]; | |||
| } | |||
| // do the zooming | |||
| plot = YAHOO.widget.Flot(plotContainer, new_data, new_options); | |||
| plot.subscribe("plotselected", plotselected); | |||
| //resubscribe plothover | |||
| plot.subscribe("plothover", plothover); | |||
| // don't fire event on the overview to prevent eternal loop | |||
| overview.setSelection(cur_ranges, true); | |||
| } | |||
| /** | |||
| * plot only selected items from overview | |||
| * @param ranges | |||
| * @returns | |||
| */ | |||
| function plotselected(ranges,cur_data) { | |||
| //updates the data for new plot | |||
| data = getDataAccordingToRanges(ranges); | |||
| generateCheckboxes(data); | |||
| var new_options = YAHOO.lang.merge(plot_options, { | |||
| xaxis: { | |||
| min: ranges.xaxis.from, | |||
| max: ranges.xaxis.to, | |||
| mode:"time", | |||
| timeformat: "%d/%m", | |||
| r730 | }, | ||
| yaxis: { | |||
| min: ranges.yaxis.from, | |||
| max: ranges.yaxis.to, | |||
| }, | |||
| r547 | }); | ||
| // do the zooming | |||
| plot = YAHOO.widget.Flot(plotContainer, data, new_options); | |||
| plot.subscribe("plotselected", plotselected); | |||
| //resubscribe plothover | |||
| plot.subscribe("plothover", plothover); | |||
| // don't fire event on the overview to prevent eternal loop | |||
| overview.setSelection(ranges, true); | |||
| //resubscribe choiced | |||
| r763 | YUE.on(choiceContainer.getElementsByTagName("input"), "click", plotchoiced, [data, ranges]); | ||
| r547 | } | ||
| var previousPoint = null; | |||
| function plothover(o) { | |||
| var pos = o.pos; | |||
| var item = o.item; | |||
| r763 | //YUD.get("x").innerHTML = pos.x.toFixed(2); | ||
| //YUD.get("y").innerHTML = pos.y.toFixed(2); | |||
| r547 | if (item) { | ||
| if (previousPoint != item.datapoint) { | |||
| previousPoint = item.datapoint; | |||
| r763 | var tooltip = YUD.get("tooltip"); | ||
| r547 | if(tooltip) { | ||
| tooltip.parentNode.removeChild(tooltip); | |||
| } | |||
| var x = item.datapoint.x.toFixed(2); | |||
| var y = item.datapoint.y.toFixed(2); | |||
| if (!item.series.label){ | |||
| item.series.label = 'commits'; | |||
| } | |||
| var d = new Date(x*1000); | |||
| var fd = d.toDateString() | |||
| var nr_commits = parseInt(y); | |||
| var cur_data = dataset[item.series.label].data[item.dataIndex]; | |||
| var added = cur_data.added; | |||
| var changed = cur_data.changed; | |||
| var removed = cur_data.removed; | |||
| var nr_commits_suffix = " ${_('commits')} "; | |||
| var added_suffix = " ${_('files added')} "; | |||
| var changed_suffix = " ${_('files changed')} "; | |||
| var removed_suffix = " ${_('files removed')} "; | |||
| if(nr_commits == 1){nr_commits_suffix = " ${_('commit')} ";} | |||
| if(added==1){added_suffix=" ${_('file added')} ";} | |||
| if(changed==1){changed_suffix=" ${_('file changed')} ";} | |||
| if(removed==1){removed_suffix=" ${_('file removed')} ";} | |||
| showTooltip(item.pageX, item.pageY, item.series.label + " on " + fd | |||
| +'<br/>'+ | |||
| nr_commits + nr_commits_suffix+'<br/>'+ | |||
| added + added_suffix +'<br/>'+ | |||
| changed + changed_suffix + '<br/>'+ | |||
| removed + removed_suffix + '<br/>'); | |||
| } | |||
| } | |||
| else { | |||
| r763 | var tooltip = YUD.get("tooltip"); | ||
| r547 | |||
| if(tooltip) { | |||
| tooltip.parentNode.removeChild(tooltip); | |||
| } | |||
| previousPoint = null; | |||
| } | |||
| } | |||
| /** | |||
| * MAIN EXECUTION | |||
| */ | |||
| var data = getDataAccordingToRanges(initial_ranges); | |||
| generateCheckboxes(data); | |||
| //main plot | |||
| var plot = YAHOO.widget.Flot(plotContainer,data,plot_options); | |||
| //overview | |||
| var overview = YAHOO.widget.Flot(overviewContainer, overview_dataset, overview_options); | |||
| //show initial selection on overview | |||
| overview.setSelection(initial_ranges); | |||
| plot.subscribe("plotselected", plotselected); | |||
| overview.subscribe("plotselected", function (ranges) { | |||
| plot.setSelection(ranges); | |||
| }); | |||
| plot.subscribe("plothover", plothover); | |||
| r763 | YUE.on(choiceContainer.getElementsByTagName("input"), "click", plotchoiced, [data, initial_ranges]); | ||
| r547 | } | ||
| SummaryPlot(${c.ts_min},${c.ts_max},${c.commit_data|n},${c.overview_data|n}); | |||
| </script> | |||
| </div> | |||
| </div> | |||
| <div class="box"> | |||
| <div class="title"> | |||
| r739 | <div class="breadcrumbs">${h.link_to(_('Shortlog'),h.url('shortlog_home',repo_name=c.repo_name))}</div> | ||
| r547 | </div> | ||
| <div class="table"> | |||
| r637 | <div id="shortlog_data"> | ||
| <%include file='../shortlog/shortlog_data.html'/> | |||
| </div> | |||
| ##%if c.repo_changesets: | |||
| ## ${h.link_to(_('show more'),h.url('changelog_home',repo_name=c.repo_name))} | |||
| ##%endif | |||
| r547 | </div> | ||
| </div> | |||
| <div class="box"> | |||
| <div class="title"> | |||
| r820 | <div class="breadcrumbs">${h.link_to(_('Tags'),h.url('tags_home',repo_name=c.repo_name))}</div> | ||
| r547 | </div> | ||
| <div class="table"> | |||
| <%include file='../tags/tags_data.html'/> | |||
| %if c.repo_changesets: | |||
| ${h.link_to(_('show more'),h.url('tags_home',repo_name=c.repo_name))} | |||
| %endif | |||
| </div> | |||
| </div> | |||
| <div class="box"> | |||
| <div class="title"> | |||
| r820 | <div class="breadcrumbs">${h.link_to(_('Branches'),h.url('branches_home',repo_name=c.repo_name))}</div> | ||
| r547 | </div> | ||
| <div class="table"> | |||
| <%include file='../branches/branches_data.html'/> | |||
| %if c.repo_changesets: | |||
| ${h.link_to(_('show more'),h.url('branches_home',repo_name=c.repo_name))} | |||
| %endif | |||
| </div> | |||
| </div> | |||
| </%def> |
