Commit c5c09ccb authored by Martin Urban's avatar Martin Urban
Browse files

File: Make reordering without rerendering and reactions on small changes (<10)...

File: Make reordering without rerendering and reactions on small changes (<10) for table and symbolview available
parent 35bab8da
......@@ -60,6 +60,7 @@
"globals": {
"$": false,
"vispa": false
"vispa": false,
"Class": false
}
}
......@@ -181,7 +181,7 @@
.file-view-symbol .file-selection-box {
position: absolute;
top: 2px;
visibility: hidden;
visibility: visible;
-webkit-user-select: none;
content: '';
}
......
......@@ -175,7 +175,7 @@
.file-selection-box {
position: absolute;
top: 2px;
visibility: hidden;
visibility: visible;
-webkit-user-select: none;
content: '';
span {
......
......@@ -12,7 +12,8 @@ var FileBaseSorting = Class.extend({
if (sortMenu === null) {
return;
}
for (var i = 0; i < sortGlyphicons.length; i++) {
var i;
for (i = 0; i < sortGlyphicons.length; i++) {
var button = $("#fastmenu-" + sortGlyphicons[i], sortMenu);
var glyph = $("i.glyphicon", button);
if (sortGlyphicons[i] != type) {
......@@ -46,14 +47,7 @@ var FileBaseSorting = Class.extend({
this.toggleSortButtons(type, this.wf.reverse);
}
this.wf.sort = type;
if (this.FileBase.workflow.currentView.type == "Symbol") {
this.FileBase.helper.sortItems(this.wf.data, this.wf.sort, this.wf.reverse);
this.FileBase.workflow.currentView.reorder();
}
else {
this.FileBase.refresh(this.wf.data, type);
}
this.FileBase.helper.sortItems(this.wf.data, this.wf.sort, this.wf.reverse);
this.FileBase.view.reorder();
}
});
var FileBaseView = Class.extend({
init: function(FileBase) {
init: function (FileBase) {
var self = this;
this.FileBase = FileBase;
this.instance = FileBase.instance;
......@@ -10,23 +10,23 @@ var FileBaseView = Class.extend({
// directives for rendering, needed for all views
this.directives = {
"icon": {
"class": function() {
"class": function () {
return self.setupSymbols(this.name, this.type, this.symlink);
}
},
// pseudo attribute to set the data to the node
"data": {
"data": function(nodeObj) {
"data": function (nodeObj) {
var node = $(nodeObj.element);
node.css("order", nodeObj.index);
//node.css("order", nodeObj.index);
node.data("data", this);
},
// set the events that can happen when a click on the node occurs
"action": function(nodeObj) {
"action": function (nodeObj) {
self.FileBase.events.setupNodeEvents(nodeObj);
},
// set opacity if cutted
"opacity": function(nodeObj) {
"opacity": function (nodeObj) {
var cookie = $.cookie("vispaFile");
if (cookie === undefined || cookie === null) {
return;
......@@ -39,9 +39,10 @@ var FileBaseView = Class.extend({
var path = self.FileBase.workflow.path + "/" + this.name;
self.instance.GET("/ajax/fs/expand", {
"path": JSON.stringify("$HOME")
}).done(function(res) {
}).done(function (res) {
path = path.replace("$HOME", res);
for (var i = 0; i < paths.length; i++) {
var i;
for (i = 0; i < paths.length; i++) {
paths[i] = paths[i].replace("$HOME", res);
}
if ($.inArray(path, paths) !== -1) {
......@@ -52,38 +53,38 @@ var FileBaseView = Class.extend({
},
// convert timestamp to dd.mm.jjjj hh:mm:ss
"mtime": {
"text": function() {
"text": function () {
return self.FileBase.helper.convertTimestamp(this.mtime);
}
},
// convert size from bytes to kB, Mb, etc
"size": {
"text": function() {
"text": function () {
return self.FileBase.helper.convertSize(this.size).size;
}
},
"sizeSuffix": {
"text": function() {
"text": function () {
return self.FileBase.helper.convertSize(this.size).sizeSuffix;
}
}
};
},
setMainContainer: function(node) {
setMainContainer: function (node) {
var self = this;
// Get the template. When it is loaded append it to the maindiv
// Then the view can be loaded
this.instance.getTemplate("html/main.html", function(err, tmpl) {
// Save the content container
this.instance.getTemplate("html/main.html", function (err, tmpl) {
// Save the content container
// Each view will dump its content into this container,
// thus it is the background
self.fileContentContainer = $(tmpl).appendTo(node);
self.FileBase.events.setupBkgEvents(self.fileContentContainer);
// Get the menu via AJAX rejquest and append it to the container
self.instance.getTemplate("html/menu.html", function(err2, tmplMenu) {
self.instance.getTemplate("html/menu.html", function (err2, tmplMenu) {
node.append(tmplMenu);
self.node = node;
// make the menu clickable
......@@ -95,7 +96,7 @@ var FileBaseView = Class.extend({
});
self.instance.getTemplate("html/filter.html", function(err2, filterField) {
self.instance.getTemplate("html/filter.html", function (err2, filterField) {
self.filterField = $(filterField);
// node.append(self.filterField);
});
......@@ -103,7 +104,7 @@ var FileBaseView = Class.extend({
},
// Helper function for setting the symbol
setupSymbols: function(name, type, symlink) {
setupSymbols: function (name, type, symlink) {
var self = this;
var iconPrefix = "icon-";
var src = null;
......@@ -111,14 +112,13 @@ var FileBaseView = Class.extend({
"f90", "f95", "F", "F03", "F90", "F95", "gif", "h", "html", "ico", "ini", "jade",
"jpeg", "jpg", "js", "less", "lnk", "log", "mako", "pdf", "png", "ps", "pxlio",
"py", "pyc", "rar", "raw", "root", "sh", "svg", "tar", "tar.gz", "tex", "tif",
"tiff", "txt", "xml", "yaml", "yml", "zip"
];
"tiff", "txt", "xml", "yaml", "yml", "zip"];
// return null;
if (symlink && type == "f") {
if (symlink && type === "f") {
src = iconPrefix + "default-symlink";
} else if (symlink && type == "d") {
} else if (symlink && type === "d") {
src = iconPrefix + "folder-symlink";
} else if (type == "d") {
} else if (type === "d") {
src = iconPrefix + "folder";
} else {
// to do: fortran and targz
......@@ -134,25 +134,26 @@ var FileBaseView = Class.extend({
} else {
src = iconPrefix + "default-alt";
}
}
// take correct icon for targz
if (extension == "gz") {
src = iconPrefix + "targz";
// take correct icon for targz
if (extension === "gz") {
src = iconPrefix + "targz";
}
}
return src;
},
// toggleViewMenu: function(preView, newView) {
toggleViewMenu: function() {
toggleViewMenu: function () {
var ids = ["Table", "Symbol"];
var view = this.FileBase.workflow.currentView.type;
var idx = ids.indexOf(view);
if (~idx)
if (~idx) {
ids.splice(idx, 1);
}
try {
this.FileBase.instance.toggleMenuEntry(view, false);
ids.forEach(function(view) {
ids.forEach(function (view) {
this.FileBase.instance.toggleMenuEntry(view, true);
}, this);
} catch (err) {
......@@ -160,11 +161,11 @@ var FileBaseView = Class.extend({
}
},
toggleFilter: function(toggleOff) {
toggleFilter: function (toggleOff) {
toggleOff = toggleOff === undefined ? false : toggleOff;
var display = this.filterField.css("visibility");
var input = $("input", this.filterField);
if (display == "visible" || toggleOff) {
if (display === "visible" || toggleOff) {
this.filterField.css({
"visibility": "hidden"
});
......@@ -179,6 +180,69 @@ var FileBaseView = Class.extend({
input.focus();
this.FileBase.actions.filter();
}
},
reorder: function () {
var parentNode = $(".file-list", this.fileContentContainer);
var nodes = $(".file-node", this.fileContentContainer);
var filelist = this.FileBase.workflow.data.filelist;
var len = nodes.length;
var nodeNameMap = {};
var j;
for (j = 0; j < len; j++) {
nodeNameMap[$(nodes[j]).data().data.name] = nodes[j];
}
nodes.detach();
var name;
var i;
for (i = 0; i < len; i++) {
name = filelist[i].name;
parentNode.append(nodeNameMap[name]);
}
},
reactOnChange: function (data) {
//noinspection JSUnresolvedVariable
var changeSize = data.subject_infos.length;
var change = {};
var newNodes = [];
var i;
for (i = 0; i < changeSize; i++) {
//noinspection JSUnresolvedVariable
change = data.subject_infos[i];
if (change.mtime !== undefined) {
newNodes.push(change);
} else {
this.removeNode(change.name);
}
}
if (newNodes.length) {
this.addNodes(newNodes);
}
},
removeNode: function (name) {
var nodes = $(".file-node", this.fileContentContainer);
var i;
for (i = 0; i < nodes.length; i++) {
if ($(nodes[i]).data().data.name === name) {
$(nodes[i]).remove();
this.FileBase.workflow.data.filelist.splice(i, 1);
break;
}
}
},
addNodes: function (data) {
this.wf = this.FileBase.workflow;
var container = $(".file-node", this.FileBase.workflow.currentView.template);
var docFragment = document.createDocumentFragment();
$(docFragment).append(container);
$(docFragment).render(data, this.FileBase.view.directives);
$(".file-list", this.fileContentContainer).append(docFragment);
this.wf.data.filelist.push.apply(this.wf.data.filelist, data);
this.FileBase.helper.sortItems(this.wf.data, this.wf.sort, this.wf.reverse);
this.reorder();
}
});
......@@ -27,12 +27,6 @@ var Symbolview = Class.extend({
// Get the container, empty it and fill the template
this.fileContentContainer.html(this.template);
//noinspection JSUnresolvedVariable
if (this.FileBase.instance.getPreference("Open") === "single" || vispa.device.hasTouch) {
$(".file-selection-box").css("visibility", "visible");
} else {
$(".file-selection-box").css("visibility", "hidden");
}
//noinspection JSUnresolvedVariable,JSLint
if (vispa.device.hasTouch) {
$(".file-properties").css("visibility", "visible");
......@@ -55,67 +49,6 @@ var Symbolview = Class.extend({
});
},
reorder: function () {
var nodes = $(".file-node", this.fileContentContainer);
var len = nodes.length;
var filelist = this.FileBase.workflow.data.filelist;
var numberNodes = filelist.length;
var newPosition = {};
var j;
for (j = 0; j < numberNodes; j++) {
newPosition[filelist[j].name] = j;
}
var name = "";
var i;
for (i = 0; i < len; i++) {
name = $(nodes[i]).data().data.name;
$(nodes[i]).css("order", newPosition[name]);
}
},
reactOnChange: function (data) {
//noinspection JSUnresolvedVariable
var changeSize = data.subject_infos.length;
var change = {};
var newNodes = [];
var i;
for (i = 0; i < changeSize; i++) {
//noinspection JSUnresolvedVariable
change = data.subject_infos[i];
if (change.mtime !== undefined) {
newNodes.push(change);
} else {
this.removeNode(change.name);
}
}
if (newNodes.length) {
this.addNodes(newNodes);
}
},
removeNode: function (name) {
var nodes = $(".file-node", this.fileContentContainer);
var i;
for (i = 0; i < nodes.length; i++) {
if ($(nodes[i]).data().data.name === name) {
$(nodes[i]).remove();
break;
}
}
},
addNodes: function (data) {
this.wf = this.FileBase.workflow;
var container = $(this.template).children();
var docFragment = document.createDocumentFragment();
$(docFragment).append(container);
$(docFragment).render(data, this.FileBase.view.directives);
$(".file-view-symbol", this.fileContentContainer).append(docFragment);
this.wf.data.filelist.push.apply(this.wf.data.filelist, data);
this.FileBase.helper.sortItems(this.wf.data, this.wf.sort, this.wf.reverse);
this.reorder();
},
setIconSize: function () {
"use strict";
var iconSize = this.FileBase.instance.getPreference("IconSize");
......
......@@ -161,11 +161,7 @@ var FileBrowserView = vispa.ExtensionView.Center.extend({
// The following two parameters are defined in remote/filesystem.py
// MAX_INLINE_SUBJECTS = 10
// MAX_SUBJECT_NAMES = 25
if (self.fb.workflow.currentView.type == "Symbol" && data.subject_count <= 10) {
self.fb.workflow.currentView.reactOnChange(data);
} else {
self.fb.updateView(100);
}
self.fb.view.reactOnChange(data);
});
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment