" ).attr( "style", `width: ${item.naturalWidth}px; height:${item.naturalHeight}px; background: url(${item.src})` ) 352 | .replaceAll( $(item) ); 353 | }); 354 | $target.find( tags.join( "," ) ).map( ( index, item ) => { 355 | $( "

" ).html( $(item).html() ).replaceAll( $(item) ); 356 | }); 357 | $target.find( tags.join( "," ) ).remove(); 358 | str = $target.html(); 359 | $target.remove(); 360 | 361 | try { 362 | str = `

本文由简悦 SimpRead 转码，原文地址 ${url}

` + str; 363 | str = str.replace( /(id|class|onclick|ondblclick|accesskey|data|dynsrc|tabindex)="[\w- ]+"/g, "" ) 364 | //.replace( / style=[ \w="-:\/\/:#;]+/ig, "" ) // style="xxxx" 365 | .replace( /label=[\u4e00-\u9fa5 \w="-:\/\/:#;]+"/ig, "" ) // label="xxxx" 366 | .replace( / finallycleanhtml=[\u4e00-\u9fa5 \w="-:\/\/:#;]+"/ig, "" ) // finallycleanhtml="xxxx" 367 | .replace( / 368 | .replace( /data[-\w]*=[ \w=\-.:\/\/?!;+"]+"[ ]?/ig, "" ) // data="xxx" || data-xxx="xxx" 369 | .replace( /href="javascript:[\w()"]+/ig, "" ) // href="javascript:xxx" 370 | .replace( /sr-blockquote/ig, "blockquote" ) // sr-blockquote to blockquote 371 | .replace( //ig, "" ) //

372 | .replace( //ig, "" ) //

373 | .replace( /<\/figcaption>/ig, "" ) //

374 | .replace( /<\/br>/ig, "" ) //
375 | .replace( /
/ig, "

" ) 376 | .replace( /<\/p>/ig, "

" ); 377 | 378 | return str; 379 | 380 | } catch( error ) { 381 | return `

转换失败，原文地址 ${url}

` 382 | } 383 | } 384 | 385 | /** 386 | * Clear Html to MD, erorr ( from simpread util.HTML2ENML ) 387 | * 388 | * @param {string} convert string 389 | */ 390 | function clearMD( str ) { 391 | str = `

本文由简悦 SimpRead 转码，原文地址 ${window.location.href}

