Allow for the selection of a video file, image or directory containing images to be selected in the filmout UI.

This commit is contained in:
Matt McWilliams 2021-02-23 19:54:03 -05:00
parent 53d147b9bc
commit 66639e951b
3 changed files with 119 additions and 37 deletions

View File

@ -46,9 +46,9 @@ let filmout;
class FilmOut { class FilmOut {
constructor() { constructor() {
this.id = 'filmout'; this.id = 'filmout';
this.extensions = ['.mpg', '.mpeg', '.mov', '.mkv', '.avi', '.mp4', this.videoExtensions = ['.mpg', '.mpeg', '.mov', '.mkv', '.avi', '.mp4',
'.gif', '.gif'];
'.tif', '.tiff', '.png', '.jpg', '.jpeg', '.bmp']; this.imageExtensions = ['.tif', '.tiff', '.png', '.jpg', '.jpeg', '.bmp'];
this.displays = []; this.displays = [];
this.state = { this.state = {
frame: 0, frame: 0,
@ -120,12 +120,16 @@ class FilmOut {
this.state.display = id; this.state.display = id;
ipcRenderer.send('display', { display: id }); ipcRenderer.send('display', { display: id });
} }
/**
* Select a file from the showOpenDialog method. Save the file
* to an <input type=file> element if the selection is valid.
**/
selectFile() { selectFile() {
return __awaiter(this, void 0, void 0, function* () { return __awaiter(this, void 0, void 0, function* () {
const elem = $('#digital'); const elem = $('#digital');
const options = { const options = {
title: `Select video or image sequence`, title: `Select video or image sequence`,
properties: [`openFile`], properties: [`multiSelection`],
defaultPath: 'c:/', defaultPath: 'c:/',
filters: [ filters: [
{ {
@ -148,24 +152,61 @@ class FilmOut {
} }
if (!files) if (!files)
return false; return false;
pathStr = files.filePaths[0]; if (files.filePaths.length > 0) {
console.dir(pathStr); pathStr = files.filePaths[0];
if (pathStr && pathStr !== '') { displayName = path.basename(pathStr);
ext = path.extname(pathStr.toLowerCase()); valid = this.validateSelection(files);
valid = this.extensions.indexOf(ext) === -1 ? false : true; log.info(`Selected "${displayName}"`, 'FILMOUT', true);
log.info(pathStr);
if (!valid) {
return false;
}
log.info(`Selected video ${pathStr.split('/').pop()}`, 'FILMOUT', true);
elem.attr('data-file', pathStr); elem.attr('data-file', pathStr);
displayName = pathStr.split('/').pop();
elem.val(displayName); elem.val(displayName);
$('#filmout_file').val(displayName); $('#filmout_file').val(displayName);
this.useFile(); this.useFile();
} }
if (!valid) {
gui.warn('Invalid selection', `The selection "${displayName}" is not an accepted video, image or folder containing an image sequence.`);
return false;
}
}); });
} }
/**
* Validate the selection to be of an approved selection or a directory
* containing images of an approved extension.
**/
validateSelection(files) {
let ext;
let pathStr;
let dir = false;
let valid = false;
let fileList = [];
if (files.filePaths.length === 1) {
pathStr = files.filePaths[0];
dir = fs.lstatSync(pathStr).isDirectory();
if (dir) {
log.info('The selection is a directory');
fileList = fs.readdirSync(pathStr);
fileList = fileList.filter((file) => {
let ext = path.extname(file).toLowerCase();
if (this.imageExtensions.indexOf(ext)) {
return true;
}
return false;
});
if (fileList.length > 0) {
valid = true;
}
}
ext = path.extname(pathStr.toLowerCase());
valid = this.videoExtensions.indexOf(ext) === -1;
if (!valid) {
valid = this.imageExtensions.indexOf(ext) === -1;
}
return valid;
}
return false;
}
/**
* Prompt the user to use the selected file/files or cancel
**/
useFile() { useFile() {
return __awaiter(this, void 0, void 0, function* () { return __awaiter(this, void 0, void 0, function* () {
const elem = $('#digital'); const elem = $('#digital');

File diff suppressed because one or more lines are too long

View File

@ -4,6 +4,7 @@
declare var dialog : any; declare var dialog : any;
declare var path : any; declare var path : any;
declare var fs : any;
/** /**
* Determine the greatest common denominator * Determine the greatest common denominator
@ -43,9 +44,9 @@ let filmout : FilmOut;
class FilmOut { class FilmOut {
private id : string = 'filmout'; private id : string = 'filmout';
private extensions : string[] = ['.mpg', '.mpeg', '.mov', '.mkv', '.avi', '.mp4', private videoExtensions : string[] = ['.mpg', '.mpeg', '.mov', '.mkv', '.avi', '.mp4',
'.gif', '.gif'];
'.tif', '.tiff', '.png', '.jpg', '.jpeg', '.bmp']; private imageExtensions : string[] = ['.tif', '.tiff', '.png', '.jpg', '.jpeg', '.bmp'];
private displays : any[] = []; private displays : any[] = [];
private state : any = { private state : any = {
frame : 0, frame : 0,
@ -124,11 +125,15 @@ class FilmOut {
this.state.display = id; this.state.display = id;
ipcRenderer.send('display', { display : id }); ipcRenderer.send('display', { display : id });
} }
/**
* Select a file from the showOpenDialog method. Save the file
* to an <input type=file> element if the selection is valid.
**/
async selectFile () { async selectFile () {
const elem : any = $('#digital'); const elem : any = $('#digital');
const options : any = { const options : any = {
title : `Select video or image sequence`, title : `Select video or image sequence`,
properties : [`openFile`], // openDirectory, multiSelection, openFile properties : [`multiSelection`], // openDirectory, multiSelection, openFile
defaultPath: 'c:/', defaultPath: 'c:/',
filters : [ filters : [
{ {
@ -144,34 +149,70 @@ class FilmOut {
let ext : string; let ext : string;
try { try {
files = await dialog.showOpenDialog(options) files = await dialog.showOpenDialog(options);
} catch (err) { } catch (err) {
log.error(err); log.error(err);
return false return false;
} }
if (!files) return false; if (!files) return false;
pathStr = files.filePaths[0]; if (files.filePaths.length > 0) {
pathStr = files.filePaths[0];
console.dir(pathStr) displayName = path.basename(pathStr);
valid = this.validateSelection(files);
if (pathStr && pathStr !== '') { log.info(`Selected "${displayName}"`, 'FILMOUT', true);
ext = path.extname(pathStr.toLowerCase());
valid = this.extensions.indexOf(ext) === -1 ? false : true;
log.info(pathStr)
if (!valid) {
return false;
}
log.info(`Selected video ${pathStr.split('/').pop()}`, 'FILMOUT', true);
elem.attr('data-file', pathStr); elem.attr('data-file', pathStr);
displayName = pathStr.split('/').pop();
elem.val(displayName); elem.val(displayName);
$('#filmout_file').val(displayName); $('#filmout_file').val(displayName);
this.useFile(); this.useFile();
} }
if (!valid) {
gui.warn('Invalid selection', `The selection "${displayName}" is not an accepted video, image or folder containing an image sequence.`);
return false;
}
} }
/**
* Validate the selection to be of an approved selection or a directory
* containing images of an approved extension.
**/
validateSelection (files : any) {
let ext : string;
let pathStr : string;
let dir : boolean = false;
let valid : boolean = false;
let fileList : string[] = [];
if (files.filePaths.length === 1) {
pathStr = files.filePaths[0];
dir = fs.lstatSync(pathStr).isDirectory();
if (dir) {
log.info('The selection is a directory');
fileList = fs.readdirSync(pathStr);
fileList = fileList.filter((file : string) => {
let ext : string = path.extname(file).toLowerCase();
if (this.imageExtensions.indexOf(ext)) {
return true;
}
return false;
});
if (fileList.length > 0) {
valid = true;
}
}
ext = path.extname(pathStr.toLowerCase());
valid = this.videoExtensions.indexOf(ext) === -1;
if (!valid) {
valid = this.imageExtensions.indexOf(ext) === -1;
}
return valid;
}
return false;
}
/**
* Prompt the user to use the selected file/files or cancel
**/
async useFile () { async useFile () {
const elem : any = $('#digital'); const elem : any = $('#digital');
const filePath : string = elem.attr('data-file'); const filePath : string = elem.attr('data-file');