s434730/RandomSec
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixed flickering problem of progress/undo panel.

Browse Source 
git-svn-id: http://google-refine.googlecode.com/svn/trunk@2396 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
David Huynh 2011-12-01 22:15:08 +00:00
parent a7e2704655
commit 4ecd83bcf8
2 changed files with 56 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
main/webapp/modules/core/scripts/project/process-panel.js
View File

@ -39,6 +39,9 @@ function ProcessPanel(div) {
this._updateOptions = {}; this._updateOptions = {};
this._onDones = []; this._onDones = [];
this._latestHistoryEntry = null; this._latestHistoryEntry = null;
this._div.html(DOM.loadHTML("core", "scripts/project/progress-panel.html"));
this._elmts = DOM.bind(this._div);
var self = this; var self = this;
$(window).keypress(function(evt) { $(window).keypress(function(evt) {
@ -91,16 +94,16 @@ ProcessPanel.prototype.showUndo = function(historyEntry) {
this._latestHistoryEntry = historyEntry; this._latestHistoryEntry = historyEntry;
this._div.stop(true,false) this._div.stop(true, false);
.empty() this._elmts.progressDiv.hide();
.html('<div id="notification"><span bind="description"></span> <span class="notification-action"><a href="javascript:{}" bind="undo">Undo</a></span></div>') this._elmts.undoDiv.show();
.fadeIn(200) this._elmts.undoDescription.text(historyEntry.description);
.delay(7500) this._elmts.undoLink.unbind().click(function() { self.undo(); });
.fadeOut(200);
var elmts = DOM.bind(this._div); this._div
.fadeIn(200)
elmts.description.text(historyEntry.description); .delay(10000)
elmts.undo.click(function() { self.undo(); }); .fadeOut(200);
}; };
ProcessPanel.prototype.undo = function() { ProcessPanel.prototype.undo = function() {
@ -130,54 +133,44 @@ ProcessPanel.prototype._cancelAll = function() {
ProcessPanel.prototype._render = function(newData) { ProcessPanel.prototype._render = function(newData) {
var self = this; var self = this;
var newProcessMap = {}; var newProcessMap = {};
var processes = newData.processes;
this._div.stop(true, false).empty(); this._div.stop(true, false);
if (!newData.processes.length) { if (!processes.length) {
Refine.setTitle(); Refine.setTitle();
this._div.fadeOut(200); this._div.fadeOut(200);
} else { } else {
this._div.fadeIn(200); this._elmts.undoDiv.hide();
var cancelmessage = "Cancel"; this._elmts.progressDiv.show();
var noticeDiv = $('<div id="notification"></div>').appendTo(this._div);
var descriptionSpan = $('<span></span>').appendTo(noticeDiv);
var statusDiv = $('<div></div>').appendTo(noticeDiv);
$('<img src="images/small-spinner.gif" />')
.addClass("notification-loader")
.appendTo(statusDiv);
var progressSpan = $('<span></span>').appendTo(statusDiv);
var countSpan = $('<span></span>').appendTo(statusDiv);
var renderProcess = function(process) {
if (process.status != "pending") {
Refine.setTitle(process.progress + "% complete");
descriptionSpan.text(process.description);
progressSpan.text(process.progress + '% complete');
}
};
var renderProcessCount = function(count) {
var pendingcount = count - 1;
countSpan.text(', ' + pendingcount + ' pending processes');
};
var processes = newData.processes;
if (processes.length >> 1) {
cancelmessage = "Cancel All";
renderProcessCount(processes.length);
}
for (var i = 0; i < processes.length; i++) { for (var i = 0; i < processes.length; i++) {
var process = processes[i]; var process = processes[i];
renderProcess(process); if (process.status != "pending") {
Refine.setTitle(process.progress + "% complete");
this._elmts.progressDescription.text(process.description);
this._elmts.progressSpan.text(process.progress + '% complete');
}
if ("onDone" in process) { if ("onDone" in process) {
newProcessMap[process.id] = process; newProcessMap[process.id] = process;
} }
} }
$('<a href="javascript:{}"></a>')
.addClass("notification-action") if (processes.length > 1) {
.text(cancelmessage) var pending = processes.length - 1;
.click(function() { this._elmts.countSpan.text('(' + pending + (pending > 1 ? ' other pending processes)' : ' other pending process)'));
self._cancelAll(); } else {
$(this).text("Canceling...").unbind(); this._elmts.countSpan.empty();
}) }
.appendTo(statusDiv); this._elmts.cancelLink
.unbind()
.text(processes.length > 1 ? "Cancel All" : "Cancel")
.click(function() {
self._cancelAll();
$(this).text("Canceling...").unbind();
})
this._div.fadeIn(200);
} }
if ((this._data) && this._data.processes.length > 0) { if ((this._data) && this._data.processes.length > 0) {
@ -190,7 +183,7 @@ ProcessPanel.prototype._render = function(newData) {
} }
} }
this._data = newData; this._data = newData;
if (this._data.exceptions) { if (this._data.exceptions) {
var messages = $.map(this._data.exceptions, function(e) { var messages = $.map(this._data.exceptions, function(e) {
return e.message; return e.message;

15
main/webapp/modules/core/scripts/project/progress-panel.html Normal file
View File

@ -0,0 +1,15 @@
<div id="notification">
<div bind="progressDiv">
<span bind="progressDescription"></span>
<div bind="progressStatus">
<img src="images/small-spinner.gif" class="notification-loader" />
<span bind="progressSpan"></span>
<span bind="countSpan"></span>
<a href="javascript:{}" class="notification-action" bind="cancelLink"></a>
</div>
</div>
<div bind="undoDiv">
<span bind="undoDescription"></span>
<span class="notification-action"><a href="javascript:{}" bind="undoLink">Undo</a></span>
</div>
</div>