\r\n\r\n ${str}`; 392 | str = str.replace( /<\/?(ins|font|span|div|canvas|noscript|fig\w+)[ -\w*= \w=\-.:&\/\/?!;,%+()#'"{}\u4e00-\u9fa5]*>/ig, "" ) 393 | .replace( /sr-blockquote/ig, "blockquote" ) 394 | .replace( /<\/?style[ -\w*= \w=\-.:&\/\/?!;,+()#"\S]*>/ig, "" ) 395 | .replace( /(name|lable)=[\u4e00-\u9fa5 \w="-:\/\/:#;]+"/ig, "" ) 396 | return str; 397 | } -------------------------------------------------------------------------------- /src/bookmarklet/style.js: -------------------------------------------------------------------------------- 1 | var notify_style = "notify-gp {\n font: 300 14px -apple-system, PingFang SC, Microsoft Yahei, Lantinghei SC, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;\n text-rendering: optimizelegibility;\n -webkit-text-size-adjust: 100%;\n -webkit-font-smoothing: antialiased;\n\n display: -webkit-flex;\n flex-flow: column nowrap;\n align-items: flex-end;\n\n position: fixed;\n\n top: 0;\n right: 0;\n\n margin: 0 15px 0 0;\n padding: 0;\n\n text-transform: none;\n\n pointer-events: none;\n}\n\nnotify-gp notify {\n display: -webkit-flex;\n align-items: center;\n\n margin: 0;\n margin-top: 15px;\n padding: 14px 24px;\n\n min-width: 288px;\n max-width: 568px;\n\n height: 48px;\n max-height: 48px;\n\n color: rgba(255, 255, 255, .7);\n background-color: rgba(50, 50, 50, 1);\n\n box-sizing: border-box;\n border-radius: 4px;\n pointer-events: auto;\n user-select: none;\n\n opacity: 0;\n transform: scaleY(0);\n transform-origin: left top 0px;\n transition: transform 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms;\n\n box-shadow: 0 1px 3px 0 rgba(60,64,67,0.302), 0 4px 8px 3px rgba(60,64,67,0.149);\n}\n\nnotify-gp notify-title {\n font-size: 13px;\n font-weight: bold;\n}\n\nnotify-gp notify-content {\n display: block;\n\n font-size: 14px;\n text-align: left;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\nnotify-gp notify-content a,\nnotify-gp notify-content a:link,\nnotify-gp notify-content a:visited,\nnotify-gp notify-content a:active {\n margin: inherit;\n padding-bottom: 5px;\n\n color: #fff;\n font-size: inherit;\n\n text-decoration: none;\n\n transition: color .5s;\n}\n\nnotify-gp notify-content a:hover {\n margin: initial;\n padding: initial;\n\n color: inherit;\n font-size: inherit;\n\n text-decoration: none;\n}\n\nnotify-gp notify-i {\n display: none;\n\n margin: 0 10px 0 0;\n\n width: 24px;\n height: 24px;\n\n background-position: center;\n background-repeat: no-repeat;\n}\n\nnotify-gp notify-action,\nnotify-gp notify-cancel {\n display: none;\n\n margin: 0 0 0 24px;\n\n max-width: 80px;\n min-width: 56px;\n\n color: #8ab4f8;\n\n font-weight: 500;\n font-size: inherit;\n text-transform: uppercase;\n text-align: right;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n\n cursor: pointer;\n}\n\nnotify-gp notify-cancel {\n margin: 0;\n}\n\nnotify-gp notify-a {\n display: block;\n position: absolute;\n\n top: 5px;\n right: 5px;\n\n cursor: pointer;\n}\n\nnotify-gp notify-a notify-span {\n display: block;\n width: 16px;\n height: 16px;\n background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABpFBMVEUAAADl5eXj4+NSVFRTVVVaXFxLTU1hY2NdX18pLCwhJCSdnp5sbm6HiYmjpKSDhYX///+rrKytrq6XmJgzNTUoKyt3eXlydHRlZ2dbXV1ucHB4enrv7++KjIyIiort7e1oamosLy8aHR0VGBgUFxcbHh4rLi5oamprbGwgIyMKDQ0KDQ0iJSVjZWWfoaEkJiYICwsLDg4KDQ0MDw8iJSWMjo41ODgMDw8JDAw2OTkvMTELDg4LDg4xMzM1NzcJDAwLDg40NjYeISEHCgoeISFkZmYtLy8yNDRvcXEWGRkHCgoaHR3///8RFBQHCgohJCShoqLIyMgaHR0HCgoZGxv4+PgRFBQLDg4xMzOWl5eam5ssLi4bHh7///8fIiIJDAwwMzNzdHQXGhoeISFlZmYsLi4KDQ0gIiI6PDwOEREuMDAXGhoHCgodHx8pLCwNEBA1ODj///8nKSkICwsICwsJDAwnKSnZ2dl9fn4pKysNDw8OEREpLCxyc3ORkpIzNTUjJSUVGBgUFxcgIyM5PDyanJwEBwcDBwcDBgYFCAgGCQn///+5RDDmAAAAhnRSTlMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQUFAQU+i7S0jkAGEYrw8Y8SBIn++Pr3jQQ67fx8dvX6iWr27z+B/YsOcoMPdPiEAaL7iAgEcfWsA6D7iAkGcawDef2LDnOFD3T4gTLnfHb6iWrqNQJ4+ff7fQILd+ToewsCLHWZmXUwAyFsKwcAAAABYktHRBCVsg0sAAAAzElEQVQY02NgwAoYZWTl5JngXGYFRSVlFVU1dRYIn1VDU6sNCLR1dNlAfHY9fQNDw/YOI2MDE1MOoACnmbmFpZW1ja2dvYMjFwMDN4NTp7OLq5u7h6dXpzcDDwOvj29bm59/QGBQcFtbSCgfA79AWFtHeERkVLR1W1tMrCCDEENcZ3xCYlJySmpaZzqDMAODSEamRVZ2cE5unn1+gSjQFrHCIqNir7a2nJLSsnJxkEMkKiqrutrauqpraiUhTpWqq29obGpuaZVmIAYAAO06McffKEk8AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDEzLTA0LTAzVDE3OjE4OjAzKzA4OjAwRdgB9wAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxMS0wNS0xOFQyMDowMTowMCswODowMB0r3XkAAABNdEVYdHNvZnR3YXJlAEltYWdlTWFnaWNrIDYuOC44LTcgUTE2IHg4Nl82NCAyMDE0LTAyLTI4IGh0dHA6Ly93d3cuaW1hZ2VtYWdpY2sub3JnWaRffwAAABh0RVh0VGh1bWI6OkRvY3VtZW50OjpQYWdlcwAxp/+7LwAAABh0RVh0VGh1bWI6OkltYWdlOjpIZWlnaHQAMTI4Q3xBgAAAABd0RVh0VGh1bWI6OkltYWdlOjpXaWR0aAAxMjjQjRHdAAAAGXRFWHRUaHVtYjo6TWltZXR5cGUAaW1hZ2UvcG5nP7JWTgAAABd0RVh0VGh1bWI6Ok1UaW1lADEzMDU3MjAwNjArP9HVAAAAE3RFWHRUaHVtYjo6U2l6ZQAxLjAzS0JCZtQvXwAAAFx0RVh0VGh1bWI6OlVSSQBmaWxlOi8vL2hvbWUvZnRwLzE1MjAvZWFzeWljb24uY24vZWFzeWljb24uY24vY2RuLWltZy5lYXN5aWNvbi5jbi9wbmcvMTcvMTc4Ni5wbmcRsze7AAAAAElFTkSuQmCC);\n}\n\nnotify-gp notify-i.holdon {\n display: block;\n margin: 0 0 0 24px;\n\n width: 20px;\n height: 20px;\n\n background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAQAAAAngNWGAAAATUlEQVR4AWMYSuB/4P+V/1lRRFiBIoEYCoGC//+vAypFKFsHFFkJV4AsAVGKzsOjFFUZHqUElCGUwpRRrpCw1YQ9Qzh4SA5wwlE4hAAAiFGQefYhNJkAAAAASUVORK5CYII=);\n cursor: pointer;\n}\n\nnotify-gp .notify-show {\n opacity: 1;\n transform: scaleY(1);\n}\n\nnotify-gp .notify-hide {\n opacity: 0;\n transform: scaleY(0);\n}\n\nnotify-gp .notify-success {\n color: rgba(118, 255, 3, .8);\n}\n\nnotify-gp .notify-warning {\n color: rgba(255, 238, 88, 1);\n}\n\nnotify-gp .notify-error {\n color: rgba(239, 83, 80, 1);\n}\n\nnotify-gp .notify-modal {\n flex-flow: column nowrap;\n align-items: flex-start;\n\n height: auto;\n max-height: 200px;\n\n box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);\n}\n\nnotify-gp .notify-modal .notify-modal-content {\n margin-top: 5px;\n font-size: 13px;\n white-space: normal;\n}\n\nnotify-gp .notify-modal .notify-modal-content a {\n margin: 0;\n padding: 0;\n\n color: inherit;\n\n font-size: inherit;\n text-decoration: underline;\n \n cursor: pointer;\n}\n\nnotify-gp .notify-modal .notify-modal-content a:hover,\nnotify-gp .notify-modal .notify-modal-content a:active,\nnotify-gp .notify-modal .notify-modal-content a:visited,\nnotify-gp .notify-modal .notify-modal-content a:focus {\n color: inherit;\n}\n\nnotify-gp .notify-snackbar {\n position: fixed;\n bottom: 0;\n left: 50%;\n margin-bottom: 5px;\n transform-origin: left bottom 0px;\n}\n\n.notify-position-lt-corner {\n align-items: flex-start;\n\n margin: 0 0 0 15px;\n\n left: 0;\n right: initial;\n}\n\n.notify-position-lb-corner {\n flex-flow: column-reverse wrap-reverse;\n\n margin: 0 0 15px 15px;\n\n right: initial;\n top: initial;\n\n left: 0;\n bottom: 0;\n}\n\n.notify-position-rb-corner {\n flex-flow: column-reverse wrap-reverse;\n align-items: flex-start;\n\n margin: 0 15px 15px 0;\n\n top: initial;\n left: initial;\n\n bottom: 0;\n right: 0;\n}\n"; 2 | 3 | var main_style = "/**\n* Golbal style\n*/\n\n.simpread-font {\n font: 300 16px/1.8 -apple-system, PingFang SC, Microsoft Yahei, Lantinghei SC, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;\n\n color:#333;\n\n text-rendering: optimizelegibility;\n -webkit-text-size-adjust: 100%;\n -webkit-font-smoothing: antialiased;\n}\n\n.simpread-hidden {\n display: none;\n}\n\n/**\n* Focus: Background( root ) style\n*/\n.simpread-focus-root {\n display: block;\n position: fixed;\n\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n background-color: rgba( 235, 235, 235, 0.9 );\n z-index: 2147483645;\n\n opacity: 0;\n transition : opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms;\n}\n\n.simpread-focus-highlight {\n position: relative;\n\n box-shadow: 0 0 0 20px #fff;\n background-color: #fff;\n\n overflow: visible;\n z-index: 2147483646;\n}\n\n.sr-controlbar-bg sr-rd-crlbar {\n z-index: 2147483647;\n}\n\n.sr-controlbar-bg sr-rd-crlbar fab {\n z-index: 2147483647;\n}\n\n/**\n* Read: background( root ) style\n*/\n.simpread-read-root {\n display: -webkit-flex;\n justify-content:center;\n align-items:center;\n\n position: relative;\n margin: 0;\n\n top: -1000px;\n left: 0;\n\n width: 100%;\n\n z-index: 2147483646;\n\n overflow-x: hidden;\n opacity: 0;\n transition: all 1000ms cubic-bezier(0.23, 1, 0.32, 1) 100ms;\n}\n\n.simpread-read-root-show {\n top: 0;\n}\n\n.simpread-read-root-hide {\n top: 1000px;\n}\n\n/**\n* Read: Read mode style\n*/\nsr-read {\n display: -webkit-flex;\n flex-flow:column nowrap;\n\n margin: 20px 20%;\n\n min-width: 400px;\n min-height: 400px;\n\n text-align: center;\n}\n\nread-process {\n position: fixed;\n\n top: 0;\n left: 0;\n\n height: 3px;\n width: 100%;\n\n background-color: #64B5F6;\n transition: width 2s;\n}\n\nsr-rd-content-error {\n display: block;\n position: relative;\n\n margin: 0px;\n margin-bottom: 30px;\n padding: 25px;\n\n background-color: rgba(0,0,0,0.05);\n}\n\nsr-rd-footer {\n display: block;\n\n margin-top: 10px;\n padding: 40px 0 30px;\n\n text-align: center;\n\n border-top: 1px solid #E0E0E0;\n clear: both;\n}\n\nsr-rd-footer-text {\n display: block;\n\n width: 100px;\n\n margin: 20px auto;\n padding: 10px 20px;\n\n color: #fff;\n background: #424242;\n\n border-radius: 5px;\n\n font-size: 20px;\n text-align: center;\n\n box-sizing: border-box;\n}\n\nsr-rd-footer-copywrite {\n display: block;\n\n padding: 0;\n margin-bottom: 20px;\n\n min-height: 24px;\n\n color: #787878;\n\n font-size: 17px;\n font-weight: 700;\n\n box-sizing: border-box;\n}\n\nsr-rd-footer-copywrite a,\nsr-rd-footer-copywrite a:link {\n margin: 0;\n padding: 0;\n\n color: #787878;\n background-color: transparent;\n\n font-size: 17px;\n line-height: initial;\n text-decoration: none;\n vertical-align: initial;\n\n box-sizing: border-box;\n}\n\nsr-rd-footer-copywrite a:hover,\nsr-rd-footer-copywrite a:focus,\nsr-rd-footer a:active {\n color: #787878;\n text-decoration: underline;\n}\n\n/**\n* Controlbar: focus mode and read mode\n*/\nsr-rd-crlbar.controlbar {\n position: fixed;\n\n right: 0;\n bottom: 0;\n\n width: 100px;\n height: 100%;\n\n opacity: 0;\n transition: opacity .5s ease;\n}\n\nsr-rd-crlbar.controlbar:hover {\n opacity: 1;\n}\n\n/**\n* Golbal\n*/\n@media all and ( max-height: 620px ) {\n\n fab {\n zoom: .8;\n }\n\n}\n\n@media all and ( max-height: 783px ) {\n\n dialog-gp dialog-content {\n max-height: 580px;\n }\n\n dialog-gp dialog-footer {\n border-top: 1px solid rgba(224, 224, 224, 1);\n }\n\n}\n\n/**\n* Highlight\n*/\n.simpread-highlight-selector {\n background-color: #fafafa;\n outline: 3px dashed #1976d2;\n opacity: .8;\n cursor: pointer;\n transition: opacity .5s ease;\n}\n\n/**\n* TOC\n*/\ntoc-bg {\n position: fixed;\n right: 0;\n top: 0;\n width: 300px;\n height: 500px;\n\n font-size: initial;\n}\n\ntoc-bg:hover {\n z-index: 3;\n}\n\n.toc-bg-hidden {\n opacity: 0;\n transition: opacity .5s ease;\n}\n\n.toc-bg-hidden:hover {\n opacity: 1;\n z-index: 3;\n}\n\ntoc * {\n all: unset;\n}\n\ntoc {\n position: fixed;\n right: 0;\n top: 100px;\n\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n\n padding: 10px;\n\n max-width: 200px;\n max-height: 500px;\n\n overflow-x: hidden;\n cursor: pointer;\n border: 1px solid rgba(158, 158, 158, 0.22);\n transition: width 1.5s;\n}\n\ntoc outline {\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n\n margin: 2px 0;\n min-height: 21px;\n\n line-height: 21px;\n text-align: left;\n}\n\ntoc outline a,\ntoc outline a:active,\ntoc outline a:visited,\ntoc outline a:focus\n{\n color: inherit;\n text-decoration: none!important;\n}\n\ntoc outline a:hover {\n font-weight: bold!important;\n text-decoration: underline!important;\n}\n\ntoc outline a.toc-outline-theme-dark,\ntoc outline a.toc-outline-theme-night {\n color: #fff!important;\n}\n\n.toc-level-h2 {\n padding-left: 10px;\n}\n.toc-level-h3 {\n padding-left: 25px;\n}\n.toc-level-h4 {\n padding-left: 35px;\n}\n\n.toc-outline-active {\n background-color: rgb(244, 67, 54);\n}\n\ntoc outline active {\n position: absolute;\n\n left: 0;\n top: 0;\n bottom: 0;\n\n padding: 0 0 0 3px;\n}\n\n/**\n* Keyboard\n*/\n\nsr-kbd {\n background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(255, 247, 133)), to(rgb(255, 197, 66)));\n border-width: 1px;\n border-style: solid;\n border-color: rgb(227, 190, 35);\n border-image: initial;\n\n position: absolute;\n left: 0;\n padding: 1px 3px 0px;\n\n font-size: 11px!important;\n font-weight: bold;\n box-shadow: rgba(0, 0, 0, 0.3) 0px 3px 7px 0px;\n overflow: hidden;\n border-radius: 3px;\n}\n\n.sr-kbd-a {\n position: relative;\n}\n\nkbd-mapping {\n position: fixed;\n left: 5px;\n bottom: 5px;\n\n display: flex;\n flex-direction: column;\n\n width: 500px;\n height: 500px;\n\n background-color: #fff;\n\n border: 1px solid rgba(158, 158, 158, .22);\n box-shadow: 0 2px 5px rgba(0,0,0,.26);\n border-radius: 3px;\n}\n\nkbd-maps {\n display: flex;\n flex-flow: column wrap; \n}\n\nkbd-mapping kbd-map-title {\n margin: 5px 0;\n \n font-size: 14px;\n font-weight: bold;\n}\n\nkbd-maps-group {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n}\n\nkbd-maps-title {\n margin: 5px 0;\n padding-left: 53px;\n\n font-size: 12px;\n font-weight: bold;\n}\n\nkbd-map kbd {\n display: inline-block;\n padding: 3px 5px;\n font-size: 11px;\n line-height: 10px;\n color: #444d56;\n vertical-align: middle;\n background-color: #fafbfc;\n border: solid 1px #c6cbd1;\n border-bottom-color: #959da5;\n border-radius: 3px;\n box-shadow: inset 0 -1px 0 #959da5;\n}\n\nkbd-map kbd-name {\n display: inline-block;\n text-align: right;\n\n width: 50px;\n}\n\nkbd-map kbd-desc {\n padding-left: 3px;\n}"; 4 | var local_style = "sr-rd-crlbar{z-index:2100000000;transition:opacity 450ms 0ms}sr-rd-crlbar fab{display:block;background-position:center;background-repeat:no-repeat;border-radius:50%;cursor:pointer;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2)}sr-rd-crlbar fab.crlbar-close{position:fixed;bottom:45px;right:12px;width:56px;height:56px;line-height:56px;background-color:rgba(244,67,54,1);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAAdklEQVQ4y+WTuQ3AIBAEaQKK8NN/BEUArmccgGyj43MMIZo5TqtFqbUPJxYtbg2OvS44IJQKhguwdUETSiXjXr77KhGICRjihWKm8Dw3KXP4Z5VZ/Lfw7B5kyD1cy5C7uAx5iJcht6vhRTUi4OrC0Szftvi/vAFNdbZ2Dp661QAAAABJRU5ErkJggg==);transform:rotate(0deg);transition:all 450ms 0ms}sr-rd-crlbar fab.crlbar-close:hover{transform:rotate(45deg);transition:all 450ms 0ms}sr-rd-crlbar fab.anchor{position:fixed;right:20px;bottom:100px;background-color:rgba(245,82,70,.8);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAANElEQVQ4T+3GMQ0AIAwAMAwSEvwLACai3HtmAHq1te8xpnCM6okAu3rigFU9MWxLr/695AI0E1VgH26hCQAAAABJRU5ErkJggg==)}sr-rd-crlbar fab.anchor,sr-rd-crlbar fab.pocket,sr-rd-crlbar fab.evernote,sr-rd-crlbar fab.yinxiang,sr-rd-crlbar fab.dropbox,sr-rd-crlbar fab.markdown,sr-rd-crlbar fab.drafts,sr-rd-crlbar fab.bear{margin-bottom:10px;width:40px;height:40px;line-height:40px;transition:opacity .5s ease}sr-rd-crlbar fab.pocket,sr-rd-crlbar fab.evernote,sr-rd-crlbar fab.yinxiang,sr-rd-crlbar fab.dropbox{background-color:#9e9e9e}sr-crlbar-group{position:fixed;display:flex;flex-direction:column;right:20px;bottom:150px;opacity:0;transition:opacity .5s ease}sr-rd-crlbar fab.pocket{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABKElEQVQ4T72UYVEDMRCF36eAOgAUgAOKhCqAOsAB4IAqoHVQB4ACDgfFQVGwzLtJmNxNelw7hfy5mcvm2923L0FHXhyZpxYYERNJN5L83XdtgFU+lIHLBNwXluPngBk/Fb5KujqUJukRePhX4Iekix0Vf0naSjot9gcrXAB3EXEr6bkHNWwKNBHRFEkHgWtglqZfQkuY3fAu6Swl/FXDJTAvoE9FZYa9SLocarlmmxI6AbbJr32YuTNgXU65ppf3O9BKZbnIc2BTAt2Gf5xUJuvqF2lAZZs59A2Ydm5K0srGvD/A3NeAL0a7Oo9Dzwpj2K3FysA+0K072y5Tl2dXgLXvrOrzFRFu35lrmn56L091FDAHRYTF9iDy0BrfkiEt/uaBHaP+2JhvPYuFFTslm1gAAAAASUVORK5CYII=)}sr-rd-crlbar fab.evernote{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAABZUlEQVQ4T61UgVECQQzcrUA7QDuQCtQK1AqEDuhArcAS1ArUCoQKwA6wArCCdfYmB/z//cOrmQGeT7K3yW1CFEzSMYARgDsAfl4DmAIYk/Rzq7HukWSgJYCPQtYbgEW89wHfJPP/9LoCGGBPAC5bAEvMzNjMfdgWUNI1gElk+HfeVVrNtyA5rAO61EEEXgDw52AjmapNX5KcXOrZrwHNzr37i52SXP4bQ18kyWkGtNZWPeh9ArgH8AzgKPK2gNFHX3927sPOejwDYHXYGoAOutqH1OFvAFp7jx0JXzuyKoU1AE9irEplG8yjdnsww+ijQS0h6/J8J/mF5ChG0zH2u3+bwyvCbjtVkpOsAI/WWpLBBiRnMaqvkesl4bjqcui6EEmWSCo5s5GkyJmRTKPaWF8dbJ1s/U0s4GhRBnwgaV32BjTQTRxqiZm1bZj3Yh+GbcLflNuXoXtkrfqi8pp7jxZ4wyf7AYBGjBWE70biAAAAAElFTkSuQmCC)}sr-rd-crlbar fab.yinxiang{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUBAMAAAB/pwA+AAAAMFBMVEUAAAD///////////////////////////////////////////////////////////87TQQwAAAAEHRSTlMAgMBAMCDQEGCgkFCwcODwVvi/VAAAANJJREFUCNclir9LAlEAgL97711dHsE9DoqcrltaGszLmoSjH1vQq38hhKTlUXNgbW7i5uYt7g46q4g4O7iLo/g/eOLy8fHxgZsC/h5OXIy7vGYhCISM/E2yNgf9/RhWA4Quy4hxvdg4VLWYfluE95+/f71POKq/340K8+tyimOEwuu83K6BAig7xsIzT7gGgMv7beW01Y5bOMvqWYXAEuH5byf20ZCrryeZbQY3Oq96dZHKIKSBInJL8jwEHrKV7spZyAC4Oq45NZ18AX1dUvYnMTu0Nyqkt1vV7AAAAABJRU5ErkJggg==)}sr-rd-crlbar fab.dropbox{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAB2klEQVRIS7WV8TlDUQzFTyZgA0zABq0JMAEm0E6gJlATsAEmwAZMgA2YIL7f+3L73d7mvb5/5L/2JjlJzkme6Z/N/jm/BgHc/VTSq5n9ZIW4+66kiZk99xWaArj7vqR7SVNJ75KOW5BI/iLpiCIkXZrZVwu0AeDuM0nXkqiuGB0AApjcnaQkb30WZnZXg6wAIoiqCc4MkHk83DbJa3+6mZdiOoAYyecWwn8lLcOHDrfZASOrO4DQB0k7SeSbpIsy4ygI30niSyH4PvG2xkGMicDDCPyWNCvObbJQGV3txdtHJO+42gCIcUEcICgC0lKJlgShpoUklEfla/6ZinB8DADI2pBe3UmMC9KJO2v92xGhe5IX+VHN0sxuMkbdncqvGn9AUNL6iEL/VJIZM6WbLtDdKQTfPknDW7cPRaZlGzMF1YBwQ8z5CElP2YVapoXck57gTn7x1idnnrlLK7IzkrN9QH7Mm03HLuN3kTP/rem/V6aVVAuBVMTsW344G3BBx8w7lXTfNS2BJKcjlJIZS4YPIM+1esZ0wKpnp6AFQsqM8DRbyjEfnPoUtMkHT8lKpkOSi1NQvhG1K8vHEg6ektHf5OqCArK6rFv2YfibvC14zPvoDsYky3z+ACVvthn/6avEAAAAAElFTkSuQmCC)}sr-rd-crlbar fab.markdown{opacity:0;background-color:rgba(245,82,70,1);background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABPUlEQVRYR+1VwVHDQAzcrYB0EqgA0kE6gHRECUklQAdJB9ABVCBmPbob2XfK5OPJ5+7lOcnSerVaE3c+vHN/DACDgcHAYKAyYGYbAFs3ph+S35lJmdkLAFOc5Ncyz8weATyE+wvJ3169CEBFPzxJyTuS507xI4DXck+yGaOZfQJ4Du+qlu6akwFQYgPCzGbNnYHVAMxA9JqvCeAS9CAmRN8+8PdXZrzWCHYA3uKsQ/ODx6YZrwZAounQfiB5jCIrALIRdXT3FMWdibCqNhSemqtgD4DfNyJdAKg16haVB9/tsoaztVEsrlEGwEFodYufxP5N82mEtwDoeEHd86UG3NAUjyBOJKWpm30gNY5rIwgfI1eVk8oN0+ZLBvSSLFTnnFmnA1Ce8rUFXYdzO34nKYdNz/gbDgYGA4OBwcA/0We1IQQPM9YAAAAASUVORK5CYII=)}sr-rd-crlbar fab.bear{opacity:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAA3NCSVQICAjb4U/gAAAACXBIWXMAAAsSAAALEgHS3X78AAAAF3RFWHRDcmVhdGlvbiBUaW1lADIwMTguNS4xOdo4t2EAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAHT0lEQVRYhaVYTYwcRxX+XlXPTO/Mjte7tmWvDYrBFkrsENs42ITIIKFsiGOBFVBQJAsQAhnzo5zhjIQ4QCzlCAiB4MLvFUKQkgOKckiIIDLJKZZQIN71ar07szM7O931fRyqu2d2vP5J8tRqdVfXvO+9771X9WrsH8ePmZk5Z96cM/POOWdm5g0Gg5kZAINDKXFkXCSNnsE4IgiCgiSRVCApBYmU5CplgEZKi1uFOkIqJjgbXVtNiZPNzDCmqppQjidmZuZgin6O8Mqpla8GwDnZpNfReBNACALMYNHv0nIIMjPnEKSInUQLzCwiwhCvysIRoWaybXiuRsy2cG7x3UodZpDMIIPBqsipgK6MxNjT6H30aeIhmjVB+JgeK2NQ2OEKr8wgTPqyFVQ2OTJh2LZ8jJmyRZLxLzJzBeU2Gh1/HoOMcyK38W4xuKomq5hjMphi3og3AUfFGnt1ToOhNjdF+kYDzSaciyDb+nXz+FjINTZFW4EFSRqLXuh06oc+suurXwura93n/9L/52t+asq8Bynn5By8tyQZade43WMexC/S+Ji/ND8PM3PmzMyVHBqM5Hp3z3eenjn3+amj98987jxgG6+9CtHqdRiQ5+yth24HkDVSSIBsC1zptOJdZWAARY8FSHDxV5JkcMqHrtWq7ZsvebfdFy+1Tp3mRt81WwC1MchXbmxceb339xfzpSU/s9N0M7elxipCLL4kJckmwVQFSoJhOFQI4+ZPHT8x4dCOx89lF7689Ozl3vPP+dm5WKwVtxPES6oIcFIRmYKNCCqw30v27a/fc3CSu5uktv/A/h/8cPrsuWxpkevrWwq60FnBokou/819e61YsxR3C5gpzyAe+NEzU0eO3hEYgHnf/swjqNc3Xv9XvnQNtcTV64U3LN0hBYAAJclf3Lu3SCdnzgot4cbq7m9cmnvii3eDWknzYydbD5+BYXj1arZ8XYA5D1jcniAxosY0evXYA2bmnIMzc/C1hJ3O1H1HPvzL37ipqXcFXMnm1bfWnvtz94W/Zf97J2RDq9WZx00RoBgoyV554KNm5r2HGby5kHO9e/Cnv5j51KffG2olHAyG195ZfPZy56/PoT3DQFCQQggxuQCAjKGw4fL1HY882n7ok+8TFYBL0/Tgh1rHTuS9HlAkOsmY2olkMbElh17fmu3dF77iarX3DwwAUO/fV5TUKIAxvARMgitiDkgh9PrtU6fbpz8x8essy4bD4XuAza4vd196ybV3IA8RAgApk5xICCQYKGj2sbOxmxkXM1tfXyf5boEXf/6z4bVF8/WSZIQACCSdJDEIxmHu98/veHQB5RJTSZIkJFdWVqK62LzdRuK063/4/dKvf+Wmp8GY0qIEMzFIciQhiAr9fvuhh+tzu6hJAdBut/v9/vLycpZlsfyKZjR2qOUVJV9dffuZH//n+98z8+aT0h6JUIgEM5EUJE8phNmFhejRBGOSGo1Gq9Xqdrubm5tpmiZJUqvVnHO+kTpJ3S7znOvrm1ff6r788tqLLwzefNO1pi1NGUJ0NRYxpEBKSowGKN/s1+cPtB88qa1NcgXsnGu324PBIITQK8pD1mrhv29vXP5JduWKvGevH9bWlGWo15Ods3KOeY5iwTaQIkN8oSWSDD5fXd352YXazrlAarskIpkkSavVWl1d9d4DgPdWr/f/9Mfub3/n5+fhHMy7qSaaVlRryItdmLGWYpxpNEkJSQco18yZM/BOWXarFCUZ2Q4hxMbb8jwsLrlm0xopCrXlMUIqVogYWpEgKKNFqxJK7PeT2dn28RPcjudxwpMkSdO00+l47xECzNm+eVHMMpVzYhBEiw1+NIUKICCrEtYByLrr9YP3NPbvvxXkuNNpmhbllOeS3JH72EjDYCApRomEGOukSOXAABpoVR1KSkQqy9J77/WzO0MIt18lotNJkuR5bgAHG/7IUXfocP7GG66WFh1O2fCSjEc4gykU3wr9pFMWAGvdf9QBMQlvL865JElCCALY69ncXG1hQVnObBjdCQyBgYEgQBNNFFXVshhIwuWDTTTS5uFDik3CbSXa65yL3JAMnU7j8bP4wAfz3kYgQwgIQhAIFVvvCFISgqIVTlnm29P1Awd4F8DVQoayhWKnY3v2pBeeUr8PwmIGESyTfIQaD8dlJ+oUQrJrV31+X7hpib4N8OjFLF9ZaZw/n5x8kCs3BMcQSIYQAuOZXCAUIsNkeYRxCnlt9y4/OzvRyd5KzGzLhiApz9FoTH33W8Fc3u8RIilIVGS7mrglVxRCbW7OakmsxTv6WnhTxjiqzNfWaqc+nj75hbC8rJyiEBS9rDJjMklBuh3TAGJd3o2QnDyO5jk3B1MXv+4PHQ4rq2JcmMuE2rY6BPpm825SupIsy7Z4TFIKN1Ztfl/z6W8zkNnwVnhjHkPmi39Q7ibGIYS82HMmwxAWl+rnHku/9IQ2BnfU5gwu9Ad3MO8m7IrzqmwEMMuY5+lTT1rawJ36pP8DYtnu0Fx23E4AAAAASUVORK5CYII=)}sr-rd-crlbar fab.drafts{opacity:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAIAAAADnC86AAAAA3NCSVQICAjb4U/gAAAACXBIWXMAAAsSAAALEgHS3X78AAAAF3RFWHRDcmVhdGlvbiBUaW1lADIwMTguNS4xOdo4t2EAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAEHElEQVRYhcVXTWhcVRT+7nt3/jKTmD9sDAp1Y8RCMW6kQuhCKrgRFNzpSupGty5ciLQrpbhwXVEUlIKLal0o4kIRBK0taIUuhIimjWNM08nPzGTeu+c7Lu6b6cTOnUnE8g7D/DDnft/5+c65PPPCm18gD7Mikg9xImk+xGmaU8YUzYfYOZcTcV7icsJ9uhqY/eMqRnQwv3HaD3FkjHO8sd0iYUamrQAwOV6uFAuiwXJax9GldiLFOH76+ENzM7Vk1PjZONppJV9fXt5sdYqFWAMlH5qxZo1tbO0+euTe0ycfHxliz4zRsxd+nJuuhVptGSaOjOkkstNKioV4+fqNNz74Zm56PBUBYExXayaLD6oAmu1k6eH7Fxfmy0UrToZkZSWwQIxBKoyj6JGF+d/rjWa78+6Fi07URIiM2Wp22ruJMcYTK2CjaGqisr7ZPHXyxOLCfJKKUkPgAKy4QI8N1jZ2nnty8dSLJ9766Nuz53+YnRxThaqK6gP3zR6aropQAcBEkdlpdv5Y2xTHSskCIOmcBMEBKxj8nyoSurtnqsVCfGimtutSpyRVhFutzivPLz21dISkAqpqo2i7nbx05pMry3U/wYQ6MAQ+rNQASLR3HYDdTqqEiJKqMNVy6e1z373z6SXf59TJPTPj77/+bKVUTBLxMvb+w0rtHHvyQLabsp8upR9EobqUzpGk92lstzcaLe+XOhHHTupc6uioVACi9Ef6AftZLBkUHinwTaQKhRQyy8AAcew/lYo4NgBIRc+HSsoQcMvwAiGFqgAUHoU94n4TISnGQEGIZD3W7EiQWFQDpYaoahY9RFVUOWgPiaoCE2MVYwx6sXaP9AHuLbVIrw299+yLc+yiqBOKDM4YisZW+73PLq7+vRUXCr7HVHWOcuvq03+9WyH7g0FfVI6kEgBJEQrZS3nPEYOb2+2Xz5yfHK/ElYJf/lQ6UkjclqxHsNTgdaNqlMZ/YfYa6AcYU6tWTBSLAJod8adC4MPE5WUKQKFeWoNL3a0BSREplSyAciHyqvuPxLzVFDXQPhEMMkUUYaW+kaTu+tomNLMQcRhL1M9xq9nGX41VEkOcVWHt1Hj5w88vf//LytXf1iYnq+TAOfDEoX8AqMZxBOCJxx6MXn2mWCkh7Fwo2GtrjXNf/rTeaK6uL9eq5VIhlnCglsru+O4xA4Cy0+4AOHb08LGjh4Px9dmlq9f+rN+cmqop1DnCYOCSMIBVr54BzKY0Ufv4q59Tx7tqJRe+4LwVi3al3rjya71SrUhPGhnwbUvCwIwffy0ApXEUtTpJ0mjtJ1eoIo7GpmoFGw/TTdeGXxIs2rg4Wxsig34zBgrd56OJ5YgJOciT1UF8bWjO7rRZvxRzIJYDFeh/JM6v1OEL5E4T55NxlAsrgH8AwnEIgVJ/yEsAAAAASUVORK5CYII=)}"; 5 | 6 | var theme_common = "/**\n* Common style, include:\n* .simpread-theme-root\n* sr-rd-title, sr-rd-desc, sr-rd-content, p, div, a, img, pre, code, sr-blockquote, ul ol\n*/\n\n.simpread-theme-root {\n font-size: 62.5%!important;\n}\n\nsr-rd-title, sr-rd-desc, sr-rd-content {\n width: 100%;\n}\n\nsr-rd-title {\n text-rendering: optimizelegibility;\n margin: 1em 0px 0.5em;\n}\n\nsr-rd-content {\n text-align: left;\n word-break: break-word;\n}\n\nsr-rd-desc {\n text-align: left;\n line-height: 2.4;\n margin: 0 0 1.2em 0;\n}\n\nsr-rd-content {\n font-size: 1.6rem;\n line-height: 1.6;\n}\n\nsr-rd-content p,\nsr-rd-content div {\n display: block;\n float: inherit;\n line-height: 1.6;\n font-size: 1.6rem;\n}\n\nsr-rd-content p,\nsr-rd-content div,\nsr-rd-content pre,\nsr-rd-content sr-blockquote {\n margin: 0 0 1.2em 0;\n word-break: break-word;\n /*\n word-wrap: break-word;\n white-space: pre-wrap;\n */\n}\n\nsr-rd-content a {\n padding: 0 5px;\n vertical-align: initial;\n}\n\nsr-rd-content a:hover {\n background: transparent;\n}\n\nsr-rd-content img {\n margin: 10px;\n padding: 5px;\n background: #fff;\n border: 1px solid #bbb;\n box-shadow: 1px 1px 3px #d4d4d4;\n}\n\nsr-rd-content sr-blockquote {\n display: block;\n position: relative;\n padding: 15px 25px;\n text-align: left;\n line-height: inherit;\n}\n\nsr-rd-content sr-blockquote:before {\n position: absolute;\n}\n\nsr-rd-content sr-blockquote * {\n margin: 0;\n font-size: inherit;\n}\n\nsr-rd-content table {\n width: 100%;\n margin: 0 0 1.2em 0;\n word-break: keep-all;\n word-break:normal;\n overflow: auto;\n border: none;\n}\n\nsr-rd-content table th, sr-rd-content table td {\n border: none;\n}\n\nsr-rd-content ul, sr-rd-content ol {\n margin: 0;\n padding: 0;\n}\n\nsr-rd-content ul {\n margin: 0 0 1.2em 0;\n margin-left: 1.3em;\n padding: 0;\n list-style: disc;\n}\n\nsr-rd-content ol {\n list-style: decimal;\n margin-left: 1.3em;\n}\n\nsr-rd-content ul li, sr-rd-content ol li {\n font-size: inherit;\n list-style: disc;\n margin: 0 0 1.2em 0;\n}\n\nsr-rd-content ul li *, sr-rd-content ol li * {\n margin: 0;\n text-align: initial;\n}\n\nsr-rd-content li ul, sr-rd-content li ol {\n margin-bottom: 0.8em;\n margin-left: 2em;\n}\n\nsr-rd-content li ul {\n list-style: circle;\n}\n\nsr-rd-content pre {\n font-family: Consolas, Monaco, 'Andale Mono', \"Source Code Pro\", \"Liberation Mono\", Courier, monospace;\n\n display: block;\n\n padding: 15px;\n\n font-size: 1.1rem;\n line-height: 1.5;\n\n word-break: break-all;\n word-wrap: break-word;\n white-space: pre;\n\n overflow: auto;\n}\n\nsr-rd-content pre div {\n font-size: 1.1rem;\n}\n\nsr-rd-content pre * {\n font-size: 1.1rem;\n}\n\nsr-rd-content pre,\nsr-rd-content li pre code,\nsr-rd-content p pre code {\n background-color: transparent;\n border: none;\n}\n\nsr-rd-content pre code {\n margin: 0;\n padding: 0;\n font-size: 1.1rem;\n}\n\nsr-rd-content pre code * {\n font-size: 1.1rem;\n}\n\nsr-rd-content li code,\nsr-rd-content p code {\n margin: 0 4px;\n padding: 2px 4px;\n font-size: 1.1rem;\n}\n\n.sr-rd-content-img {\n width: 90%;\n height: auto;\n}\n\n.sr-rd-content-img-load {\n width: 48px;\n height: 48px;\n margin: 0;\n padding: 0;\n border-style: none;\n border-width: 0;\n background-repeat: no-repeat;\n background-image: url( \"../images/loading.gif\" );\n}\n\n.sr-rd-content-center {\n text-align: center;\n display: -webkit-box;\n -webkit-box-align: center;\n -webkit-box-pack: center;\n -webkit-box-orient: vertical;\n}\n\n.sr-rd-content-nobeautify {\n margin: 0;\n padding: 0;\n border: 0;\n box-shadow: 0 0 0;\n}\n\nsr-rd-mult {\n display: flex;\n flex-direction: row;\n\n margin: 0 0 16px 0;\n padding: 16px 0 24px;\n\n width: 100%;\n\n background-color: #fafafa;\n\n border-radius: 2px;\n box-shadow: 0 1px 5px rgba(0, 0, 0, 0.16);\n}\n\nsr-rd-mult:hover {\n transition: all 450ms 0ms;\n box-shadow: 1px 1px 8px rgba(0, 0, 0, .16);\n}\n\nsr-rd-mult sr-rd-mult-content {\n display: flex;\n flex-direction: column;\n\n padding: 0 16px 0;\n}\n\nsr-rd-mult sr-rd-mult-avatar {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\nsr-rd-mult sr-rd-mult-avatar span {\n display: -webkit-box;\n\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n\n max-width: 75px;\n\n overflow: hidden;\n text-overflow: ellipsis;\n text-align: left;\n\n font-size: 1rem;\n}\n\nsr-rd-mult sr-rd-mult-avatar img {\n margin-bottom: 0;\n\n max-width: 50px;\n max-height: 50px;\n width: 50px;\n height: 50px;\n\n border-radius: 50%;\n}\n\nsr-rd-mult sr-rd-mult-avatar .sr-rd-content-center {\n margin: 0;\n}\n\nsr-page {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n\n width: 100%;\n}"; 7 | 8 | $("head").append(""); 9 | $("head").append(""); 10 | $("head").append(""); 11 | $("head").append(""); -------------------------------------------------------------------------------- /src/little.css: -------------------------------------------------------------------------------- 1 | sr-rd-crlbar.controlbar { 2 | width: 100px; 3 | height: 200px; 4 | 5 | opacity: 1; 6 | z-index: 2147483647; 7 | transition: opacity 450ms 0ms; 8 | } 9 | 10 | sr-rd-crlbar.controlbar.hidden { 11 | opacity: 0; 12 | } 13 | 14 | sr-rd-crlbar fab { 15 | position: fixed; 16 | display: block; 17 | 18 | bottom: 45px; 19 | right: 24px; 20 | 21 | width: 56px; 22 | height: 56px; 23 | line-height: 56px; 24 | 25 | font-size: 15px; 26 | text-align: center; 27 | 28 | color: #fff; 29 | background-color: rgb(76, 175, 80); 30 | 31 | border-radius: 50%; 32 | cursor: pointer; 33 | box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2); 34 | 35 | transform: rotate(0deg); 36 | transition: all 450ms 0ms; 37 | } 38 | 39 | .simpread-read-root sr-rd-crlbar fab:hover, 40 | sr-rd-crlbar fab.crlbar-close:hover { 41 | transform: rotate(45deg); 42 | transition: all 450ms 0ms; 43 | } 44 | 45 | .simpread-read-root sr-rd-crlbar fab, 46 | sr-rd-crlbar fab.crlbar-close { 47 | background-color: rgba(244, 67, 54, 1); 48 | } 49 | 50 | sr-rd-crlbar fab.crlbar-close { 51 | background-position: center; 52 | background-repeat: no-repeat; 53 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAQAAABKfvVzAAAAdklEQVQ4y+WTuQ3AIBAEaQKK8NN/BEUArmccgGyj43MMIZo5TqtFqbUPJxYtbg2OvS44IJQKhguwdUETSiXjXr77KhGICRjihWKm8Dw3KXP4Z5VZ/Lfw7B5kyD1cy5C7uAx5iJcht6vhRTUi4OrC0Szftvi/vAFNdbZ2Dp661QAAAABJRU5ErkJggg==); 54 | } 55 | 56 | sr-rd-crlbar fab.not-adapter { 57 | background-color: rgba(189, 189, 189, 1); 58 | } 59 | 60 | sr-rd-crlbar fab.setting, 61 | sr-rd-crlbar fab.about { 62 | bottom: 100px; 63 | right: 33px; 64 | 65 | margin-bottom: 10px; 66 | 67 | width: 40px; 68 | height: 40px; 69 | 70 | line-height: 40px; 71 | font-size: 10px; 72 | 73 | background-color: rgb(3, 169, 244); 74 | background-position: center; 75 | background-repeat: no-repeat; 76 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABvUlEQVRIS72WjVFCQQyENxVoB2oF2oFYiZYAFYgVaAlQidgBdoAdaAVxvptkjMffQxluhoF3L5fNZff2MB1huPuCNGY2cveppEdJd2a2sCPkVwCcSRpLeojP0QFuu2J3A7j7paT7smhuZquaxN1HkkhM1XRjJinn+L3a2qJY/FoStoo6gOw3028dBy30F4C7UwlVTySdS1oDiH4vzWwcu2SnL5IuJC0l8cyHHMsG4O4kuy4EQRaDhTmYIwG74JvnD9oWoDcFALAfDja0Y6i4nsxsulemsVXakwQB8BGkJRjvqay+W8BLtJZzMItiyTNjdz0Ha6Rl9qgypdgIHbJNi4UewZUgqqPXbbg7PU7iP6Pf+XpSYyswAJm8zq9JsgAdFH8SgHp4aBFEIkH63LcIvyH+q2vReGuL9p3Mf5McBKbvoIxUB76Dn1SZEsfId+xyk0xRW/OuPMkkrbYwRIHEDD5oyA8ZVi8iwXNBat4ShbwHT6tiFVhN9aJ1u44TCQgkDzU7RIFnXXVe1LzrtHbdKQpC2U2O5i1dTIqCOA5gXjjMz3deOENZDhVyNg67Mv8AAGd56XNpHf3S3/i35Rt5qiGSUhS/qAAAAABJRU5ErkJggg==); 77 | 78 | opacity: 0; 79 | transition: opacity .5s ease; 80 | } 81 | 82 | sr-rd-crlbar fab.about { 83 | bottom: 150px; 84 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAeklEQVRIie3T0QmAIBDG8RuhEdwkR3CENmiE3KxRXKEN/r0oSJkvXaHgB/ckfD84OZFWAlhgTqNd7rnHDyAHXAFwakDfARZgu8wKTBrltrB7vU/+AzDA8RmQQf0f2gAeiw2wA6EAhPhm3gC1O0ix7QIR8bV5VT4iInICHxrcTgOet60AAAAASUVORK5CYII=); 85 | } 86 | 87 | sr-rd-crlbar fab.show { 88 | opacity: 1; 89 | } 90 | 91 | .simpread-option-root { 92 | position: fixed; 93 | top: 0px; 94 | left: 0px; 95 | 96 | display: flex; 97 | justify-content: center; 98 | align-items: center; 99 | 100 | width: 100%; 101 | height: 100%; 102 | 103 | color: rgb(255, 255, 255); 104 | background-color: rgba(0,0,0,.5); 105 | 106 | text-shadow: rgba(0, 0, 0, 0.3) 0px 1px; 107 | 108 | opacity: 0; 109 | transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms; 110 | 111 | z-index: 2147483646; 112 | } 113 | 114 | dialog-gp { 115 | display: -webkit-flex; 116 | flex-direction: column; 117 | 118 | margin: 0; 119 | padding: 0; 120 | 121 | min-width: 480px; 122 | min-height: 300px; 123 | 124 | color: rgba(0, 0, 0, 0.870588); 125 | background-color: rgb(255, 255, 255); 126 | 127 | border-radius: 3px; 128 | box-sizing: border-box; 129 | box-shadow: rgba(0, 0, 0, 0.247059) 0px 14px 45px, rgba(0, 0, 0, 0.219608) 0px 10px 18px; 130 | } 131 | 132 | dialog-head { 133 | display: block; 134 | 135 | padding: 24px 24px 20px 24px; 136 | 137 | min-height: 25px; 138 | line-height: 25px; 139 | 140 | font-size: 21px; 141 | font-weight: 500; 142 | 143 | color: #fff; 144 | background-color: rgb(100, 181, 246); 145 | } 146 | 147 | dialog-content { 148 | display: block; 149 | 150 | padding: 24px 24px 0; 151 | 152 | width: 100%; 153 | min-height: 244px; 154 | max-height: 580px; 155 | 156 | overflow-y: auto; 157 | box-sizing: border-box; 158 | } 159 | 160 | dialog-footer { 161 | display: -webkit-flex; 162 | flex-flow: row nowrap; 163 | justify-content: flex-end; 164 | 165 | width: 100%; 166 | min-height: 52px; 167 | 168 | box-sizing: border-box; 169 | } 170 | 171 | sr-opt-gp sr-opt-label { 172 | font-weight:500; 173 | color: rgb(33, 150, 243); 174 | } 175 | 176 | sr-opt-gp sr-opt-item { 177 | display: flex; 178 | justify-content: center; 179 | flex-direction: row; 180 | 181 | width: 100%; 182 | } 183 | 184 | dialog-content .about { 185 | padding: 3px 0 10px 0; 186 | 187 | width: 650px; 188 | 189 | color: rgba(51, 51, 51, 0.7); 190 | 191 | font-weight: 400; 192 | font-size: 14px; 193 | 194 | text-align: center; 195 | text-shadow: none; 196 | line-height: 1.8; 197 | } 198 | 199 | dialog-content .about a { 200 | text-decoration: none; 201 | 202 | color: rgba(51, 51, 51, 0.87); 203 | border-bottom: 1px dotted rgba(51, 51, 51, 0.7); 204 | } 205 | 206 | /** 207 | * Wheel menu buttons 208 | */ 209 | .sr-rd-trigger { 210 | position: fixed; 211 | right: 50%; 212 | bottom: 35px; 213 | } 214 | 215 | .blooming-menu__container { 216 | opacity: 0.5; 217 | transition: all 1s cubic-bezier(.23,1,.32,1) .1s!important; 218 | } 219 | 220 | .blooming-menu__container:hover { 221 | opacity: 1; 222 | } 223 | 224 | .blooming-menu__main { 225 | background-color: rgba(244, 67, 54, 1)!important; 226 | } 227 | 228 | .blooming-menu__item-btn-wrapper { 229 | background-color: #03a9f4!important; 230 | transition: all 1000ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; 231 | } 232 | 233 | .blooming-menu__item-btn-wrapper:active { 234 | background-color: #0D47A1!important; 235 | } 236 | 237 | .blooming-menu__main.is-active { 238 | transform: rotate(0)!important; 239 | -webkit-transform: rotate(0)!important; 240 | } 241 | 242 | .blooming-menu__item:nth-of-type(3) button, 243 | .blooming-menu__item:nth-of-type(4) button { 244 | transform: rotate(90deg); 245 | } 246 | 247 | .blooming-menu__item:nth-of-type(6) button { 248 | transform: rotate(180deg); 249 | } 250 | 251 | /** 252 | * Mobile media 253 | */ 254 | @media (pointer:coarse) { 255 | fab { 256 | opacity: 1!important; 257 | } 258 | 259 | /** 260 | * iPhone XS Max and below 261 | */ 262 | @media only screen and (max-device-width: 414px) { 263 | 264 | sr-rd-crlbar.controlbar { 265 | z-index: 2147483646!important; 266 | } 267 | 268 | dialog-gp { 269 | transform: scale(.7); 270 | z-index: 2147483647!important; 271 | } 272 | 273 | dialog-content .about { 274 | width: 100%!important; 275 | } 276 | } 277 | } -------------------------------------------------------------------------------- /src/userscript/simpread.js: -------------------------------------------------------------------------------- 1 | // ==UserScript== 2 | // @name 简悦( SimpRead ) · 轻阅版 3 | // @namespace http://ksria.com/simpread/ 4 | // @version 1.1.2.200206 5 | // @description 简悦 - 让你瞬间进入沉浸式阅读的 User Script 扩展 6 | // @author Kenshin 7 | // @include http://*/* 8 | // @include https://*/* 9 | // @require https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js 10 | // @require https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js 11 | // @require https://cdn.jsdelivr.net/npm/interactjs/dist/interact.min.js 12 | // @require https://greasyfork.org/scripts/40244-mduikit/code/MDUIKit.js?version=697886 13 | // @require https://greasyfork.org/scripts/40236-notify/code/Notify.js?version=770172 14 | // @require https://greasyfork.org/scripts/40172-mousetrap/code/Mousetrap.js?version=262594 15 | // @require https://greasyfork.org/scripts/383025-bloomingmenu/code/BloomingMenu.js?version=698175 16 | // @require https://greasyfork.org/scripts/39995-pureread/code/PureRead.js?version=770507 17 | // @require https://greasyfork.org/scripts/39997-puplugin/code/PuPlugin.js?version=770506 18 | // @resource global_sites http://sr.ksria.cn/website_list_v4.json?data=1.1.2.20200205 19 | // @resource notify_style http://sr.ksria.cn/puread/notify.css?version=1.1.2.20200205 20 | // @resource main_style http://sr.ksria.cn/puread/simpread.css?version=1.1.2.20200205 21 | // @resource mntips_style http://sr.ksria.cn/puread/mintooltip.css?version=1.1.2.202002051244 22 | // @resource option_style http://sr.ksria.cn/puread/setting.css?version=1.1.2.20200205 23 | // @resource user_style http://sr.ksria.cn/puread/little.css?version=1.1.2.202002061430 24 | // @resource theme_common http://sr.ksria.cn/puread/theme_common.css?version=1.1.2.20200205 25 | // @resource theme_dark http://sr.ksria.cn/puread/theme_dark.css?version=1.1.2.20200205 26 | // @resource theme_github http://sr.ksria.cn/puread/theme_github.css?version=1.1.2.20200205 27 | // @resource theme_gothic http://sr.ksria.cn/puread/theme_gothic.css?version=1.1.2.20200205 28 | // @resource theme_night http://sr.ksria.cn/puread/theme_night.css?version=1.1.2.20200205 29 | // @resource theme_pixyii http://sr.ksria.cn/puread/theme_pixyii.css?version=1.1.2.20200205 30 | // @resource theme_engwrite http://sr.ksria.cn/puread/theme_engwrite.css?version=1.1.2.20200205 31 | // @resource theme_monospace http://sr.ksria.cn/puread/theme_monospace.css?version=1.1.2.20200205 32 | // @resource theme_newsprint http://sr.ksria.cn/puread/theme_newsprint.css?version=1.1.2.20200205 33 | // @resource theme_octopress http://sr.ksria.cn/puread/theme_octopress.css?version=1.1.2.20200205 34 | // @resource theme_mobile http://sr.ksria.cn/puread/theme_mobile.css?version=1.1.2.20200205 35 | // @grant GM_getResourceText 36 | // @grant GM_addStyle 37 | // @grant GM_getValue 38 | // @grant GM_setValue 39 | // @grant GM_deleteValue 40 | // @grant GM_info 41 | // @run-at document-end 42 | // @noframes 43 | // ==/UserScript== 44 | 45 | const pr = new PureRead(), 46 | style = puplugin.Plugin( "style" ), 47 | global_sites = GM_getResourceText( "global_sites" ), 48 | notify_style = GM_getResourceText( "notify_style" ), 49 | main_style = GM_getResourceText( "main_style" ), 50 | mntips_style = GM_getResourceText( "mntips_style" ), 51 | option_style = GM_getResourceText( "option_style" ), 52 | user_style = GM_getResourceText( "user_style" ), 53 | theme_common = GM_getResourceText( "theme_common" ), 54 | theme_dark = GM_getResourceText( "theme_dark" ), 55 | theme_github = GM_getResourceText( "theme_github" ), 56 | theme_gothic = GM_getResourceText( "theme_gothic" ), 57 | theme_night = GM_getResourceText( "theme_night" ), 58 | theme_pixyii = GM_getResourceText( "theme_pixyii" ), 59 | theme_engwrite = GM_getResourceText( "theme_engwrite" ), 60 | theme_monospace = GM_getResourceText( "theme_monospace" ), 61 | theme_newsprint = GM_getResourceText( "theme_newsprint" ), 62 | theme_octopress = GM_getResourceText( "theme_octopress" ), 63 | theme_mobile = GM_getResourceText( "theme_mobile" ), 64 | theme = { theme_github, theme_newsprint, theme_gothic, theme_engwrite, theme_octopress, theme_pixyii, theme_monospace, theme_night, theme_dark }, 65 | focus = { 66 | version : "2016-12-29", 67 | bgcolor : "rgba( 235, 235, 235, 0.9 )", 68 | mask : true, 69 | highlight : true, // not-write, only read 70 | opacity : 90, 71 | shortcuts : "A S", 72 | }, 73 | read = { 74 | version : "2017-03-16", 75 | cleanup : true, 76 | pure : true, 77 | auto : false, 78 | controlbar: true, 79 | highlight : true, 80 | shortcuts : "A A", 81 | theme : "github", 82 | fontfamily: "default", 83 | whitelist : [], 84 | exclusion : [ 85 | "v2ex.com","issue.github.com","readme.github.com","question.zhihu.com","douban.com","nationalgeographic.com.cn","tech.163.com","docs.microsoft.com","msdn.microsoft.com","baijia.baidu.com","code.oschina.net","http://www.ifanr.com","http://www.ifanr.com/news","http://www.ifanr.com/app","http://www.ifanr.com/minapp","http://www.ifanr.com/dasheng","http://www.ifanr.com/data","https://www.ifanr.com/app","http://www.ifanr.com/weizhizao","http://www.thepaper.cn","http://www.pingwest.com","http://tech2ipo.com","https://www.waerfa.com/social" 86 | ], 87 | fontsize : "62.5%", 88 | layout : "20%", 89 | toc : true, 90 | toc_hide : true, 91 | }, 92 | option = { 93 | version : "2017-04-03", 94 | esc : true, 95 | trigger : "read", // include: 'focus' 'read', only by userscript 96 | origins : [], 97 | trigger_hiden: true, 98 | blacklist : [ 99 | "google.com","https://www.baidu.com/?vit=1" 100 | ], 101 | }, 102 | opt_value = ` 103 | # 是否启用 ESC 退出方式？ 104 | # 默认为 true，取值范围 true | false 105 | set_esc: true 106 | 107 | # 右下角触发器点击后进入的模式 108 | # 默认为 read，取值范围 focus | read 109 | set_trigger: read 110 | 111 | # 当在非适配的页面是否隐藏触发器 112 | # 默认为 true （隐藏），取值范围 true | false 113 | # 当选择了 true 且在非适配页面时，可以通过快捷键使用临时阅读模式 114 | set_trigger_hiden: true 115 | 116 | # 黑名单，加入其中后，不再启动简悦 117 | # 有别于白名单和排除列表，前两种当前页面还是加载简悦，但黑名单则彻底加载轻阅的代码 118 | # 支持域名和 URL， 119 | # 例如： 120 | # https://www.baidu.com/?vit=1 则在此页面禁用 121 | # google.com 则凡是含有 google.com 的域名都禁用，包括： mail.google.com doc.google.com 等 122 | # mail.google.com 仅在 mail.google.com 下无法使用，但 doc.google.com 则没问题 123 | # 每个名单由小写 , 分隔 124 | set_blacklist: 125 | `, 126 | focus_value = ` 127 | # 是否启用点击空白（遮罩）退出功能？ 128 | # 默认为 true，取值范围 true | false 129 | set_mask: true 130 | 131 | # 遮罩的背景色，仅支持 rgba 格式 132 | # 默认为 rgba( 235, 235, 235, 1 ) 133 | set_bgcolor: rgba( 235, 235, 235, 0.9 ) 134 | 135 | # 遮罩的透明度 136 | # 默认为 90，取值范围 0 ~ 100 137 | set_opacity: 90 138 | 139 | # 启动聚焦模式的快捷键 140 | # 默认为 A S 141 | # 必须有两个值，仅支持 shift, 字母和数字，中间必须有空格 142 | set_shortcuts: A S 143 | 144 | # 当未适配聚焦模式时，是否启用手动聚焦模式？ 145 | # 默认为启用，取值范围 true | false 146 | set_highlight: true 147 | `, 148 | read_value = ` 149 | # 主题样式 150 | # 取值范围白练 → github, 白磁 → newsprint, 卯之花色 → gothic, 丁子色 → engwrite 151 | # 取值范围娟鼠 → octopress, 月白 → pixyii, 百合 → monospace, 紺鼠 → night, 黒鸢 → dark 152 | # 请使用关键字，而非名称，如：pixyii 153 | set_theme: github 154 | 155 | # 字体样式，支持 css font-family 值 156 | # 默认为 default，即浏览器默认值 157 | set_fontfamily: default 158 | 159 | # 字体大小，支持 css font-size 值 160 | # 默认为 62.5% 161 | set_fontsize: 62.5% 162 | 163 | # 布局宽度，支持 css margin 值，例如： 20px, 80% 等 164 | # 默认为 20% 宽度 165 | set_layout: 20% 166 | 167 | # 是否一直显示右下角的控制栏？ 168 | # 默认为不显示，取值范围 true | false 169 | set_controlbar: false 170 | 171 | # 当未适配阅读模式时，是否启用临时阅读模式？ 172 | # 默认为启用，取值范围 true | false 173 | set_highlight: true 174 | 175 | # 启动阅读模式的快捷键 176 | # 默认为 A A 177 | # 必须有两个值，仅支持 shift, 字母和数字，中间必须有空格 178 | set_shortcuts: A A 179 | 180 | # 如果当前页面适配阅读模式，是否自动进入阅读模式？ 181 | # 默认为 false，取值范围 true | false 182 | set_auto: false 183 | 184 | # 黑名单，加入其中后，不会自动进入阅读模式 185 | # 此功能在 auto = true 时才会生效 186 | # 支持 minimatch，域名和 name，例如： "v2ex.com", "http://www.ifanr.com/**/*" 187 | # 每个名单由小写 , 分隔 188 | set_exclusion: 189 | 190 | # 白名单，加入其中后，自动进入阅读模式 191 | # 此功能在 auto = true 时才会生效，并与黑名单互斥 192 | # 支持 minimatch，域名和 name，例如： "v2ex.com", "http://www.ifanr.com/**/*" 193 | # 默认为空，每个名单由小写 , 分隔 194 | set_whitelist: 195 | 196 | # 是否启用增强解析模式？ 197 | # 增强解析模式会对版面重新设计，包括：去除多余空格、优化版面结构等，此功能为测试版，遇到解析失败时，请关闭此功能。 198 | # 默认为 true，取值范围 true | false 199 | set_cleanup: true 200 | 201 | # 是否启用纯粹模式？ 202 | # 比【增强解析模式】还要彻底优化版本，包括：字形、颜色、字号、代码段等，专治页面及不规范，如：微信订阅号，CSDN 等。 203 | # 此功能在 cleanup = true 时才会生效 204 | # 默认为 true，取值范围 true | false 205 | set_pure: true 206 | 207 | # 是否自动生成大纲（目录）？ 208 | # 只整理 h1, h2, h3, h4 的内容为大纲 209 | # 默认为 true，取值范围 true | false 210 | set_toc: true 211 | 212 | # 大纲（目录）是否开启「鼠标移动到左上角」自动显示？ 213 | # 关闭意味着「一直显示」 214 | # 此功能在 toc = true 时才会生效 215 | # 默认为 true，取值范围 true | false 216 | set_toc_hide: true 217 | `; 218 | let current_state = "", // include: focus, read, option 219 | simpread = { version: "1.1.2", focus, read, option }, 220 | org_simp = { ...simpread }; 221 | 222 | /**************************** 223 | * Entry 224 | ****************************/ 225 | 226 | // initialize 227 | version(); 228 | 229 | // blacklist 230 | if ( !blacklist() ) { 231 | // add simpread style 232 | GM_addStyle( notify_style ); 233 | GM_addStyle( main_style ); 234 | GM_addStyle( mntips_style ); 235 | GM_addStyle( option_style ); 236 | GM_addStyle( user_style ); 237 | GM_addStyle( theme_common ); 238 | GM_addStyle( theme_mobile ); 239 | 240 | // add websites and current can'b read mode 241 | if (GM_getValue( "simpread_db" )) { 242 | pr.sites = GM_getValue( "simpread_db" ); 243 | } else { 244 | pr.Addsites( JSON.parse( global_sites )); 245 | GM_setValue( "simpread_db", pr.sites ); 246 | } 247 | pr.cleanup = simpread.read.cleanup; 248 | pr.pure = simpread.read.pure; 249 | pr.AddPlugin( puplugin.Plugin() ); 250 | pr.Getsites(); 251 | 252 | // global 253 | bindShortcuts(); 254 | controlbar(); 255 | autoOpen(); 256 | dragging(); 257 | 258 | console.log( "[SimpRead Lite] current pureread is ", pr, simpread ); 259 | } 260 | 261 | /**************************** 262 | * Method 263 | ****************************/ 264 | 265 | /** 266 | * Version 267 | */ 268 | function version() { 269 | // get and set simpread 270 | if (GM_getValue( "simpread" )) { 271 | simpread = GM_getValue( "simpread" ); 272 | } else { 273 | GM_setValue( "simpread", simpread ); 274 | GM_setValue( "simpread_subver", GM_info.script.version ); 275 | new Notify().Render( "简悦 · 轻阅版版本提示", `安装到最新版 ${GM_info.script.version}，请看详细说明。` ); 276 | } 277 | // compare 278 | if ( GM_getValue( "simpread_subver" ) != GM_info.script.version ) { 279 | GM_setValue( "simpread_subver", GM_info.script.version ); 280 | if ( simpread.version != org_simp.version ) { 281 | if ( simpread.version == undefined ) { 282 | simpread = { ...org_simp }; 283 | } else { 284 | Object.keys( org_simp ).forEach( key => { 285 | key != "version" && Object.keys( org_simp[key] ).forEach( value => { 286 | if ( !simpread[key][value] ) { 287 | simpread[key][value] = org_simp[key][value]; 288 | } 289 | }); 290 | }); 291 | simpread.version = org_simp.version; 292 | } 293 | GM_setValue( "simpread", simpread ); 294 | } 295 | new Notify().Render( "简悦 · 轻阅版版本提示", `升级到正式版 ${GM_info.script.version}，请看更新说明。` ); 296 | } 297 | } 298 | 299 | /** 300 | * Black list 301 | */ 302 | function blacklist() { 303 | let is_blacklist = false; 304 | for ( const item of simpread.option.blacklist ) { 305 | if ( !item.startsWith( "http" ) ) { 306 | if ( location.hostname.includes( item ) ) { 307 | is_blacklist = true; 308 | break; 309 | } 310 | } else { 311 | if ( location.href == item ) { 312 | is_blacklist = true; 313 | break; 314 | } 315 | } 316 | } 317 | console.log( "current site is blacklist", is_blacklist ) 318 | return is_blacklist; 319 | } 320 | 321 | /** 322 | * Keyboard event handler 323 | */ 324 | function bindShortcuts() { 325 | Mousetrap.bind( [ simpread.focus.shortcuts.toLowerCase() ], () => entryMode( "focus" )); 326 | Mousetrap.bind( [ simpread.read.shortcuts.toLowerCase() ], () => entryMode( "read" )); 327 | Mousetrap.bind( "esc", ( event, combo ) => { 328 | if ( combo == "esc" && simpread.option.esc ) { 329 | if ( $( ".simpread-read-root" ).length > 0 ) $( ".simpread-read-root sr-rd-crlbar fab" )[1].click(); 330 | if ( $( ".simpread-focus-root" ).length > 0 ) $( "sr-rd-crlbar fab.crlbar-close" )[0].click(); 331 | } 332 | }); 333 | } 334 | 335 | /** 336 | * Auto open read mode 337 | */ 338 | function autoOpen() { 339 | const exclusion = ( minimatch, data ) => { 340 | const url = window.location.origin + window.location.pathname; 341 | return data.findIndex( item => { 342 | item = item.trim(); 343 | return item.startsWith( "http" ) ? minimatch( url, item ) : item == pr.current.site.name; 344 | }) == -1 ? true : false; 345 | }, 346 | whitelist = ( minimatch, data ) => { 347 | const url = window.location.origin + window.location.pathname; 348 | return data.findIndex( item => { 349 | item = item.trim(); 350 | return item.startsWith( "http" ) ? minimatch( url, item ) : item == pr.current.site.name; 351 | }) != -1 ? true : false; 352 | }; 353 | if ( window.location.href.includes( "simpread_mode=read" ) || 354 | ( simpread.read.auto && exclusion( puplugin.Plugin( "minimatch" ), simpread.read.exclusion )) || 355 | ( !simpread.read.auto && whitelist( puplugin.Plugin( "minimatch" ), simpread.read.whitelist )) 356 | ) { 357 | switch ( pr.current.site.name ) { 358 | case "my.oschina.net": 359 | case "36kr.com": 360 | case "chiphell.com": 361 | case "question.zhihu.com": 362 | $( () => readMode() ); 363 | break; 364 | case "post.juejin.im": 365 | case "entry.juejin.im": 366 | setTimeout( ()=>readMode(), 2500 ); 367 | break; 368 | case "kancloud.cn": 369 | case "sspai.com": 370 | setTimeout( ()=>readMode(), 1000 ); 371 | break; 372 | default: 373 | if ( pr.state == "adapter" ) readMode(); 374 | break; 375 | } 376 | } 377 | } 378 | 379 | /** 380 | * Control bar 381 | */ 382 | function controlbar() { 383 | $( "body" ).append( '' ); 384 | $( "sr-rd-crlbar" ).css( "opacity", 1 ); 385 | if ( pr.state == "none" ) $( "sr-rd-crlbar fab:not(.setting,.about)" ).addClass( "not-adapter" ); 386 | setTimeout( () => { 387 | $( "sr-rd-crlbar" ).removeAttr( "style" ); 388 | if ( pr.state == "none" && simpread.option.trigger_hiden == true ) $( "sr-rd-crlbar" ).css({ display: "none" }); 389 | const position = GM_getValue( "simpread_trigger_pos" ); 390 | if ( position && position['sr-rd-crlbar'] ) { 391 | const { x, y } = position['sr-rd-crlbar']; 392 | $( 'sr-rd-crlbar' ) 393 | .attr( 'data-x', x ) 394 | .attr( 'data-y', y ) 395 | .css({ 396 | 'transform': `translate(${x}px, ${y}px)`, 397 | '-webkit-transform': `translate(${x}px, ${y}px)`, 398 | }); 399 | } 400 | $( "sr-rd-crlbar" ).removeClass( "hidden" ); 401 | }, 1000 * 2 ); 402 | $( "sr-rd-crlbar fab:not(.setting,.about)" ).click( event => { 403 | if ( $( 'sr-rd-crlbar[draggable="true"]' ).length > 0 ) return; 404 | if ( $(event.target).hasClass( "crlbar-close" ) ) { 405 | $( ".simpread-focus-root" ).trigger( "click", "okay" ); 406 | $( event.target ).removeClass( "crlbar-close" ).text( "简悦" ); 407 | } else entryMode( simpread.option.trigger ); 408 | event.preventDefault(); 409 | return false; 410 | }); 411 | $( "sr-rd-crlbar fab:not(.setting,.about)" ).mouseover( () => { 412 | if ( $( ".simpread-focus-root" ).length == 0 ) { 413 | $( "sr-rd-crlbar fab.setting" ).addClass( "show" ); 414 | $( "sr-rd-crlbar fab.about" ).addClass( "show" ); 415 | } 416 | $( "sr-rd-crlbar" ).one( "mouseleave" , () => { 417 | $( "sr-rd-crlbar fab.setting" ).removeClass( "show" ); 418 | $( "sr-rd-crlbar fab.about" ).removeClass( "show" ); 419 | }); 420 | }); 421 | $( "sr-rd-crlbar fab.setting" ).click( () => { 422 | optionMode(); 423 | }); 424 | $( "sr-rd-crlbar fab.about" ).click( () => { 425 | aboutMode(); 426 | }); 427 | }; 428 | 429 | /** 430 | * Enter Mode 431 | * 432 | * @param {string} include: focus, read 433 | */ 434 | function entryMode( type ) { 435 | try { 436 | type = type == "focus" ? "focus" : "read"; 437 | if ( [ "none" ].includes( pr.state ) ) { 438 | if ( simpread[type].highlight == true ) tempMode( type ); 439 | else new Notify().Render( `当前未启用临时阅读模式，并当前站点也未适配，如需要适配请提交到此页面` ); 440 | } else type == "focus" ? focusMode() : readMode(); 441 | } catch ( err ) { 442 | console.error( err ) 443 | new Notify().Render( 2, "当前页面无法使用阅读模式。" ); 444 | } 445 | } 446 | 447 | /** 448 | * Focus mode 449 | * 450 | * @param {dom} html element 451 | */ 452 | function focusMode( element = undefined ) { 453 | let $focus = element ? $(element) : pr.Include(), 454 | tag, $parent, 455 | sel, range, node; 456 | const focuscls = "simpread-focus-highlight", 457 | focusstyle = "z-index: 2147483646; overflow: visible; position: relative;", 458 | maskcls = "simpread-focus-mask", 459 | maskstyle = "z-index: auto; opacity: 1; overflow: visible; transform: none; animation: none; position: relative;", 460 | bgcls = "simpread-focus-root", 461 | bgtmpl = "

