LINUX.ORG.RU

LORCode Tools: панель тегов и цитирование выделенного

 


21

29

Скрипт добавляет панель тегов над формами ответа/треда/профиля/etc.
Кроме тегов на панели есть специальные функции:

  • «brs» добавляет [br] к переводам строк;
  • «fix», а-ля викификация: превращает (c) в ©, (f) в £, " - " в " — " и еще много;
  • «deltags-in» снимает крайнее (внешнее) обрамления тегами в выделенном.

Добавляет ссылки сверху постов:

  • «блок-цитата» вставляет выделенный текст (или все сообщение) в тегах [quote];
  • «цитата» вставляет текст, добавляя в начало каждой строки стрелочки цитирования (>);
  • «юзер» вставляет обращение через тег [user] к автору соответствующего поста.

Для установки скрипта в Firefox вам необходимо расширение Greasemonkey, по ссылке на скрипт будет предложено установить его.
В Opera смотрите настройки для сайта >> скрипты, где задается папка JavaScript, в которую и должен быть сохранен скрипт.

Обновления:

  • 03.11.2011: v. 0.1
  • 04.11.2011: v. 0.11
  • 13.11.2011: v. 0.12
  • 14.12.2011: v. 0.13
  • 02.01.2012: v. 0.2
  • 14.04.2012: v. 0.21

Форки:

Официально поддерживается только тема black. Форки любого рода приветствуются.

При обновлениях обновляется все тот же файл, а равно ссылка не меняется (по крайней мере пока). Об обновлениях создаются соответствующие посты в треде, ChangeLog ведется на официальной странице. Рекомендую подписаться на тред.

Скрипт базируется на MultiCodePanel 2 (тоже мой проект) и распространяется на условиях лицензии Creative Commons Attribution 3.0 Unported.

Спасибо за помощь Yareg, спасибо авторам статей «Range, TextRange и Selection», «Учимся писать userscript'ы», «Textarea и управление им с помощью javascript», без вас у меня ничего бы не вышло.

Ответ на: комментарий от Eddy_Em

[code]

ERROR: Execution of script 'LORCode Tools' failed! unsafeWindow is not defined
ReferenceError: unsafeWindow is not defined
at eval (eval at <anonymous> (eval at <anonymous> (unknown source)), <anonymous>:88:1)
at Object.eval (eval at <anonymous> (eval at <anonymous> (unknown source)), <anonymous>:1270:2)
at Object.eval (eval at <anonymous> (eval at <anonymous> (unknown source)), <anonymous>:1273:4)
at d (eval at <anonymous> (unknown source), <anonymous>:28:45)
at eval (eval at <anonymous> (eval at <anonymous> (unknown source)), <anonymous>:1:25)
at Object.eval (native)
at m (eval at <anonymous> (unknown source), <anonymous>:52:343)
at Z (eval at <anonymous> (unknown source), <anonymous>:28:61)
at aa (eval at <anonymous> (unknown source), <anonymous>:62:388)
at b (eval at <anonymous> (unknown source), <anonymous>:63:286)
[/code]

Твой код нормально работает под Chromium, так, по крайней мере было до последнего дня.

lexxus-lex ★★★ ()

Починил сортировку трекера (надоел всякий мусор, который там тоннами плавает при редактировании wiki).

Кто хочет — обновите мой клон скрипта.

Да, вот новые правила для stylish:

