From 19c0006134b5cb53fb7ed51d8f63490f8f7d1761 Mon Sep 17 00:00:00 2001
From: luxagraf <sng@luxagraf.net>
Date: Mon, 21 Mar 2016 19:29:19 -0400
Subject: added inline image preview to birdsightings changeform and fixed
 private gallery pages

---
 .../admin/birds/birdsighting/change_form.html      | 135 +++++++++++++++++++++
 .../admin/photos/luxgallery/change_form.html       |   4 +-
 design/templates/archives/gallery_list.html        |  10 +-
 design/templates/details/photo_gallery.html        |  13 +-
 4 files changed, 148 insertions(+), 14 deletions(-)
 create mode 100644 design/templates/admin/birds/birdsighting/change_form.html

(limited to 'design')

diff --git a/design/templates/admin/birds/birdsighting/change_form.html b/design/templates/admin/birds/birdsighting/change_form.html
new file mode 100644
index 0000000..31c9914
--- /dev/null
+++ b/design/templates/admin/birds/birdsighting/change_form.html
@@ -0,0 +1,135 @@
+{% extends "admin/base_site.html" %}
+{% load i18n admin_urls admin_static admin_modify %}
+
+{% block extrahead %}{{ block.super }}
+<script type="text/javascript" src="{% url 'admin:jsi18n' %}"></script>
+{{ media }}
+<script>
+if (!$) {
+    $ = django.jQuery;
+}
+$(function(){
+    $('#id_images').css('width', '500px').css('height', '400px');
+    $('#id_images option').each(function(){
+        $(this).attr('style', 'background: url('+$(this).text().split("qq")[1]+') no-repeat; background-size: 120px 80px; height: 80px; padding-left: 125px; line-height: 80px; margin-bottom: 4px; padding-bottom: 5px;border-bottom: #eee 1px solid;');
+        $(this).html($(this).text().split("qq")[0] + ' &ndash; <a href="/admin/photos/luximage/'+ $(this).text().split("qq")[2]+'/change/">edit</a>')
+    });
+});
+</script>
+
+{% endblock %}
+
+{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "admin/css/forms.css" %}" />{% endblock %}
+
+{% block coltype %}colM{% endblock %}
+
+{% block bodyclass %}{{ block.super }} app-{{ opts.app_label }} model-{{ opts.model_name }} change-form{% endblock %}
+
+{% if not is_popup %}
+{% block breadcrumbs %}
+<div class="breadcrumbs">
+<a href="{% url 'admin:index' %}">{% trans 'Home' %}</a>
+&rsaquo; <a href="{% url 'admin:app_list' app_label=opts.app_label %}">{{ opts.app_config.verbose_name }}</a>
+&rsaquo; {% if has_change_permission %}<a href="{% url opts|admin_urlname:'changelist' %}">{{ opts.verbose_name_plural|capfirst }}</a>{% else %}{{ opts.verbose_name_plural|capfirst }}{% endif %}
+&rsaquo; {% if add %}{% trans 'Add' %} {{ opts.verbose_name }}{% else %}{{ original|truncatewords:"18" }}{% endif %}
+</div>
+{% endblock %}
+{% endif %}
+
+{% block content %}<div id="content-main">
+{% block object-tools %}
+{% if change %}{% if not is_popup %}
+  <ul class="object-tools">
+    {% block object-tools-items %}
+    <li>
+        {% url opts|admin_urlname:'history' original.pk|admin_urlquote as history_url %}
+        <a href="{% add_preserved_filters history_url %}" class="historylink">{% trans "History" %}</a>
+    </li>
+    {% if has_absolute_url %}<li><a href="{{ absolute_url }}" class="viewsitelink">{% trans "View on site" %}</a></li>{% endif %}
+    {% endblock %}
+  </ul>
+{% endif %}{% endif %}
+{% endblock %}
+<form {% if has_file_field %}enctype="multipart/form-data" {% endif %}action="{{ form_url }}" method="post" id="{{ opts.model_name }}_form" novalidate>{% csrf_token %}{% block form_top %}{% endblock %}
+<div>
+{% if is_popup %}<input type="hidden" name="{{ is_popup_var }}" value="1" />{% endif %}
+{% if to_field %}<input type="hidden" name="{{ to_field_var }}" value="{{ to_field }}" />{% endif %}
+{% if save_on_top %}{% block submit_buttons_top %}{% submit_row %}{% endblock %}{% endif %}
+{% if errors %}
+    <p class="errornote">
+    {% if errors|length == 1 %}{% trans "Please correct the error below." %}{% else %}{% trans "Please correct the errors below." %}{% endif %}
+    </p>
+    {{ adminform.form.non_field_errors }}
+{% endif %}
+
+{% block field_sets %}
+{% for fieldset in adminform %}
+  {% include "admin/includes/fieldset.html" %}
+{% endfor %}
+{% endblock %}
+
+{% block after_field_sets %}{% endblock %}
+
+{% block inline_field_sets %}
+{% for inline_admin_formset in inline_admin_formsets %}
+    {% include inline_admin_formset.opts.template %}
+{% endfor %}
+{% endblock %}
+
+{% block after_related_objects %}{% endblock %}
+
+{% block submit_buttons_bottom %}{% submit_row %}{% endblock %}
+
+{% block admin_change_form_document_ready %}
+    <script type="text/javascript">
+        (function($) {
+            $(document).ready(function() {
+                $('.add-another').click(function(e) {
+                    e.preventDefault();
+                    var event = $.Event('django:add-another-related');
+                    $(this).trigger(event);
+                    if (!event.isDefaultPrevented()) {
+                        showAddAnotherPopup(this);
+                    }
+                });
+                $('.related-lookup').click(function(e) {
+                    e.preventDefault();
+                    var event = $.Event('django:lookup-related');
+                    $(this).trigger(event);
+                    if (!event.isDefaultPrevented()) {
+                        showRelatedObjectLookupPopup(this);
+                    }
+                });
+                $('body').on('click', '.related-widget-wrapper-link', function(e) {
+                    e.preventDefault();
+                    if (this.href) {
+                        var event = $.Event('django:show-related', {href: this.href});
+                        $(this).trigger(event);
+                        if (!event.isDefaultPrevented()) {
+                            showRelatedObjectPopup(this);
+                        }
+                    }
+                });
+                $('body').on('change', '.related-widget-wrapper select', function(e) {
+                    var event = $.Event('django:update-related');
+                    $(this).trigger(event);
+                    if (!event.isDefaultPrevented()) {
+                        updateRelatedObjectLinks(this);
+                    }
+                });
+                $('.related-widget-wrapper select').trigger('change');
+
+            {% if adminform and add %}
+                $('form#{{ opts.model_name }}_form :input:visible:enabled:first').focus()
+            {% endif %}
+            });
+        })(django.jQuery);
+    </script>
+{% endblock %}
+
+{# JavaScript for prepopulated fields #}
+{% prepopulated_fields_js %}
+
+</div>
+</form></div>
+{% endblock %}
diff --git a/design/templates/admin/photos/luxgallery/change_form.html b/design/templates/admin/photos/luxgallery/change_form.html
index b0341ce..31c9914 100644
--- a/design/templates/admin/photos/luxgallery/change_form.html
+++ b/design/templates/admin/photos/luxgallery/change_form.html
@@ -11,8 +11,8 @@ if (!$) {
 $(function(){
     $('#id_images').css('width', '500px').css('height', '400px');
     $('#id_images option').each(function(){
-        $(this).attr('style', 'background: url({{MEDIA_URL}}images/galleries/thumb/'+$(this).text().split("qq")[1]+') no-repeat; background-size: 120px 80px; height: 80px; padding-left: 120px; line-height: 80px; margin-bottom: 4px;');
-        $(this).html($(this).text().split("qq")[0] + ' &ndash; '+ $(this).text().split("qq")[1].split("/")[1] )
+        $(this).attr('style', 'background: url('+$(this).text().split("qq")[1]+') no-repeat; background-size: 120px 80px; height: 80px; padding-left: 125px; line-height: 80px; margin-bottom: 4px; padding-bottom: 5px;border-bottom: #eee 1px solid;');
+        $(this).html($(this).text().split("qq")[0] + ' &ndash; <a href="/admin/photos/luximage/'+ $(this).text().split("qq")[2]+'/change/">edit</a>')
     });
 });
 </script>
diff --git a/design/templates/archives/gallery_list.html b/design/templates/archives/gallery_list.html
index 1ae8696..3f7bd73 100644
--- a/design/templates/archives/gallery_list.html
+++ b/design/templates/archives/gallery_list.html
@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% load get_image_size %}
+{% load get_image_by_size %}
 {% load typogrify_tags %}
 {% load pagination_tags %}
 
@@ -33,10 +33,10 @@
     <article id="image-{{forloop.counter}}" class="photo-gallery">
             <a href="{{object.get_absolute_url}}" title="view images from {{ object.title }}">
                 <img sizes="(max-width: 1140px) 100vw"
-                     srcset="{% get_image_size object.thumb 'small' %} 720w,
-                             {% get_image_size object.thumb 'medium' %} 1140w,
-                             {% get_image_size object.thumb 'large' %} 2280w,"
-                     src="{% get_image_size object.thumb 'medium' %}" alt="{{object.title}}" ></a>
+                     srcset="{% get_image_by_size object.thumb '720' %} 720w,
+                             {% get_image_by_size object.thumb '1140' %} 1140w,
+                             {% get_image_by_size object.thumb '2280' %} 2280w,"
+                     src="{% get_image_by_size object.thumb '1140' %}" alt="{{object.title}}" ></a>
             <div class="gallery-text">
             <h4>{{object.title}}</h4>
             <time class="dt-published published dt-updated post--date" datetime="{{object.pub_date|date:'c'}}">{{object.pub_date|date:"F"}} <span>{{object.pub_date|date:"j, Y"}}</span></time> &ndash; 
diff --git a/design/templates/details/photo_gallery.html b/design/templates/details/photo_gallery.html
index 73b1d25..db8ec87 100644
--- a/design/templates/details/photo_gallery.html
+++ b/design/templates/details/photo_gallery.html
@@ -1,6 +1,6 @@
 {% extends 'base.html' %}
 {% load typogrify_tags %}
-{% load get_image_size %}
+{% load get_image_by_size %}
 {% load number_to_word  %}
 
 {% block pagetitle %}{{object.title}} - Luxagraf, Photos{% endblock %}
@@ -28,11 +28,11 @@
         <article id="image-{{forloop.counter}}"> 
             <h6><a href="#image-{{forloop.counter}}" class="permalink" title="link to this image">&#8734; {{forloop.counter|number_to_word}} &#8734;</a></h6>
             <figure class="fig">
-                <a href="{% get_image_size photo "original" %}"><img sizes="(max-width: 960px) 100vw"
-                     srcset="{% get_image_size photo "small" %} 720w,
-                             {% get_image_size photo "medium" %} 1140w,
-                             {% get_image_size photo "large" %} 2280w,"
-                     src="{% get_image_size photo "medium" %}" alt="{{photo.title}}" {%if photo.is_portait %}class="v"{%endif%} ></a>
+                <a href="{% get_image_by_size photo "original" %}"><img sizes="(max-width: 960px) 100vw"
+                     srcset="{% get_image_by_size photo 720 %} 720w,
+                             {% get_image_by_size photo 1140 %} 1140w,
+                             {% get_image_by_size photo 2280 %} 2280w,"
+                     src="{% get_image_by_size photo 1140 %}" alt="{{photo.title}}" {%if photo.is_portait %}class="v"{%endif%} ></a>
             <figcaption class="figcaption">
                 <div class="caption" id="id-{{photo.id}}">
                     <h3 class="figcaption--title">{{photo.title}}</h3>
@@ -50,7 +50,6 @@
         </figure>
         </article>
         {% endfor %}
-    </section>
 {%endblock%}
 
 {% block js %}
-- 
cgit v1.2.3-70-g09d2