", 462 | bgclsjq = "." + bgcls, 463 | includeStyle = ( $target, style, cls, type ) => { 464 | $target.each( ( idx, ele ) => { 465 | let bakstyle, 466 | selector = $(ele); 467 | if ( type === "add" ) { 468 | bakstyle = selector.attr( "style" ) == undefined ? "" : selector.attr( "style" ); 469 | selector.attr( "style", bakstyle + style ).addClass( cls ); 470 | } else if ( type === "delete" ) { 471 | bakstyle = selector.attr( "style" ); 472 | bakstyle = bakstyle.replace( style, "" ); 473 | selector.attr( "style", bakstyle ).removeClass( cls ); 474 | } 475 | }); 476 | }, 477 | excludeStyle = ( $target, type ) => { 478 | const tags = pr.Exclude( $target ); 479 | if ( type == "delete" ) $target.find( tags ).hide(); 480 | else if ( type == "add" ) $target.find( tags ).show(); 481 | }; 482 | 483 | if ( current_state == "focus" ) { 484 | new Notify().Render( "请误重复进入。" ); 485 | return; 486 | } else if ( current_state != "" ) { 487 | new Notify().Render( "请先退出当前模式。" ); 488 | return; 489 | } else current_state = "focus"; 490 | 491 | // set include style 492 | includeStyle( $focus, focusstyle, focuscls, "add" ); 493 | 494 | // set exclude style 495 | excludeStyle( $focus, "delete" ); 496 | 497 | // add simpread-focus-mask 498 | $parent = $focus.parent(); 499 | tag = $parent[0].tagName; 500 | while ( tag.toLowerCase() != "body" ) { 501 | includeStyle( $parent, maskstyle, maskcls, "add" ); 502 | $parent = $parent.parent(); 503 | tag = $parent[0].tagName; 504 | } 505 | 506 | // add background 507 | $( "body" ).append( bgtmpl ); 508 | 509 | // add background color 510 | $( bgclsjq ) 511 | .css({ "background-color" : style.BgColor( simpread.focus.bgcolor, simpread.focus.opacity ) }) 512 | .animate({ opacity: 1 }); 513 | 514 | // click mask remove it 515 | $( bgclsjq ).on( "click", ( event, data ) => { 516 | if ( !simpread.focus.mask && !data ) return; 517 | $( bgclsjq ).animate({ opacity: 0 }, { 518 | complete: ()=> { 519 | current_state = ""; 520 | includeStyle( $focus, focusstyle, focuscls, "delete" ); 521 | excludeStyle( $focus, "add" ); 522 | $( bgclsjq ).remove(); 523 | $( bgclsjq ).off( "click" ); 524 | $( "sr-rd-crlbar fab:not(.setting,.about)" ).removeClass( "crlbar-close" ).text( "简悦" ); 525 | } 526 | }); 527 | 528 | // remove simpread-focus-mask style 529 | $parent = $focus.parent(); 530 | tag = $parent[0].tagName; 531 | while ( tag && tag.toLowerCase() != "body" ) { 532 | includeStyle( $parent, maskstyle, maskcls, "delete" ); 533 | $parent = $parent.parent(); 534 | tag = $parent[0].tagName; 535 | } 536 | }); 537 | 538 | // set focus controlbar 539 | $( "sr-rd-crlbar fab:not(.setting,.about)" ).addClass( "crlbar-close" ).text( "" ); 540 | } 541 | 542 | /** 543 | * Read mode 544 | */ 545 | function readMode() { 546 | const $root = $( "html" ), 547 | bgtmpl = `