@-moz-document domain("linux.org.ru"){
div.code{border-left: 5px solid !important;}
#bd div.messages div.infoblock {display: none !important;}
#bd {padding: 0.5em !important;}
div.quote p cite{text-decoration: none !important; font-weight: bold !important;}
.quote{border: 1px dotted !important;}
p[style*="margin-top: 0"] > em {display: none !important;}
p {margin: 0 !important;}
.SortTrackMenu{position: absolute;  padding: 1px;
background: none repeat scroll 0 0  #0000ff !important; text-align: left;}
.SortTrackMenuItem{left: 0px; background-color: #c0c0c0 !important; color: black; line-height: 1.2;padding: 0px 3px;}
#msg{font-family: monospace !important;  font-size: 12px !important;}
#form_msg{font-family: monospace !important; font-size: 12px !important;}
#ft-back-button{display: none !important;}
.sign{margin-left: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important;}
footer{padding-bottom: 0 !important; margin-bottom: 0 !important;}
a:hover{text-decoration: none !important;}
.keyword{font-weight: bold !important;}
span.comment{font-style: italic !important;}
.number{font-weight: bold !important; font-style: italic !important;}
}
blockquote{
    border: 1px dotted !important;
    margin: 0 !important;
    padding: 0 0 0 0.5em !important;
}
.page-number{padding: 0px !important;}
.messages .msg {margin: 4px 0px !important; padding: 4px !important;}
nav {position: relative; top: -3em; float: right;}
a.btn:before {content: "[";}
a.btn:after {content: "]";}
.btn {border: none !important; padding: 0px !important;}

Так как кнопки тоже имеют класс btn, пришлось явно указать, что скобочки добавлять надо лишь тегам "a", последнее правило помимо нормального отображения "кнопок" меню трекера превращает остальные кнопки в человеческие.

Eddy_Em ☆☆☆☆☆ ()
Ответ на: комментарий от lexxus-lex

пока установил себе это:
https://chrome.google.com/webstore/detail/bbcodeinsert/fhckbmeeagkjnabhfaindk...

upd: решил проблему, весь замес был в кривом tamplemonkey, установил violentmonkey с opera addons - всё заработало.

lexxus-lex ★★★ ()
Последнее исправление: lexxus-lex (всего исправлений: 1)

Не ради тунеяцтва. А просто JFF.

Запилил и я себе «хелпер бб-тегов». Да плевать что на jQuery. На лоре же есь jQuery, вы не знали? Ну, можно было бы и на VanillaJS сделать.

Ниасилил я тут читать все страницы и что оно умеет, потому написал свой. Скорее всего все это есть и в этом. Не суть. У меня удобно добавлять вообще кастомные теги. Просто допиши еще одну строчку и все. Пример такой:

<a class="bb-tag" data-name="foo" data-wrap="y" data-attr="bar" href="#">Foo</a>

Выдаст:

[foo=bar]выделенный текст[/foo]

Атрибуты:

  • data-name - имя тега (b, br, code)
  • data-wrap - оборачивать в закрывающий или нет (y - да, любое другое значение - нет)
  • data-attr - атрибут тега (тот что идёт после знака равно), например для code: c, cpp, а для url: http://domain.tld/

Так же можно пеменять после какого элемента будут вставляться эти кнопки. Нужно сменить селектор у определения bbBefore.

Собсно код:

// ==UserScript==
// @name LORCode Tools Simple
// @description ...
// @author ...
// @license GPLv3
// @version 0.0.1
// @grant none
// @namespace http://www.linux.org.ru/*
// @namespace https://www.linux.org.ru/*
// @include http://www.linux.org.ru/*
// @include https://www.linux.org.ru/*
// ==/UserScript==

$(function() {

    var
        bbBefore = $('textarea#msg'),
        msgArea  = $('textarea#msg'),
        bbBox    = $('<div id="bb-helper-box"></div>');

    if (!msgArea.length) {
        return;
    } else {
        msgArea = msgArea[0];
    }

    function getTagSettings(tagObj)
    {
        return {
            name : tagObj.attr('data-name') || false,
            wrap : (tagObj.attr('data-wrap') == 'y'),
            attr : tagObj.attr('data-attr') || false
        };
    }

    function insertTag(b, e)
    {
        if (document.selection) {
            msgArea.focus();
            var s = document.selection.createRange();
            s.text = b + s.text + e;
        } else if (msgArea.selectionStart || msgArea.selectionStart == '0') {
            msgArea.focus();
            var sp = msgArea.selectionStart;
            var ep = msgArea.selectionEnd;
            msgArea.value = msgArea.value.substring(0, sp)
                + b
                + msgArea.value.substring(sp, ep)
                + e
                + msgArea.value.substring(ep, msgArea.value.length);
        } else {
            msgArea.value += b + e;
        }
    }

    $('<style>'
        + '#bb-helper-box {'
        + '    padding: 10px 0;'
        + '    font-size: 0.8em;'
        + '}'
        + '#bb-helper-box a.bb-tag {'
        + '    display: inline-block;'
        + '    margin: 0 3px;'
        + '    padding: 0 5px;'
        + '    min-width: 1.7em;'
        + '    height: 1.7em;'
        + '    line-height: 1.6em;'
        + '    text-decoration: none;'
        + '    text-align: center;'
        + '    color: #eeeeec;'
        + '    background: #204a87;'
        + '    border: solid 1px #d4d4d4;'
        + '    border-radius: 0.2em;'
        + '}'
        + '#bb-helper-box a.bb-tag:hover {'
        + '    box-shadow: 0 0 1px 1px #729fcf;'
        + '}'
        + '</style>').insertAfter(bbBefore);

    bbBox.html(
        ''
        + '<a class="bb-tag" data-name="br"     data-wrap="n" href="#br">br</a>'
        + '<a class="bb-tag" data-name="b"      data-wrap="y" href="#b"><b>b</b></a>'
        + '<a class="bb-tag" data-name="i"      data-wrap="y" href="#i"><i>i</i></a>'
        + '<a class="bb-tag" data-name="u"      data-wrap="y" href="#u"><u>u</u></a>'
        + '<a class="bb-tag" data-name="s"      data-wrap="y" href="#s"><s>s</s></a>'
        + '<a class="bb-tag" data-name="em"     data-wrap="y" href="#em"><em>em</em></a>'
        + '<a class="bb-tag" data-name="pre"    data-wrap="y" href="#pre">pre</a>'
        + '<a class="bb-tag" data-name="inline" data-wrap="y" href="#inline">inline</a>'
        + '<a class="bb-tag" data-name="user"   data-wrap="y" href="#user">user</a>'
        + '<a class="bb-tag" data-name="quote"  data-wrap="y" href="#quote">quote</a>'
        + '<a class="bb-tag" data-name="url"    data-wrap="y" href="#url">url</a>'
        + '<a class="bb-tag" data-name="list"   data-wrap="y" href="#list">list</a>'
        + '<a class="bb-tag" data-name="*"      data-wrap="n" href="#list-entry">*</a>'
        + '<a class="bb-tag" data-name="code"   data-wrap="y" href="#code">code</a>'

        + '<a class="bb-tag" data-name="code" data-wrap="y" data-attr="c"   href="#c-code">C</a>'
        + '<a class="bb-tag" data-name="code" data-wrap="y" data-attr="cpp" href="#cpp-code">C++</a>'

    ).insertAfter(bbBefore);

    bbBox.on('click', 'a.bb-tag', function() {

        var
            that = $(this),
            data = that.data('tag-settings');
   
        if (!data) {
            data = getTagSettings(that);
            that.data('tag-settings', data);
        }
        if (data.name) {
            insertTag(
                '[' + data.name + (data.attr ? '=' + data.attr : '') + ']',
                data.wrap ? '[/' + data.name + ']' : ''
            );
        }

        return false;
    });

});

Выглядит так: http://s28.postimg.org/ujzma3r0t/Screenshot.png

deep-purple ★★★★★ ()
Ответ на: комментарий от lexxus-lex

Ctrl+F5 сделал? Ато оно у меня тоже по началу видимо из-за кешей не работало.

Аааа! Ну все пральна. Я ж прикрутил его только для «ответить на это сообщение». Таки пофиксию сегодня чтоб и на создание треда цеплялось.

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

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

Хотя бы. Про jQuery знал, но я его не знал, не знаю, и даже как-то знать не хочу. Свой скрипт пофиксил, снова работает.

nightingale ()
Ответ на: комментарий от deep-purple

Эмм... У меня — ничего :)
Это у Эдди что-то настраивается (если настраивается... у меня настройки не сохранились). А у меня просто панелька и три ссылки у каждого поста. Методом тыка все это осваивается легко.

nightingale ()
Ответ на: комментарий от deep-purple

Естественно в коде можно под себя пофиксить что надо; я старался хороший, красивый код писать :)
Тред для этого читать не надо. Об этом и речи не шло в треде. Но спрашивай, если что.

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

