Added support for table sorting to the HTML output.

Instead of manually adding this functionality with our own code; we use
the JQuery tablesorter plugin which adds support for sorting with a few
simple rows of code.
This commit is contained in:
Adam Waldenberg 2013-05-20 16:07:02 +02:00
parent 128b8b3b56
commit 1992d3dc94
3 changed files with 38 additions and 5 deletions

View file

@ -48,8 +48,8 @@ def __output_html_template__(name):
file_r = open(template_path, "rb")
return file_r.read().decode("utf-8", "replace")
def __get_zip_file_content__(name):
zip_file = zipfile.ZipFile(basedir.get_basedir() + "/html/flot.zip", "r")
def __get_zip_file_content__(name, fileName="/html/flot.zip"):
zip_file = zipfile.ZipFile(basedir.get_basedir() + fileName, "r")
content = zip_file.read(name)
zip_file.close()
return content.decode("utf-8", "replace")
@ -59,6 +59,7 @@ def output_header():
base = basedir.get_basedir()
html_header = __output_html_template__(base + "/html/html.header")
jquery_js = __get_zip_file_content__("jquery.js")
tablesorter_js = __get_zip_file_content__("jquery.tablesorter.min.js", "/html/jquery.tablesorter.min.js.zip")
flot_js = __get_zip_file_content__("jquery.flot.js")
pie_js = __get_zip_file_content__("jquery.flot.pie.js")
@ -67,7 +68,7 @@ def output_header():
logo_file.close()
logo = base64.b64encode(logo)
print(html_header.format(version.__version__, jquery_js, flot_js, pie_js, logo.decode("utf-8", "replace")))
print(html_header.format(version.__version__, jquery_js, tablesorter_js, flot_js, pie_js, logo.decode("utf-8", "replace")))
elif __selected_format__ == "xml":
print("<gitinspector>")
print("\t<version>" + version.__version__ + "</version>")

View file

@ -6,10 +6,12 @@
<script type="application/javascript">{1}</script>
<script type="application/javascript">{2}</script>
<script type="application/javascript">{3}</script>
<script type="application/javascript">{4}</script>
<script type="application/javascript">
$(document).ready(function() {{
var row = 0;
var MINOR_AUTHOR_PERCENTAGE = 1.00;
var isReversed = false;
var colorRows = function() {{
$(this).removeClass("odd");
@ -35,6 +37,32 @@
$("table.git tbody tr:visible").each(colorRows);
$("table#changes, table#blame").tablesorter({{
sortList: [[0,0]],
headers: {{
0: {{ sorter: "text" }}
}}
}}).bind("sortEnd", function() {{
$(this).find("tbody tr:visible").each(colorRows);
}});
$("table#changes thead tr th, table#blame thead tr th").click(function() {{
$(this).parent().find("th strong").remove();
var parentIndex = $(this).index();
if (this.isReversed) {{
$(this).append("<strong> &and;</strong>");
}} else {{
$(this).append("<strong> &or;</strong>");
}}
this.isReversed = !this.isReversed;
}});
$("table#changes thead tr th:first-child, table#blame thead tr th:first-child").each(function() {{
this.isReversed = true;
$(this).append("<strong> &or;</strong>");
}});
$("table.git tfoot tr td:first-child").filter(function() {{
return $(this).parent().parent().parent().find("tbody tr:hidden").length > 0;
}}).each(function() {{
@ -121,10 +149,13 @@
border-radius: 8px 8px 0px 0px;
-moz-border-radius: 8px 8px 0px 0px;
}}
table#changes thead tr th, table#blame thead tr th, table.git tfoot tr td {{
border: 1px solid #eee;
text-align: center;
}}
table.git tfoot tr td {{
border-radius: 0px 0px 8px 8px;
-moz-border-radius: 0px 0px 8px 8px;
border: 1px solid #eee;
text-align: center;
}}
table.git td {{
@ -166,6 +197,7 @@
background-color: #ddcece;
min-height: 0;
}}
table#changes thead tr th:hover, table#blame thead tr th:hover,
table#changes tfoot tr td:hover, table#blame tfoot tr td:hover, div.button:hover {{
background-color: #eddede;
border: 1px solid #bbb;
@ -175,7 +207,7 @@
</head>
<body>
<div><div class="box logo">
<img src="data:image/png;base64,{4}" />
<img src="data:image/png;base64,{5}" />
<p>The output has been generated by <a href="http://gitinspector.googlecode.com">gitinspector</a>;
the statistical analysis tool for git repositories.<p>
</div></div>

Binary file not shown.