Added post preview popups

boards/static/js/refpopup.js

@@ -0,0 +1,198 b''
+function $X(path, root) {
+    return document.evaluate(path, root || document, null, 6, null);
+}
+function $x(path, root) {
+    return document.evaluate(path, root || document, null, 8, null).singleNodeValue;
+}
+
+function $del(el) {
+    if(el) el.parentNode.removeChild(el);
+}
+
+function $each(list, fn) {
+    if(!list) return;
+    var i = list.snapshotLength;
+    if(i > 0) while(i--) fn(list.snapshotItem(i), i);
+}
+
+function addRefLinkPreview(node) {
+    $each($X('.//a[starts-with(text(),">>")]', node || document), function(link) {
+        link.addEventListener('mouseover', showPostPreview, false);
+        link.addEventListener('mouseout', delPostPreview, false);
+    });
+}
+
+function showPostPreview(e) {
+    var doc = document;
+    //ref id
+    var pNum = $(this).text().match(/\d+/);
+
+    //position
+    //var x = e.clientX + (doc.documentElement.scrollLeft || doc.body.scrollLeft) - doc.documentElement.clientLeft + 1;
+    //var y = e.clientY + (doc.documentElement.scrollTop || doc.body.scrollTop) - doc.documentElement.clientTop;
+
+    var x = e.clientX + (doc.documentElement.scrollLeft || doc.body.scrollLeft) + 2;
+    var y = e.clientY + (doc.documentElement.scrollTop || doc.body.scrollTop);
+
+    var cln = doc.createElement('div');
+    cln.id = 'pstprev_' + pNum;
+    cln.className = 'post_preview post';
+
+    cln.style.cssText = 'top:' + y + 'px;' + (x < doc.body.clientWidth/2 ? 'left:' + x + 'px' : 'right:' + parseInt(doc.body.clientWidth - x + 1) + 'px');
+
+    cln.addEventListener('mouseout', delPostPreview, false);
+
+
+    var mkPreview = function(cln, html) {
+
+        cln.innerHTML = html;
+
+        addRefLinkPreview(cln);
+
+        //if(!$x('.//small', cln)) showRefMap(post, p_num, refMap)
+    };
+
+
+    cln.innerHTML = 'Загрузка...';
+
+    //если пост найден в дереве.
+    if($('div[id='+pNum+']').length > 0) {
+        var postdata = $('div[id='+pNum+']').html();
+
+        //TODO: временно
+        //funcInit(postdata);
+
+        //make preview
+        mkPreview(cln, postdata);
+    }
+    //ajax api
+//    else {
+//        $.getJSON(mayuri_cfg['board_url']+'api/single/'+pNum)
+//            .success(function(data) {
+//                //post templates
+//                var postdata = makeAjaxPost(data).html();
+//
+//                //TODO: временно
+//                //funcInit(postdata);
+//
+//                //make preview
+//                mkPreview(cln, postdata);
+//
+//            })//if error
+//            .error(function() {
+//                cln.innerHTML = 'Пост не найден.';
+//            });
+//    }
+
+    $del(doc.getElementById(cln.id));
+
+    //add preview
+    $('body').append(cln);
+}
+
+function delPostPreview(e) {
+    var el = $x('ancestor-or-self::*[starts-with(@id,"pstprev")]', e.relatedTarget);
+    if(!el) $each($X('.//div[starts-with(@id,"pstprev")]'), function(clone) {
+        $del(clone)
+    });
+    else while(el.nextSibling) $del(el.nextSibling);
+}
+
+
+
+
+
+
+function addPreview() {
+    $('.post').find('a').each(function() {
+        showPostPreview($(this));
+    });
+}
+
+function showPreview(node) {
+    node.each(function() {
+        //reflink?
+        if($(this).text().indexOf('>>') == 0) {
+            //add mouseover event
+            $(this).on('mouseover', function(e) {
+                var ref = $(this);
+
+                var doc = document;
+                //ref id
+                var pNum = ref.text().match(/\d+/);
+
+                //position
+                var x = e.clientX + (doc.documentElement.scrollLeft || doc.body.scrollLeft) + 2;
+                var y = e.clientY + (doc.documentElement.scrollTop || doc.body.scrollTop);
+
+                //create preview block
+                var cln = $('<div>', {
+                    id: 'pstprev_' + pNum,
+                    class: 'post_preview post'
+                })
+                    .css('cssText', 'top:' + y + 'px;' + (x < doc.body.clientWidth/2 ? 'left:' + x + 'px' : 'right:' + parseInt(doc.body.clientWidth - x + 1) 
++ 'px'));
+
+
+                var mkPreview = function(cln, html) {
+
+                    cln.html(html);
+
+                    showPreview($(cln));
+                    //if(!$x('.//small', cln)) showRefMap(post, p_num, refMap)
+                };
+
+                cln.html('Загрузка...');
+
+                //если пост найден в дереве.
+                if($('div[id='+pNum+']').length > 0) {
+                    var postdata = $('div[id='+pNum+']').clone().html();
+                    //TODO: лучше бы вынести в mkPreview
+                    //if($.localStorage('addImgPreview') > 0) showImgPreview($(postdata));
+
+                    //make preview
+                    mkPreview(cln, postdata);
+                }
+                //ajax api
+//                else {
+//                    $.getJSON(mayuri_cfg['board_url']+'api/single/'+pNum)
+//                        .success(function(data) {
+//                            //post templates
+//                            var postdata = makeAjaxPost(data).html();
+//
+//                            //make preview
+//                            mkPreview(cln, postdata);
+//
+//                        })//if error
+//                        .error(function() {
+//                            cln.html('Пост не найден.');
+//                        });
+//                }
+
+               $del(doc.getElementById(cln.id));
+
+                //add preview
+                $('body').append(cln);
+            });
+
+            $(this).on('mouseout', function() {
+                delPreview($(this));
+            })
+        }
+    });
+
+}
+
+function delPreview(e) {
+    var el = e.relatedTarget;
+    if(!el) {
+        $(el).each(function(clone) {
+            $del(clone)
+        });
+    }
+    {
+        while(el.next())
+            $del(el.next());
+    }
+}
+

