1+ // ==UserScript==
2+ // @name Highlight Every Code
3+ // @name :zh-CN 代码片段高亮
4+ // @name :zh-TW 代碼片斷高亮
5+ // @namespace hoothin
6+ // @version 0.80
7+ // @description Add a icon to popup a window that allows syntax highlighting and beautify and word count of source code snippets on current page
8+ // @description :zh-CN 选择代码片段后点击图标弹出新窗口显示高亮美化与格式化后的代码与字数统计
9+ // @description :zh-TW 選擇代碼片段后點擊圖標彈出新窗口顯示高亮美化與格式化后的代碼與字數統計
10+ // @author Hoothin
11+ // @grant GM_openInTab
12+ // @compatible chrome
13+ // @compatible firefox
14+ // @contributionURL https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=rixixi@sina.com&item_name=Greasy+Fork+donation
15+ // @contributionAmount 1
16+ // @include *
17+ // ==/UserScript==
18+
19+ ( function ( ) {
20+ 'use strict' ;
21+ var isChrome = unsafeWindow . chrome ;
22+ var codeIcon = document . createElement ( "img" ) ;
23+ var codes , scrollX , scrollY ;
24+ codeIcon . style . cssText = "position:fixed;z-index:99999;display:none;cursor: pointer;" ;
25+ codeIcon . title = "Show this code snippet" ;
26+ codeIcon . src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYAgMAAACD0OXYAAAACVBMVEX7+/swMDBTU1MLxgsCAAAAJElEQVQI12MIBYEAGLUKBBbAqAUMQICgAoAqoBQ95JaCnASjAAgXMdk3d5HTAAAAAElFTkSuQmCC" ;
27+ codeIcon . onmousedown = function ( ) {
28+ let html = '<title>Code Snippet</title>' +
29+ '<link rel="stylesheet" href="http' + ( isChrome ?'s' :'' ) + '://cdn.rawgit.com/google/code-prettify/master/styles/sons-of-obsidian.css"/>' +
30+ '<script>var code,codeStr;window.onload=function(){code=document.querySelector("#code");codeStr=code.innerHTML.replace(/&/g, "&").replace(/&(nbsp;|amp;|#39;|quot;)/g, "&$1");prettyPrint();}</script>' +
31+ '<script src="http' + ( isChrome ?'s' :'' ) + '://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.js?skin=sons-of-obsidian"></script>' +
32+ '<script src="http' + ( isChrome ?'s' :'' ) + '://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.6.4/beautify.min.js"></script>' +
33+ '<script src="http' + ( isChrome ?'s' :'' ) + '://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.6.4/beautify-html.min.js"></script>' +
34+ '<script src="http' + ( isChrome ?'s' :'' ) + '://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.6.4/beautify-css.min.js"></script>' +
35+ 'Code formatting: <a href="#" onclick="code.innerHTML=js_beautify(codeStr);code.className=\'prettyprint linenums\';prettyPrint();return false;">Javaspcript</a> ' +
36+ '<a href="#" onclick="code.innerHTML=html_beautify(codeStr);code.className=\'prettyprint linenums\';prettyPrint();return false;">Html</a> ' +
37+ '<a href="#" onclick="code.innerHTML=css_beautify(codeStr);code.className=\'prettyprint linenums\';prettyPrint();return false;">Css</a> ' +
38+ '<a href="#" onclick="code.innerHTML=codeStr;code.className=\'prettyprint linenums\';prettyPrint();return false;">Raw</a> <b style="color:red">(' + codes . length + ' words)</b>' +
39+ '<pre id="code" class="prettyprint linenums" style="word-wrap: break-word; white-space: pre-wrap;border: 1px solid rgb(136, 136, 204);border-radius: 8px;">' + codes + "</pre>" ;
40+ if ( isChrome ) {
41+ let c = window . open ( "" , "_blank" , "width=750, height=400, location=0, resizable=1, menubar=0, scrollbars=0" ) ;
42+ c . document . write ( html ) ;
43+ c . document . close ( ) ;
44+ } else {
45+ GM_openInTab ( 'data:text/html;charset=utf-8,' + encodeURIComponent ( html ) ) ;
46+ }
47+ } ;
48+ document . body . appendChild ( codeIcon ) ;
49+ document . addEventListener ( 'mousedown' , function ( o ) {
50+ codeIcon . style . display = "none" ;
51+ } ) ;
52+ document . addEventListener ( 'mouseup' , function ( o ) {
53+ if ( o . button === 0 && ( o . ctrlKey || o . altKey || o . metaKey || o . shiftKey ) ) {
54+ setTimeout ( function ( ) {
55+ codes = document . getSelection ( ) . toString ( ) . replace ( / & / g, "&" ) . replace ( / \< / g, "<" ) . replace ( / \> / g, ">" ) ;
56+ if ( codes ) {
57+ codeIcon . style . display = "block" ;
58+ let pos = getMousePos ( o ) ;
59+ let left , top ;
60+ if ( isChrome ) {
61+ top = pos . y > document . documentElement . clientHeight - 50 ?( pos . y - 25 ) :( pos . y + 15 ) ;
62+ left = pos . x > document . documentElement . clientWidth - 50 ?( pos . x - 25 ) :( pos . x + 15 ) ;
63+ } else {
64+ top = pos . y - 25 ;
65+ left = pos . x + 15 ;
66+ }
67+ codeIcon . style . top = top + "px" ;
68+ codeIcon . style . left = left + "px" ;
69+ }
70+ } , 1 ) ;
71+ }
72+ } , false ) ;
73+
74+ function getMousePos ( event ) {
75+ var e = event || window . event ;
76+ scrollX = document . documentElement . scrollLeft || document . body . scrollLeft ;
77+ scrollY = document . documentElement . scrollTop || document . body . scrollTop ;
78+ var x = ( e . pageX || e . clientX ) - scrollX ;
79+ var y = ( e . pageY || e . clientY ) - scrollY ;
80+ return { 'x' : x , 'y' : y } ;
81+ }
82+ } ) ( ) ;
0 commit comments