Ага. Мой скрипт хранит настройки в локалсторидже, а сами настройки появляются пунктом "Настройки пользовательского скрипта" в профиле. Вот что там есть:

  • фильтрация трекера
  • удалить прикрепленные везде
  • удалить прикрепленные только в Talks
  • сворачивать большие блоки CODE
  • удалить «страшный глаз»
  • добавить пользовательскую панель
  • отображать секунды в дате
  • заменять кавычки кавычками
  • отображать новые сообщения первыми
  • скрывать «Похожие темы»

Пункт "заменять кавычки кавычками" до сих пор глючит (например, не позволяет списки нумерованные делать и т.п.), все руки не доходят починить.

Eddy_Em ☆☆☆☆☆ ()

Опять какой-то косяк: перестала работать кнопка "пожаловаться". Вроде бы iframe создается (судя по отладочным сообщениям в консольке F12), но остается невидимым. Возможно, это я с CSS намудрил, надо проверять.

Eddy_Em ☆☆☆☆☆ ()
Ответ на: комментарий от DeadEye

Отпишусь. Если у тебя то же самое, а stylish ты не правил, то проблема опять в самом ЛОРе. Ладно, авось, через пару-тройку недель руки дойдут, чтобы это починить.

КАК ЖЕ НЕ ХВАТАЕТ API!!!!!!!!!!!!!!!!!!!!!!!

