1 files changed, 30 insertions, 44 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 %}&ndash; {{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>