rafaelcaricio/LibreTranslate
1
0
Fork 0
forked from mirrors/LibreTranslate
Code Issues Pull requests Projects Releases Packages Wiki Activity

Copy text fixes

Browse source
This commit is contained in:
Piero Toffanin 2021-01-18 10:06:43 -05:00
parent 9aae135420
commit 72248f0050
1 changed files with 35 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

58
app/templates/index.html
View file

@ -135,8 +135,8 @@
</template> </template>
</select> </select>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="input-field col s6"> <div class="input-field col s6">
<textarea id="textarea1" class="materialize-textarea" v-model="inputText" @input="handleInput" ref="inputTextarea"></textarea> <textarea id="textarea1" class="materialize-textarea" v-model="inputText" @input="handleInput" ref="inputTextarea"></textarea>
<label for="textarea1">Input Text</label> <label for="textarea1">Input Text</label>
@ -151,15 +151,15 @@
<div class="indeterminate"></div> <div class="indeterminate"></div>
</div></label> </div></label>
</div> </div>
<div style="text-align: right;">
<button class="copy" data-clipboard-target="#textarea2" style="display: inline-block;">Copy text</button>
</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div style="text-align: right;"> <div class="col s6">
<input type="reset" style="display: inline-block;" value="🗑" title="Delete text"> <button class="btn btn-small" style="display: inline-block;" title="Delete text" @click="deleteText"><i class="material-icons">delete</i></button>
</div> </div>
<div class="col s6" style="text-align: right;">
<button class="btn btn-small" style="display: inline-block;" @click="copyText">[[ copyTextLabel ]]</button>
</div>
</div> </div>
</form> </form>
</div> </div>
@ -250,8 +250,6 @@ window.Prism.manual = true;
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.22.0/prism.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.22.0/prism.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js"></script>
<script> <script>
// API host/endpoint // API host/endpoint
var BaseUrl = window.location.protocol + "//" + window.location.host; var BaseUrl = window.location.protocol + "//" + window.location.host;
@ -277,6 +275,8 @@ document.addEventListener('DOMContentLoaded', function(){
translatedText: "", translatedText: "",
output: "", output: "",
charactersLimit: -1, charactersLimit: -1,
copyTextLabel: "Copy Text"
}, },
mounted: function(){ mounted: function(){
var self = this; var self = this;
@ -346,6 +346,8 @@ document.addEventListener('DOMContentLoaded', function(){
if (this.charactersLimit !== -1 && this.inputText.length >= this.charactersLimit){ if (this.charactersLimit !== -1 && this.inputText.length >= this.charactersLimit){
this.inputText = this.inputText.substring(0, this.charactersLimit); this.inputText = this.inputText.substring(0, this.charactersLimit);
} }
}, },
computed: { computed: {
requestCode: function(){ requestCode: function(){
@ -440,22 +442,32 @@ document.addEventListener('DOMContentLoaded', function(){
request.send(data); request.send(data);
}, 300); }, 300);
} },
copyText: function(e){
e.preventDefault();
console.log(this.$refs);
this.$refs.translatedTextarea.select();
this.$refs.translatedTextarea.setSelectionRange(0, 9999999); /* For mobile devices */
document.execCommand("copy");
if (this.copyTextLabel === "Copy Text"){
this.copyTextLabel = "Copied!";
var self = this;
setTimeout(function(){
self.copyTextLabel = "Copy Text";
}, 1500);
}
},
deleteText: function(e){
e.preventDefault();
this.inputText = this.translatedText = "";
}
} }
}); });
}); });
var clipboard = new ClipboardJS('.copy');
clipboard.on('success', function(e) {
console.log('Done, text copied.');
e.clearSelection();
});
clipboard.on('error', function(e) {
console.log('Error: '+e);
});
</script> </script>
</body> </body>
</html> </html>