album.jinja 4.53 KB
Newer Older
Skia's avatar
Skia committed
1 2 3 4 5 6
{% extends "core/base.jinja" %}

{% block title %}
{% trans %}SAS{% endtrans %}
{% endblock %}

Skia's avatar
Skia committed
7
{% macro print_path(file) %}
Skia's avatar
Skia committed
8
{% if file and file.parent %}
Skia's avatar
Skia committed
9 10 11 12 13 14
{{ print_path(file.parent) }}
<a href="{{ url('sas:album', album_id=file.id) }}">{{ file.get_display_name() }}</a> >
{% endif %}
{% endmacro %}


Skia's avatar
Skia committed
15
{% block content %}
Skia's avatar
Skia committed
16
<a href="{{ url('sas:main') }}">SAS</a> > {{ print_path(album.parent) }} {{ album.get_display_name() }}
Skia's avatar
WIP SAS  
Skia committed
17
<h3>{{ album.get_display_name() }}</h3>
Skia's avatar
Skia committed
18
<hr>
Skia's avatar
Skia committed
19
<div>
Skia's avatar
Skia committed
20
    {% for a in album.children.filter(is_folder=True, is_moderated=True).all() %}
Skia's avatar
Skia committed
21 22 23 24 25 26 27 28 29 30
    <a href="{{ url("sas:album", album_id=a.id) }}" style="display: inline-block">
    <div class="album">
        <div>
        {% if a.children.filter(is_folder=False, is_moderated=True).exists() %}
        <img src="{{ a.children.filter(is_folder=False).first().as_picture.get_download_thumb_url() }}" alt="{% trans %}preview{% endtrans %}">
        {% else %}
        <img src="{{ static('core/img/sas.jpg') }}" alt="{% trans %}preview{% endtrans %}">
        {% endif %}
        </div>
        {{ a.name }}
Skia's avatar
Skia committed
31
    </div>
Skia's avatar
Skia committed
32
    </a>
Skia's avatar
Skia committed
33 34 35
    {% endfor %}
</div>
<div>
Skia's avatar
Skia committed
36
    {% for p in album.children.filter(is_folder=False, is_moderated=True).all() %}
Skia's avatar
WIP SAS  
Skia committed
37
    {% if p.as_picture.can_be_viewed_by(user) %}
Skia's avatar
Skia committed
38
    <div class="picture">
39
        <a href="{{ url("sas:picture", picture_id=p.id) }}#pict">
Skia's avatar
Skia committed
40
            <img src="{{ p.as_picture.get_download_thumb_url() }}" alt="{{ p.get_display_name() }}" />
Skia's avatar
Skia committed
41 42 43 44 45
        </a>
    </div>
    {% endif %}
    {% endfor %}
</div>
46 47 48 49 50
<form action="" method="post" enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p() }}
    <p><input type="submit" value="{% trans %}Upload{% endtrans %}" /></p>
</form>
Skia's avatar
Skia committed
51 52
{% endblock %}

Skia's avatar
Skia committed
53 54
{% block script %}
{{ super() }}
55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152
<script>
$("form").submit(function (event) {
    var formData = new FormData($(this)[0]);

    if(formData.get('album_name') === '' && formData.get('images').name === '')
        return false;

    if(formData.get('images').name === '') {
        return true;
    }

    event.preventDefault();

    var errorlist;
    if((errorlist = this.querySelector('ul.errorlist.nonfield')) === null) {
        errorlist = document.createElement('ul');
        errorlist.classList.add('errorlist', 'nonfield');
        this.insertBefore(errorlist, this.firstElementChild);
    }

    while(errorlist.childElementCount > 0) 
        errorlist.removeChild(errorlist.firstElementChild);

    var progress;
    if((progress = this.querySelector('progress')) === null) {
        progress = document.createElement('progress');
        progress.value = 0;
        var p = document.createElement('p');
        p.appendChild(progress);
        this.insertBefore(p, this.lastElementChild);
    }

    var dataHolder;

    if(formData.get('album_name') !== '') {
        dataHolder = new FormData();
        dataHolder.set('csrfmiddlewaretoken', '{{ csrf_token }}');
        dataHolder.set('album_name', formData.get('album_name'));
        $.ajax({
            method: 'POST',
            data: dataHolder,
            processData: false,
            contentType: false,
            success: onSuccess
        })
    }

    var images = formData.getAll('images');
    var imagesCount = images.length;
    var completeCount = 0;

    var poolSize = 5;
    var imagePool = [];

    while(images.length > 0 && imagePool.length < poolSize) {
        var image = images.shift();
        imagePool.push(image);
        sendImage(image);
    }

    function sendImage(image) {
        dataHolder = new FormData();
        dataHolder.set('csrfmiddlewaretoken', '{{ csrf_token }}');
        dataHolder.set('images', image);

        $.ajax({
            method: 'POST',
            data: dataHolder,
            processData: false,
            contentType: false,
        })
            .done(onSuccess.bind(undefined, image))
            .always(next.bind(undefined, image));
    }

    function next(image, status, jqXHR) {
        var index;
        if(index = imagePool.indexOf(image) !== -1) {
            imagePool.splice(index, 1);
        }
        var nextImage;
        if(nextImage = images.shift()) {
            imagePool.push(nextImage);

            sendImage(nextImage);
        }
    }

    function onSuccess(image, data, status, jqXHR) {
        var errors = Array.from($(data).find('.errorlist.nonfield')[0].children);
        while(errors.length > 0)
            errorlist.appendChild(errors.shift());
        progress.value = ++completeCount / imagesCount;
        if(progress.value === 1 && errorlist.children.length === 0)
            document.location.reload()
    }
});
</script>
Skia's avatar
Skia committed
153
{% endblock %}