Commit d59e2485 authored by fred's avatar fred
Browse files

import custom panik gallery template & script

parent cccfb6e9
function gallery(element) {
var element_id = '#' + $(element).attr('id');
$(element).sortable({
items: '> li',
containment: 'parent',
placeholder: 'empty-image',
update: function(event, ui) {
var new_order = $(element).find('> li').map(function() { return $(this).data('object-id'); }).get().join();
$.ajax({
url: $(element).data('order-url'),
data: {'new-order': new_order},
success: function(data, status) {
$(element).replaceWith($(data).find(element_id));
gallery($(element_id));
}
});
}
});
$('.image-delete').on('click', function() {
$.ajax({
url: $(this).attr('href'),
success: function(data, status) {
$(element).replaceWith($(data).find(element_id));
gallery($(element_id));
}
});
return false;
});
};
{% load thumbnail %}
{% if cell.title %}<h3>{{ cell.title }}</h3>{% endif %}
<div class="gallery" id="gallery-{{cell.id}}">
{% for image in cell.image_set.all %}
{% if forloop.first %}
<div class="first" style="display: none;">
<img src="#"/>
<span class="gallery-legend"></span>
{% thumbnail image.image "640x480" crop="50% 25%" as im %}
<div class="first">
<img src="{{ im.url }}"/>
<span>{% if image.title %}{{ image.title }}{% endif %}</span>
</div>
<div>
{% endif %}
{% thumbnail image.image "200x100" crop="50% 25%" as im %}
{% if cell.slug == 'portrait' %}
{% thumbnail image.image "480x640" crop="50% 25%" as im_large %}
<span class="image" data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
class="portrait" {% if image.title %} title="{{image.title}}" {% endif %}/></span>
<div> {# extra opened <div> #}
{% endthumbnail %}
{% else %}
{% endif %}
{% thumbnail image.image "60x60" crop="50% 25%" as im %}
{% thumbnail image.image "640x480" crop="50% 25%" as im_large %}
<span class="image" data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
<span data-image-large="{{ im_large.url }}"><img src="{{ im.url }}"
{% if image.title %} title="{{image.title}}" {% endif %}/></span>
{% endthumbnail %}
{% endif %}
{% endthumbnail %}
{% if forloop.last %}
</div> {# close extra <div> #}
{% endif %}
{% endfor %}
</div>
</div>
<script type="text/javascript">
$(function() {
var $gallery = $('#gallery-{{cell.id}}');
$gallery.find('span').on('click', function() {
$gallery.find('div.first img').attr('src', $(this).data('image-large'));
});
});
</script>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment