Official Everybody Edits Forums
Do you think I could just leave this part blank and it'd be okay? We're just going to replace the whole thing with a header image anyway, right?
You are not logged in.
- Topics: Active | Unanswered
#26 2015-09-25 15:54:44, last edited by AlphaJon (2015-09-26 17:59:07)
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
I'm aware of this
But surely the bbcode is simply a few string replace lines, right?
Like replace [quote=hummerz5] with <div style='quote'> <cite>Written by: Hummerz5</cite> <blockquote> my quoted info </blockquote> </div>
I'll try to get the html of the selection later this weekend, using the getparentselection thing + jquery to achieve this shouldn't be too hard. (not now cuz busy)
There is no html/BBcode in the selection though, and while it may be possible to add up the BBcode inside selection, it seems too complicated to implement [at least for now].
Offline
#27 2015-09-29 22:30:22
- Different55
- Forum Admin
- Joined: 2015-02-07
- Posts: 16,575
Re: Highlighting + quickqoute
Okay, new version of quickcod added. Please report any bugs in this topic.
"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto
Offline
- Wooted by: (3)
#28 2015-09-30 16:33:54
- skullz17
- Member
- Joined: 2015-02-15
- Posts: 6,699
Re: Highlighting + quickqoute
If you highlight part of the post, plus anything outside the post, it doesn't matter how much you highlighted, it will just ignore your highlight and do the whole post. is this intended?
thx for sig bobithan
Offline
#29 2015-09-30 20:02:57
- Different55
- Forum Admin
- Joined: 2015-02-07
- Posts: 16,575
Re: Highlighting + quickqoute
If your selection includes anything that isn't part of the post attached to the Quick Quote button you clicked, it'll assume it was a mistake and quote the whole post instead.
"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto
Offline
#30 2015-09-30 22:06:21
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
How's this looking?
http://stackoverflow.com/questions/4220 … cted-texts
It's what I was thinking all along.
Really though, I had no idea how to implement this. I'm guessing we could take the HTML elements here and use the selection range to cut off the unwanted text and keep the HTML. Then we're back to converting HTML and BBCode
Offline
#31 2015-10-01 10:00:48, last edited by AlphaJon (2015-10-01 11:58:11)
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
How's this looking?
http://stackoverflow.com/questions/4220 … cted-texts
It's what I was thinking all along.
Really though, I had no idea how to implement this. I'm guessing we could take the HTML elements here and use the selection range to cut off the unwanted text and keep the HTML. Then we're back to converting HTML and BBCode
Well, I'll try to do it this weekend [I have no internet on weekdays except at work so can't really do much atm]
EDIT: found this on StackOverflow:
function getSelectionHtml() {
var html = "";
if (typeof window.getSelection != "undefined") {
var sel = window.getSelection();
if (sel.rangeCount) {
var container = document.createElement("div");
for (var i = 0, len = sel.rangeCount; i < len; ++i) {
container.appendChild(sel.getRangeAt(i).cloneContents());
}
html = container.innerHTML;
}
} else if (typeof document.selection != "undefined") {
if (document.selection.type == "Text") {
html = document.selection.createRange().htmlText;
}
}
return html;
}it seems to work to me (there are the html tags in the result), now the only thing missing is the HTML->BBcode conversion, but I need a list of the BBcodes and their HTML translations so I can "reverse-translate" it to put actual BBcode into the quote, and not the HTML tags (I have the feeling it's going to cause some trouble with tags which have particular attributes like url, color, img)
Offline
#32 2015-10-01 12:33:40, last edited by hummerz5 (2015-10-01 12:33:57)
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
It certainly would. You seem to be rather capable in this area-- I half expected you to have some regex thoughts with this.
like [url=*] and [/url], <a href="*"> and </a>
[img]*[/img], <img src="*" />But the list is rather exhaustive
Perhaps different55 can give us a tip or two
Offline
#33 2015-10-01 14:07:59, last edited by AlphaJon (2015-10-01 14:31:21)
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
Perhaps different55 can give us a tip or two
Tbh I'm hoping different55 willl come here and provide the BBcode <=> HTML matches 
If not I'll make a "half-spam" post containing the most used tags and work on it
EDIT: I found a JS BBcode parser, which can get the job easily (I didn't test it yet), but it requires adding the whole file to the topic pages(as a <script></script>, will require different55 to download the JS file and put it somewhere on the forum server, or link it to the github file).
However, I'm still going to need the list of BBcode <=> HTML to make it work properly on this forum.
Offline
#34 2015-10-01 16:59:28
- Different55
- Forum Admin
- Joined: 2015-02-07
- Posts: 16,575
Re: Highlighting + quickqoute
Here's the function that turns BBCode to HTML, not including smilies. I can provide that as well if you want.
//
// Convert BBCodes to their HTML equivalent
//
function do_bbcode($text, $is_signature = false)
{
global $lang_common, $pun_user, $pun_config, $re_list, $pun_bbcode;
if (strpos($text, '[quote') !== false)
{
$text = preg_replace('%\[quote\]\s*%', '</p><div class="quotebox"><blockquote><div><p>', $text);
$text = preg_replace_callback('%\[quote=("|&\#039;|"|\'|)(.*?)\\1\]%s', create_function('$matches', 'global $lang_common; return "</p><div class=\"quotebox\"><cite>".str_replace(array(\'[\', \'\\"\'), array(\'[\', \'"\'), $matches[2])." ".$lang_common[\'wrote\']."</cite><blockquote><div><p>";'), $text);
$text = preg_replace('%\s*\[\/quote\]%S', '</p></div></blockquote></div><p>', $text);
}
if (strpos($text, '[spoiler') !== false)
{
$text = str_replace('[spoiler]', "</p><div class=\"quotebox spoilerbox\" style=\"padding: 0 5px;\"><div class=\"spoiler\" onclick=\"var e,d,c=this.parentNode,a=c.getElementsByTagName('div')[1],b=this.getElementsByTagName('span')[0];if(a.style.display!=''){while(c.parentNode&&(!d||!e||d==e)){e=d;d=(window.getComputedStyle?getComputedStyle(c, null):c.currentStyle)['backgroundColor'];if(d=='transparent'||d=='rgba(0, 0, 0, 0)')d=e;c=c.parentNode;}a.style.display='';b.innerHTML='▲';}else{a.style.display='none';b.innerHTML='▼';}\"><span class=\"spoiler\">▼</span>".$lang_common['Hidden text']."</div><div class=\"spoiled\" style=\"display:none\"><p>", $text);
$text = preg_replace('#\[spoiler=(.*?)\]#s', '</p><div class="quotebox spoilerbox" style="padding: 0 5px;"><div class="spoiler" onclick="var e,d,c=this.parentNode,a=c.getElementsByTagName(\'div\')[1],b=this.getElementsByTagName(\'span\')[0];if(a.style.display!=\'\'){while(c.parentNode&&(!d||!e||d==e)){e=d;d=(window.getComputedStyle?getComputedStyle(c, null):c.currentStyle)[\'backgroundColor\'];if(d==\'transparent\'||d==\'rgba(0, 0, 0, 0)\')d=e;c=c.parentNode;}a.style.display=\'\';b.innerHTML=\'▲\';}else{a.style.display=\'none\';b.innerHTML=\'▼\';}"><span class="spoiler">▼</span>$1</div><div class="spoiled" style="display:none"><p>', $text);
$text = str_replace('[/spoiler]', '</p></div></div><p>', $text);
}
if (!$is_signature)
{
$pattern_callback[] = $re_list;
$replace_callback[] = 'handle_list_tag($matches[2], $matches[1])';
}
$pattern[] = '%\[b\](.*?)\[/b\]%ms';
$pattern[] = '%\[i\](.*?)\[/i\]%ms';
$pattern[] = '%\[u\](.*?)\[/u\]%ms';
$pattern[] = '%\[s\](.*?)\[/s\]%ms';
$pattern[] = '%\[del\](.*?)\[/del\]%ms';
$pattern[] = '%\[ins\](.*?)\[/ins\]%ms';
$pattern[] = '%\[em\](.*?)\[/em\]%ms';
$pattern[] = '%\[colou?r=([a-zA-Z]{3,20}|\#[0-9a-fA-F]{6}|\#[0-9a-fA-F]{3})](.*?)\[/colou?r\]%ms';
$pattern[] = '%\[h\](.*?)\[/h\]%ms';
$pattern[] = '%\[center\](.*?)\[/center\]%ms';
$pattern[] = '%\[hide\](.*?)\[/hide\]%ms';
$pattern[] = '%\[pre\](.*?)\[/pre\]%ms';
$pattern[] = '%\[youtube\]([a-zA-Z0-9]*)\[/youtube\]%s';
$pattern[] = '%\[donate\]%s';
foreach($pun_bbcode as $custom_tag) { // Add the Custom BBCodes to the patterns array
if($custom_tag['type'] == 1)
$pattern[] = '%\['.$custom_tag['name'].'\](.*?)\[/'.$custom_tag['name'].'\]%ms';
else
$pattern[] = '%\['.$custom_tag['name'].'=([0-9a-zA-Z.\-_+\(\)#@:; /]{1,200})\](.*?)\[/'.$custom_tag['name'].'\]%ms';
}
$replace[] = '<strong>$1</strong>';
$replace[] = '<em>$1</em>';
$replace[] = '<span class="bbu">$1</span>';
$replace[] = '<span class="bbs">$1</span>';
$replace[] = '<del>$1</del>';
$replace[] = '<ins>$1</ins>';
$replace[] = '<em>$1</em>';
$replace[] = '<span style="color: $1">$2</span>';
$replace[] = '</p><h5>$1</h5><p>';
$replace[] = '</p><div class="center"><p>$1<p></div><p>';
$replace[] = '<span class="bgcolor">$1</span>';
$replace[] = '<div class="codebox"><pre><code>$1</code></pre></div>';
$replace[] = '<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/$1"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/v/$1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed></object>';
$replace[] = '<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="6EBDSJ5X3SYLW">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>';
foreach($pun_bbcode as $custom_tag) { // Add the Custom BBCodes to the replace array
$replace[] = $custom_tag['output'];
}
if (($is_signature && $pun_config['p_sig_img_tag'] == '1') || (!$is_signature && $pun_config['p_message_img_tag'] == '1'))
{
$pattern_callback[] = '%\[img\]((ht|f)tps?://)([^\s<"]*?)\[/img\]%';
$pattern_callback[] = '%\[img=([^\[]*?)\]((ht|f)tps?://)([^\s<"]*?)\[/img\]%';
if ($is_signature)
{
$replace_callback[] = 'handle_img_tag($matches[1].$matches[3], true)';
$replace_callback[] = 'handle_img_tag($matches[2].$matches[4], true, $matches[1])';
}
else
{
$replace_callback[] = 'handle_img_tag($matches[1].$matches[3], false)';
$replace_callback[] = 'handle_img_tag($matches[2].$matches[4], false, $matches[1])';
}
}
$pattern_callback[] = '%\[url\]([^\[]*?)\[/url\]%';
$pattern_callback[] = '%\[url=([^\[]+?)\](.*?)\[/url\]%';
$pattern[] = '%\[email\]([^\[]*?)\[/email\]%';
$pattern[] = '%\[email=([^\[]+?)\](.*?)\[/email\]%';
$pattern_callback[] = '%\[topic\]([1-9]\d*)\[/topic\]%';
$pattern_callback[] = '%\[topic=([1-9]\d*)\](.*?)\[/topic\]%';
$pattern_callback[] = '%\[post\]([1-9]\d*)\[/post\]%';
$pattern_callback[] = '%\[post=([1-9]\d*)\](.*?)\[/post\]%';
$pattern_callback[] = '%\[forum\]([1-9]\d*)\[/forum\]%';
$pattern_callback[] = '%\[forum=([1-9]\d*)\](.*?)\[/forum\]%';
$pattern_callback[] = '%\[user\]([1-9]\d*)\[/user\]%';
$pattern_callback[] = '%\[user=([1-9]\d*)\](.*?)\[/user\]%';
$replace_callback[] = 'handle_url_tag($matches[1])';
$replace_callback[] = 'handle_url_tag($matches[1], $matches[2])';
$replace[] = '<a href="mailto:$1">$1</a>';
$replace[] = '<a href="mailto:$1">$2</a>';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewtopic.php?id=\'.$matches[1])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewtopic.php?id=\'.$matches[1], $matches[2])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewtopic.php?pid=\'.$matches[1].\'#p\'.$matches[1])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewtopic.php?pid=\'.$matches[1].\'#p\'.$matches[1], $matches[2])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewforum.php?id=\'.$matches[1])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/viewforum.php?id=\'.$matches[1], $matches[2])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/profile.php?id=\'.$matches[1])';
$replace_callback[] = 'handle_url_tag(\''.get_base_url(true).'/profile.php?id=\'.$matches[1], $matches[2])';
// This thing takes a while! :)
$text = preg_replace($pattern, $replace, $text);
$count = count($pattern_callback);
for($i = 0 ; $i < $count ; $i++)
{
$text = preg_replace_callback($pattern_callback[$i], create_function('$matches', 'return '.$replace_callback[$i].';'), $text);
}
return $text;
}You can probably just convert all [forum ] and [post ] tags url tags. Nobody will miss them.
"Sometimes failing a leap of faith is better than inching forward"
- ShinsukeIto
Offline
#35 2015-10-02 09:09:29
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
Here's the function that turns BBCode to HTML
-snip-
Yay for the quote and spoiler regexes!
Offline
#36 2015-10-02 21:30:24, last edited by hummerz5 (2015-10-02 21:35:25)
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
so we should probably figure out
who's going to take all of that info and condense it
because it's pretty intense
I mean, I can try... but I'd hate for us both to start and waste 50% effort y'know
Interesting. It seems we're going for the $$$.
...
This is good to know. And here everyone thinks you have to use colors!
Offline
#37 2015-10-02 22:38:48, last edited by AlphaJon (2015-10-02 23:22:05)
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
diff, when I went through the spoiler regex, I have to admit putting such a JS inline is kinda... disturbing 
Anyway, I'm converting the html to BBcode atm so I'm going to soon edit this post to put online what I've done
Here it is, but it doesn't seem to work for me (includes the parser from github and the function fetching the html from selection, so it has more than 200 lines):
My code is in the last lines, but it doesn't seem to do a thing on the output. I still think it's too complicated for a thing which is just supposed to add BBcode.
A much easier way to make it work would be to include BBcode INSIDE the post within hidden tags (not sure if display:none will do the trick or if it has to remain visible but with a width of 0), but I can't test this way (not to mention there may be some side effects to this approach, not sure what kind of side effects though)
Oh, BTW, it seems that making url and img tags work will be even harder than the rest of the tags, because they are treated differently due to the URLs (the result isn't even in the piece of PHP code diff provided, the 2 tags may have their own functions)
Offline
#38 2015-10-03 02:38:06, last edited by hummerz5 (2015-10-03 02:56:27)
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
I think you're on to something here.
Truly.
Why did you comment out em?
bbcodeParser.addBBCode('[img]{TEXT}[/img]', '<span class="postimg"><img src="{TEXT}" alt="{TEXT}"></span>');
allows
bbcodeParser.htmlToBBCode("<span class=\"postimg\"><img src=\"swaggimg\" alt=\"hi\"></span>")
bbcodeParser.addBBCode('[url={URL}]{TEXT}', '<a href="{URL}" rel="nofollow">{TEXT}</a>');There's probably some huge problem with this, do share.
Otherwise I'm goin' on URL
You say it isn't working for you? Your magic workin' is doing wonders for me.
Offline
#39 2015-10-03 15:12:02
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
You say it isn't working for you? Your magic workin' is doing wonders for me.
Well idk what I messed up, but it's nice to hear you've got it working.
But on my console the last line in the code is showing the html without converting to BBcode, did you add some code besides the test case?
Btw you forgot the [ /url] for the url tag 
Offline
#40 2015-10-03 23:16:33, last edited by hummerz5 (2015-10-03 23:23:22)
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
Well, I might simply be using the important line when I need it.
E.g.,
1. Run your code
2. select something
3. run your output line
oops who needs [/ url]s anyway
I guess the problem I see here is recursing to the parent
er, the post itself
That way we still get the list, bold, table, code, or whatever that holds the selection
Otherwise we don't get that all.
meaning:
this is bold
now it's also italicized
and even underlined
still bold
oops
returns only underlined html... or something etc
I'd also suggest
bbCodeThatIsOutput.replace("<br>", '\n')Offline
- Wooted by:
#41 2015-10-06 13:10:00
- AlphaJon
- Member
- From: Who knows
- Joined: 2015-07-21
- Posts: 1,297
Re: Highlighting + quickqoute
I'm starting to give up on this, it's becoming too complicated for something which is just supposed to put BBcode. 
There's still the quickquote without selecting which does put the BBcode, and you can then erase the parts you don't need.
Offline
#43 2016-01-24 02:03:23, last edited by hummerz5 (2016-01-24 02:10:38)
- hummerz5
- Member
- From: wait I'm not a secret mod huh
- Joined: 2015-08-10
- Posts: 5,854
Re: Highlighting + quickqoute
Hi, this is totally not gravedigging.
I feel like there was some newly generated interest on the topic, so I'll reiterate my point that atm nothing's particularly broken with this for me... I mean, there's some things to tidy up, but the main issue here is that it only works for me. If someone else could chip in and test, woot.
Firefox btw. This is what I have:
Everything's nested in a <p> still. We could fix all that with removing the <p> and just adding two line breaks after each element rite? Also, I note that a URL when halfway quoted only has the start URL tag, but not the end. Perhaps we could fix that all by appending the end to all open tags automatically? Thoughts?
thx
lol edit: disregard what I said about the in-progress URL tag. It very well could be that Jonathan had already told me how the url tag didn't have an /url so shh
edit 2: yeah that fixed it. and...
bbcodeParser.addBBCode('\n{TEXT}', '<br>{TEXT}')
bbcodeParser.addBBCode('\n\n{TEXT}', '</p><p>{TEXT}')
hacky? solution to the extra br and p tags. Offline
[ Started around 1738468675.4106 - Generated in 0.183 seconds, 13 queries executed - Memory usage: 1.72 MiB (Peak: 1.99 MiB) ]