Eddy_Em ☆☆☆☆☆ ()
Ответ на: комментарий от nightingale

Потому что в хроме, ЕМНИП, даже greasemonkey не надо

Каким боком здесь greasemonkey? Если есть аддон то для конечного пользователя нужен всего один шаг для получения новой версии: твой аплоад новой версии в стор. У пользователя оно обновится автоматически. А сейчас как минимум еще два лишних: ты итак его куда-то заливаешть, но нужно както уведомить о сем пользовавтелей + они еще должны его скачать и установить.

А еще я на макскома обиделся.

А каким боком это здесь? если ты пилишь расширение для себя то не выкладывай его. если для всех - то пожалуйста сделай еще один шаг, который уже был «одинажы» проделан. Если лень - то выложы на гитхаб. мож кто поможет.

Моя разработка не на гитхабе

и почему же?

Багрепорты принимаю

ну так может займешся тем багом, что на скрине?

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

Каким боком здесь greasemonkey?

В файрфоксе и новой опере нужен для подключения юзерскрипта.

А каким боком это здесь?

Интереса подубавилось делать чего-либо для лора.

и почему же?

Мне норм. Я им пользоваться не умею и даже не особо хочу учиться. Вряд ли он мне добавит удобства.

если ты пилишь расширение для себя то не выкладывай его

Да ну.

если для всех - то пожалуйста сделай еще один шаг

Я подумаю. Если этот магазин расширений позволяет добавить / сменить админа расширения, могу тебя сделать его админом, и поддерживай, если хочешь, это расширение. Я же и на лор-то раз в неделю пишу.

ну так может займешся тем багом, что на скрине?

Я подумаю. А там что-то именно не работает, что именно? На какое действие сабжевые ошибки выскакивают?

nightingale ()

Москвич, ты задрал со своими хоумпагами, которые все померли. Залей уже юзерскрипт на гитхаб, там он может пылиться хоть сто лет. И людям искать проще будет, а может кто и PR сделает полезный, если LOR опять поломают.

Virtuos86 ★★★★★ ()
Последнее исправление: Virtuos86 (всего исправлений: 1)