Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

jQuery を使用しての Qiita の機能変更要望

More than 1 year has passed since last update.

長いコードを Qiita に書いてしまった場合

上から下までドラッグして選択するのは手間なので
Firebug などブラウザのデバッグツールにて下記を実行することで
内容が textarea 要素に格納されます。
※ jQuery を使用しているのでごちゅういください

これで選択ミスで余計な記述をコピーすることがなくなる・・・かも?

非jQuery
const highLights = document.querySelectorAll('.highlight');
Object.keys(highLights)
  .map(key => highLights[key].contentEditable = true)
  ;
ハイライトされたコードをCtrl+Aで選択したい
jQuery('div.highlight pre').each(function() {
    // このスクリプトによる textarea が存在しなければ新規に、そんざいしたらそれを
    (jQuery(this).siblings('textarea').length ? jQuery(this).siblings('textarea') : jQuery('<textarea>'))
        // ハイライトの対象の記述を textarea に格納
        .val(jQuery(this).text())
        // 当 pre タグの前(親のすぐ下)に生成した textarea をセット
        .prependTo(
            jQuery(this).closest('div')
        )
    ;
});

Qiita:Team で目次がはみ出た

目次をスクロールさせる
// Qiita:Team の場合目次がスクロールしないので
jQuery('div.teamArticle_tocContents')
    .css({
        // max-height で高さ制限
        'max-height': (jQuery(window).height() - 50)
        // 縦軸にスクロールさせる
        , 'overflow-y': 'auto'
    })
;

テーブルが横スクロールしている場合に・・・

テーブルの横スクロールを解除
// table の高さがあり、横にスクロールしている場合スクロールしていることに気づかないことがあるので
jQuery('table').each(function(index){
    // checkbox を生成
    if (!jQuery(this).prev().is(':checkbox')) {
        /**
         * id の接頭語を生成
         */
        var checkbox_id_prefix = 'table_checkbox_';
        /**
         * id を生成
         */
        var checkbox_id = checkbox_id_prefix + index;
        /**
         * そんなにのびないであろうが・・・いちおう
         */
        var increment_limit = 10;
        /**
         * カウンター
         */
        var increment_counter = 0;
        // ちょっと危ないが・・・
        while(!!jQuery('#' + checkbox_id).length
            // 気持ち安全装置
            || increment_limit <= increment_counter
            ) {
            // 横に伸ばしちゃう
            checkbox_id = checkbox_id + '_';
            // カウントアップ
            increment_counter++;
        }
        // チェックボックスを生成
        jQuery('<input />"')
            // checkbox に
            .prop('type', 'checkbox')
            // 生成した id をセット
            .prop('id', checkbox_id)
            // セレクタでできるが・・・ jQuery を使ってしまっているのでイベントにて
            .on('change', function() {
                // label が挟まってしまったので・・・
                jQuery(this).nextAll('table:first')
                    .css({
                        // チェックがついている場合にスクロールを解除する
                        overflow: (jQuery(this).is(':checked') ? 'visible' : 'auto')
                    })
                    ;
            })
            // 画面に反映
            .insertBefore(this)
            ;
        // チェックボックに対応する label を生成
        jQuery('<label>スクロール解除</label>')
            .prop('for', checkbox_id)
            // チェックボックスの前で・・・
            .insertBefore(jQuery('#' + checkbox_id))
            ;
    }
});

ストック一覧のタグを絞り込みたい

タグの絞り込むのはあれなのでならべかえる
// 検索テキストボックス
jQuery('<input />')
    // placeholder をつけてみる
    .prop('placeholder', 'タグ絞り込み')
    .insertAfter(jQuery('.SidePanelItemMenu').prev('.SidePanelItem__header'))
    ;
// でかあああい!
jQuery('.SidePanelItemMenu__label img[src*="missing"]')
    .css({
       height: 18
       , width: 18
    })
;
// でりげ〜しょん
jQuery('div.SidePanelItem')
    .on('keyup', 'input', function() {
        /** 1 件もヒットしなかったらもっと表示する */
        var no_match = true;
        jQuery('.SidePanelItemMenu li .SidePanelItemMenu__label').each(function() {
            /** テキストで検索 */
            var regexp_search = new RegExp(
                jQuery('.SidePanelItemMenu').prev('input')
                    .val()
                    // 英数字以外全部エスケープしてしまう
                    .replace(/(\W)/g, '\\$1')
                    // 正規表現オプションの文字の大小むし
                    , 'i')
                    ;
            // 文字列にヒットしたら
            if (regexp_search.test(jQuery(this).text())) {
                // li をならべかえてしまう
                jQuery(this).closest('li')
                        .prependTo(jQuery(this).closest('ul'))
                        ;
                // あったぜ
                no_match = false;
            }
        });
        // なかったぜ
        if (no_match) {
            // もう一回走査するとかはしないがもっと表示はしておく
            jQuery('.SidePanelItemMenu__more').trigger('click');
            // もそっと、こう・・・
            jQuery('.SidePanelItemMenu__label img[src*="missing"]')
                .css({
                   height: 18
                   , width: 18
                })
            ;
        }
    })
    ;
// もっと表示するにょきにょき抑止
jQuery('ul.SidePanelItemMenu')
    .css({
        'overflow-y': 'auto'
        , 'max-height': jQuery('ul.SidePanelItemMenu').height()
    })
    ;
// もっと表示するが ul に巻き込まれているので退避
jQuery('.SidePanelItemMenu__more')
    .appendTo(jQuery('ul.SidePanelItemMenu').parent())
    ;

編集での差分へのジャンプ

差分へ一発で
// a タグのリスト格納
jQuery('<div id="diff_indexes"></div>')
    .css({
      height: '100%'
      , position: 'absolute'
      , right: 0
    })
    .appendTo(jQuery('div.editorMarkdown'))
    ;
jQuery('a.editorMarkdown_tab')
    // くりっくっくりっく
    .on('click', function() {
        jQuery('.editorMarkdown_diff')
            // 差分表示にリンク表示用の幅を調整
            .css({
                width: '95%'
            })
            // 差分要素を抽出
            .find('.add, .remove')
            .each(function(index){
                /** id のベース */
                var diff_id_prefix = 'editorMarkdown_diff';
                /** もうちょくせつせいせいでいいや */
                var diff_id = this.id || diff_id_prefix + '_' + index;
                jQuery(this).prop('id', diff_id);
                // なかったら
                if (!jQuery('[href="#' + diff_id + '"]').length) {
                    jQuery('<a>' + (jQuery(this).is('.add') ? '+' : '-') + '</a>')
                        .prop('href', '#' + diff_id)
                        .appendTo(jQuery('#diff_indexes'))
                        ;
                    jQuery('<br />')
                        .appendTo(jQuery('#diff_indexes'))
                        ;
                }
            })
            ;
    })
    ;
ysKuga
いつもの vagrant のおっさん
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away