548 | 549 | 550 | 551 | 552 | 553 | 554 | 555 | 556 | 全文完 557 | 558 | 559 | 560 |

本文由简悦 SimpRead 优化，用以提升阅读体验

561 |

使用了全新的简悦词法分析引擎^beta，点击查看详细说明

562 |

563 | 564 | 565 | 566 | 567 | 568 | 569 |

570 | 571 | 572 | 573 | 574 | 575 | 576 | 577 |

`, 578 | multiple = ( include, avatar ) => { 579 | const contents = [], 580 | names = avatar[ 0 ].name, 581 | urls = avatar[ 1 ].url; 582 | include.each( ( idx, item ) => { 583 | const art = {}; 584 | art.name = $( names[idx] ).text(); 585 | art.url = $( urls[idx] ).attr( "src" ); 586 | art.content = $( item ).html(); 587 | !art.url && ( art.url = default_src ); 588 | contents.push( art ); 589 | }); 590 | const child = contents.map( item => { 591 | return ` 592 | 593 |

594 | ${ item.name } 595 | 596 | ${ item.content } 597 | `; 598 | }); 599 | $( "sr-rd-content" ).html( child ); 600 | }, 601 | paging = page => { 602 | const prev = page[0].prev, 603 | next = page[1].next, 604 | btn_next = mduikit.Button( "btn-next", "后一页 →", { href: next == undefined ? "javascript:;" : next, disable: next == undefined ? true : false, color: "#fff", bgColor: "#1976D2" }), 605 | btn_prev = mduikit.Button( "btn-prev", "← 前一页", { href: prev == undefined ? "javascript:;" : prev, disable: prev == undefined ? true : false, color: "#fff", bgColor: "#1976D2" }); 606 | if ( !prev && !next ) $( "sr-page" ).remove(); 607 | else $( "sr-page" ).html( btn_prev + btn_next ); 608 | }, 609 | special = ()=> { 610 | if ( pr.current.site.name == "qdaily.com" ) { 611 | new Notify().Render( "简悦 · 轻阅版并不支持此站的适配，如需请使用完整版。" ); 612 | return true; 613 | } 614 | if ( pr.html.include.includes && pr.html.include.includes( "sr-rd-content-error" ) ) { 615 | //new Notify().Render( `当前页面结构改变导致不匹配阅读模式，请报告此页面` ); 616 | //simpread.read.highlight == true && tempMode( "read" ); 617 | //return true; 618 | console.warn( '=== Adapter failed call Readability View ===' ) 619 | pr.Readability(); 620 | pr.ReadMode(); 621 | return false; 622 | } 623 | }; 624 | 625 | if ( pr.isMathJax() && pr.state == "temp" ) { 626 | console.warn( '=== MathJax Mode ===' ) 627 | const dom = pr.MathJaxMode(); 628 | if ( typeof dom == "undefined" ) { 629 | new Notify().Render( "智能感知失败，请移动鼠标框选。" ); 630 | highlight().done( dom => { 631 | storage.pr.TempMode( "read", dom ); 632 | Render( false ); 633 | }); 634 | } else if ( typeof dom == "string" ) { 635 | const html = pr.GetDom( dom, "html" ); 636 | pr.Newsite( "read", html ); 637 | } else { 638 | pr.TempMode( "read", dom[0] ); 639 | } 640 | } 641 | pr.ReadMode(); 642 | 643 | if ( special() ) return; 644 | 645 | if ( current_state == "read" ) { 646 | new Notify().Render( "请误重复进入。" ); 647 | return; 648 | } else if ( current_state != "" ) { 649 | new Notify().Render( "请先退出当前模式。" ); 650 | return; 651 | } else current_state = "read"; 652 | 653 | $( "body" ).addClass( "simpread-hidden" ); 654 | $root 655 | .addClass( "simpread-font" ) 656 | .addClass( "simpread-theme-root" ) 657 | .append( bgtmpl ); 658 | 659 | $( ".simpread-read-root" ) 660 | .addClass( "simpread-theme-root" ) 661 | .animate( { opacity: 1 }, { delay: 100 }) 662 | .addClass( "simpread-read-root-show" ); 663 | 664 | $( "sr-rd-title" ).html( pr.html.title ); 665 | if ( pr.html.desc != "" && pr.html.desc != undefined ) $( "sr-rd-desc" ).html( pr.html.desc ); 666 | else $( "sr-rd-desc" ).remove(); 667 | if ( pr.html.avatar ) multiple( pr.html.include, pr.html.avatar ); 668 | else $( "sr-rd-content" ).html( pr.html.include ); 669 | if ( pr.html.paging ) paging( pr.html.paging ); 670 | else $( "sr-page" ).remove(); 671 | 672 | $("sr-rd-content").find( pr.Exclude( $("sr-rd-content") ) ).remove(); 673 | pr.Beautify( $( "sr-rd-content" ) ); 674 | pr.Format( "simpread-read-root" ); 675 | 676 | GM_addStyle( theme[`theme_${simpread.read.theme}`] ); 677 | style.FontFamily( simpread.read.fontfamily ); 678 | style.FontSize( simpread.read.fontsize ); 679 | style.Layout( simpread.read.layout ); 680 | 681 | pr.pure && codeHighlight(); 682 | simpread.read.toc && toc(); 683 | 684 | // exit 685 | $( ".simpread-read-root sr-rd-crlbar fab:not(.setting)" ).one( "click", event => { 686 | $( ".simpread-read-root" ).animate( { opacity: 0 }, { 687 | delay: 100, 688 | complete: () => { 689 | current_state = ""; 690 | $root.removeClass( "simpread-theme-root" ) 691 | .removeClass( "simpread-font" ); 692 | if ( $root.attr("style") ) $root.attr( "style", $root.attr("style").replace( "font-size: 62.5%!important", "" )); 693 | $( "body" ).removeClass( "simpread-hidden" ); 694 | $( ".simpread-read-root" ).remove(); 695 | $( "head #sr-rd-mobile" ).remove(); 696 | } 697 | }).addClass( "simpread-read-root-hide" ); 698 | }); 699 | $( ".simpread-read-root sr-rd-crlbar fab:not(.setting)" ).mouseover( () => { 700 | $( ".simpread-read-root sr-rd-crlbar fab.setting" ).addClass( "show" ); 701 | }); 702 | $( ".simpread-read-root sr-rd-crlbar" ).mouseleave( () => { 703 | $( "sr-rd-crlbar fab.setting" ).removeClass( "show" ); 704 | }); 705 | $( ".simpread-read-root sr-rd-crlbar fab.setting" ).click( () => { 706 | wheelmenu(); 707 | }); 708 | }; 709 | 710 | /** 711 | * Temp Read mode 712 | * 713 | * @param {string} include: focus, read 714 | */ 715 | function tempMode( mode = "read" ) { 716 | new Notify().Render( "当前并未适配阅读模式，请移动鼠标手动生成临时阅读模式。" ); 717 | highlight().done( dom => { 718 | if ( mode == "read" ) { 719 | pr.TempMode( mode, dom.outerHTML ); 720 | readMode(); 721 | } else focusMode( dom ); 722 | }); 723 | } 724 | 725 | /** 726 | * Highlight 727 | * 728 | * @return {promise} promise 729 | */ 730 | function highlight() { 731 | const highlight_class= "simpread-highlight-selector"; 732 | let $prev; 733 | const dtd = $.Deferred(), 734 | mousemoveEvent = event => { 735 | if ( !$prev ) { 736 | $( event.target ).addClass( highlight_class ); 737 | } else { 738 | $prev.removeClass( highlight_class ); 739 | $( event.target ).addClass( highlight_class ); 740 | } 741 | $prev = $( event.target ); 742 | }; 743 | $( "body" ).one( "click", event => { 744 | if ( !$prev ) return; 745 | $( event.target ).removeClass( highlight_class ); 746 | $( "body" ).off( "mousemove", mousemoveEvent ); 747 | $prev = undefined; 748 | dtd.resolve( event.target ); 749 | }); 750 | $( "body" ).one( "keydown", event => { 751 | if ( event.keyCode == 27 && $prev ) { 752 | $( event.target ).find( `.${highlight_class}` ).removeClass( highlight_class ); 753 | $( "body" ).off( "mousemove", mousemoveEvent ); 754 | $prev = undefined; 755 | } 756 | }); 757 | $( "body" ).on( "mousemove", mousemoveEvent ); 758 | return dtd; 759 | } 760 | 761 | /** 762 | * Code highlight 763 | */ 764 | function codeHighlight() { 765 | $("head").append( '' ); 766 | // source from https://simpread.ksria.cn/plugins/details/klGUASLasg version 0.0.5 767 | const $content = $( 'sr-rd-content' ); 768 | if ( location.host == "blog.csdn.net" ) { 769 | // remove svg 770 | $content.find( "svg" ).map( function( idx, item ) { 771 | if ( $(item).attr("title") == "CSDN认证原创" ) { 772 | $(item).remove(); 773 | } else if ( $(item).html().trim().startsWith( ' 0 ) { 787 | $content.find( "pre" ).map(function(idx,item){ 788 | $(item).prev().remove(); 789 | }) 790 | } 791 | } 792 | 793 | // format pre 794 | if ( $("body").find( "div[data-prism-highlighted]" ).length > 0 ) { 795 | // e.g. https://zh.javascript.info/hello-world 796 | $content.find( "pre" ).map( ( idx, item ) => { 797 | $(item).text( $($("body").find( "pre" )[idx]).find( "code.language-markup" )[0].outerText ) 798 | }); 799 | } else if ( $("body").find( ".crayon-syntax" ).length > 0 ) { 800 | // crayon-syntax 801 | $content.find( "table" ).map( ( idx, item ) => { 802 | if ( $(item).find( "td" ).attr( "data-settings" ) ) { 803 | const html = $($(item).find("tbody td")[1])[0].innerText; 804 | $(item).replaceWith( `