boards/static/css/base.css

@@ -22,3 +22,8 b''
 .strikethrough {
     text-decoration: line-through;
 }
+
+.post_preview {
+    z-index: 300;
+    position:absolute;
+}

boards/static/js/main.js

@@ -35,4 +35,6 b''
     //addPopups();
     
     addMarkPanel();
+
+    addRefLinkPreview();
 });

boards/templates/boards/base.html

@@ -28,6 +28,7 b''
 <script src="{% static 'js/panel.js' %}"></script>
 <script src="{% static 'js/popup.js' %}"></script>
 <script src="{% static 'js/image.js' %}"></script>
+<script src="{% static 'js/refpopup.js' %}"></script>
 <script src="{% static 'js/main.js' %}"></script>
 
 <div class="navigation_panel">

todo.txt

@@ -7,6 +7,7 b''
 [DONE] Ban reasons. Split bans into 2 types "read-only" and "read
 denied". Use second only for autoban for spam
 [DONE] Clean up tests and make them run ALWAYS
+[DONE] Use transactions in tests
 
 [NOT STARTED] Tree view (JS)
 [NOT STARTED] Adding tags to images filename
@@ -19,7 +20,6 b' denied". Use second only for autoban for'
 [NOT STARTED] Group tags by first letter in all tags list
 [NOT STARTED] Show board speed in the lower panel (posts per day)
 [NOT STARTED] Character counter in the post field
-[NOT STARTED] Use transactions in tests
 [NOT STARTED] Save image thumbnails size to the separate field
 [NOT STARTED] Whitelist functionality. Permin autoban of an address
 [NOT STARTED] Split up post model into post and thread,