Improve behaviour of collapsed code boxes

diff --git a/com.woltlab.wcf/templates/codeBBCodeTag.tpl b/com.woltlab.wcf/templates/codeBBCodeTag.tpl
index 844009590687090b83c7e2ff57531a636d2e20b8..6b7f1eceb578463478acef21531baf69bb2d03a5 100644 (file)
--- a/com.woltlab.wcf/templates/codeBBCodeTag.tpl
+++ b/com.woltlab.wcf/templates/codeBBCodeTag.tpl
@@ -20,12 +20,34 @@
        
        {if $lines > 10}
                <span class="codeBoxExpand jsButtonCodeBoxExpand">{lang}wcf.bbcode.button.showAll{/lang}</span>
-               <script data-relocate="true">
-                       $(function() {
-                               $('.jsButtonCodeBoxExpand').removeClass('jsButtonCodeBoxExpand').click(function() {
-                                       $(this).parent().removeClass('minimized').end().remove();
+               
+               {if !$__overlongCodeBoxSeen|isset}
+                       {assign var='__overlongCodeBoxSeen' value=true}
+                       <script data-relocate="true">
+                               $(function() {
+                                       $('.jsButtonCodeBoxExpand').removeClass('jsButtonCodeBoxExpand').click(function() {
+                                               $(this).parent().removeClass('minimized').end().remove();
+                                       });
+                                       
+                                       // searching in a page causes Google Chrome to scroll
+                                       // the code box if something inside it matches
+                                       // 
+                                       // expand the box in this case, to:
+                                       // a) Improve UX
+                                       // b) Hide an ugly misplaced "show all" button
+                                       $('.codeBox').on('scroll', function() {
+                                               $(this).find('.codeBoxExpand').click();
+                                       });
+                                       
+                                       // expand code boxes that are initially scrolled this
+                                       // may happen due to someone linking to a specific line
+                                       $('.codeBox').each(function() {
+                                               if ($(this).scrollTop() != 0) {
+                                                       $(this).find('.codeBoxExpand').click();
+                                               }
+                                       });
                                });
-                       });
-               </script>
+                       </script>
+               {/if}
        {/if}
 </div>