${html}

` ); 805 | } 806 | }); 807 | } else if ( $content.find( "table code" ).length > 0 ) { 808 | // syntaxhighlighter 809 | $content.find( "table" ).map( ( idx, item ) => { 810 | if ( $(item).find( "code" ).length > 0 ) { 811 | const html = $($(item).find("tbody td")[1])[0].innerText; 812 | $(item).replaceWith( `

${html}

` ); 813 | } 814 | }); 815 | } else if ( $content.find( "pre code" ).length == 0 && $content.find( "pre" ).length > 0 ) { 816 | //NOT-TODO 817 | } else if ( $("body").find( 'pre code li' ).length > 0 ) { 818 | // pre code → li 819 | $("body").find( 'pre' ).map( function( idx, pre ) { 820 | let html = ""; 821 | $(pre).find( 'li' ).map( function( idx, item ) { 822 | idx = idx; 823 | html += item.innerText + "\n" 824 | }) 825 | $($content.find( "pre" )[idx]).html( html.replace(//ig,">") ); 826 | }) 827 | } else if ( $content.find( "table pre" ).length > 0 ) { 828 | // pre → table 829 | $("table").map(function( idx, item ) { 830 | let html = ""; 831 | $(item).find("pre").map( function(indx, pre) { 832 | html += pre.innerText + "\n"; 833 | }); 834 | html != "" && $(item).replaceWith( "

" + html.replace(//ig,">").trim() + "

" ); 835 | }); 836 | } else if ( $("body").find( "pre code" ).length > 0 ) { 837 | // pre → code 838 | let arr = {}; 839 | $("body").find( "pre" ).map(function( idx, item ) { 840 | let html = ""; 841 | if ( $(item).find( "code" ).length > 0 ) { 842 | if ( $(item).find( "code" ).length > 1 ) { 843 | html = item.innerText; 844 | } else { 845 | html = $(item).find( "code" ).text(); 846 | } 847 | arr[idx] = html; 848 | } 849 | }); 850 | $content.find( "pre" ).map(function( idx, item ) { 851 | $(item).html( arr[idx].replace(//ig,">").trim() ); 852 | }); 853 | } 854 | 855 | // remove lines 856 | $content.find( "pre" ).map( function( idx, item ) { 857 | const $target = $(item); 858 | const lines = item.innerHTML.split('\n'); 859 | let html = ""; 860 | for( let i = 0; i < lines.length; i++ ) { 861 | const line = lines[i]; 862 | if ( !/^\d+$/.test( line.trim() ) ) { 863 | html += line + "\n"; 864 | } 865 | } 866 | $target.html( html.trim() ) 867 | }); 868 | 869 | // mark 870 | Mousetrap.bind( 'h h h', function() { 871 | new Notify().Render( "移动鼠标框选需要重新整理并高亮代码的区域。" ); 872 | mark().done( dom => { 873 | let $target = $(dom), 874 | $parent = $target.parent(); 875 | if ( $target.is( "td" ) || $parent.is("td") ) { 876 | $target = $parent.parent().parent(); 877 | } 878 | $target.html( `

