diff --git a/src/dev-center/js/apps.js b/src/dev-center/js/apps.js index 487989783e..16d2873fc9 100644 --- a/src/dev-center/js/apps.js +++ b/src/dev-center/js/apps.js @@ -436,6 +436,12 @@ function generate_edit_app_section(app) {

This will set your app's window title to the opened file's name when a user opens a file in your app.

+
+ + +

If checked, when the user drags and drops a file on the app it will be automatically uploaded to their desktop and opened in a new instance of the app.

+
+

Misc

@@ -511,7 +517,8 @@ function trackOriginalValues(){ hideTitleBar: $('#edit-app-hide-titlebar').is(':checked'), locked: $('#edit-app-locked').is(':checked'), fullPageOnLanding: $('#edit-app-fullpage-on-landing').is(':checked'), - setTitleToFile: $('#edit-app-set-title-to-file').is(':checked') + setTitleToFile: $('#edit-app-set-title-to-file').is(':checked'), + uploadOnDrag: $('#edit-app-upload-and-open-on-drag').is(':checked') } }; } @@ -548,7 +555,8 @@ function hasChanges() { $('#edit-app-hide-titlebar').is(':checked') !== originalValues.checkboxes.hideTitleBar || $('#edit-app-locked').is(':checked') !== originalValues.checkboxes.locked || $('#edit-app-fullpage-on-landing').is(':checked') !== originalValues.checkboxes.fullPageOnLanding || - $('#edit-app-set-title-to-file').is(':checked') !== originalValues.checkboxes.setTitleToFile + $('#edit-app-set-title-to-file').is(':checked') !== originalValues.checkboxes.setTitleToFile || + $('#edit-app-upload-and-open-on-drag').is(':checked') !== originalValues.checkboxes.uploadOnDrag ); } @@ -596,6 +604,7 @@ function resetToOriginalValues() { $('#edit-app-locked').prop('checked', originalValues.checkboxes.locked); $('#edit-app-fullpage-on-landing').prop('checked', originalValues.checkboxes.fullPageOnLanding); $('#edit-app-set-title-to-file').prop('checked', originalValues.checkboxes.setTitleToFile); + $('#edit-app-upload-and-open-on-drag').prop('checked', originalValues.checkboxes.uploadOnDrag); if (originalValues.icon) { $('#edit-app-icon').css('background-image', `url(${originalValues.icon})`); @@ -1151,6 +1160,7 @@ $(document).on('click', '.edit-app-save-btn', async function (e) { hide_titlebar: $('#edit-app-hide-titlebar').is(":checked"), locked: $(`#edit-app-locked`).is(":checked") ?? false, set_title_to_opened_file: $('#edit-app-set-title-to-file').is(":checked"), + upload_and_open_on_drag: $('#edit-app-upload-and-open-on-drag').is(":checked"), }, filetypeAssociations: filetype_associations, }).then(async (app) => { diff --git a/src/gui/src/UI/UIWindow.js b/src/gui/src/UI/UIWindow.js index cad431f666..68bf7d11ec 100644 --- a/src/gui/src/UI/UIWindow.js +++ b/src/gui/src/UI/UIWindow.js @@ -117,6 +117,7 @@ async function UIWindow(options) { options.is_maximized = options.is_maximized ?? false; options.is_openFileDialog = options.is_openFileDialog ?? false; options.is_resizable = options.is_resizable ?? true; + options.upload_and_open_on_drag = options.upload_and_open_on_drag ?? false; // if this is a fullpage window, it won't be resizable if(options.is_fullpage){ @@ -257,6 +258,7 @@ async function UIWindow(options) { data-update_window_url = "${options.update_window_url && options.is_visible}" data-user_set_url_params = "${html_encode(user_set_url_params)}" data-initial_zindex = "${zindex}" + data-upload_and_open_on_drag = "${options.upload_and_open_on_drag}" style=" z-index: ${zindex}; ${options.width !== undefined ? 'width: ' + html_encode(options.width) +'; ':''} ${options.height !== undefined ? 'height: ' + html_encode(options.height) +'; ':''} @@ -1689,7 +1691,7 @@ async function UIWindow(options) { // -------------------------------------------------------- // Dragster - // Allow dragging of local files onto this window, if it's is_dir + // Allow dragging of local files onto this window, if it's is_dir or if upload_and_open_on_drag is true // -------------------------------------------------------- $(el_window_body).dragster({ enter: function (dragsterEvent, event) { @@ -1716,6 +1718,19 @@ async function UIWindow(options) { // de-highlight all windows $('.item-container').removeClass('item-container-active'); } + // if upload_and_open_on_drag is true, open the file in a new instance of the app + else if(options.upload_and_open_on_drag){ + // upload items + window.upload_items(e.dataTransfer.items, window.desktop_path, { + success: (items) => { + // open app + launch_app({ + name: options.app, + file_path: $(el_window).attr('data-path'), + }) + } + }) + } e.stopPropagation(); e.preventDefault(); return false; diff --git a/src/gui/src/helpers.js b/src/gui/src/helpers.js index 42b021c21d..5d3a18b8ca 100644 --- a/src/gui/src/helpers.js +++ b/src/gui/src/helpers.js @@ -1770,7 +1770,7 @@ window.init_upload_using_dialog = function(el_target_container, target_path = nu }) } -window.upload_items = async function(items, dest_path){ +window.upload_items = async function(items, dest_path, options = {}){ let upload_progress_window; let opid; @@ -1845,6 +1845,11 @@ window.upload_items = async function(items, dest_path){ }) // remove from active_uploads delete window.active_uploads[opid]; + // if success callback is provided, call it + if(options.success && typeof options.success === 'function'){ + console.log('success callback', items); + options.success(items); + } }, // error error: async function(err){ diff --git a/src/gui/src/helpers/launch_app.js b/src/gui/src/helpers/launch_app.js index 412176818c..cc75a7dc52 100644 --- a/src/gui/src/helpers/launch_app.js +++ b/src/gui/src/helpers/launch_app.js @@ -356,6 +356,11 @@ const launch_app = async (options)=>{ if(app_info.metadata?.set_title_to_opened_file !== undefined && typeof app_info.metadata.set_title_to_opened_file === 'boolean' && app_info.metadata.set_title_to_opened_file === true) title = options.file_path ? path.basename(options.file_path) : title; + // upload_on_drag + let upload_and_open_on_drag = false; + if(app_info.metadata?.upload_and_open_on_drag !== undefined && typeof app_info.metadata.upload_and_open_on_drag === 'boolean') + upload_and_open_on_drag = app_info.metadata.upload_and_open_on_drag; + // open window el_win = UIWindow({ element_uuid: uuid, @@ -380,6 +385,7 @@ const launch_app = async (options)=>{ is_resizable: window_resizable, has_head: ! hide_titlebar, show_in_taskbar: app_info.background ? false : window_options?.show_in_taskbar, + upload_and_open_on_drag: upload_and_open_on_drag, }); // If the app is not in the background, show the window