Copy img tag #4

Merged
alpha6 merged 3 commits from copy_img_tag into master 2017-08-01 21:07:10 +03:00
4 changed files with 20 additions and 5 deletions

View file

@ -7,3 +7,9 @@
.foto-block .foto-notes {
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

@ -7,7 +7,7 @@
# registry = sqitch
# client = sqlite3
[target "foto_test"]
uri = db:sqlite:rsscp_test.db
uri = db:sqlite:fotostore.db
[engine "sqlite"]
target = foto_test
[deploy]

View file

@ -42,9 +42,9 @@
</div>
<div class="foto-notes col-md-3">
<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">
<a v-bind:href="scale.url">{{ scale.size }}</a>
<a v-bind:href="scale.url">{{ scale.size }}</a> <div @click="copyText" class="copy-img">{{ hostname+scale.url }}</div>
</li>
</ul>
</div>
@ -54,6 +54,7 @@
<script>
var apiURL = '<%= url_for('get_images') %>'
var hostname = window.location.protocol+"//"+window.location.host;
var demo = new Vue({
@ -74,10 +75,18 @@
xhr.open('GET', apiURL)
xhr.onload = function () {
self.imagesList = JSON.parse(xhr.responseText)
console.log(self.imagesList[0].thumbnail_url)
}
xhr.send()
},
copyText(event) {
//TODO: rewrite it to vue/JS from jquery
var $temp = $("<input>");
$("body").append($temp);
$temp.val("<img src="+$(event.target).text()+">").select();
document.execCommand("copy");
$temp.remove();
},
}
}
})
</script>