[Tutorial] Cite Specific Text

With this code you can mention a specific text of a post.

Image:


Create a new JS code with the following content:

Code:

/*
 *  Application: Cite specific text
 *  Date: 2016-09-08
 *  Version: 1.109052018
 *  Copyright (c) Daemon <help.forumotion.com>
 *  This work is free. You can redistribute it and/or modify it
 */
(function() {
    quote = {
        initialize: function() {
            $(function() {
                if (!$.sceditor && _userdata.session_logged_in < 1) return;
                quote.setupQuote();
            });
        },
        setupQuote: function() {
            $("head").append(
            '<style type="text/css">' +
            '.quote-box {' +
            '  z-index: 999;' +
            '  margin-top: 16px;' +
            '  position: absolute;' +
            '  display: none;' +
            '  background-color: rgba(70,70,70,0.6);' +
            '  padding: 4px;' +
            '  -webkit-box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7);' +
            '  -moz-box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7);' +
            '  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7 );' +
            '  -moz-border-radius: 4px;' +
            '  -webkit-border-radius: 4px;' +
            '  border-radius: 4px;' +
            '}' +
            '.quote-box > div {' +
            '  background-color: #f7f7f7;' +
            '  padding: 5px;' +
            '}' +
            '.quote-box > input {' +
            '  margin: 0 3px;' +
            '  cursor: pointer;' +
            '  border-radius: 3px;' +
            '  -webkit-border-radius: 3px;' +
            '  -moz-border-radius: 3px;' +
            '}' +
            '.quote-box > .quote-stem {' +
            '  border-color: transparent transparent #000;' +
            '  opacity: 0.3;' +
            '  border-style: solid;' +
            '  border-width: 15px;' +
            '  display: block;' +
            '  height: 0;' +
            '  left: 5px;' +
            '  position: absolute;' +
            '  top: -30px;' +
            '  width: 0;' +
            '  z-index: 3;' +
            '}' +
            '</style>'
            );
           
            var el = $("<div>", {
                class: "quote-box"
            }).append(
            '<div>' +
            '    <input type="button" onclick="quote.quoteText()" value="Quote">' +
            '    <input type="button" onclick="quote.mention()" value="@Mention">' +
            '    <input type="button" onclick="quote.hideQuote()" value="×">' +
            '</div>' +
            '<span class="quote-stem"></span>'
            );

            $(el).appendTo("body");

            var selectedTxt, author;
            // VERSIONS:                PUNB    || PHPBB3 AND MODERNBB || PHPBB2 || INVISION
            $(document).on("mouseup", ".post-entry, .content, .postbody, .post-entry", function(e) {
                var arr = {
                    'user': [],
                    'text': []
                };
                // VERSIONS:                                          PUNB  ||              PHPBB3              ||              MODERNBB            ||                  PHPBB2                ||        INVISION
                author = $(this).parents("[class*='post--']").find(".username, .author > a, .postprofile strong > a, .postprofile-name, .comment-author, .name, .blog_comment-title > a[href^='/u'], .postprofile-head > a").text(),
                selectedTxt = quote.getSelectionText();
                if(selectedTxt) {
                    $(".quote-box").show().css({top: e.pageY + "px", left: e.pageX + "px"});
                    arr.user.push(author);
                    arr.text.push(selectedTxt);
                    sessionStorage.setItem("quote-box", JSON.stringify(arr));
                } else {
                    quote.hideQuote();
                }
            });
        },
        quoteText: function() {
            var stored = $.parseJSON(sessionStorage.getItem("quote-box"));
            if(stored) {
                $("textarea").sceditor("instance").insert("[quote='" + stored.user + "']" + stored.text + "[/quote]");
                quote.hideQuote();
            }
        },
        mention: function() {
            var stored = $.parseJSON(sessionStorage.getItem("quote-box"));
            if(stored) {
                $("textarea").sceditor("instance").insert("@" + stored.user);
                quote.hideQuote();
            }
        },
        getSelectionText: function() {
            var text;
            if (window.getSelection) {
                text = window.getSelection().toString();
            } else if (document.selection && document.selection.type != "Control") {
                text = document.selection.createRange().text;
            }
            return text;
        },
        hideQuote: function() {
            $(".quote-box").hide();
        }
    };
    quote.initialize()
})();

I can confirm this works well on phpbb3.

I can confirm it works in #ModernBB .

The code has been fully updated! Any problems, please comment below...

Daemon wrote:The code has been fully updated! Any problems, please comment below...

The code does not work on my forum. When I click the "quote" button, it doesn't go into post-mode.

Quote the user 2 times so the quote does not work well

jucarese wrote:Quote the user 2 times so the quote does not work well

I have the same problem.

Any updates for this? @Daemon