LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

made whole dragzone clickable

Browse source
This commit is contained in:
bill bittner 2017-10-10 11:52:34 -07:00
parent 5ef70efebc
commit 58e180784b
2 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
public/assets/css/general.css
View file

@ -402,6 +402,7 @@ table {
.dropzone:hover { .dropzone:hover {
border: 2px dashed #1e90ff; border: 2px dashed #1e90ff;
cursor: pointer;
} }
#primary-dropzone-wrapper, #publish-form-wrapper { #primary-dropzone-wrapper, #publish-form-wrapper {

12
views/index.handlebars
View file

@ -1,14 +1,14 @@
{{> topBar}} {{> topBar}}
<div class="row row--full-height"> <div class="row row--full-height">
<div id="primary-dropzone-wrapper"> <div id="primary-dropzone-wrapper">
<div id="primary-dropzone" class="dropzone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)"> <div id="primary-dropzone" class="dropzone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" onclick="triggerFileChooser('siofu_input', event)">
<div id="primary-dropzone-instructions"> <div id="primary-dropzone-instructions">
<div class="row"> <div class="row">
<p>Drag & drop image or video here</p> <p>Drag & drop image or video here</p>
<p>OR</p> <p>OR</p>
<form> <form>
<label class="input-file-label" for="siofu_input">CHOOSE FILE</label> <label class="input-file-label" for="siofu_input">CHOOSE FILE</label>
<input class=" input-file" type="file" id="siofu_input" name="siofu_input" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/> <input class="input-file" type="file" id="siofu_input" name="siofu_input" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/>
</form> </form>
</div> </div>
<div class="info-message info-message--failure" id="input-error-file-selection" hidden="true"></div> <div class="info-message info-message--failure" id="input-error-file-selection" hidden="true"></div>
@ -23,7 +23,7 @@
<div class="column column--5 column--med-10 align-content-top" > <div class="column column--5 column--med-10 align-content-top" >
<!-- preview --> <!-- preview -->
<div class="row"> <div class="row">
<div id="asset-preview-holder" class="dropzone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" onmouseenter="showInstructions()" onmouseleave="hideInstructions()"> <div id="asset-preview-holder" class="dropzone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" onmouseenter="showInstructions()" onmouseleave="hideInstructions()" onclick="triggerFileChooser('siofu_input', event)">
<div id="asset-preview-target"></div> <div id="asset-preview-target"></div>
<div id="preview-dropzone-instructions" hidden="true"> <div id="preview-dropzone-instructions" hidden="true">
<div class="row"> <div class="row">
@ -31,7 +31,7 @@
<p>OR</p> <p>OR</p>
<form> <form>
<label class="input-file-label" for="siofu_input">CHOOSE FILE</label> <label class="input-file-label" for="siofu_input">CHOOSE FILE</label>
<input class=" input-file" type="file" id="siofu_input" name="siofu_input" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/>
</form> </form>
</div> </div>
</div> </div>
@ -66,7 +66,6 @@
var stagedFiles = null; var stagedFiles = null;
/* drop zone functions */ /* drop zone functions */
function showInstructions () { function showInstructions () {
document.getElementById('preview-dropzone-instructions').hidden = false; document.getElementById('preview-dropzone-instructions').hidden = false;
document.getElementById('asset-preview').style.opacity = 0.3; document.getElementById('asset-preview').style.opacity = 0.3;
@ -99,6 +98,9 @@
event.dataTransfer.clearData(); event.dataTransfer.clearData();
} }
} }
function triggerFileChooser(fileInputId, event) {
document.getElementById(fileInputId).click();
}
/* socketio-file-upload listeners */ /* socketio-file-upload listeners */
function updatePublishStatus(msg){ function updatePublishStatus(msg){