Skip to content

Instantly share code, notes, and snippets.

@Kenshin

Kenshin/main.js

Created September 3, 2018 07:29
Show Gist options
  • Save Kenshin/4b981094a615540c30fc63451e038d30 to your computer and use it in GitHub Desktop.
Save Kenshin/4b981094a615540c30fc63451e038d30 to your computer and use it in GitHub Desktop.
Download ZIP
划词搜索 → 简悦插件 → https://github.com/Kenshin/simpread/wiki/插件编写
Raw
main.js
const root = 'sr-plugin-search',
google = '<svg t="1531450684775" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1048" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M518.848 449.152l414.272 0q6.848 38.272 6.848 73.152 0 124-52 221.44t-148.288 152.288-220.864 54.848q-89.728 0-170.848-34.56t-140-93.44-93.44-140-34.56-170.848 34.56-170.848 93.44-140 140-93.44 170.848-34.56q171.424 0 294.272 114.848l-119.424 114.848q-70.272-68-174.848-68-73.728 0-136.288 37.152t-99.136 100.864-36.576 139.136 36.576 139.136 99.136 100.864 136.288 37.152q49.728 0 91.424-13.728t68.576-34.272 46.848-46.848 29.44-49.728 12.864-44.576l-249.152 0 0-150.848z" p-id="1049" fill="#ffffff"></path></svg>',
bing = '<svg t="1531450907872" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3129" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M153.813333 0L358.4 71.936V791.893333l288.128-166.186666-141.226667-66.346667-89.173333-221.866667 453.973333 159.488v231.893334L358.528 1024l-204.672-113.92V0z" fill="#ffffff" p-id="3130"></path></svg>',
baidu = '<svg t="1531450985988" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3618" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M226.522 536.053c96.993-20.839 83.792-136.761 80.878-162.089-4.758-39.065-50.691-107.346-113.075-101.952-78.499 7.036-89.957 120.445-89.957 120.445C93.748 444.857 129.764 556.857 226.522 536.053zM329.512 737.61c-2.848 8.175-9.18 29.014-3.686 47.173 10.822 40.707 46.168 42.55 46.168 42.55l50.792 0L422.786 703.169 368.41 703.169C343.952 710.473 332.159 729.468 329.512 737.61zM406.537 341.666c53.572 0 96.859-61.646 96.859-137.9 0-76.12-43.287-137.767-96.859-137.767-53.472 0-96.892 61.646-96.892 137.767C309.645 280.019 353.065 341.666 406.537 341.666zM637.241 350.779c71.598 9.281 117.632-67.141 126.777-125.035 9.349-57.827-36.854-125.036-87.544-136.561-50.791-11.659-114.213 69.688-119.976 122.757C549.597 276.803 565.779 341.566 637.241 350.779zM812.666 691.174c0 0-110.761-85.701-175.425-178.305-87.645-136.593-212.177-81.011-253.822-11.558-41.478 69.452-106.106 113.375-115.286 125-9.314 11.458-133.813 78.666-106.173 201.423 27.64 122.69 124.7 120.345 124.7 120.345s71.53 7.036 154.519-11.524c83.021-18.428 154.484 4.59 154.484 4.59s193.919 64.929 246.988-60.072C895.655 756.037 812.666 691.174 812.666 691.174zM480.881 877.253 354.807 877.253c-54.443-10.855-76.12-48.044-78.867-54.343-2.68-6.433-18.125-36.317-9.951-87.109 23.52-76.12 90.627-81.614 90.627-81.614l67.107 0 0-82.485 57.157 0.871L480.88 877.253zM715.674 876.382l-145.07 0c-56.219-14.508-58.866-54.444-58.866-54.444L511.738 661.49l58.866-0.938 0 144.199c3.586 15.345 22.682 18.159 22.682 18.159l59.771 0L653.057 661.49l62.618 0L715.675 876.382zM921.051 448.006c0-27.708-23.018-111.13-108.385-111.13-85.501 0-96.925 78.732-96.925 134.382 0 53.136 4.489 127.313 110.695 124.935C932.677 593.846 921.051 475.881 921.051 448.006z" p-id="3619" fill="#ffffff"></path></svg>',
wiki = '<svg t="1531451085368" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4153" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M638.72 808.533333 529.493333 551.253333C485.973333 636.16 438.186667 725.333333 397.226667 808.533333 396.8 808.96 377.173333 808.533333 377.173333 808.533333 314.453333 661.333333 249.6 516.266667 186.453333 370.346667 171.946667 334.506667 120.746667 277.333333 85.333333 277.333333 85.333333 273.066667 85.333333 263.68 85.333333 258.133333L301.226667 258.133333 301.226667 277.333333C275.626667 277.333333 232.106667 294.4 243.2 322.133333 273.92 387.84 381.44 642.56 410.88 707.413333 430.933333 667.306667 487.68 561.493333 512 516.693333 492.8 479.146667 432.213333 338.346667 414.293333 303.36 400.64 280.32 366.08 277.333333 339.626667 277.333333 339.626667 270.933333 340.053333 266.666667 339.626667 258.56L529.92 258.986667 529.92 276.053333C503.893333 277.333333 479.573333 286.293333 490.666667 311.04 516.266667 363.946667 531.2 401.92 554.666667 450.986667 561.92 436.48 600.32 357.546667 618.666667 316.16 629.76 288.426667 613.12 277.333333 567.04 277.333333 567.466667 272.213333 567.466667 263.253333 567.466667 258.986667 626.773333 258.56 715.946667 258.56 731.733333 258.133333L731.733333 276.053333C701.44 277.333333 670.293333 293.546667 654.08 318.293333L576 482.133333C583.68 503.893333 659.626667 672.426667 667.733333 691.2L832 314.453333C819.2 283.733333 782.506667 277.333333 768 277.333333 768 271.786667 768 264.533333 768 258.133333L938.666667 259.413333 938.666667 260.266667 938.666667 277.333333C901.12 277.333333 877.653333 298.666667 864 330.666667 829.866667 407.04 725.333333 650.24 657.066667 808.533333 657.066667 808.533333 638.72 808.533333 638.72 808.533333Z" p-id="4154" fill="#ffffff"></path></svg>',
baike = '<svg t="1531451135912" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4457" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M959.562409 923.105079 862.333994 248.89672c-5.554506-38.291095-25.688055-72.128761-56.69014-95.277994-31.004131-23.149233-69.165266-32.838919-107.457384-27.285436s-72.129784 25.687032-95.279017 56.69014c-11.220552 15.027252-19.268856 31.739888-23.961738 49.330522l0-26.857694c0-79.874165-64.98199-144.856156-144.856156-144.856156-46.315862 0-87.621617 21.852704-114.15697 55.785537-26.535353-33.932834-67.841108-55.785537-114.15697-55.785537-79.874165 0-144.856156 64.98199-144.856156 144.856156l0 722.06225c0 2.119267 0.214894 4.188392 0.623193 6.186909 2.862187 13.988596 15.240099 24.512277 30.075992 24.512277l228.313939 0 228.313939 0 379.860471 0c0.833995 0 1.657756-0.042979 2.474354-0.10847 8.388041-0.38374 16.277732-4.185322 21.801539-10.562567C958.213691 940.854325 960.833355 931.921885 959.562409 923.105079zM652.104945 219.757053c13.33675-17.862833 32.832779-29.462009 54.895261-32.660864s44.048215 2.38328 61.910025 15.72003c17.862833 13.33675 29.462009 32.831756 32.658817 54.869678l92.164073 639.102816-160.566976 0-96.804766-615.279225C633.210619 259.500219 638.798894 237.576907 652.104945 219.757053zM671.022807 896.858298l-92.077092 0L578.945715 311.621297 671.022807 896.858298zM122.317837 205.495234c0-46.01808 37.438681-83.457784 83.457784-83.457784s83.457784 37.438681 83.457784 83.457784l0 691.363064L122.317837 896.858298 122.317837 205.495234zM350.631776 896.858298 350.631776 205.495234c0-46.01808 37.438681-83.457784 83.457784-83.457784s83.457784 37.438681 83.457784 83.457784l0 691.363064L350.631776 896.858298z" p-id="4458" fill="#ffffff"></path></svg>',
copy = '<svg t="1531451244469" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5231" xmlns:xlink="http://www.w3.org/1999/xlink" width="14" height="14"><defs><style type="text/css"></style></defs><path d="M704 640l256 0 0 355.968C960 1011.392 947.392 1024 931.968 1024L476.032 1024C460.608 1024 448 1011.392 448 995.968L448 412.032C448 396.608 460.608 384 479.168 384L704 384 704 640zM768 389.376 768 576l192 0-182.464-186.624L768 389.376zM448 69.376 448 192l128 0L457.536 69.376 448 69.376zM384 320l192 0L576 256 384 256 384 64 95.168 64C76.608 64 64 76.608 64 92.032l0 644.8c0 15.424 12.608 28.032 28.032 28.032L384 764.864 384 320z" p-id="5232" fill="#ffffff"></path></svg>';
$content.on( "click", clickEventHandler );
/**
* mouse up event handler
*/
function clickEventHandler( event ) {
//获取选中的文字
let m_word = String( window.getSelection() );
m_word = m_word.replace( /^\s*/, "" ).replace( /\s*$/, "" );
//m_word为空，退出
if ( m_word == "" ) $content.find( 'sr-plugin-search' ).length > 0 && remove();
else {
$content.find( 'sr-plugin-search' ).length > 0 && $( root ).remove();
create( event, m_word );
}
}
/**
* create search box
*/
function create( event, m_word ) {
//获取当前鼠标位置
const width = event.target.offsetWidth,
height = event.target.offsetHeight,
_dict_x = event.clientX + window.scrollX + 5,
_dict_y = event.clientY + window.scrollY - 27 - 5,
tmpl = `<sr-plugin-search style="left: ${_dict_x}px; top: ${_dict_y}px;">
<sr-plugin-search-a data-href="https://www.google.com/search?q=">${google}</sr-plugin-search-a>
<sr-plugin-search-a data-href="https://cn.bing.com/search?q=">${bing}</sr-plugin-search-a>
<sr-plugin-search-a data-href="https://www.baidu.com/s?wd=">${baidu}</sr-plugin-search-a>
<sr-plugin-search-a data-href="https://zh.wikipedia.org/wiki/">${wiki}</sr-plugin-search-a>
<sr-plugin-search-a data-href="https://baike.baidu.com/item/">${baike}</sr-plugin-search-a>
<sr-plugin-search-a data-href="copy">${copy}</sr-plugin-search-a>
</sr-plugin-search->`;
//add dict icon box to body
$content.append( tmpl );
setTimeout( ()=>$( root ).velocity({ opacity: 1 }, { duration: 100 }), 100 );
$( root ).on( 'click', 'sr-plugin-search-a', event => {
let tag = event.target.tagName.toLowerCase(),
href = event.target.dataset.href,
target = event.target;
while ( tag != 'sr-plugin-search-a' ) {
target = target.parentElement;
tag = target.tagName.toLowerCase();
href = target.dataset.href;
}
if ( href == "copy" ) {
const copy = text => {
const $temp = $("<textarea>"),
brRegex = /<br\s*[\/]?>/gi;
$content.append( $temp );
$temp.val( text.replace(brRegex, "\r\n") ).select();
const result = document.execCommand( "copy" );
$temp.remove();
return result;
};
const result = copy( m_word );
result && new Notify().Render( "已成功复制到剪切板。" );
} else {
const $a = $( `<a style="display:none" href="${ href + encodeURI( m_word ) }" target="_blank"></a>` ).appendTo( "body" );
$a[0].click();
$a.remove();
}
});
}
/**
* remove dict box
*/
function remove() {
$( root ).velocity({ opacity: 0 }, { duration: 300 ,complete: () => {$( root ).remove();}});
}
Raw
man.css
sr-plugin-search {
position: absolute;
display: flex;
align-items: center;
margin: 5px;
padding: 0 5px;
color: rgba(255, 255, 255, .9);
background-color: rgba(50, 50, 50, 1);
font-size: 15px;
border-radius: 4px;
box-shadow: 0 2px 5px rgba(0,0,0,.26);
opacity: 0;
}
sr-plugin-search-a {
margin: 5px;
color: inherit;
cursor: pointer;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment