LINUX.ORG.RU

Auto spoiler

 , , , ,


6

4

В очередной раз наткнувшись на километровый топик с вставками кода решил откопать свой юзерскрипт для скрытия больших кусков кода.

Последняя версия где-то протерялась, потому переписал практически с нуля, на основе той что нашел:

  • префикс перед spoiler, в зависимости от типа
  • умеет скрывать теги [cut], [code], [pre]
  • лимит строк - 15 или 5, если тема засрана вставками (тут можно считать лимиты отдельно для каждого поста, но мне лень).

Скопипастте его уже в лоровский скрипт, там 2.5 строчек кода.

// ==UserScript==
// @name        LOR spoiler
// @namespace   linux.org.ru
// @description Add spoiler functionality
// @include     https://linux.org.ru/*
// @include     https://www.linux.org.ru/*
// @version     2
// @grant       none
// ==/UserScript==

$script.ready('jquery',function(){
  console.log('LOR spoiler is ON');

  // spoiler
  var types = ['cut', 'code', 'pre'];
  var blocks = {
    cut: $('[id ^= cut]'),
    code: $('.code'),
    pre: $('pre:not([class])')
  };

  var total_block_cnt = blocks.cut.length + blocks.code.length + blocks.pre.length;
  var line_limit = total_block_cnt > 2 ? 5 : 15;

  var spoiler_prefix_on = '>>> ';
  var spoiler_prefix_off = '<<< ';

  var tpl = 
    '<span class="sign">'+
      '<span>'+ spoiler_prefix_on +'</span>'+
      '<a '+
      'id="spoiler-hide-{TYPE}_{ID}" '+
      'href="javascript:void(0);" '+
      'onClick="javascript:var block=$(\'#hide-{TYPE}_{ID}\'); var prefix=this.previousElementSibling;'+
        'if (block.css(\'display\')===\'none\') {'+
          'block.show(); prefix.innerText=\''+spoiler_prefix_off+'\'; } else {'+
          'block.hide(); prefix.innerText=\''+spoiler_prefix_on+'\'; };">'+
      '{TYPE}-spoiler'+
      '</a>'+
    '</span><br/>';

  // change content
  if (total_block_cnt > 0) {
    for (var i = 0; i < types.length; i++) {
      var TYPE = types[i];
      var ID = 0;
      
      blocks[TYPE].each(function() {
        // limit
        var no_hl = $(this).find('pre.no-highlight code');
        var cur_blk = no_hl.length > 0 ?  no_hl : $(this);
        if (cur_blk.text().split("\n").length <= line_limit) return;

        // add spoiler
        var spoiler = tpl.replace(/\{TYPE\}/g, TYPE).replace(/\{ID\}/g, ID);
        $(this).attr('id','hide-'+TYPE+'_'+ ID).hide();
        $(this).before(spoiler);
        
        ID++;
      });
    }
  }
});

з.ы. выглядит так: http://i.imgur.com/SA0ScAO.png
или так: http://i.imgur.com/SGdal6y.png

★★★★

grem и Camel чего-то подобного запрашивали в теме про «18 лет Linux.org.ru»
кастую

anTaRes ★★★★ ()

Вот это было бы очень полезно. Крутая штука.

Weres ★★★ ()

Спасибо, так намного удобнее. Жаль, что никак не добавят такую фичу в сам движок.

grem ★★★★★ ()

О, спасибо, а то я уже с портянками в ленте бросил бороться.

mandala ★★★★ ()

Проблема со списками (она вообще проблема в движке):

Далее первого пункта не обрабатывается, пример: strace 4.15

mandala ★★★★ ()
Ответ на: комментарий от mandala

это не баг а фича

лимит строк - 15 или 5, если тема засрана вставками

т.е. второй блок какраз 5 строк, оставляем как есть

а если бы било 1-2 блока всего - оставляло бы до 15 строк открытыми, включительно

тут как вариант можно было бы рисовать таки спойлер, но не скрывать, а давать возможность самостоятельно свернуть
но тут при обновлении страницы оно бы опять открывалось

не хочется усложнять код, я специально делал его по максимуму понятным и простым, и совместимым с лоровским
чтоб тупой копипастой можно было добавить в лор, если вдруг

anTaRes ★★★★ ()
Последнее исправление: anTaRes (всего исправлений: 2)
Ответ на: комментарий от mandala

это поведение описывается тут:

var line_limit = total_block_cnt > 2 ? 5 : 15;
если поменять на
var line_limit = 0;
то будет скрывать все блоки, даже однострочные

anTaRes ★★★★ ()
Последнее исправление: anTaRes (всего исправлений: 2)
Ответ на: комментарий от anTaRes

почему так? часто бывают темы, где меряются однострочниками
sed и сложная строка
потому небольшие блоки оставляются как есть, так (ИМХО) удобнее

anTaRes ★★★★ ()

так они чуть более заметны, не сливаются с никами и лучше вписываются в текст, ИМХО

