diff options
Diffstat (limited to 'design')
-rw-r--r-- | design/templates/admin/insert_images.html | 74 | ||||
-rw-r--r-- | design/templates/admin/jrnl/change_form.html | 29 |
2 files changed, 30 insertions, 73 deletions
diff --git a/design/templates/admin/insert_images.html b/design/templates/admin/insert_images.html index 08b6d46..9caaeed 100644 --- a/design/templates/admin/insert_images.html +++ b/design/templates/admin/insert_images.html @@ -29,7 +29,6 @@ figure { color: #666; } </style> -<script src="/static/jquery.tools.min.js"></script> <script> function buildVideo(video_mp4, video_webm, id, c, poster) { html = '<div class="self-embed-container">\n\t<video poster="'+poster+'" controls="true" loop="false" preload="auto" id="'+id+'" class="vidauto'; @@ -56,45 +55,11 @@ function buildImage(image_url, id, c, caption) { } return html; } -$(function(){ - var ta = parent.document.getElementById('{{textarea_id}}'); - - $('#uploads li').click(function(){ - $(this).children('.popup').show(); - }); - - $('.popup .close').click(function(){ - $(this).parent('.popup').hide(); - return false; - }); - - $('.insert').click(function(){ - if ($(this).attr('data-is-video')) { - var code = buildVideo($(this).attr('data-video-mp4'), $(this).attr('data-video-webm'), $(this).attr('data-id'), $(this).attr('data-class'), $(this).attr('data-poster')); - } else { - var code = buildImage($(this).attr('data-src'), $(this).attr('data-id'), $(this).attr('data-class'), $(this).attr('data-caption')); - } - var el = parent.document.getElementById('{{textarea_id}}'); - var start = el.selectionStart - var end = el.selectionEnd - var text = el.value - var before = text.substring(0, start) - var after = text.substring(end, text.length) - el.value = (before + code + after) - el.selectionStart = el.selectionEnd = start + code.length - el.focus() - $(this).parents('.popup').hide(); - return false; - }); - - $('#refresh').click(function(){ - location.reload(true); - return false; - }); - -}); - - +function openInNewTab(url) { + var win = window.open(url, '_blank'); + win.focus(); + return false; +} </script> </head> <body> @@ -103,7 +68,7 @@ $(function(){ <img src="/static/admin/img/icon-addlink.svg" alt="Add"> </button> <div class="up-wrapper">{% for object in object_list %} - <div class="item-wrapper"> + <div class="item-wrapper" id="images"> <figure class="item" > <img src="{% if object.get_type == "LuxImage" %}{% get_image_by_size object 'tn' %}{%else%}{{object.video_poster.url}}" style="max-width: 150px{%endif%}" /> <figcaption>{{object.id}} - {{object.title}} {% if object.caption %}– {{object.caption}}{%endif%}</figcaption> @@ -111,11 +76,11 @@ $(function(){ <ul class="actions">{%if object.get_type == "LuxVideo" %} <li><a data-is-video="true" data-video-mp4="{{object.video_mp4.url}}" data-video-webm="{{object.video_webm.url}}" data-id="{{object.id}}" data-class="vid" data-poster="{{object.video_poster.url}}" class="insert" href="">Insert video</a>{%else%} <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picwide" class="insert" href="">full width</a></li> - <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picfull" class="insert" href="">column width</a></li> <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picwide" data-caption="true" class="insert" href="">full width cap</a></li> - <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picfull" data-caption="true" class="insert" href="">column width cap</a></li> <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="cluster pic" class="insert" href="">cluster</a></li> - <li><a href="/admin/photos/luximage/{{object.pk}}/change/">Edit Image</a></li>{%endif%} + <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picfull" class="insert" href="">column width</a></li> + <li><a data-src="{% get_image_by_size object 'admin_insert' %}" data-id="{{object.id}}" data-class="picfull" data-caption="true" class="insert" href="">column width cap</a></li> + <li><a onclick='openInNewTab("/admin/photos/luximage/{{object.pk}}/change/");' href="#">Edit Image</a></li>{%endif%} </ul> </div> {% endfor %} @@ -123,5 +88,26 @@ $(function(){ <!-- "next page" action --> <a class="nextPage browse right"></a> +<script> +Array.from(document.getElementsByClassName('insert')).forEach(function(item) { + if (item.dataset.isVideo) { + var code = buildVideo(item.dataset.videoMp4, item.dataset.videoWebm, item.dataset.id, item.dataset.class, item.dataset.dataPoster); + } else { + var code = buildImage(item.dataset.src, item.dataset.id, item.dataset.class, item.dataset.caption); + } + item.addEventListener("click", function( event ) { + var el = parent.document.getElementById('{{textarea_id}}'); + var start = el.selectionStart + var end = el.selectionEnd + var text = el.value + var before = text.substring(0, start) + var after = text.substring(end, text.length) + el.value = (before + code + after) + console.log(code); + el.selectionStart = el.selectionEnd = start + code.length + el.focus() + }, false); +}); +</script> </body> </html> diff --git a/design/templates/admin/jrnl/change_form.html b/design/templates/admin/jrnl/change_form.html index e3edae0..06f2d9d 100644 --- a/design/templates/admin/jrnl/change_form.html +++ b/design/templates/admin/jrnl/change_form.html @@ -4,22 +4,6 @@ {% block extrahead %}{{ block.super }} <script type="text/javascript" src="{% url 'admin:jsi18n' %}"></script> {{ media }} -<script> -if (!$) { - $ = django.jQuery; -} -$(function(){ - $('#id_body_markdown').each(function(){ - $(this).after('<iframe frameborder="0" style="border: #dddddd 1px solid;margin-left: 20px;width:330px; height:720px;" src="/luximages/insert/?textarea='+this.id+'"></iframe>'); - }); - $('#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] + ' – <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 %} @@ -40,24 +24,11 @@ $(function(){ {% endif %} {% block content %} - <a class="btn" onclick="geoFindMe();" href="javascript:void(0);" class="historylink">Get Location</a> <div id="content-main"> {% block object-tools %} {% if change %}{% if not is_popup %} <ul class="object-tools"> {% block object-tools-items %} - - <li> - <a onclick="geoFindMe();" href="javascript:void(0);" class="historylink">Get Location</a> - </li> - <li> - <a href="{% url opts|admin_urlname:'history' original.pk|admin_urlquote %}" class="historylink">{% trans "History" %}</a> - </li> - {% if has_absolute_url %} - <li> - <a href="{% url 'admin:view_on_site' content_type_id original.pk %}" class="viewsitelink">{% trans "View on site" %}</a> - </li> - {% endif %} <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> |