mirrors/puter
1
0
Fork 0
mirror of https://github.com/HeyPuter/puter synced 2024-11-14 22:06:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add an 'Upload' button at the bottom of OpenFilePicker

Browse Source
This commit is contained in:
jelveh 2024-10-27 21:32:39 -07:00
parent cd8a080d72
commit 54ae69b7b7
3 changed files with 28 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/gui/src/UI/UIWindow.js
View File

@ -374,8 +374,8 @@ async function UIWindow(options) {
// is_saveFileDialog
if(options.is_saveFileDialog){
h += `<div class="window-filedialog-prompt">`;
h += `<div style="display:flex;">`;
h += `<input type="text" class="savefiledialog-filename" autocorrect="off" spellcheck="false" value="${html_encode(options.saveFileDialog_default_filename) ?? ''}">`;
h += `<div style="display:flex; flex-grow: 1;">`;
h += `<input type="text" style="flex-grow:1;" class="savefiledialog-filename" autocorrect="off" spellcheck="false" value="${html_encode(options.saveFileDialog_default_filename) ?? ''}">`;
h += `<button class="button button-small filedialog-cancel-btn">${i18n('cancel')}</button>`;
h += `<button class="button `;
if(options.saveFileDialog_default_filename === undefined || options.saveFileDialog_default_filename === '')
@ -388,7 +388,13 @@ async function UIWindow(options) {
// is_openFileDialog
else if(options.is_openFileDialog){
h += `<div class="window-filedialog-prompt">`;
h += `<div style="text-align:right;">`;
// 'upload here'
h += `<div class="window-filedialog-upload-here"><svg xmlns="http://www.w3.org/2000/svg" style="width: 18px; height: 18px; margin-bottom: -5px;" width="16" height="16" fill="currentColor" class="bi bi-cloud-arrow-up" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M7.646 5.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708z"/>
<path d="M4.406 3.342A5.53 5.53 0 0 1 8 2c2.69 0 4.923 2 5.166 4.579C14.758 6.804 16 8.137 16 9.773 16 11.569 14.502 13 12.687 13H3.781C1.708 13 0 11.366 0 9.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383m.653.757c-.757.653-1.153 1.44-1.153 2.056v.448l-.445.049C2.064 6.805 1 7.952 1 9.318 1 10.785 2.23 12 3.781 12h8.906C13.98 12 15 10.988 15 9.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 4.825 10.328 3 8 3a4.53 4.53 0 0 0-2.941 1.1z"/>
</svg> ${i18n('upload')}</div>`;
h += `<div style="text-align:right; flex-grow:1;">`;
h += `<button class="button button-small filedialog-cancel-btn">${i18n('cancel')}</button>`;
h += `<button class="button disabled button-small button-primary openfiledialog-open-btn">${i18n('open')}</button>`;
h += `</div>`;
@ -398,7 +404,7 @@ async function UIWindow(options) {
// is_directoryPicker
else if(options.is_directoryPicker){
h += `<div class="window-filedialog-prompt">`;
h += `<div style="text-align:right;">`;
h += `<div style="text-align:right; flex-grow: 1;">`;
h += `<button class="button button-small filedialog-cancel-btn">${i18n('cancel')}</button>`;
h += `<button class="button button-small button-primary directorypicker-select-btn" style="margin-left:10px;">${i18n('select')}</button>`;
h += `</div>`;
@ -492,7 +498,13 @@ async function UIWindow(options) {
const el_filedialog_cancel_btn = document.querySelector(`#window-${win_id} .filedialog-cancel-btn`);
const el_openfiledialog_open_btn = document.querySelector(`#window-${win_id} .openfiledialog-open-btn`);
const el_directorypicker_select_btn = document.querySelector(`#window-${win_id} .directorypicker-select-btn`);
const el_window_filedialog_upload_here = document.querySelector(`#window-${win_id} .window-filedialog-upload-here`);
if(el_window_filedialog_upload_here){
el_window_filedialog_upload_here.addEventListener('click', function(){
window.init_upload_using_dialog(el_window_body, $(el_window).attr('data-path') + '/');
});
}
// attach optional event listeners
el_window.on_before_exit = options.on_before_exit;

13
src/gui/src/css/style.css
View File

@ -1324,8 +1324,9 @@ span.header-sort-icon img {
background-color: #f3f5f9;
padding: 0 15px;
display: flex;
flex-direction: column;
flex-direction: row;
justify-content: center;
align-items: center;
}
.savefiledialog-filename {
@ -1337,6 +1338,16 @@ span.header-sort-icon img {
flex-grow: 1;
}
.window-filedialog-upload-here{
-webkit-font-smoothing: antialiased;
opacity: 0.7;
font-size: 14px;
}
.window-filedialog-upload-here:hover{
cursor: pointer;
opacity: 1;
}
.savefiledialog-save-btn, .openfiledialog-open-btn {
margin-left: 10px;
}

1
src/gui/src/helpers/launch_app.js
View File

@ -306,7 +306,6 @@ const launch_app = async (options)=>{
if(app_info.metadata?.credentialless !== undefined && typeof app_info.metadata.credentialless === 'boolean')
credentialless = app_info.metadata.credentialless;
console.log('credentialless', credentialless);
// open window
el_win = UIWindow({
element_uuid: uuid,