47 lines
1.2 KiB
CoffeeScript
47 lines
1.2 KiB
CoffeeScript
Packery = require('packery')
|
|
|
|
jQuery(document).ready(() ->
|
|
jQuery("#masonryslide-container").hide()
|
|
)
|
|
|
|
jQuery(document).on('click', '#pack', () ->
|
|
container = jQuery("#masonryslide-container")
|
|
container.show()
|
|
jQuery("#masonryslide").width(container.width() - 100)
|
|
jQuery("#masonryslide").height(container.height() - 300)
|
|
|
|
promise = Promise.resolve()
|
|
slide = document.getElementById('masonryslide')
|
|
grid = new Packery(slide, {
|
|
itemSelector: "img"
|
|
percentPosition: true
|
|
columnWidth: 100
|
|
})
|
|
for file in document.getElementById('masonryslide-files').files
|
|
img = document.createElement("img")
|
|
img.classList.add("obj")
|
|
img.file = file
|
|
jQuery("#masonryslide")[0].append(img)
|
|
|
|
fr = new FileReader()
|
|
fr.onload = ((aImg) ->
|
|
(e) ->
|
|
aImg.src = e.target.result
|
|
if jQuery(aImg).width() > (jQuery("#masonryslide").width() / 3)
|
|
jQuery(aImg).width("33%")
|
|
grid.layout()
|
|
resolve()
|
|
)(img)
|
|
fr.readAsDataURL(file)
|
|
|
|
promise.then(() ->
|
|
items = jQuery(slide).find('img').draggable()
|
|
grid.bindUIDraggableEvents(items)
|
|
)
|
|
)
|
|
|
|
jQuery("#pngdownload").click(() ->
|
|
canvas = document.getElementById("masonryslide")
|
|
document.location.href = canvas.toDataUrl("image/png")
|
|
)
|