Suggestion on Filelist sort order



  • The current filelist sort order is alphabetic. - which has a certain appeal.

    Mostly though - I find myself wanting to reprint one of the most recently downloaded files - especially if I have a couple with slightly different settings that I am trying to get right.

    It would be great if there was a configuration option to have the list sorted by date.

    Thanks in advance.



  • @stuartofmt just click the column name and it will sort by that



  • @jay_s_uk

    Which column name are you referring to ? I'm using DueUI. I do not see any column names in the widget ??

    Capture.PNG



  • This is the quick hack I made to Dueui_widget.js (see comments) -- but it's not exactly configurable .....

    class DueuiFileDropdownWidget extends DueuiSelectWidget {
    	constructor(config, parent){
    		super($.extend(true, {
    		}, config), parent);
    		this.refresh();
    //Added to force sort by date
            this.sort="date";
    		
    <snip>
    
    	async refresh() {
    		this.jq.empty();
    		let files = await dueui.getFileList(this.directory);
    		let options = [];
    		this.jq.append(`<option value="#####">Select a file...</option>`)
    		for (let fe of files) {
    
    //added date element to allow sorting
    			options.push({"value": fe.name, "label": this.formatName(fe.name), "date": fe.date});
    		}
    	
    if (this.sort &&
    			(this.sort === "label" || this.sort === "file")) {
    			if (this.sort === "file") {
    				this.sort = "value";
    			}
    			options.sort((a, b) => {
    				return a[this.sort].localeCompare(b[this.sort]);
    			});
    //else if added for date sorting
    		} else if (this.sort === "date"){
    			options.sort();
    			options.reverse();
    
    		} else {
    			options.sort();
    		}
    
    
    <snip>
    
    


  • @stuartofmt sorry, my bad. Missed this was in the dueui category.
    Disregard my comment



  • @jay_s_uk

    NP - in an active forum like this - it's easy to do 😷



  • I can add that to the config for the widget.



  • @gtj0

    I just realized that changing the sort setting in the config file to:

    				"element_configs": [
    					{
    						"id": "selectafile",
    						"type": "file_select",
    						"directory": "/gcodes/",
    <snip>
    						"sort": "date",
    
    <snip>
    

    and also making the suggested changes to dueui_widget.js (without the line this.sort="date" ) makes it easily switchable.



  • @gtj0

    Since I have been fiddling to gain a better working knowledge of js. Thought I'd pass on my attempt to rewrite the relevant portion of the filelist code.
    If it's useful / saves you some time - great. If not, it was an interesting exercise.

    	async refresh() {
    		this.jq.empty();
    		let files = await dueui.getFileList(this.directory);
    		let options = [];
    		this.jq.append(`<option value="#####">Select a file...</option>`)
    		for (let fe of files) {
    		let element = {};
    		element["value"] = fe.name;
    		element["label"] = this.formatName(fe.name);
    		if (this.sort === ("date"||"size")) {   //the current possible values are only type, name, size, date
    		element[this.sort] = fe[this.sort];
    		}
    		options.push(element);
    		}
    // Set the sort element
    if (this.sort !== ("date"||"size")) {
    	this.sort = "value";
    }		
    // Sort ascending by default		
    options.sort((a, b) => {return a[this.sort].localeCompare(b[this.sort]);});
    // Reverse it if necessary		
    if (this.ascending === false) {
    			options.reverse();
    }
    

    The default (no sort or ascending variable) as alphabetic ascending.

    For descending by date - I add these values in my config file.

    "element_configs": [
    	{
    		"id": "selectafile",
    		"type": "file_select",
    		"directory": "/gcodes/",
    <snip>
    		"sort": "date",
    		"ascending": false,
    <snip>
    		},
    


  • Of course - as I went to sleep, I realized that (1) the if statement inside the iteration loop was not a good idea and (2) at a practical level, there were only three use-cases and (3) the sort on size was wrong.
    So here is at least a better attempt.

    	async refresh() {
    		this.jq.empty();
    		let files = await dueui.getFileList(this.directory);
    		let options = [];
    		this.jq.append(`<option value="#####">Select a file...</option>`)
    		
    		if (this.sort === "date") {
    			for (let fe of files) {
    				options.push({"value": fe.name, "label": this.formatName(fe.name), "date": fe.date});
    			}	
    		} else if (this.sort === "size"){
    			for (let fe of files) {
    				options.push({"value": fe.name, "label": this.formatName(fe.name), "size": fe.size});
    			}				
    		} else {
    			for (let fe of files) {
    				options.push({"value": fe.name, "label": this.formatName(fe.name)});
    			}	
    		}
    
    // Set the sort element
    
    	if (this.sort === "date") {
    		options.sort((a, b) => {return a[this.sort].localeCompare(b[this.sort]);});
    	} else if (this.sort === "size") {
    		options.sort((a, b) => {return parseInt(a[this.sort]) - parseInt(b[this.sort]);});
    	} else {	
    		this.sort = "value";
    		options.sort((a, b) => {return a[this.sort].localeCompare(b[this.sort]);});
    	}
    
    // Sorted ascending by above		
    // Reverse it if necessary	
    	
    if (this.ascending === false) {
    			options.reverse();
    }
    


  • I woke this morning recognizing the two main if statements - in the above - can now be merged - making the whole thing quite tidy.


Log in to reply