MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-18 14:23:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: Add drag/drop functionality to the screenshot viewer (#536)

Browse Source 
* feat: Add drag/drop functionality to the screenshot viewer

* feat: Add arrow key controls for screenshot carousel
This commit is contained in:
Teacup
2023-05-07 22:50:52 -04:00
committed by GitHub
parent 627e4c89f5
commit f184dc8475
5 changed files with 76 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
html/src/app.js
View File

@@ -72,6 +72,12 @@ speechSynthesis.getVoices();
configRepository.setBool('migrate_config_20201101', true);
}
// Make sure file drops outside of the screenshot manager don't navigate to the file path dropped.
// This issue persists on prompts created with prompt(), unfortunately. Not sure how to fix that.
document.body.addEventListener('drop', function (e) {
e.preventDefault();
});
document.addEventListener('keyup', function (e) {
if (e.ctrlKey) {
if (e.key === 'I') {
@@ -82,6 +88,11 @@ speechSynthesis.getVoices();
} else if (e.altKey && e.key === 'R') {
$app.refreshCustomCss();
}
let carouselNavigation = { 'ArrowLeft': 0, 'ArrowRight': 2 }[e.key]
if (carouselNavigation !== undefined && $app.screenshotMetadataDialog?.visible) {
$app.screenshotMetadataCarouselChange(carouselNavigation);
}
});
VRCXStorage.GetArray = async function (key) {
@@ -20627,7 +20638,7 @@ speechSynthesis.getVoices();
this.showScreenshotMetadataDialog();
};
$app.data.screenshotMetadataDialog = {
visible: false,
metadata: {},
@@ -20697,6 +20708,22 @@ speechSynthesis.getVoices();
});
};
/**
* This function is called by .NET(CefCustomDragHandler#CefCustomDragHandler) when a file is dragged over a drop zone in the app window.
* @param {string} filePath - The full path to the file being dragged into the window
*/
$app.methods.dragEnterCef = function(filePath) {
this.currentlyDroppingFile = filePath
};
$app.methods.handleDrop = function(event) {
if (this.currentlyDroppingFile == null) return
console.log("Dropped file into window: ", this.currentlyDroppingFile)
AppApi.GetScreenshotMetadata(this.currentlyDroppingFile);
event.preventDefault()
};
// YouTube API
$app.data.youTubeApiKey = '';

4
html/src/index.pug
View File

@@ -11,7 +11,7 @@ html
link(rel="stylesheet" href="app.css")
link(rel="stylesheet" href="flags.css")
body
.x-app#x-app(style="display:none")
.x-app#x-app(style="display:none" @dragenter.prevent @dragover.prevent @drop.prevent)
//- login
.x-login-container(v-show="!API.isLoggedIn" v-loading="loginForm.loading")
div(style="position:absolute;margin:5px")
@@ -3845,7 +3845,7 @@ html
//- dialog: screenshot metadata
el-dialog.x-dialog(:before-close="beforeDialogClose" @mousedown.native="dialogMouseDown" @mouseup.native="dialogMouseUp" ref="screenshotMetadataDialog" :visible.sync="screenshotMetadataDialog.visible" :title="$t('dialog.screenshot_metadata.header')" width="1050px")
div(v-if="screenshotMetadataDialog.visible")
div(v-if="screenshotMetadataDialog.visible" @dragover.prevent @dragenter.prevent @drop="handleDrop" style="-webkit-app-region: drag")
el-button(size="small" icon="el-icon-folder-opened" @click="AppApi.OpenScreenshotFileDialog()") {{ $t('dialog.screenshot_metadata.browse') }}
el-button(v-if="API.currentUser.$isVRCPlus && screenshotMetadataDialog.metadata.filePath" size="small" icon="el-icon-upload2" @click="uploadScreenshotToGallery") {{ $t('dialog.screenshot_metadata.upload') }}
span(v-text="screenshotMetadataDialog.metadata.fileName" style="margin-left:5px")