Skip to content

Commit

Permalink
#1594 Replace spoiler implementation with Bootstrap
Browse files Browse the repository at this point in the history
  • Loading branch information
Studio384 committed Jun 12, 2018
1 parent 7f16bff commit 33f4b3c
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 12 deletions.
3 changes: 2 additions & 1 deletion backstage/about.php
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,8 @@
<div class="container">
<h2 class="clearfix"><span class="version-name">Fallow Preview 2 <small>2.1-alpha.2</small></span></h2>
<ul class="changes">
<li><div class="stater"><em class="state state-improved"><?php _e('Improved', 'luna') ?></em></div><?php _e('Improved dDatabase management', 'luna') ?></li>
<li><div class="stater"><em class="state state-improved"><?php _e('Improved', 'luna') ?></em></div><?php _e('Spoilers now use the Bootstrap\'s collapse plugin', 'luna') ?></li>
<li><div class="stater"><em class="state state-improved"><?php _e('Improved', 'luna') ?></em></div><?php _e('Improved database management', 'luna') ?></li>
<li><div class="stater"><em class="state state-improved"><?php _e('Improved', 'luna') ?></em></div><?php _e('Improved night mode with better contrast and darker design', 'luna') ?></li>
<li><div class="stater"><em class="state state-fixed"><?php _e('Fixed', 'luna') ?></em></div><?php _e('ALPHA - Backstage accent settings no longer trigger a warning', 'luna') ?></li>
</ul>
Expand Down
10 changes: 7 additions & 3 deletions include/parser.php
Original file line number Diff line number Diff line change
Expand Up @@ -706,9 +706,13 @@ function do_bbcode($text, $is_signature = false)
}

if ($luna_config['o_allow_spoiler'] == 1 && strpos($text, '[spoiler') !== false) {
$text = str_replace('[spoiler]', "</p><div class=\"panel panel-default panel-spoiler\" style=\"padding: 0px;\"><div class=\"panel-heading\" onclick=\"var e,d,c=this.parentNode,a=c.getElementsByTagName('div')[1],b=this.getElementsByTagName('.fa')[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='';a.style.backgroundColor=d;b.innerHTML='&#9650;';}else{a.style.display='none';b.innerHTML='&#9660;';}\" style=\"font-weight: bold; cursor: pointer; font-size: 0.9em;\"><h3 class=\"panel-title\"><i class=\"fas fa-fw fa-angle-down\"></i>" . __('Spoiler', 'luna') . "</h3></div><div class=\"panel-body\" style=\"display: none;\"><p>", $text);
$text = preg_replace('#\[spoiler=(.*?)\]#s', '</p><div class="panel panel-default panel-spoiler" style="padding: 0px;"><div class="panel-heading" 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=\'\';a.style.backgroundColor=d;b.innerHTML=\'&#9650;\';}else{a.style.display=\'none\';b.innerHTML=\'&#9660;\';}" style="font-weight: bold; cursor: pointer; font-size: 0.9em;"><h3 class="panel-title"><i class="fas fa-fw fa-angle-down"></i>$1</h3></div><div class="panel-body" style="display: none;"><p>', $text);
$text = str_replace('[/spoiler]', '</p></div></div><p>', $text);
$count = 0;
$spoiler = mt_rand();

$text = preg_replace('%\[spoiler\]\s*%', '</p><div class="panel panel-default panel-spoiler"><div class="panel-heading" role="tab" id="heading'.$spoiler.$count.'"><h4 class="panel-title"><a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse'.$spoiler.$count.'" aria-expanded="true" aria-controls="collapse'.$spoiler.$count.'"><span class="fa fa-fw fa-angle-down"></span> '.__('Spoiler', 'luna').'</a></h4></div><div id="collapse'.$spoiler.$count.'" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading'.$spoiler.$count.'"><div class="panel-body"><p>', $text, -1, $count);
$text = preg_replace('%\[spoiler=(.*?)\]\s*%', '</p><div class="panel panel-default panel-spoiler"><div class="panel-heading" role="tab" id="heading'.$spoiler.$count.'"><h4 class="panel-title"><a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse'.$spoiler.$count.'" aria-expanded="true" aria-controls="collapse'.$spoiler.$count.'"><span class="fa fa-fw fa-angle-down"></span> $1</a></h4></div><div id="collapse'.$spoiler.$count.'" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading'.$spoiler.$count.'"><div class="panel-body"><p>', $text, -1, $count);

$text = str_replace('[/spoiler]', '</p></div></div></div><p>', $text);
}

if (!$is_signature) {
Expand Down
5 changes: 5 additions & 0 deletions themes/Fifteen/css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -1670,6 +1670,11 @@ blockquote footer {
border: none;
}

.panel.panel-spoiler .panel-heading a {
color: #fff;
text-decoration: none;
}

.panel.panel-spoiler .panel-heading {
color: #fff;
border: none;
Expand Down
18 changes: 10 additions & 8 deletions themes/Fifteen/views/help.php
Original file line number Diff line number Diff line change
Expand Up @@ -69,14 +69,16 @@
<?php if($luna_config['o_allow_spoiler'] == 1) { ?>
<p><?php _e('You can also hide parts of your comment if you don\'t want to spoil its content.', 'luna') ?></p>
<p><code>[spoiler=<?php _e('Spoiled text', 'luna') ?>]<?php _e('This is the text I don\'t want to spoil.', 'luna') ?>[/spoiler]</code></p>
<div class="panel panel-default panel-spoiler" style="padding: 0px;">
<div class="panel-heading" 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='';a.style.backgroundColor=d;b.innerHTML='&#9650;';}else{a.style.display='none';b.innerHTML='&#9660;';}" style="font-weight: bold; cursor: pointer; font-size: 0.9em;">
<h3 class="panel-title"><i class="fas fa-fw fa-angle-down"></i> <?php _e('Spoiled text', 'luna') ?></h3>
</div>
<div class="panel-body" style="display: none;">
<?php _e('This is the text I don\'t want to spoil.', 'luna') ?>
</div>
</div>
<div class="panel panel-default panel-spoiler">
<div class="panel-heading" role="tab" id="heading">
<h4 class="panel-title"><a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse" aria-expanded="true" aria-controls="collapse"><span class="fa fa-fw fa-angle-down"></span> <?php _e('Spoiled text', 'luna') ?></a></h4>
</div>
<div id="collapse" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading">
<div class="panel-body">
<?php _e('This is the text I don\'t want to spoil.', 'luna') ?>
</div>
</div>
</div>
<p><?php _e('Like the quote tag, you can use the spoiler tag without specifying a title. If a title contains the characters [ or ] you can enclose it in quote marks.', 'luna') ?></p>
<?php } ?>
</div>
Expand Down

0 comments on commit 33f4b3c

Please sign in to comment.