${dom.innerText}

` ); 879 | hljs.highlightBlock($target.find("pre")[0]); 880 | }); 881 | }); 882 | 883 | function mark() { 884 | const highlight_class = "simpread-highlight-selector"; 885 | let $prev; 886 | const dtd = $.Deferred(), 887 | mousemoveEvent = event => { 888 | if ( !$prev ) { 889 | $( event.target ).addClass( highlight_class ); 890 | } else { 891 | $prev.removeClass( highlight_class ); 892 | $( event.target ).addClass( highlight_class ); 893 | } 894 | $prev = $( event.target ); 895 | }; 896 | $content.one( "click", event => { 897 | if ( !$prev ) return; 898 | $( event.target ).removeClass( highlight_class ); 899 | $content.off( "mousemove", mousemoveEvent ); 900 | $prev = undefined; 901 | dtd.resolve( event.target ); 902 | }); 903 | $("html").one( "keydown", event => { 904 | if ( event.keyCode == 27 && $prev ) { 905 | $content.find( `.${highlight_class}` ).removeClass( highlight_class ); 906 | $content.off( "mousemove", mousemoveEvent ); 907 | $prev = undefined; 908 | event.preventDefault(); 909 | return false; 910 | } 911 | }); 912 | $content.on( "mousemove", mousemoveEvent ); 913 | return dtd; 914 | } 915 | 916 | $content.find( 'pre' ).map( function(idx,item){ 917 | hljs.highlightBlock(item); 918 | }); 919 | 920 | // change pre background by theme 921 | switch ( simpread.read.theme ) { 922 | case 'github': 923 | case 'pixyii': 924 | case 'gothic': 925 | $("head").append( '' ) 926 | break; 927 | case 'monospace': 928 | $("head").append( '' ) 929 | break; 930 | case 'engwrite': 931 | $("head").append( '' ) 932 | break; 933 | case 'newsprint': 934 | $("head").append( '' ) 935 | break; 936 | case 'octopress': 937 | $("head").append( '' ) 938 | break; 939 | case 'dark': 940 | $("head").append( '' ) 941 | break; 942 | case 'night': 943 | $("head").append( '' ) 944 | break; 945 | } 946 | } 947 | 948 | /** 949 | * Wheel menu buttons 950 | */ 951 | function wheelmenu() { 952 | if ( $(".sr-rd-trigger").length > 0 ) { 953 | $(".sr-rd-trigger").remove(); 954 | $("head #blooming-menu__root").remove(); 955 | return; 956 | }; 957 | const menu = new BloomingMenu({ 958 | startAngle: -180, 959 | endAngle: 0, 960 | radius: 120, 961 | itemsNum: 7, 962 | itemAnimationDelay: 0, 963 | isAutoClose: false 964 | }); 965 | menu.render(); 966 | menu.open() 967 | menu.props.elements.items.forEach(function (item, index) { 968 | item.addEventListener('click', function () { 969 | if ( $( '.sr-rd-trigger[draggable="true"]' ).length > 0 ) return; 970 | switch ( index ) { 971 | case 0: 972 | case 1: 973 | const size = parseFloat( simpread.read.fontsize ) + ( index == 0 ? 3 : -3 ); 974 | simpread.read.fontsize = `${size}%`; 975 | style.FontSize( simpread.read.fontsize ); 976 | GM_setValue( "simpread", simpread ); 977 | break; 978 | case 2: 979 | case 3: 980 | const layout = parseFloat( simpread.read.layout ) + ( index == 3 ? 3 : -3 ); 981 | simpread.read.layout = `${layout}%`; 982 | style.Layout( simpread.read.layout ); 983 | GM_setValue( "simpread", simpread ); 984 | break; 985 | case 4: 986 | case 5: 987 | const arr = Object.keys( theme ), 988 | len = arr.length; 989 | let idx = arr.indexOf( `theme_${simpread.read.theme}` ) + + ( index == 4 ? 1 : -1 ); 990 | if ( idx == len ) { 991 | idx = 0; 992 | } else if ( idx == -1 ) { 993 | idx = len -1; 994 | } 995 | // remove old theme 996 | $( "head" ).find( "style" ).map( (index, item) => { 997 | const $target = $(item), 998 | css = $target.text(); 999 | if ( css.startsWith( "sr-rd-theme-" + simpread.read.theme ) ) { 1000 | $target.remove(); 1001 | } 1002 | }); 1003 | // add new theme 1004 | simpread.read.theme = arr[idx].replace( "theme_", "" ); 1005 | GM_setValue( "simpread", simpread ); 1006 | GM_addStyle( theme[`theme_${simpread.read.theme}`] ); 1007 | break; 1008 | case 6: 1009 | menu.remove(); 1010 | $(".sr-rd-trigger").remove(); 1011 | $("head #blooming-menu__root").remove(); 1012 | break; 1013 | } 1014 | }) 1015 | }); 1016 | setTimeout( ()=> { 1017 | $(".simpread-read-root").append( `

