|
|
|
@ -31,35 +31,303 @@ |
|
|
|
|
|
|
|
|
|
|
|
**************************************************************/ |
|
|
|
**************************************************************/ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var DynamicTableHeaderContextMenuClass = null; |
|
|
|
|
|
|
|
|
|
|
|
var DynamicTable = new Class({ |
|
|
|
var DynamicTable = new Class({ |
|
|
|
|
|
|
|
|
|
|
|
initialize : function () {}, |
|
|
|
initialize : function () {}, |
|
|
|
|
|
|
|
|
|
|
|
setup : function (tableId, tableHeaderId, context_menu) { |
|
|
|
setup : function (dynamicTableDivId, dynamicTableFixedHeaderDivId, contextMenu) { |
|
|
|
this.tableId = tableId; |
|
|
|
this.dynamicTableDivId = dynamicTableDivId; |
|
|
|
this.tableHeaderId = tableHeaderId; |
|
|
|
this.dynamicTableFixedHeaderDivId = dynamicTableFixedHeaderDivId; |
|
|
|
this.table = $(tableId); |
|
|
|
this.fixedTableHeader = $(dynamicTableFixedHeaderDivId).getElements('tr')[0]; |
|
|
|
|
|
|
|
this.hiddenTableHeader = $(dynamicTableDivId).getElements('tr')[0]; |
|
|
|
|
|
|
|
this.tableBody = $(dynamicTableDivId).getElements('tbody')[0]; |
|
|
|
this.rows = new Hash(); |
|
|
|
this.rows = new Hash(); |
|
|
|
this.cur = new Array(); |
|
|
|
this.selectedRows = new Array(); |
|
|
|
this.columns = new Array(); |
|
|
|
this.columns = new Array(); |
|
|
|
this.context_menu = context_menu; |
|
|
|
this.contextMenu = contextMenu; |
|
|
|
this.sortedColumn = getLocalStorageItem('sorted_column_' + this.tableId, 0); |
|
|
|
this.sortedColumn = getLocalStorageItem('sorted_column_' + this.dynamicTableDivId, 0); |
|
|
|
this.reverseSort = getLocalStorageItem('reverse_sort_' + this.tableId, '0'); |
|
|
|
this.reverseSort = getLocalStorageItem('reverse_sort_' + this.dynamicTableDivId, '0'); |
|
|
|
this.initColumns(); |
|
|
|
this.initColumns(); |
|
|
|
this.loadColumnsOrder(); |
|
|
|
this.loadColumnsOrder(); |
|
|
|
this.updateHeader(); |
|
|
|
this.updateTableHeaders(); |
|
|
|
|
|
|
|
this.setupCommonEvents(); |
|
|
|
|
|
|
|
this.setupHeaderEvents(); |
|
|
|
|
|
|
|
this.setupHeaderMenu(); |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setupCommonEvents : function () { |
|
|
|
|
|
|
|
var scrollFn = function() { |
|
|
|
|
|
|
|
$(this.dynamicTableFixedHeaderDivId).getElements('table')[0].style.left = |
|
|
|
|
|
|
|
-$(this.dynamicTableDivId).scrollLeft + 'px'; |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(this.dynamicTableDivId).addEvent('scroll', scrollFn); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var resizeFn = function() { |
|
|
|
|
|
|
|
var panel = $(this.dynamicTableDivId).getParent('.panel'); |
|
|
|
|
|
|
|
var h = panel.getBoundingClientRect().height - $(this.dynamicTableFixedHeaderDivId).getBoundingClientRect().height; |
|
|
|
|
|
|
|
$(this.dynamicTableDivId).style.height = h + 'px'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Workaround due to inaccurate calculation of elements heights by browser
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var n = 2; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
while (panel.clientWidth != panel.offsetWidth && n > 0) { // is panel vertical scrollbar visible ?
|
|
|
|
|
|
|
|
n--; |
|
|
|
|
|
|
|
h -= 0.5; |
|
|
|
|
|
|
|
$(this.dynamicTableDivId).style.height = h + 'px'; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.lastPanelHeight = panel.getBoundingClientRect().height; |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(this.dynamicTableDivId).getParent('.panel').addEvent('resize', resizeFn); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.lastPanelHeight = 0; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Workaround. Resize event is called not always (for example it isn't called when browser window changes it's size)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var checkResizeFn = function() { |
|
|
|
|
|
|
|
var panel = $(this.dynamicTableDivId).getParent('.panel'); |
|
|
|
|
|
|
|
if (this.lastPanelHeight != panel.getBoundingClientRect().height) { |
|
|
|
|
|
|
|
this.lastPanelHeight = panel.getBoundingClientRect().height; |
|
|
|
|
|
|
|
panel.fireEvent('resize'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setInterval(checkResizeFn, 500); |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setupHeaderEvents : function () { |
|
|
|
|
|
|
|
this.currentHeaderAction = ''; |
|
|
|
|
|
|
|
this.canResize = false; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var resetElementBorderStyle = function (el, side) { |
|
|
|
|
|
|
|
if (side === 'left' || side !== 'right') { |
|
|
|
|
|
|
|
el.setStyle('border-left-style', ''); |
|
|
|
|
|
|
|
el.setStyle('border-left-color', ''); |
|
|
|
|
|
|
|
el.setStyle('border-left-width', ''); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (side === 'right' || side !== 'left') { |
|
|
|
|
|
|
|
el.setStyle('border-right-style', ''); |
|
|
|
|
|
|
|
el.setStyle('border-right-color', ''); |
|
|
|
|
|
|
|
el.setStyle('border-right-width', ''); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var mouseMoveFn = function (e) { |
|
|
|
|
|
|
|
var brect = e.target.getBoundingClientRect(); |
|
|
|
|
|
|
|
var mouseXRelative = e.event.clientX - brect.left; |
|
|
|
|
|
|
|
if (this.currentHeaderAction === '') { |
|
|
|
|
|
|
|
if (brect.width - mouseXRelative < 5) { |
|
|
|
|
|
|
|
this.resizeTh = e.target; |
|
|
|
|
|
|
|
this.canResize = true; |
|
|
|
|
|
|
|
e.target.getParent("tr").style.cursor = 'col-resize'; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
else if ((mouseXRelative < 5) && e.target.getPrevious('[class=""]')) { |
|
|
|
|
|
|
|
this.resizeTh = e.target.getPrevious('[class=""]'); |
|
|
|
|
|
|
|
this.canResize = true; |
|
|
|
|
|
|
|
e.target.getParent("tr").style.cursor = 'col-resize'; |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.canResize = false; |
|
|
|
|
|
|
|
e.target.getParent("tr").style.cursor = ''; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (this.currentHeaderAction === 'drag') { |
|
|
|
|
|
|
|
var previousVisibleSibling = e.target.getPrevious('[class=""]'); |
|
|
|
|
|
|
|
var borderChangeElement = previousVisibleSibling; |
|
|
|
|
|
|
|
var changeBorderSide = 'right'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (mouseXRelative > brect.width / 2) { |
|
|
|
|
|
|
|
borderChangeElement = e.target; |
|
|
|
|
|
|
|
this.dropSide = 'right'; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
else { |
|
|
|
|
|
|
|
this.dropSide = 'left'; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
e.target.getParent("tr").style.cursor = 'move'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (!previousVisibleSibling) { // right most column
|
|
|
|
|
|
|
|
borderChangeElement = e.target; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (mouseXRelative <= brect.width / 2) |
|
|
|
|
|
|
|
changeBorderSide = 'left'; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
borderChangeElement.setStyle('border-' + changeBorderSide + '-style', 'solid'); |
|
|
|
|
|
|
|
borderChangeElement.setStyle('border-' + changeBorderSide + '-color', '#e60'); |
|
|
|
|
|
|
|
borderChangeElement.setStyle('border-' + changeBorderSide + '-width', 'initial'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
resetElementBorderStyle(borderChangeElement, changeBorderSide === 'right' ? 'left' : 'right'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
borderChangeElement.getSiblings('[class=""]').each(function(el){ |
|
|
|
|
|
|
|
resetElementBorderStyle(el); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
this.lastHoverTh = e.target; |
|
|
|
|
|
|
|
this.lastClientX = e.event.clientX; |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var mouseOutFn = function (e) { |
|
|
|
|
|
|
|
resetElementBorderStyle(e.target); |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onBeforeStart = function (el) { |
|
|
|
|
|
|
|
this.clickedTh = el; |
|
|
|
|
|
|
|
this.currentHeaderAction = 'start'; |
|
|
|
|
|
|
|
this.dragMovement = false; |
|
|
|
|
|
|
|
this.dragStartX = this.lastClientX; |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onStart = function (el, event) { |
|
|
|
|
|
|
|
if (this.canResize) { |
|
|
|
|
|
|
|
this.currentHeaderAction = 'resize'; |
|
|
|
|
|
|
|
this.startWidth = this.resizeTh.getStyle('width').toFloat(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
else { |
|
|
|
|
|
|
|
this.currentHeaderAction = 'drag'; |
|
|
|
|
|
|
|
el.setStyle('background-color', '#C1D5E7'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onDrag = function (el, event) { |
|
|
|
|
|
|
|
if (this.currentHeaderAction === 'resize') { |
|
|
|
|
|
|
|
var width = this.startWidth + (event.page.x - this.dragStartX); |
|
|
|
|
|
|
|
if (width < 16) |
|
|
|
|
|
|
|
width = 16; |
|
|
|
|
|
|
|
this.columns[this.resizeTh.columnName].width = width; |
|
|
|
|
|
|
|
this.updateColumn(this.resizeTh.columnName); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onComplete = function (el, event) { |
|
|
|
|
|
|
|
resetElementBorderStyle(this.lastHoverTh); |
|
|
|
|
|
|
|
el.setStyle('background-color', ''); |
|
|
|
|
|
|
|
if (this.currentHeaderAction === 'resize') |
|
|
|
|
|
|
|
localStorage.setItem('column_' + this.resizeTh.columnName + '_width_' + this.dynamicTableDivId, this.columns[this.resizeTh.columnName].width); |
|
|
|
|
|
|
|
if ((this.currentHeaderAction === 'drag') && (el !== this.lastHoverTh)) { |
|
|
|
|
|
|
|
this.saveColumnsOrder(); |
|
|
|
|
|
|
|
var val = localStorage.getItem('columns_order_' + this.dynamicTableDivId).split(','); |
|
|
|
|
|
|
|
val.erase(el.columnName); |
|
|
|
|
|
|
|
var pos = val.indexOf(this.lastHoverTh.columnName); |
|
|
|
|
|
|
|
if (this.dropSide === 'right') pos++; |
|
|
|
|
|
|
|
val.splice(pos, 0, el.columnName); |
|
|
|
|
|
|
|
localStorage.setItem('columns_order_' + this.dynamicTableDivId, val.join(',')); |
|
|
|
|
|
|
|
this.loadColumnsOrder(); |
|
|
|
|
|
|
|
this.updateTableHeaders(); |
|
|
|
|
|
|
|
while (this.tableBody.firstChild) |
|
|
|
|
|
|
|
this.tableBody.removeChild(this.tableBody.firstChild); |
|
|
|
|
|
|
|
this.updateTable(true); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (this.currentHeaderAction === 'drag') { |
|
|
|
|
|
|
|
resetElementBorderStyle(el); |
|
|
|
|
|
|
|
el.getSiblings('[class=""]').each(function(el){ |
|
|
|
|
|
|
|
resetElementBorderStyle(el); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
this.currentHeaderAction = ''; |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onCancel = function (el) { |
|
|
|
|
|
|
|
this.currentHeaderAction = ''; |
|
|
|
|
|
|
|
this.setSortedColumn(el.columnName); |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var ths = this.fixedTableHeader.getElements('th'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < ths.length; i++) { |
|
|
|
|
|
|
|
var th = ths[i]; |
|
|
|
|
|
|
|
th.addEvent('mousemove', mouseMoveFn); |
|
|
|
|
|
|
|
th.addEvent('mouseout', mouseOutFn); |
|
|
|
|
|
|
|
th.makeResizable({ |
|
|
|
|
|
|
|
modifiers : {x: '', y: ''}, |
|
|
|
|
|
|
|
onBeforeStart : onBeforeStart, |
|
|
|
|
|
|
|
onStart : onStart, |
|
|
|
|
|
|
|
onDrag : onDrag, |
|
|
|
|
|
|
|
onComplete : onComplete, |
|
|
|
|
|
|
|
onCancel : onCancel |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setupDynamicTableHeaderContextMenuClass : function () { |
|
|
|
|
|
|
|
if (!DynamicTableHeaderContextMenuClass) { |
|
|
|
|
|
|
|
DynamicTableHeaderContextMenuClass = new Class({ |
|
|
|
|
|
|
|
Extends: ContextMenu, |
|
|
|
|
|
|
|
updateMenuItems: function () { |
|
|
|
|
|
|
|
for (var i = 0; i < this.dynamicTable.columns.length; i++) { |
|
|
|
|
|
|
|
if (this.dynamicTable.columns[i].caption === '') |
|
|
|
|
|
|
|
continue; |
|
|
|
|
|
|
|
if (this.dynamicTable.columns[i].visible !== '0') |
|
|
|
|
|
|
|
this.setItemChecked(this.dynamicTable.columns[i].name, true); |
|
|
|
|
|
|
|
else |
|
|
|
|
|
|
|
this.setItemChecked(this.dynamicTable.columns[i].name, false); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
showColumn : function (columnName, show) { |
|
|
|
|
|
|
|
this.columns[columnName].visible = show ? '1' : '0'; |
|
|
|
|
|
|
|
localStorage.setItem('column_' + columnName + '_visible_' + this.dynamicTableDivId, show ? '1' : '0'); |
|
|
|
|
|
|
|
this.updateColumn(columnName); |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setupHeaderMenu : function () { |
|
|
|
|
|
|
|
this.setupDynamicTableHeaderContextMenuClass(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var menuId = this.dynamicTableDivId + '_headerMenu'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var ul = new Element('ul', {id: menuId, class: 'contextMenu scrollableMenu'}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var createLi = function(columnName, text) { |
|
|
|
|
|
|
|
var html = '<a href="#' + columnName + '" ><img src="theme/checked"/>' + escapeHtml(text) + '</a>'; |
|
|
|
|
|
|
|
return new Element('li', {html: html}); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var actions = {}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var onMenuItemClicked = function (element, ref, action) { |
|
|
|
|
|
|
|
this.showColumn(action, this.columns[action].visible === '0'); |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < this.columns.length; i++) { |
|
|
|
|
|
|
|
var text = this.columns[i].caption; |
|
|
|
|
|
|
|
if (text === '') |
|
|
|
|
|
|
|
continue; |
|
|
|
|
|
|
|
ul.appendChild(createLi(this.columns[i].name, text)); |
|
|
|
|
|
|
|
actions[this.columns[i].name] = onMenuItemClicked; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ul.inject(document.body); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.headerContextMenu = new DynamicTableHeaderContextMenuClass({ |
|
|
|
|
|
|
|
targets: '#' + this.dynamicTableFixedHeaderDivId + ' tr', |
|
|
|
|
|
|
|
actions: actions, |
|
|
|
|
|
|
|
menu : menuId, |
|
|
|
|
|
|
|
offsets : { |
|
|
|
|
|
|
|
x : -15, |
|
|
|
|
|
|
|
y : 2 |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.headerContextMenu.dynamicTable = this; |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
initColumns : function () {}, |
|
|
|
initColumns : function () {}, |
|
|
|
|
|
|
|
|
|
|
|
newColumn : function (name, style, caption) { |
|
|
|
newColumn : function (name, style, caption, defaultWidth, defaultVisible) { |
|
|
|
var column = {}; |
|
|
|
var column = {}; |
|
|
|
column['name'] = name; |
|
|
|
column['name'] = name; |
|
|
|
column['visible'] = getLocalStorageItem('column_' + name + '_visible_' + this.tableId, '1'); |
|
|
|
column['visible'] = getLocalStorageItem('column_' + name + '_visible_' + this.dynamicTableDivId, defaultVisible ? '1' : '0'); |
|
|
|
column['force_hide'] = false; |
|
|
|
column['force_hide'] = false; |
|
|
|
column['caption'] = caption; |
|
|
|
column['caption'] = caption; |
|
|
|
column['style'] = style; |
|
|
|
column['style'] = style; |
|
|
|
column['onclick'] = 'this._this.setSortedColumn(\'' + name + '\');'; |
|
|
|
column['width'] = getLocalStorageItem('column_' + name + '_width_' + this.dynamicTableDivId, defaultWidth); |
|
|
|
column['dataProperties'] = [name]; |
|
|
|
column['dataProperties'] = [name]; |
|
|
|
column['getRowValue'] = function (row, pos) { |
|
|
|
column['getRowValue'] = function (row, pos) { |
|
|
|
if (pos == undefined) |
|
|
|
if (pos == undefined) |
|
|
|
@ -76,15 +344,17 @@ var DynamicTable = new Class({ |
|
|
|
column['updateTd'] = function (td, row) { |
|
|
|
column['updateTd'] = function (td, row) { |
|
|
|
td.innerHTML = this.getRowValue(row); |
|
|
|
td.innerHTML = this.getRowValue(row); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
column['onResize'] = null; |
|
|
|
this.columns.push(column); |
|
|
|
this.columns.push(column); |
|
|
|
this.columns[name] = column; |
|
|
|
this.columns[name] = column; |
|
|
|
|
|
|
|
|
|
|
|
$(this.tableHeaderId).appendChild(new Element('th')); |
|
|
|
this.hiddenTableHeader.appendChild(new Element('th')); |
|
|
|
|
|
|
|
this.fixedTableHeader.appendChild(new Element('th')); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
loadColumnsOrder : function () { |
|
|
|
loadColumnsOrder : function () { |
|
|
|
columnsOrder = ['state_icon']; // status icon column is always the first
|
|
|
|
var columnsOrder = []; |
|
|
|
val = localStorage.getItem('columns_order_' + this.tableId); |
|
|
|
var val = localStorage.getItem('columns_order_' + this.dynamicTableDivId); |
|
|
|
if (val === null || val === undefined) return; |
|
|
|
if (val === null || val === undefined) return; |
|
|
|
val.split(',').forEach(function(v) { |
|
|
|
val.split(',').forEach(function(v) { |
|
|
|
if ((v in this.columns) && (!columnsOrder.contains(v))) |
|
|
|
if ((v in this.columns) && (!columnsOrder.contains(v))) |
|
|
|
@ -106,18 +376,24 @@ var DynamicTable = new Class({ |
|
|
|
val += ','; |
|
|
|
val += ','; |
|
|
|
val += this.columns[i].name; |
|
|
|
val += this.columns[i].name; |
|
|
|
} |
|
|
|
} |
|
|
|
localStorage.setItem('columns_order_' + this.tableId, val); |
|
|
|
localStorage.setItem('columns_order_' + this.dynamicTableDivId, val); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
updateHeader : function () { |
|
|
|
updateTableHeaders : function () { |
|
|
|
var ths = $(this.tableHeaderId).getElements('th'); |
|
|
|
this.updateHeader(this.hiddenTableHeader); |
|
|
|
|
|
|
|
this.updateHeader(this.fixedTableHeader); |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
updateHeader : function (header) { |
|
|
|
|
|
|
|
var ths = header.getElements('th'); |
|
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < ths.length; i++) { |
|
|
|
for (var i = 0; i < ths.length; i++) { |
|
|
|
th = ths[i]; |
|
|
|
th = ths[i]; |
|
|
|
th._this = this; |
|
|
|
th._this = this; |
|
|
|
th.setAttribute('onclick', this.columns[i].onclick); |
|
|
|
th.setAttribute('title', this.columns[i].caption); |
|
|
|
th.innerHTML = this.columns[i].caption; |
|
|
|
th.innerHTML = this.columns[i].caption; |
|
|
|
th.setAttribute('style', this.columns[i].style); |
|
|
|
th.setAttribute('style', 'width: ' + this.columns[i].width + 'px;' + this.columns[i].style); |
|
|
|
|
|
|
|
th.columnName = this.columns[i].name; |
|
|
|
if ((this.columns[i].visible == '0') || this.columns[i].force_hide) |
|
|
|
if ((this.columns[i].visible == '0') || this.columns[i].force_hide) |
|
|
|
th.addClass('invisible'); |
|
|
|
th.addClass('invisible'); |
|
|
|
else |
|
|
|
else |
|
|
|
@ -135,17 +411,30 @@ var DynamicTable = new Class({ |
|
|
|
updateColumn : function (columnName) { |
|
|
|
updateColumn : function (columnName) { |
|
|
|
var pos = this.getColumnPos(columnName); |
|
|
|
var pos = this.getColumnPos(columnName); |
|
|
|
var visible = ((this.columns[pos].visible != '0') && !this.columns[pos].force_hide); |
|
|
|
var visible = ((this.columns[pos].visible != '0') && !this.columns[pos].force_hide); |
|
|
|
var ths = $(this.tableHeaderId).getElements('th'); |
|
|
|
var ths = this.hiddenTableHeader.getElements('th'); |
|
|
|
if (visible) |
|
|
|
var fths = this.fixedTableHeader.getElements('th'); |
|
|
|
|
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
|
|
|
|
var style = 'width: ' + this.columns[pos].width + 'px;' + this.columns[pos].style; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ths[pos].setAttribute('style', style); |
|
|
|
|
|
|
|
fths[pos].setAttribute('style', style); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (visible) { |
|
|
|
ths[pos].removeClass('invisible'); |
|
|
|
ths[pos].removeClass('invisible'); |
|
|
|
else |
|
|
|
fths[pos].removeClass('invisible'); |
|
|
|
ths[pos].addClass('invisible'); |
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
|
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
|
|
|
|
if (visible) |
|
|
|
|
|
|
|
trs[i].getElements('td')[pos].removeClass('invisible'); |
|
|
|
trs[i].getElements('td')[pos].removeClass('invisible'); |
|
|
|
else |
|
|
|
} |
|
|
|
|
|
|
|
else { |
|
|
|
|
|
|
|
ths[pos].addClass('invisible'); |
|
|
|
|
|
|
|
fths[pos].addClass('invisible'); |
|
|
|
|
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
trs[i].getElements('td')[pos].addClass('invisible'); |
|
|
|
trs[i].getElements('td')[pos].addClass('invisible'); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (this.columns[pos].onResize !== null) |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
this.columns[pos].onResize(columnName); |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
setSortedColumn : function (column) { |
|
|
|
setSortedColumn : function (column) { |
|
|
|
@ -157,14 +446,14 @@ var DynamicTable = new Class({ |
|
|
|
// Toggle sort order
|
|
|
|
// Toggle sort order
|
|
|
|
this.reverseSort = this.reverseSort == '0' ? '1' : '0'; |
|
|
|
this.reverseSort = this.reverseSort == '0' ? '1' : '0'; |
|
|
|
} |
|
|
|
} |
|
|
|
localStorage.setItem('sorted_column_' + this.tableId, column); |
|
|
|
localStorage.setItem('sorted_column_' + this.dynamicTableDivId, column); |
|
|
|
localStorage.setItem('reverse_sort_' + this.tableId, this.reverseSort); |
|
|
|
localStorage.setItem('reverse_sort_' + this.dynamicTableDivId, this.reverseSort); |
|
|
|
this.updateTable(false); |
|
|
|
this.updateTable(false); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
getSelectedRowId : function () { |
|
|
|
getSelectedRowId : function () { |
|
|
|
if (this.cur.length > 0) |
|
|
|
if (this.selectedRows.length > 0) |
|
|
|
return this.cur[0]; |
|
|
|
return this.selectedRows[0]; |
|
|
|
return ''; |
|
|
|
return ''; |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
@ -172,7 +461,7 @@ var DynamicTable = new Class({ |
|
|
|
if (!MUI.ieLegacySupport) |
|
|
|
if (!MUI.ieLegacySupport) |
|
|
|
return; |
|
|
|
return; |
|
|
|
|
|
|
|
|
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
trs.each(function (el, i) { |
|
|
|
trs.each(function (el, i) { |
|
|
|
if (i % 2) { |
|
|
|
if (i % 2) { |
|
|
|
el.addClass('alt'); |
|
|
|
el.addClass('alt'); |
|
|
|
@ -183,25 +472,25 @@ var DynamicTable = new Class({ |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
selectAll : function () { |
|
|
|
selectAll : function () { |
|
|
|
this.cur.empty(); |
|
|
|
this.selectedRows.empty(); |
|
|
|
|
|
|
|
|
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
var tr = trs[i]; |
|
|
|
var tr = trs[i]; |
|
|
|
this.cur.push(tr.rowId); |
|
|
|
this.selectedRows.push(tr.rowId); |
|
|
|
if (!tr.hasClass('selected')) |
|
|
|
if (!tr.hasClass('selected')) |
|
|
|
tr.addClass('selected'); |
|
|
|
tr.addClass('selected'); |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
deselectAll : function () { |
|
|
|
deselectAll : function () { |
|
|
|
this.cur.empty(); |
|
|
|
this.selectedRows.empty(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
selectRow : function (rowId) { |
|
|
|
selectRow : function (rowId) { |
|
|
|
this.cur.empty(); |
|
|
|
this.selectedRows.empty(); |
|
|
|
this.cur.push(rowId); |
|
|
|
this.selectedRows.push(rowId); |
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
var tr = trs[i]; |
|
|
|
var tr = trs[i]; |
|
|
|
if (tr.rowId == rowId) { |
|
|
|
if (tr.rowId == rowId) { |
|
|
|
@ -259,7 +548,7 @@ var DynamicTable = new Class({ |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
getTrByRowId : function (rowId) { |
|
|
|
getTrByRowId : function (rowId) { |
|
|
|
trs = this.table.getElements('tr'); |
|
|
|
trs = this.tableBody.getElements('tr'); |
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
if (trs[i].rowId == rowId) |
|
|
|
if (trs[i].rowId == rowId) |
|
|
|
return trs[i]; |
|
|
|
return trs[i]; |
|
|
|
@ -272,20 +561,19 @@ var DynamicTable = new Class({ |
|
|
|
|
|
|
|
|
|
|
|
var rows = this.getFilteredAndSortedRows(); |
|
|
|
var rows = this.getFilteredAndSortedRows(); |
|
|
|
|
|
|
|
|
|
|
|
for (var i = 0; i < this.cur.length; i++) |
|
|
|
for (var i = 0; i < this.selectedRows.length; i++) |
|
|
|
if (!(this.cur[i] in rows)) { |
|
|
|
if (!(this.selectedRows[i] in rows)) { |
|
|
|
this.cur.splice(i, 1); |
|
|
|
this.selectedRows.splice(i, 1); |
|
|
|
i--; |
|
|
|
i--; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
|
|
|
|
|
|
|
|
for (var rowPos = 0; rowPos < rows.length; rowPos++) { |
|
|
|
for (var rowPos = 0; rowPos < rows.length; rowPos++) { |
|
|
|
var rowId = rows[rowPos]['rowId']; |
|
|
|
var rowId = rows[rowPos]['rowId']; |
|
|
|
tr_found = false; |
|
|
|
tr_found = false; |
|
|
|
for (j = rowPos; j < trs.length; j++) |
|
|
|
for (j = rowPos; j < trs.length; j++) |
|
|
|
if (trs[j]['rowId'] == rowId) { |
|
|
|
if (trs[j]['rowId'] == rowId) { |
|
|
|
trs[rowPos].removeClass('over'); |
|
|
|
|
|
|
|
tr_found = true; |
|
|
|
tr_found = true; |
|
|
|
if (rowPos == j) |
|
|
|
if (rowPos == j) |
|
|
|
break; |
|
|
|
break; |
|
|
|
@ -304,7 +592,7 @@ var DynamicTable = new Class({ |
|
|
|
|
|
|
|
|
|
|
|
tr._this = this; |
|
|
|
tr._this = this; |
|
|
|
tr.addEvent('contextmenu', function (e) { |
|
|
|
tr.addEvent('contextmenu', function (e) { |
|
|
|
if (!this._this.cur.contains(this.rowId)) |
|
|
|
if (!this._this.selectedRows.contains(this.rowId)) |
|
|
|
this._this.selectRow(this.rowId); |
|
|
|
this._this.selectRow(this.rowId); |
|
|
|
return true; |
|
|
|
return true; |
|
|
|
}); |
|
|
|
}); |
|
|
|
@ -312,37 +600,37 @@ var DynamicTable = new Class({ |
|
|
|
e.stop(); |
|
|
|
e.stop(); |
|
|
|
if (e.control) { |
|
|
|
if (e.control) { |
|
|
|
// CTRL key was pressed
|
|
|
|
// CTRL key was pressed
|
|
|
|
if (this._this.cur.contains(this.rowId)) { |
|
|
|
if (this._this.selectedRows.contains(this.rowId)) { |
|
|
|
// remove it
|
|
|
|
// remove it
|
|
|
|
this._this.cur.erase(this.rowId); |
|
|
|
this._this.selectedRows.erase(this.rowId); |
|
|
|
// Remove selected style
|
|
|
|
// Remove selected style
|
|
|
|
this.removeClass('selected'); |
|
|
|
this.removeClass('selected'); |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
else { |
|
|
|
this._this.cur.push(this.rowId); |
|
|
|
this._this.selectedRows.push(this.rowId); |
|
|
|
// Add selected style
|
|
|
|
// Add selected style
|
|
|
|
this.addClass('selected'); |
|
|
|
this.addClass('selected'); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
else { |
|
|
|
if (e.shift && this._this.cur.length == 1) { |
|
|
|
if (e.shift && this._this.selectedRows.length == 1) { |
|
|
|
// Shift key was pressed
|
|
|
|
// Shift key was pressed
|
|
|
|
var first_row_id = this._this.cur[0]; |
|
|
|
var first_row_id = this._this.selectedRows[0]; |
|
|
|
var last_row_id = this.rowId; |
|
|
|
var last_row_id = this.rowId; |
|
|
|
this._this.cur.empty(); |
|
|
|
this._this.selectedRows.empty(); |
|
|
|
var trs = this._this.table.getElements('tr'); |
|
|
|
var trs = this._this.tableBody.getElements('tr'); |
|
|
|
var select = false; |
|
|
|
var select = false; |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
for (var i = 0; i < trs.length; i++) { |
|
|
|
var tr = trs[i]; |
|
|
|
var tr = trs[i]; |
|
|
|
|
|
|
|
|
|
|
|
if ((tr.rowId == first_row_id) || (tr.rowId == last_row_id)) { |
|
|
|
if ((tr.rowId == first_row_id) || (tr.rowId == last_row_id)) { |
|
|
|
this._this.cur.push(tr.rowId); |
|
|
|
this._this.selectedRows.push(tr.rowId); |
|
|
|
tr.addClass('selected'); |
|
|
|
tr.addClass('selected'); |
|
|
|
select = !select; |
|
|
|
select = !select; |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
else { |
|
|
|
if (select) { |
|
|
|
if (select) { |
|
|
|
this._this.cur.push(tr.rowId); |
|
|
|
this._this.selectedRows.push(tr.rowId); |
|
|
|
tr.addClass('selected'); |
|
|
|
tr.addClass('selected'); |
|
|
|
} |
|
|
|
} |
|
|
|
else |
|
|
|
else |
|
|
|
@ -368,7 +656,7 @@ var DynamicTable = new Class({ |
|
|
|
|
|
|
|
|
|
|
|
// Insert
|
|
|
|
// Insert
|
|
|
|
if (rowPos >= trs.length) { |
|
|
|
if (rowPos >= trs.length) { |
|
|
|
tr.inject(this.table); |
|
|
|
tr.inject(this.tableBody); |
|
|
|
trs.push(tr); |
|
|
|
trs.push(tr); |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
else { |
|
|
|
@ -377,8 +665,8 @@ var DynamicTable = new Class({ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// Update context menu
|
|
|
|
// Update context menu
|
|
|
|
if (this.context_menu) |
|
|
|
if (this.contextMenu) |
|
|
|
this.context_menu.addTarget(tr); |
|
|
|
this.contextMenu.addTarget(tr); |
|
|
|
|
|
|
|
|
|
|
|
this.updateRow(tr, true); |
|
|
|
this.updateRow(tr, true); |
|
|
|
} |
|
|
|
} |
|
|
|
@ -407,7 +695,7 @@ var DynamicTable = new Class({ |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
removeRow : function (rowId) { |
|
|
|
removeRow : function (rowId) { |
|
|
|
this.cur.erase(rowId); |
|
|
|
this.selectedRows.erase(rowId); |
|
|
|
var tr = this.getTrByRowId(rowId); |
|
|
|
var tr = this.getTrByRowId(rowId); |
|
|
|
if (tr != null) { |
|
|
|
if (tr != null) { |
|
|
|
tr.dispose(); |
|
|
|
tr.dispose(); |
|
|
|
@ -418,9 +706,9 @@ var DynamicTable = new Class({ |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
clear : function () { |
|
|
|
clear : function () { |
|
|
|
this.cur.empty(); |
|
|
|
this.selectedRows.empty(); |
|
|
|
this.rows.empty(); |
|
|
|
this.rows.empty(); |
|
|
|
var trs = this.table.getElements('tr'); |
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
while (trs.length > 0) { |
|
|
|
while (trs.length > 0) { |
|
|
|
trs[trs.length - 1].dispose(); |
|
|
|
trs[trs.length - 1].dispose(); |
|
|
|
trs.pop(); |
|
|
|
trs.pop(); |
|
|
|
@ -428,7 +716,7 @@ var DynamicTable = new Class({ |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
selectedRowsIds : function () { |
|
|
|
selectedRowsIds : function () { |
|
|
|
return this.cur.slice(); |
|
|
|
return this.selectedRows.slice(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
getRowIds : function () { |
|
|
|
getRowIds : function () { |
|
|
|
@ -440,19 +728,34 @@ var TorrentsTable = new Class({ |
|
|
|
Extends: DynamicTable, |
|
|
|
Extends: DynamicTable, |
|
|
|
|
|
|
|
|
|
|
|
initColumns : function () { |
|
|
|
initColumns : function () { |
|
|
|
this.newColumn('priority', 'width: 30px', '#'); |
|
|
|
this.newColumn('priority', '', '#', 30, true); |
|
|
|
this.newColumn('state_icon', 'width: 16px; cursor: default', ''); |
|
|
|
this.newColumn('state_icon', 'cursor: default', '', 22, true); |
|
|
|
this.newColumn('name', 'min-width: 200px', 'QBT_TR(Name)QBT_TR'); |
|
|
|
this.newColumn('name', '', 'QBT_TR(Name)QBT_TR[CONTEXT=TorrentModel]', 200, true); |
|
|
|
this.newColumn('size', 'width: 100px', 'QBT_TR(Size)QBT_TR'); |
|
|
|
this.newColumn('size', '', 'QBT_TR(Size)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('progress', 'width: 80px', 'QBT_TR(Done)QBT_TR'); |
|
|
|
this.newColumn('progress', '', 'QBT_TR(Done)QBT_TR[CONTEXT=TorrentModel]', 85, true); |
|
|
|
this.newColumn('num_seeds', 'width: 100px', 'QBT_TR(Seeds)QBT_TR'); |
|
|
|
this.newColumn('num_seeds', '', 'QBT_TR(Seeds)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('num_leechs', 'width: 100px', 'QBT_TR(Peers)QBT_TR'); |
|
|
|
this.newColumn('num_leechs', '', 'QBT_TR(Peers)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('dlspeed', 'width: 100px', 'QBT_TR(Down Speed)QBT_TR'); |
|
|
|
this.newColumn('dlspeed', '', 'QBT_TR(Down Speed)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('upspeed', 'width: 100px', 'QBT_TR(Up Speed)QBT_TR'); |
|
|
|
this.newColumn('upspeed', '', 'QBT_TR(Up Speed)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('eta', 'width: 100px', 'QBT_TR(ETA)QBT_TR'); |
|
|
|
this.newColumn('eta', '', 'QBT_TR(ETA)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('ratio', 'width: 100px', 'QBT_TR(Ratio)QBT_TR'); |
|
|
|
this.newColumn('ratio', '', 'QBT_TR(Ratio)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('category', 'width: 100px', 'QBT_TR(Category)QBT_TR'); |
|
|
|
this.newColumn('category', '', 'QBT_TR(Category)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
this.newColumn('added_on', 'width: 100px', 'QBT_TR(Added on)QBT_TR'); |
|
|
|
this.newColumn('added_on', '', 'QBT_TR(Added On)QBT_TR[CONTEXT=TorrentModel]', 100, true); |
|
|
|
|
|
|
|
this.newColumn('completion_on', '', 'QBT_TR(Completed On)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('tracker', '', 'QBT_TR(Tracker)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('dl_limit', '', 'QBT_TR(Down Limit)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('up_limit', '', 'QBT_TR(Up Limit)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('downloaded', '', 'QBT_TR(Downloaded)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('uploaded', '', 'QBT_TR(Uploaded)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('downloaded_session', '', 'QBT_TR(Session Download)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('uploaded_session', '', 'QBT_TR(Session Upload)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('amount_left', '', 'QBT_TR(Remaining)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('save_path', '', 'QBT_TR(Save path)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('completed', '', 'QBT_TR(Completed)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('ratio_limit', '', 'QBT_TR(Ratio Limit)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('seen_complete', '', 'QBT_TR(Last Seen Complete)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('last_activity', '', 'QBT_TR(Last Activity)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
this.newColumn('total_size', '', 'QBT_TR(Total Size)QBT_TR[CONTEXT=TorrentModel]', 100, false); |
|
|
|
|
|
|
|
|
|
|
|
this.columns['state_icon'].onclick = ''; |
|
|
|
this.columns['state_icon'].onclick = ''; |
|
|
|
this.columns['state_icon'].dataProperties[0] = 'state'; |
|
|
|
this.columns['state_icon'].dataProperties[0] = 'state'; |
|
|
|
@ -548,15 +851,27 @@ var TorrentsTable = new Class({ |
|
|
|
|
|
|
|
|
|
|
|
if (td.getChildren('div').length) { |
|
|
|
if (td.getChildren('div').length) { |
|
|
|
var div = td.getChildren('div')[0]; |
|
|
|
var div = td.getChildren('div')[0]; |
|
|
|
|
|
|
|
var newWidth = td.offsetWidth - 5; |
|
|
|
|
|
|
|
if (div.lastWidth !== newWidth) { |
|
|
|
|
|
|
|
div.setWidth(newWidth); |
|
|
|
|
|
|
|
div.lastWidth = newWidth; |
|
|
|
|
|
|
|
} |
|
|
|
if (div.getValue() != progressFormated) |
|
|
|
if (div.getValue() != progressFormated) |
|
|
|
div.setValue(progressFormated); |
|
|
|
div.setValue(progressFormated); |
|
|
|
} |
|
|
|
} |
|
|
|
else |
|
|
|
else |
|
|
|
td.adopt(new ProgressBar(progressFormated.toFloat(), { |
|
|
|
td.adopt(new ProgressBar(progressFormated.toFloat(), { |
|
|
|
'width' : 80 |
|
|
|
'width' : td.offsetWidth - 5 |
|
|
|
})); |
|
|
|
})); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['progress'].onResize = function (columnName) { |
|
|
|
|
|
|
|
var pos = this.getColumnPos(columnName); |
|
|
|
|
|
|
|
var trs = this.tableBody.getElements('tr'); |
|
|
|
|
|
|
|
for (var i = 0; i < trs.length; i++) |
|
|
|
|
|
|
|
this.columns[columnName].updateTd(trs[i].getElements('td')[pos], this.rows.get(trs[i].rowId)); |
|
|
|
|
|
|
|
}.bind(this); |
|
|
|
|
|
|
|
|
|
|
|
// num_seeds
|
|
|
|
// num_seeds
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['num_seeds'].updateTd = function (td, row) { |
|
|
|
this.columns['num_seeds'].updateTd = function (td, row) { |
|
|
|
@ -626,6 +941,64 @@ var TorrentsTable = new Class({ |
|
|
|
var date = new Date(this.getRowValue(row) * 1000).toLocaleString(); |
|
|
|
var date = new Date(this.getRowValue(row) * 1000).toLocaleString(); |
|
|
|
td.set('html', date); |
|
|
|
td.set('html', date); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// completion_on
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['completion_on'].updateTd = function (td, row) { |
|
|
|
|
|
|
|
var val = this.getRowValue(row); |
|
|
|
|
|
|
|
if (val === 0xffffffff || val < 0) |
|
|
|
|
|
|
|
td.set('html', ''); |
|
|
|
|
|
|
|
else { |
|
|
|
|
|
|
|
var date = new Date(this.getRowValue(row) * 1000).toLocaleString(); |
|
|
|
|
|
|
|
td.set('html', date); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// seen_complete
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['seen_complete'].updateTd = this.columns['completion_on'].updateTd; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// dl_limit, up_limit
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['dl_limit'].updateTd = function (td, row) { |
|
|
|
|
|
|
|
var speed = this.getRowValue(row); |
|
|
|
|
|
|
|
if (speed === 0) |
|
|
|
|
|
|
|
td.set('html', '∞') |
|
|
|
|
|
|
|
else |
|
|
|
|
|
|
|
td.set('html', friendlyUnit(speed, true)); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['up_limit'].updateTd = this.columns['dl_limit'].updateTd; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// downloaded, uploaded, downloaded_session, uploaded_session, amount_left, completed, total_size
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['downloaded'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['uploaded'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['downloaded_session'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['uploaded_session'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['amount_left'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['amount_left'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['completed'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
this.columns['total_size'].updateTd = this.columns['size'].updateTd; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// save_path, tracker
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['save_path'].updateTd = this.columns['name'].updateTd; |
|
|
|
|
|
|
|
this.columns['tracker'].updateTd = this.columns['name'].updateTd; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// ratio_limit
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['ratio_limit'].updateTd = this.columns['ratio'].updateTd; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// last_activity
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['last_activity'].updateTd = function (td, row) { |
|
|
|
|
|
|
|
var val = this.getRowValue(row); |
|
|
|
|
|
|
|
if (val < 1) |
|
|
|
|
|
|
|
td.set('html', '∞'); |
|
|
|
|
|
|
|
else |
|
|
|
|
|
|
|
td.set('html', 'QBT_TR(%1 ago)QBT_TR[CONTEXT=TransferListDelegate]'.replace('%1', friendlyDuration((new Date()) / 1000 - val, true))); |
|
|
|
|
|
|
|
}; |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
applyFilter : function (row, filterName, categoryHash) { |
|
|
|
applyFilter : function (row, filterName, categoryHash) { |
|
|
|
@ -752,18 +1125,19 @@ var TorrentPeersTable = new Class({ |
|
|
|
Extends: DynamicTable, |
|
|
|
Extends: DynamicTable, |
|
|
|
|
|
|
|
|
|
|
|
initColumns : function () { |
|
|
|
initColumns : function () { |
|
|
|
this.newColumn('country', 'width: 4px', ''); |
|
|
|
this.newColumn('country', '', 'QBT_TR(Country)QBT_TR[CONTEXT=PeerListWidget]', 22, true); |
|
|
|
this.newColumn('ip', 'width: 80px', 'QBT_TR(IP)QBT_TR'); |
|
|
|
this.newColumn('ip', '', 'QBT_TR(IP)QBT_TR[CONTEXT=PeerListWidget]', 80, true); |
|
|
|
this.newColumn('port', 'width: 35px', 'QBT_TR(Port)QBT_TR'); |
|
|
|
this.newColumn('port', '', 'QBT_TR(Port)QBT_TR[CONTEXT=PeerListWidget]', 35, true); |
|
|
|
this.newColumn('client', 'width: 110px', 'QBT_TR(Client)QBT_TR'); |
|
|
|
this.newColumn('client', '', 'QBT_TR(Client)QBT_TR[CONTEXT=PeerListWidget]', 140, true); |
|
|
|
this.newColumn('progress', 'width: 30px', 'QBT_TR(Progress)QBT_TR'); |
|
|
|
this.newColumn('progress', '', 'QBT_TR(Progress)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('dl_speed', 'width: 30px', 'QBT_TR(Down Speed)QBT_TR'); |
|
|
|
this.newColumn('dl_speed', '', 'QBT_TR(Down Speed)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('up_speed', 'width: 30px', 'QBT_TR(Up Speed)QBT_TR'); |
|
|
|
this.newColumn('up_speed', '', 'QBT_TR(Up Speed)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('downloaded', 'width: 30px', 'QBT_TR(Downloaded)QBT_TR[CONTEXT=PeerListWidget]'); |
|
|
|
this.newColumn('downloaded', '', 'QBT_TR(Downloaded)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('uploaded', 'width: 30px', 'QBT_TR(Uploaded)QBT_TR[CONTEXT=PeerListWidget]'); |
|
|
|
this.newColumn('uploaded', '', 'QBT_TR(Uploaded)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('connection', 'width: 30px', 'QBT_TR(Connection)QBT_TR'); |
|
|
|
this.newColumn('connection', '', 'QBT_TR(Connection)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('flags', 'width: 30px', 'QBT_TR(Flags)QBT_TR'); |
|
|
|
this.newColumn('flags', '', 'QBT_TR(Flags)QBT_TR[CONTEXT=PeerListWidget]', 50, true); |
|
|
|
this.newColumn('relevance', 'min-width: 30px', 'QBT_TR(Relevance)QBT_TR'); |
|
|
|
this.newColumn('relevance', '', 'QBT_TR(Relevance)QBT_TR[CONTEXT=PeerListWidget]', 30, true); |
|
|
|
|
|
|
|
this.newColumn('files', '', 'QBT_TR(Files)QBT_TR[CONTEXT=PeerListWidget]', 100, true); |
|
|
|
|
|
|
|
|
|
|
|
this.columns['country'].dataProperties.push('country_code'); |
|
|
|
this.columns['country'].dataProperties.push('country_code'); |
|
|
|
this.columns['flags'].dataProperties.push('flags_desc'); |
|
|
|
this.columns['flags'].dataProperties.push('flags_desc'); |
|
|
|
@ -858,6 +1232,13 @@ var TorrentPeersTable = new Class({ |
|
|
|
td.title = this.getRowValue(row, 1); |
|
|
|
td.title = this.getRowValue(row, 1); |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// files
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.columns['files'].updateTd = function (td, row) { |
|
|
|
|
|
|
|
td.innerHTML = escapeHtml(this.getRowValue(row, 0).replace('\n', ';')); |
|
|
|
|
|
|
|
td.title = escapeHtml(this.getRowValue(row, 0)); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
sledgehammer999
8 years ago
committed by