--- 1111        2016-12-15 17:52:38.878135646 +0200
+++ 2222        2016-12-15 17:52:01.414132648 +0200
@@ -18,7 +18,8 @@
     code: $('.code'),
     pre: $('pre:not([class])')
   };
-
+  var translate = {cut:'текст', code:'код', pre:'блок'};
+  
   var total_block_cnt = blocks.cut.length + blocks.code.length + blocks.pre.length;
   var line_limit = total_block_cnt > 2 ? 5 : 15;
 
@@ -26,16 +27,16 @@
   var spoiler_prefix_off = '&lt;&lt;&lt;&nbsp;';
 
   var tpl = 
-    '<span class="sign">'+
+    '<span>'+
       '<span>'+ spoiler_prefix_on +'</span>'+
-      '<a '+
+      '<a class="tag"'+
       'id="spoiler-hide-{TYPE}_{ID}" '+
       'href="javascript:void(0);" '+
       'onClick="javascript:var block=$(\'#hide-{TYPE}_{ID}\'); var prefix=this.previousElementSibling;'+
         'if (block.css(\'display\')===\'none\') {'+
           'block.show(); prefix.innerText=\''+spoiler_prefix_off+'\'; } else {'+
           'block.hide(); prefix.innerText=\''+spoiler_prefix_on+'\'; };">'+
-      '{TYPE}-spoiler'+
+      '{TYPE:tr} скрыт'+
       '</a>'+
     '</span><br/>';
 
@@ -52,7 +53,7 @@
         if (cur_blk.text().split("\n").length <= line_limit) return;                                                                                  
                                                                                                                                                       
         // add spoiler                                                                                                                                
-        var spoiler = tpl.replace(/\{TYPE\}/g, TYPE).replace(/\{ID\}/g, ID);                                                                          
+        var spoiler = tpl.replace(/\{TYPE\}/g, TYPE).replace(/\{ID\}/g, ID).replace(/\{TYPE:tr\}/g, translate[TYPE]);                                 
         $(this).attr('id','hide-'+TYPE+'_'+ ID).hide();                                                                                               
         $(this).before(spoiler);                                                                                                                      
                                                                                                                                                       

anTaRes ★★★★ ()

Класс. Почему я раньше этот тред не нашёл?

sudopacman ★★★★★ ()
Ответ на: комментарий от sudopacman

этому скрипту года 2
написал после того как сам сделал «каку»: километровую новость с ченжлогом ( В Wine Staging (wine-compholio) добавлен набор патчей CSMT )
В Wine Staging (wine-compholio) добавлен набор патчей CSMT (комментарий)

ровно 2 :)

anTaRes ★★ (16.12.2014 11:30:13)

anTaRes ★★★★ ()

Не силён в жабоскрипте

А как сделать, чтобы вместо «>>> code-spoiler» и «<<< code-spoiler» показывалось «>>> Показать код» и «>>> Скрыть код» соответственно и чтобы эта кнопка всегда показывалась в отдельной строчке (а то, например, тут отображается сразу после текста), но при этом лишняя пустая строка не вставлялась там, где она не нужна?

sudopacman ★★★★★ ()
Ответ на: Не силён в жабоскрипте от sudopacman

так, чтоль:

  var spoiler_prefix_on = 'Показать';
  var spoiler_prefix_off = 'Скрыть';

  var tpl = 
    '<br/><span>'+
      '<span>&gt;&gt;&gt;&nbsp;</span>'+
      '<a class="tag"'+
      'id="spoiler-hide-{TYPE}_{ID}" '+
      'href="javascript:void(0);" '+
      'onClick="javascript:var block=$(\'#hide-{TYPE}_{ID}\');'+
        'if (block.css(\'display\')===\'none\') {'+
          'block.show(); this.innerText=this.innerText.replace(\''+spoiler_prefix_on+'\', \''+spoiler_prefix_off+'\'); } else {'+
          'block.hide(); this.innerText=this.innerText.replace(\''+spoiler_prefix_off+'\', \''+spoiler_prefix_on+'\'); };">'+
      spoiler_prefix_on + '&nbsp;{TYPE:tr}'+
      '</a>'+
    '</span><br/>';
?
это с учетом правок из пред. диффа

з.ы. то что в одну строку - это фича
а так - в большинстве случаев будет лишний отступ

anTaRes ★★★★ ()
Ответ на: комментарий от anTaRes

sudopacman

При редактировании каст не работает, кстати.

вот, на всякий случай, все вкуче

Спасибо огромное. Вроде работает как надо. Как раз хотел попросить скрипт целиком, потому что в Хроме при редактировании в Treapmonkey глючит прокрутка и половина экрана занята хрен пойми чем, а в Firefox в Greasemonkey не работает копипаста; жутко неудобно было редактировать.

sudopacman ★★★★★ ()

Чуть переделал твой скрипт, добавил к <span style="display: block; width: 100%; border: 1px dashed red">. ну и убрал последний <br/>

так просто имхо лучше выделяется. а то у меня глаза вечно проскакивают что тут типа спойлер, сливается со ссылками, особенно когда сразу под ним еще 3-4 простыни на 4 строки каждая

upcFrost ★★★★★ ()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.