` ); 1018 | $(".sr-rd-trigger").append( $(".blooming-menu__container") ); 1019 | $(".simpread-read-root .blooming-menu__main-content").html( `` ); 1020 | $($(".simpread-read-root .blooming-menu__item-btn")[0]).html( `` ); 1021 | $($(".simpread-read-root .blooming-menu__item-btn")[1]).html( `` ); 1022 | $($(".simpread-read-root .blooming-menu__item-btn")[2]).html( `` ); 1023 | $($(".simpread-read-root .blooming-menu__item-btn")[3]).html( `` ); 1024 | $($(".simpread-read-root .blooming-menu__item-btn")[4]).html( `` ); 1025 | $($(".simpread-read-root .blooming-menu__item-btn")[5]).html( `` ); 1026 | $($(".simpread-read-root .blooming-menu__item-btn")[6]).html( `` ); 1027 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[0]).attr( "data-balloon-pos", "left" ).attr( "aria-label", "增加字体" ); 1028 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[1]).attr( "data-balloon-pos", "up" ).attr( "aria-label", "减小字体" ); 1029 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[2]).attr( "data-balloon-pos", "up" ).attr( "aria-label", "减小留白" ); 1030 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[3]).attr( "data-balloon-pos", "up" ).attr( "aria-label", "增加留白" ); 1031 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[4]).attr( "data-balloon-pos", "up" ).attr( "aria-label", "前一个主题" ); 1032 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[5]).attr( "data-balloon-pos", "up" ).attr( "aria-label", "后一个主题" ); 1033 | $($(".simpread-read-root .blooming-menu__item-btn-wrapper")[6]).attr( "data-balloon-pos", "right" ).attr( "aria-label", "退出" ); 1034 | $( "body" ).find( ".blooming-menu__container" ).remove(); 1035 | const position = GM_getValue( "simpread_trigger_pos" ); 1036 | if ( position && position['div'] ) { 1037 | const { x, y } = position['div']; 1038 | $( '.sr-rd-trigger' ) 1039 | .attr( 'data-x', x ) 1040 | .attr( 'data-y', y ) 1041 | .css({ 1042 | 'transform': `translate(${x}px, ${y}px)`, 1043 | '-webkit-transform': `translate(${x}px, ${y}px)`, 1044 | }); 1045 | } 1046 | }, 100 ); 1047 | 1048 | let preScroll = 0; 1049 | $(document).scroll( () => { 1050 | if ( $(document).scrollTop() > preScroll ) { 1051 | menu.close(); 1052 | } else { 1053 | //TO-DO 1054 | } 1055 | preScroll = $(document).scrollTop(); 1056 | }); 1057 | } 1058 | 1059 | /** 1060 | * toc 1061 | */ 1062 | function toc() { 1063 | const table = [], 1064 | cls = simpread.read.toc_hide ? "toc-bg-hidden" : ""; 1065 | $("sr-read").find( "h1, h2, h3, h4" ).map( ( idx, item) => { 1066 | const $item = $( item ), 1067 | tag = $item[0].tagName.toLowerCase(), 1068 | value = $item.text(); 1069 | let id = $item.attr( "id" ); 1070 | id = id == undefined ? `sr-toc-${idx}` : `${id}-${idx}` 1071 | $item.attr( "id", id ); 1072 | value && table.push({ 1073 | level: `toc-level-${tag}`, 1074 | id, 1075 | value, 1076 | }); 1077 | }); 1078 | console.log( "current toc is ", table ) 1079 | let tmpl = ""; 1080 | table.forEach( ( item, idx ) => { 1081 | tmpl += ` 1082 | 1083 | ${ item.value } 1084 | `; 1085 | }); 1086 | $("sr-read").append( `${tmpl}` ); 1087 | let is_click = false; 1088 | $("sr-read toc outline a").on( "click", event => { 1089 | is_click = true; 1090 | const $target = $( event.target ).parent(); 1091 | $target.parent().find( "active" ).removeClass( "toc-outline-active" ); 1092 | $target.find( "active" ).addClass( "toc-outline-active" ); 1093 | 1094 | const href = $( event.target ).attr("href"), 1095 | offsetTop = href === "#" ? 0 : $(href).offset().top - 5; 1096 | $( "html" ).stop().animate({ 1097 | scrollTop: offsetTop 1098 | }, 300, () => { 1099 | setTimeout( ()=>is_click = false, 500 ); 1100 | }); 1101 | event.preventDefault(); 1102 | }) 1103 | simpread.read.toc_hide ? 1104 | $('head').append( `` ) 1105 | : $( "toc" ).css({ "width" : "initial" }); 1106 | } 1107 | 1108 | /** 1109 | * Drag 1110 | */ 1111 | function dragging() { 1112 | const position = GM_getValue( "simpread_trigger_pos" ) || {}; 1113 | interact( '.draggable' ).draggable({ 1114 | onmove: event => { 1115 | const target = event.currentTarget, 1116 | id = target.tagName.toLowerCase(), 1117 | x = ( parseFloat(target.getAttribute('data-x')) || 0 ) + event.dx, 1118 | y = ( parseFloat(target.getAttribute('data-y')) || 0 ) + event.dy; 1119 | $( target ) 1120 | .attr( "draggable", true ) 1121 | .attr( 'data-x', x ) 1122 | .attr( 'data-y', y ) 1123 | .css({ 1124 | 'transform': `translate(${x}px, ${y}px)`, 1125 | '-webkit-transform': `translate(${x}px, ${y}px)` 1126 | }); 1127 | position[id] = { x,y }; 1128 | GM_setValue( "simpread_trigger_pos", position ); 1129 | }, 1130 | onend: event => { 1131 | setTimeout( () => $( event.currentTarget ).attr( "draggable", false ), 500 ); 1132 | } 1133 | }); 1134 | } 1135 | 1136 | /** 1137 | * Option Mode 1138 | */ 1139 | function optionMode() { 1140 | const close = event => { 1141 | mduikit.Destory(); 1142 | $( ".simpread-option-root" ) 1143 | .animate({ opacity: 0 }, { complete: ()=>{ 1144 | current_state = ""; 1145 | $( ".simpread-option-root" ).remove(); 1146 | }}); 1147 | }, 1148 | save = event => { 1149 | setter( $("#txt-option").val(), "option" ); 1150 | setter( $("#txt-focus ").val(), "focus" ); 1151 | setter( $("#txt-read ").val(), "read" ); 1152 | GM_setValue( "simpread", simpread ); 1153 | console.log( "current simpread is ", simpread ) 1154 | new Notify().Render( "保存成功，请刷新当前页面，以便新配置文件生效。" ); 1155 | }, 1156 | imports = event => { 1157 | const input = document.createElement( "input" ), 1158 | $input = $(input), 1159 | onload = event => { 1160 | if ( event && event.target && event.target.result ) { 1161 | try { 1162 | const json = JSON.parse( event.target.result ); 1163 | if ( json.version && json.version.replace( /\./g, "" ) < simpread.version.replace( /\./g, "" ) ) { 1164 | new Notify().Render( 2, "上传的版本太低，已转换为最新版版本！" ); 1165 | } 1166 | Object.keys( simpread.focus ).forEach( key => { json.focus[key] != undefined && (simpread.focus[key] = json.focus[key] )}); 1167 | Object.keys( simpread.read ).forEach( key => { json.read[key] != undefined && (simpread.read[key] = json.read[key] )}); 1168 | Object.keys( simpread.option ).forEach( key => { json.option[key] != undefined && (simpread.option[key] = json.option[key] )}); 1169 | GM_setValue( "simpread", simpread ); 1170 | if ( json.websites ) { 1171 | pr.sites.custom = [ ...json.websites.custom ]; 1172 | pr.sites.local = [ ...json.websites.local ]; 1173 | GM_setValue( "simpread_db", pr.sites ); 1174 | new Notify().Render( `已导入本地适配源：${ pr.sites.local.length} 条；官方次适配源：${pr.sites.custom.length} 条。` ); 1175 | console.log( "new simpread db", pr.sites ) 1176 | } 1177 | new Notify().Render( "导入成功，请刷新当前页面，以便新配置文件生效。" ); 1178 | } catch ( error ) { new Notify().Render( 2, "上传失败，配置文件解析失败，请重新确认。" ); } 1179 | } 1180 | }; 1181 | $input.attr({ type : "file", multiple : "false" }) 1182 | .one( "change", event => { 1183 | const reader = new FileReader(); 1184 | reader.onload = onload; 1185 | reader.readAsText( event.target.files[0] ); 1186 | }); 1187 | $input.trigger( "click" ); 1188 | }, 1189 | exports = event => { 1190 | const data = "data:text/json;charset=utf-8," + encodeURIComponent( JSON.stringify( simpread )); 1191 | const $a = $( `` ).appendTo( "body" ); 1192 | $a[0].click(); 1193 | $a.remove(); 1194 | }, 1195 | remote = event => { 1196 | if ( location.protocol == "https:" ) { 1197 | new Notify().Render( `请勿在 https 下面使用此功能，请前往 http 的页面，如：点击这里` ); 1198 | return; 1199 | } 1200 | $.getJSON( "http://sr.ksria.cn/website_list_v4.json" + "?_=" + Math.round(+new Date()), result => { 1201 | const count = pr.Addsites( result ); 1202 | count > 0 && GM_setValue( "simpread_db", pr.sites ); 1203 | count == 0 ? new Notify().Render( "适配列表已同步至最新版本。" ) : new Notify().Render( 0, `适配列表已同步成功，本次新增 ${ count } 个站点。` ); 1204 | }); 1205 | }, 1206 | clean = event => { 1207 | new Notify().Render( "是否清除掉本地配置文件？", "同意 ", () => { 1208 | simpread = { ...org_simp }; 1209 | GM_setValue( "simpread", simpread ); 1210 | pr.sites = { global:[], custom:[], local:[] }; 1211 | GM_deleteValue( "simpread_db" ); 1212 | new Notify().Render( "清除成功，请刷新本页!" ); 1213 | }); 1214 | }, 1215 | getter = ( value, type ) => { 1216 | try { 1217 | const arr = value.split( "\n" ).map( str => { 1218 | str = str.trim(); 1219 | if ( str.startsWith( "set_" ) ) { 1220 | str = str.replace( "set_", "" ); 1221 | const key = str.split( ":" )[0]; 1222 | let value = str.split( ":" )[1]; 1223 | if ( simpread[type][key] != undefined ) { 1224 | value = simpread[type][key]; 1225 | ![ "whitelist", "exclusion", "blacklist" ].includes( key ) && value === "" && ( value = org_simp[type][key] ); 1226 | return `set_${key}: ${value}`; 1227 | } 1228 | } else return str; 1229 | }); 1230 | return arr.join( "\n" ); 1231 | } catch ( error ) { 1232 | new Notify().Render( 2, "设置出现了问题，请重新打开设置。" ); 1233 | } 1234 | }, 1235 | setter = ( value, type ) => { 1236 | try { 1237 | const arr = value.split( "\n" ).forEach( str => { 1238 | str = str.trim(); 1239 | if ( str.startsWith( "set_" ) ) { 1240 | str = str.replace( "set_", "" ); 1241 | const key = str.split( ":" )[0]; 1242 | if ( [ "exclusion", "whitelist", "blacklist" ].includes( key )) { 1243 | const value = str.replace( `${key}:`, "" ).trim(); 1244 | simpread[type][key] = value.split(","); 1245 | } 1246 | else if ( simpread[type][key] != undefined ) { 1247 | let value = str.split( ":" )[1].trim(); 1248 | if ( typeof simpread[type][key] == "boolean" ) { 1249 | simpread[type][key] = value == "true" ? true : false; 1250 | } else simpread[type][key] = value.trim(); 1251 | } 1252 | } 1253 | }); 1254 | } catch ( error ) { 1255 | new Notify().Render( 2, "设置出现了问题，请重新打开设置。" ); 1256 | } 1257 | }, 1258 | btn_cancel = mduikit.Button( "opt-cancel", "关闭", { color: "rgb(33, 150, 243)", type: "flat", onclick: close, mode: "secondary" }), 1259 | btn_save = mduikit.Button( "opt-save", "保存", { color: "rgb(33, 150, 243)", type: "flat", onclick: save }), 1260 | btn_import = mduikit.Button( "opt-import", "从本地导入配置文件", { color: "#fff", bgColor: "#FF5252", type: "flat", width: "100%", onclick: imports }), 1261 | btn_export = mduikit.Button( "opt-export", "导出配置文件到本地", { color: "#fff", bgColor: "#2196F3", type: "flat", width: "100%", onclick: exports }), 1262 | btn_remote = mduikit.Button( "opt-remote", "手动同步适配列表", { color: "#fff", bgColor: "#2196F3", type: "flat", width: "100%", onclick: remote }), 1263 | btn_clean = mduikit.Button( "opt-clean", "清除数据", { color: "#fff", bgColor: "#757575", type: "flat", width: "100%", onclick: clean }), 1264 | txt_option = mduikit.Textarea( "txt-option", getter(opt_value, "option"), { color: "rgba(51, 51, 51, 0.6)", state_color: "rgb(33, 150, 243)", size: "11px", height: "130px" }), 1265 | txt_focus = mduikit.Textarea( "txt-focus", getter(focus_value, "focus"), { color: "rgba(51, 51, 51, 0.6)", state_color: "rgb(33, 150, 243)", size: "11px" }), 1266 | txt_read = mduikit.Textarea( "txt-read", getter(read_value, "read"), { color: "rgba(51, 51, 51, 0.6)", state_color: "rgb(33, 150, 243)", size: "11px" }), 1267 | optmpl = `

