hyung-hwan/codepot
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactored the revision graph subview in the code folder view

Browse Source
This commit is contained in:
hyung-hwan
2016-12-30 14:47:44 +00:00
parent 625026c50d
commit 2cc4002de7
2 changed files with 209 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

354
codepot/src/codepot/views/code_folder.php
View File

@ -51,7 +51,6 @@
$revreqroot = '';
$history_path = "/code/history/{$project->id}/{$hex_headpath}";
}
else
{
@ -105,111 +104,35 @@ function show_tooltip(id, x, y, contents) {
}).appendTo("body").fadeIn(200);
}
function show_loc_by_lang_graph (response)
var RevGraphApp = (function ()
{
var loc;
try { loc = $.parseJSON(response); }
catch (e) { loc = null; }
if (loc == null)
// -------------------------------------------------------------------
// CONSTRUCTOR
// -------------------------------------------------------------------
function App ()
{
show_alert ('Invalid data received', "<?php print $this->lang->line('Error')?>");
}
else
if (this.constructor != App)
{
var blank = [];
for (var key in loc) blank.push ([ key, loc[key][1]] );
var comment = [];
for (var key in loc) comment.push ([ key, loc[key][2]] );
var code = [];
for (var key in loc) code.push ([ key, loc[key][3]] );
var dataset =
[
{ label: "<?php print $this->lang->line('Code')?>", data: code },
{ label: "<?php print $this->lang->line('Comment')?>", data: comment },
{ label: "<?php print $this->lang->line('Blank')?>", data: blank }
];
var options = {
series: {
stack: true,
shadowSize: 0,
bars: {
show: true,
fill: true,
align: "center",
barWidth: 0.8
},
lines: { show: false, fill: true },
points: { show: false }
},
grid: { hoverable: true, clickable: true },
xaxes: [
{ mode: "categories",
autoscaleMargin: 0.05,
rotateTicks: ((code.length >= 8)? 135: 0)
},
],
yaxes: { }
};
$("#code_folder_result_loc_by_lang_graph").width(550).height(400);
$.plot($("#code_folder_result_loc_by_lang_graph"), dataset, options);
var code_folder_result_loc_by_lang_graph_previous_point = null;
$("#code_folder_result_loc_by_lang_graph").bind("plothover", function (event, pos, item) {
if (item)
{
if (code_folder_result_loc_by_lang_graph_previous_point != item.datapoint)
{
code_folder_result_loc_by_lang_graph_previous_point = item.datapoint;
$("#code_folder_result_loc_by_lang_graph_tooltip").remove();
show_tooltip("code_folder_result_loc_by_lang_graph_tooltip", item.pageX, item.pageY - 20, item.datapoint[1]);
}
}
else
{
$("#code_folder_result_loc_by_lang_graph_tooltip").remove();
code_folder_result_loc_by_lang_graph_previous_point = null;
}
});
return new App ();
}
$("#code_folder_loc_by_lang_button").button("enable");
$("#code_folder_loc_by_lang_spin" ).removeClass ("fa-cog fa-spin");
this.window = $(window);
this.graph_container = $("#code_folder_revision_graph_container");
this.graph_canvas = $("#code_folder_revision_graph");
this.graph_button = $("#code_folder_revision_graph_button");
this.graph_spin = $("#code_folder_revision_graph_spin");
this.graph_ajax = null;
this.revision_network = null;
return this;
}
function show_loc_by_file_graph (response)
{
var loc;
try { loc = $.parseJSON(response); }
catch (e) { loc = null; }
if (loc == null)
{
show_alert ('Invalid data received', "<?php print $this->lang->line('Error')?>");
}
else
{
var f = new CodeFlower("#code_folder_result_loc_by_file_graph", 550, 400);
f.update (loc);
}
$("#code_folder_loc_by_file_button").button("enable");
$("#code_folder_loc_by_file_spin" ).removeClass ("fa-cog fa-spin");
}
var revision_network = null;
function show_revision_graph (response)
// -------------------------------------------------------------------
// PRIVATE FUNCTIONS
// -------------------------------------------------------------------
function on_graph_success (response, textStatus, jqXHR)
{
var data;
try { data = $.parseJSON(response); }
@ -269,24 +192,207 @@ function show_revision_graph (response)
data.edges[i].font = { color: 'red' };
}
if (revision_network === null)
if (this.revision_network === null)
{
revision_network = new vis.Network(document.getElementById('code_folder_result_revision_graph'), data, options);
$('#code_folder_result_revision_graph').resizable({
resize: function (event, ui) {
revision_network.setSize (ui.size.width - 10, ui.size.height - 10);
revision_network.redraw();
}
});
this.revision_network = new vis.Network(this.graph_canvas[0], data, options);
}
else
{
revision_network.setData (data);
this.revision_network.setData (data);
}
this.graph_container.dialog("option", "height", (this.window.height() * 90 / 100));
this.graph_container.dialog("option", "width", (this.window.width() * 90 / 100));
this.graph_container.dialog ({
position: {
my: "center center",
at: "center center",
of: this.window
}
});
on_graph_container_resize.call (this);
}
this.graph_button.button("enable");
this.graph_spin.removeClass ("fa-cog fa-spin");
}
function on_graph_error (jqXHR, textStatus, errorThrown)
{
show_alert (xhr.status + ' ' + thrownError, "<?php print $this->lang->line('Error')?>");
this.graph_button.button("enable");
this.graph_spin.removeClass ("fa-cog fa-spin");
}
function open_revision_graph()
{
this.graph_button.button ("disable");
this.graph_spin.addClass ("fa-cog fa-spin");
this.graph_container.dialog ("open");
if (this.graph_ajax != null) this.graph_ajax.abort();
this.graph_ajax = $.ajax ({
url: codepot_merge_path (
"<?php print site_url(); ?>",
"/graph/enjson_revision_graph/<?php print $project->id; ?>/<?php print $hex_headpath;?><?php print $revreq?>"),
context: this,
success: on_graph_success,
error: on_graph_error
});
}
function on_graph_container_resize()
{
if (this.revision_network != null)
{
this.revision_network.setSize (this.graph_container.width(), this.graph_container.height());
this.revision_network.redraw();
this.revision_network.fit();
}
}
$("#code_folder_revision_graph_button").button("enable");
$("#code_folder_revision_graph_spin" ).removeClass ("fa-cog fa-spin");
// -------------------------------------------------------------------
// PUBLIC FUNCTIONS
// -------------------------------------------------------------------
App.prototype.initWidgets = function ()
{
var self = this;
this.graph_container.dialog ({
title: '<?php print $this->lang->line('Revision')?>',
resizable: true,
autoOpen: false,
width: 'auto',
height: 'auto',
modal: true,
buttons: {
'<?php print $this->lang->line('Close')?>': function () {
if (this.graph_ajax != null) return;
self.graph_container.dialog('close');
}
},
beforeClose: function() {
return this.graph_ajax == null;
},
});
this.graph_container.on ("dialogresize", function (evt, ui) {
on_graph_container_resize.call (self);
});
this.graph_button.button().click (function ()
{
open_revision_graph.call (self);
return false;
});
};
return App;
})();
function show_loc_by_lang_graph (response)
{
var loc;
try { loc = $.parseJSON(response); }
catch (e) { loc = null; }
if (loc == null)
{
show_alert ('Invalid data received', "<?php print $this->lang->line('Error')?>");
}
else
{
var blank = [];
for (var key in loc) blank.push ([ key, loc[key][1]] );
var comment = [];
for (var key in loc) comment.push ([ key, loc[key][2]] );
var code = [];
for (var key in loc) code.push ([ key, loc[key][3]] );
var dataset =
[
{ label: "<?php print $this->lang->line('Code')?>", data: code },
{ label: "<?php print $this->lang->line('Comment')?>", data: comment },
{ label: "<?php print $this->lang->line('Blank')?>", data: blank }
];
var options = {
series: {
stack: true,
shadowSize: 0,
bars: {
show: true,
fill: true,
align: "center",
barWidth: 0.8
},
lines: { show: false, fill: true },
points: { show: false }
},
grid: { hoverable: true, clickable: true },
xaxes: [
{ mode: "categories",
autoscaleMargin: 0.05,
rotateTicks: ((code.length >= 8)? 135: 0)
},
],
yaxes: { }
};
$("#code_folder_loc_by_lang_graph").width(550).height(400);
$.plot($("#code_folder_loc_by_lang_graph"), dataset, options);
var code_folder_loc_by_lang_graph_previous_point = null;
$("#code_folder_loc_by_lang_graph").bind("plothover", function (event, pos, item) {
if (item)
{
if (code_folder_loc_by_lang_graph_previous_point != item.datapoint)
{
code_folder_loc_by_lang_graph_previous_point = item.datapoint;
$("#code_folder_loc_by_lang_graph_tooltip").remove();
show_tooltip("code_folder_loc_by_lang_graph_tooltip", item.pageX, item.pageY - 20, item.datapoint[1]);
}
}
else
{
$("#code_folder_loc_by_lang_graph_tooltip").remove();
code_folder_loc_by_lang_graph_previous_point = null;
}
});
}
$("#code_folder_loc_by_lang_button").button("enable");
$("#code_folder_loc_by_lang_spin" ).removeClass ("fa-cog fa-spin");
}
function show_loc_by_file_graph (response)
{
var loc;
try { loc = $.parseJSON(response); }
catch (e) { loc = null; }
if (loc == null)
{
show_alert ('Invalid data received', "<?php print $this->lang->line('Error')?>");
}
else
{
var f = new CodeFlower("#code_folder_loc_by_file_graph", 550, 400);
f.update (loc);
}
$("#code_folder_loc_by_file_button").button("enable");
$("#code_folder_loc_by_file_spin" ).removeClass ("fa-cog fa-spin");
}
function render_readme()
@ -783,24 +889,9 @@ $(function () {
return false;
});
$("#code_folder_revision_graph_button").button().click (function () {
$("#code_folder_revision_graph_button").button("disable");
$("#code_folder_revision_graph_spin").addClass ("fa-cog fa-spin");
var ajax_req = $.ajax ({
url: codepot_merge_path (
"<?php print site_url(); ?>",
"/graph/enjson_revision_graph/<?php print $project->id; ?>/<?php print $hex_headpath;?><?php print $revreq?>"),
context: document.body,
success: show_revision_graph,
error: function (xhr, ajaxOptions, thrownError) {
show_alert (xhr.status + ' ' + thrownError, "<?php print $this->lang->line('Error')?>");
$("#code_folder_revision_graph_button").button("enable");
$("#code_folder_revision_graph_spin" ).removeClass ("fa-cog fa-spin");
}
});
return false;
});
var rev_graph_app = new RevGraphApp ();
rev_graph_app.initWidgets ();
<?php if ($show_search): ?>
$('#code_search_invertedly').button();
@ -1044,9 +1135,12 @@ $this->load->view (
</div>
<div id="code_folder_graph" class="graph">
<div id="code_folder_result_loc_by_lang_graph"></div>
<div id="code_folder_result_loc_by_file_graph"></div>
<div id="code_folder_result_revision_graph"></div>
<div id="code_folder_loc_by_lang_graph"></div>
<div id="code_folder_loc_by_file_graph"></div>
<div id="code_folder_revision_graph_container">
<div id="code_folder_revision_graph"></div>
</div>
</div>
<div id="code_folder_search">

2
codepot/src/codepot/views/code_revision.php
View File

@ -729,7 +729,7 @@ $history = $file['history'];
<div id="code_revision_result_files" class="collapsible-box">
<div class="collapsible-box-header"><?php print $this->lang->line('Files')?></div>
<div id="code_revision_result_files_table_container" class="collapsible-box-panel">
<table id="code_revision_result_files_table" class="codepot-fit-width-table codepot-spacious-table">
<table id="code_revision_result_files_table" class="codepot-fit-width-table">
<?php
/*
print '<tr class="heading">';