您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Song list history for everynoise.com.
// ==UserScript== // @name Song List // @version 0.1 // @description Song list history for everynoise.com. // @author Randyr // @match http://everynoise.com/ // @include http://everynoise.com/* // @grant none // @require http://code.jquery.com/jquery-3.2.1.min.js // @namespace https://greasyfork.runtimutd.eu.org/users/131271 // ==/UserScript== (function() { 'use strict'; function main() { try { var x = document.getElementById('mirror'); x.className = "centered"; x.style = ""; x = document.getElementById('tunnel'); x.className = "centered"; x.style = ""; } catch (e) {} var div = document.createElement('div'); div.className = "float-bottom"; $('.title').first().after(div); var label_prev = $(document.createElement('p')).text('Previous: '), label_curr = $(document.createElement('p')).text('Current: '), previous_song = $(document.createElement('p')).text('-'), curr_song = $(document.createElement('p')).text('-'), history_button = document.createElement('div'); history_button.className = "button-right"; history_button.innerHTML = "History"; $(div).append(label_prev); $(div).append(previous_song); $(div).append(label_curr); $(div).append(curr_song); $(div).append(history_button); var history_panel = [ '<div id="history-panel" class="modal">', ' <div class="modal-content">', ' <div class="modal-header">', ' <span class="close">×</span>', ' <h2>History</h2>', ' </div>', ' <div class="modal-body">', ' <ol id="history-list"></ol>', ' </div>', ' </div>', '</div>', ].join('\n'); $('body').append(history_panel); var current_song = ''; var playlist = []; function getDivByArtist(artist) { var xpath = '//div[text()="' + artist + '"]'; return document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; } function playlist_append(song_div, song_name) { playlist.push(song_div); curr_song.text(song_name); $('#history-list').append('<li>' + song_name + '</li>'); try { var prev_song = playlist[playlist.length - 2].title.replace('e.g.', ''); previous_song.text(prev_song); } catch (e) { } } function getSong() { if (current_song === nowplaying || nowplaying === '') { return; } current_song = nowplaying; var song_div = getDivByArtist(current_song); var song_name = song_div.title.replace('e.g.', ''); playlist_append(song_div, song_name); } function check() { getSong(); setTimeout(function() { check(); }, 1000); } check(); var modal = document.getElementById('history-panel'); var span = document.getElementsByClassName('close')[0]; history_button.onclick = function() { if (modal.style.display === "block") { modal.style.display = "none"; } else { modal.style.display = "block"; } }; span.onclick = function() { modal.style.display = "none"; }; } var script = document.createElement('script'); script.appendChild(document.createTextNode('('+main+')();')); (document.body || document.head || document.documentElement).appendChild(script); var css = [ ".centered {", " margin: auto;", " width: 50%;", " padding: 0;", " margin-top: 15px;", "}", ".centered > .canvas {", " margin: auto;", " width: 50%;", "}", ".float-bottom {", " position: fixed;", " height: 50px;", " width: 100%;", " z-index: 1001;", " opacity: 1;", " margin: -8px;", " bottom: 0;", " background-color: #616161;", " box-shadow: 0px -1px 22px 0px rgba(89,89,89,0.61);", "}", ".float-bottom > p {", " color: white;", " float: left;", " display: inline;", " margin-left: 10px;", " height: 100%;", "}", ".float-bottom > p:nth-child(1), .float-bottom > p:nth-child(2) {", " color: rgba(224, 224, 224, 0.64);", "}", ".button-right {", " float: right;", " display: inline;", " padding: 12px 18px;", " height: 100%;", " color: white;", " text-align: center;", " background-color: rgb(79,195,247);", " border-radius: 3px;", " font-size: 14px;", " cursor: pointer;", "}", ".modal {", " display: none;", " position: fixed;", " z-index: 1001;", " top: 5%;", " opacity: 1;", " transform: scaleX(1);", " left: 75%;", " right: 25%;", " width: 20%;", " max-height: 50%;", " overflow-y: auto;", " background-color: rgb(0, 0, 0);", " background-color: rgba(0, 0, 0, 0.4);", " -webkit-animation-name: fadeIn;", " -webkit-animation-duration: 0.4s;", " animation-name: fadeIn;", " animation-duration: 0.4s;", " margin: auto;", " border-radius: 2px;", " box-shadow: 0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.3);", "}", "@media screen and (max-width: 992px) {", " .modal {", " width: 30%;", " left: 65%;", " }", "}", ".modal-content {", " background-color: #fefefe;", "}", ".close {", " color: white;", " float: right;", " font-size: 28px;", " font-weight: bold;", "}", ".close:hover, .close:focus {", " color: #000;", " text-decoration: none;", " cursor: pointer;", "}", ".modal-header {", " padding: 2px 14px;", " background-color: rgba(79,195,247, 0.8);", " color: white;", "}", ".modal-header h2 {", " margin-top: 10px;", " margin-bottom: 5px;", "}", ".modal-body {", " padding: 2px 12px;", " border: 1px solid #E0E0E0;", "}", "@-webkit-keyframes slideIn {", " from {bottom: -300px; opacity: 0}", " to {bottom: 0; opacity: 1}", "}", "@keyframes slideIn {", " from {bottom: -300px; opacity: 0}", " to {bottom: 0; opacity: 1}", "}", "@-webkit-keyframes fadeIn {", " from {opacity: 0}", " to {opacity: 1}", "}", "@keyframes fadeIn {", " from {opacity: 0}", " to {opacity: 1}", "}", ].join('\n'); var stylescript = document.createElement('style'); stylescript.type = "text/css"; stylescript.innerHTML = css; document.getElementsByTagName('head')[0].appendChild(stylescript); })();