1268 | 1269 | 选项页 1270 | 1271 | 1272 | 导入和导出 1273 | ${ btn_import + btn_export } 1274 | 1275 | 1276 | 同步与清除 1277 | ${ btn_remote + btn_clean } 1278 | 1279 | 1280 | 全局 1281 | ${ txt_option } 1282 | 1283 | 1284 | 聚焦模式 1285 | ${ txt_focus } 1286 | 1287 | 1288 | 阅读模式 1289 | ${ txt_read } 1290 | 1291 | 1292 | 1293 | ${btn_cancel + btn_save} 1294 | 1295 | 1296 |

`; 1297 | if ( current_state == "option" ) { 1298 | new Notify().Render( "请误重复进入。" ); 1299 | return; 1300 | } else if ( current_state != "" ) { 1301 | new Notify().Render( "请先退出当前模式。" ); 1302 | return; 1303 | } else current_state = "option"; 1304 | $( "html" ).append( optmpl ); 1305 | $( ".simpread-option-root" ).animate({ opacity: 1 }); 1306 | const [ h1, h2 ] = [ $("dialog-gp").height(), $(".simpread-option-root").height() ]; 1307 | if ( h2 <= h1 ) { 1308 | $("dialog-gp").height( h2 - 80 ); 1309 | } 1310 | } 1311 | 1312 | /** 1313 | * About Mode 1314 | */ 1315 | function aboutMode() { 1316 | const close = ( event, cb ) => { 1317 | mduikit.Destory(); 1318 | $( ".simpread-option-root" ) 1319 | .animate({ opacity: 0 }, { complete: ()=>{ 1320 | current_state = ""; 1321 | $( ".simpread-option-root" ).remove(); 1322 | cb && cb(); 1323 | }}); 1324 | }, 1325 | option = event => { 1326 | close( event, () => optionMode() ); 1327 | }, 1328 | btn_cancel = mduikit.Button( "opt-cancel", "关闭", { color: "rgb(33, 150, 243)", type: "flat", onclick: close }), 1329 | btn_open = mduikit.Button( "opt-open", "设定", { color: "rgb(33, 150, 243)", type: "flat", onclick: option, mode: "secondary" }), 1330 | optmpl = `

1331 | 1332 | 关于 1333 | 1334 |

1335 |

1336 | 1337 | 1338 | 1339 |

1340 |

1341 |

1342 | 你好，我是简悦 · 轻阅版的开发者 Kenshin，很高兴看到你能使用它。
1343 | 它是一个阅读模式类的油猴脚本，也是简悦的轻量级版本。
1344 | 拥有简悦的一切特性，更具有「加载速度快 · 只关注阅读模式呈现」等特点。
1345 | 简悦的初衷：还原一个干净的阅读空间，提升你的阅读体验。
1346 | 截至到目前为止，简悦已经精准适配了 ${ pr.sites.global.length }个网址，详细请看这里。
1347 | 简悦是一个免费且开源的项目，占用了我绝大多数的业余时间。
1348 | 如果觉得它还不错，希望可以给我投票或请我喝杯咖啡，这是对简悦的最大鼓励。
1349 | 现在就加入 Telegram 群，获取简悦的第一手资料。
1350 |

1351 | 1352 | 1353 | ${btn_open + btn_cancel} 1354 | 1355 | 1356 |

`; 1357 | if ( current_state == "option" ) { 1358 | new Notify().Render( "请误重复进入。" ); 1359 | return; 1360 | } else if ( current_state != "" ) { 1361 | new Notify().Render( "请先退出当前模式。" ); 1362 | return; 1363 | } else current_state = "option"; 1364 | $( "html" ).append( optmpl ); 1365 | $( ".simpread-option-root" ).animate({ opacity: 1 },{ complete: ()=>{ 1366 | const [ h1, h2 ] = [ $("dialog-gp").height(), $(".simpread-option-root").height() ]; 1367 | if ( h2 <= h1 ) { 1368 | $("dialog-gp").animate({height: h2 - 80 }); 1369 | } 1370 | }}); 1371 | } --------------------------------------------------------------------------------

简悦 - SimpRead

简悦 · 轻阅版