Skip to content

Instantly share code, notes, and snippets.

@khsk
Last active September 26, 2017 01:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save khsk/94fed99c690f6dff7634 to your computer and use it in GitHub Desktop.
Save khsk/94fed99c690f6dff7634 to your computer and use it in GitHub Desktop.
Qiitaのコードの左側に選択不可能な行番号を追加するユーザースクリプト ref: http://qiita.com/khsk/items/89fc40321f1387829135
// ==UserScript==
// @name Qiita Code Number
// @namespace khsk
// @description コードに選択不可能な行番号を追加する
// @include http://qiita.com/*/items/*
// @include http://qiita.com/*/private/*
// @version 1
// @grant none
// ==/UserScript==
// 追加した行番号は選択不可にする
var style = document.createElement('style')
style.type = 'text/css'
style.innerHTML = 'span.khsk-codeNumber { user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none;}'
document.getElementsByTagName('head')[0].appendChild(style)
var codes = document.querySelectorAll('div.highlight pre')
Array.prototype.forEach.call(codes, function(code) {
var rows = code.innerText.split('\n')
// 最後に改行が入っているので、空要素が生まれるため削除
rows.pop()
rows = rows.map((row, index, array)=>{
// 桁数は3桁までとする
let number = (' ' + (index + 1)).slice(-3)
return '<span class="khsk-codeNumber">' + number + ' </span>' + row
})
code.innerHTML = rows.join('\n')
})
// ==UserScript==
// @name Qiita Code Number
// @namespace khsk
// @description コードに選択不可能な行番号を追加する
// @include http://qiita.com/*/items/*
// @include https://qiita.com/*/items/*
// @include http://qiita.com/*/private/*
// @include https://qiita.com/*/private/*
// @version 1
// @grant none
// ==/UserScript==
var style = document.createElement('style')
style.type = 'text/css'
style.innerHTML = `
pre.khsk-codeNumber {
float: left;
user-select: none; /* 追加した行番号は選択不可にする */
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
overflow-x: hidden !important; /* スクロールバーはあるのもないのも不自然 */
}
pre.khsk-codeNumber:after {
clear: both;
}
`
document.getElementsByTagName('head')[0].appendChild(style)
var codes = document.querySelectorAll('div.highlight pre')
Array.prototype.forEach.call(codes, function(code) {
var rows = code.innerText.split('\n')
// 最後に改行が入っていることにより、空要素が生まれるため削除
rows.pop()
var length = rows.length
var numbers = document.createElement('pre')
numbers.className = 'khsk-codeNumber'
for (let i = 0; i < length; ++i) {
// 桁数は3桁までとする
let number = (' ' + (i + 1)).slice(-3)
// Textでは改行が反映されない
numbers.innerHTML += number + '\n'
}
code.parentElement.insertBefore(numbers,code)
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment