I'm having a really strange problem while sorting a dynamic DOM structure and by dynamic I mean that there will be content coming in and out of the structure I'm sorting. So what I'm doing is running two functions every 500ms in order to re-order all the new DOM elements as soon as they came in.
I'm doing this because I have no way to sort the data before is in the DOM (so please save your "this is not the right way to do things" comments, I Know, I have no other option).
The sorting is working "OK" the thing is that originally all this DOM elements (basically a parent DIV with a lot of children) open a PopUp window when you click on them, as soon as I apply the sorting function nothing happens when I click on them, my guess is because the whole DOM is reordering very fast because of rerunning the sorting function all the time something get lost, I just don't know how to fix it.
Here's the JQuery for assigning priorities to each div row and then reordering elements by that priority:
$(document).ready(function () {
setInterval(function () {
//Incoming Chat Structure Variables
var $incomingChatsTable, $incomingChatsRows, $incomingChatTags
$incomingChatsTable= $("div[__jx__id*='incoming_list__list_content_container']")
$incomingChatsRowsContainer=$("div[__jx__id='___$_194__visitor_list__incoming_list__list__content']")
$incomingChatsRows = $("div[class*='renderers_Incoming']")
$incomingChatTags = $( "div[__jx__id*='incoming_list__list__content'] div[class*='renderers_Incoming'] .visitorlist_tags .jx_ui_html_span:last-child .tag").toArray()
//Assigning Priorities Function
function assignPriority(arrayParent) {
for ( var i=0; i <= arrayParent.length; i++) {
var actualRow = $(arrayParent[i])
var minutesInQueue = $(actualRow).find('.time_cell').text().substr(0,2)
var priorityVal = parseInt(minutesInQueue)
var actualRowTags = $( actualRow ).find('.tag').toArray()
$(actualRow).addClass('priorityRow')
for (var k=0; k <= actualRowTags.length; k++) {
let normalHolderTag = $(actualRowTags[k]).text().toLowerCase()
if (normalHolderTag === 'vip') {
priorityVal += 30
$(actualRow).attr('data-priority', priorityVal)
} else if ( normalHolderTag === 'rg' ) {
priorityVal += 20
$(actualRow).attr('data-priority', priorityVal)
} else if ( normalHolderTag === 'accountclosure' ) {
priorityVal += 10
$(actualRow).attr('data-priority', priorityVal)
} else {
$(actualRow).attr('data-priority', priorityVal)
}
$(actualRow).find('.numbers_cell').text(priorityVal)
}
}
}
//Sorting Incoming Chats By Priority
function orderByPriority(container) {
var myArray = container.find('.priorityRow')
myArray.sort(function(a,b){
contentA = parseInt( $(a).data('priority') )
contentB = parseInt( $(b).data('priority') )
return (contentB - contentA)
}).prependTo( container )
}
setInterval(function () {
assignPriority( $incomingChatsRows )
orderByPriority( $incomingChatsRowsContainer )
}, 500)
}, 500)
})