Copy img tag #4

Merged
alpha6 merged 3 commits from copy_img_tag into master 2017-08-01 21:07:10 +03:00
3 changed files with 20 additions and 4 deletions
Showing only changes of commit 968ae0f2ce - Show all commits

View file

@ -6,4 +6,10 @@
} }
.foto-block .foto-notes { .foto-block .foto-notes {
padding: 5px; padding: 5px;
}
.copy-img {
content:url(/img/copy_icon.png);
width: 32px;
height: 32px;
overflow: hidden;
} }

BIN
public/img/copy_icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

View file

@ -42,9 +42,9 @@
</div> </div>
<div class="foto-notes col-md-3"> <div class="foto-notes col-md-3">
<ul> <ul>
<li><a v-bind:href="image.original_url">Original</a></li> <li><a v-bind:href="image.original_url">Original</a> <div @click="copyText" class="copy-img">{{ hostname+image.original_url }}</div></li>
<li v-for="scale in image.scales"> <li v-for="scale in image.scales">
<a v-bind:href="scale.url">{{ scale.size }}</a> &lt;img src="{{ scale.url}}"&gt; <a v-bind:href="scale.url">{{ scale.size }}</a> <div @click="copyText" class="copy-img">{{ hostname+scale.url }}</div>
</li> </li>
</ul> </ul>
</div> </div>
@ -54,6 +54,7 @@
<script> <script>
var apiURL = '<%= url_for('get_images') %>' var apiURL = '<%= url_for('get_images') %>'
var hostname = window.location.protocol+"//"+window.location.host;
var demo = new Vue({ var demo = new Vue({
@ -74,10 +75,19 @@
xhr.open('GET', apiURL) xhr.open('GET', apiURL)
xhr.onload = function () { xhr.onload = function () {
self.imagesList = JSON.parse(xhr.responseText) self.imagesList = JSON.parse(xhr.responseText)
console.log(self.imagesList[0].thumbnail_url) // console.log(self.imagesList[0].thumbnail_url)
} }
xhr.send() xhr.send()
} },
copyText(event) {
// console.log(event.target);
var $temp = $("<input>");
$("body").append($temp);
$temp.val("<img src="+$(event.target).text()+">").select();
document.execCommand("copy");
$temp.remove();
},
} }
}) })
</script> </script>