Kanka Jump to Post

Adds a dropdown to Kanka entity headers to quickly scroll to the selected post.

目前為 2021-12-05 提交的版本,檢視 最新版本

// ==UserScript==
// @name         Kanka Jump to Post
// @namespace    http://tampermonkey.net/
// @version      3
// @description  Adds a dropdown to Kanka entity headers to quickly scroll to the selected post.
// @author       Salvatos
// @match        https://kanka.io/*
// @exclude      */html-export
// @icon         https://www.google.com/s2/favicons?domain=kanka.io
// @grant        GM_addStyle
// ==/UserScript==

// Run only on entity Story pages
if (document.getElementById('app').parentNode.classList.contains("entity-story")) {
    GM_addStyle(`
    .jump-to-post .btn-sm {
    	padding: 6px 5px 5px 10px;
    	font-size: 11px;
    }
    .jump-to-post .fa-book:after {
		content: " ▼";
        vertical-align: middle;
        font-size: 8px;
	}
    .dropdown-menu {
        left: unset;
        right: 0;
    }
	`);

	/* Set arrays and prefs */
	const addTopLink = false;
    var hasPosts = 0;
    var posts = [];
    $("div.entity-note").each(function(){
        posts.push($(this));
    });


	/* Start dropdown */
	var postList= `
	<div class="btn-group jump-to-post">
		<button type="button" class="btn btn-default btn-sm dropdown-toggle" tabindex="-1" data-toggle="dropdown" title="Entity posts" aria-expanded="false">
			<i class="fa fa-book" aria-hidden="true"></i>
		</button>
		<ul class="note-dropdown-menu dropdown-menu dropdown-posts" aria-label="Jump to an entity post">
	`;

    /* Insert each item name and ID */
	$.each( posts, function( key, value ) {
        hasPosts++;
        postList+= `
		    <li><a href="#` + $(this).attr('id') + `">` + $.trim($(this).find("h3.box-title").text()) + `</a></li>
    	`;
    });

    /* If there is no post, add a notice (won’t be necessary once Entries are treated like posts) */
    if (hasPosts < 1) {
        postList+= `<li><a><i>No post</i></a></li>`;
    }

    /* Close dropdown */
    postList+= `
		</ul>
	</div>
	`;

	/* Insert element after post expand/collapse buttons */
    $(postList).appendTo(".header-buttons > .btn-group");

    /* Add "top" link to box headings */
    if (addTopLink) {
        $("<a class='to-top' href='#app'>&nbsp;^&nbsp;top</a>").appendTo("div.entity-note > .box-header > h3");
    }
}