☰

Greasy Fork is available in English.

GitHub Pages Link

A userscript that adds pages link to repository

  1. // ==UserScript==
  2. // @name        GitHub Pages Link
  3. // @version     0.1.0
  4. // @description A userscript that adds pages link to repository
  5. // @license     MIT
  6. // @author      Jim Cheung
  7. // @namespace   https://github.com/jinhucheung
  8. // @include     https://github.com/*
  9. // @run-at      document-idle
  10. // @grant       none
  11. // @icon        https://github.githubassets.com/pinned-octocat.svg
  12. // ==/UserScript==
  13. (function() {
  14.   "use strict";
  15.  
  16.   var selectors = {
  17.     // repository content
  18.     repoContent: ".repository-content",
  19.     // pages enironments
  20.     pagesEnv: ".BorderGrid-cell a[href$='environment=github-pages']",
  21.     // pages link
  22.     pagesLink: "a[role='link']",
  23.     // repo link on side
  24.     repoLinkGridPreSibling: ".BorderGrid .BorderGrid-row:first-child > .BorderGrid-cell > h2 ~ .f4",
  25.     // repo link on header
  26.     repoLinkHeaderPreSibling: "#js-repo-pjax-container > .hide-full-screen > .d-block > p"
  27.   }
  28.  
  29.   var pagesHostTemplete = "{space}.github.io"
  30.   var pagesLinkTemplete =
  31.     '<div class="d-flex flex-items-center {containerClass}">' +
  32.       '<svg mr="2" classes="flex-shrink-0" height="16" class="octicon octicon-link flex-shrink-0 mr-2" viewBox="0 0 16 16" version="1.1" width="16" aria-hidden="true"><path fill-rule="evenodd" d="M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z"></path></svg>' +
  33.       '<span class="flex-auto min-width-0 css-truncate css-truncate-target width-fit">' +
  34.         '<a title="https://{pagesLink}" role="link" target="_blank" class="text-bold" rel="noopener noreferrer" href="https://{pagesLink}">{pagesLink}</a>' +
  35.       '</span>' +
  36.     '</div>'
  37.  
  38.   function isEnablePages() {
  39.     var repoContent = document.querySelector(selectors.repoContent)
  40.     return repoContent && repoContent.querySelector(selectors.repoLinkGridPreSibling) && getPagesLink()
  41.   }
  42.  
  43.   function isNotFoundPagesLink() {
  44.     return !document.querySelector(selectors.pagesLink)
  45.   }
  46.  
  47.   function getPagesLink() {
  48.     var paths = location.pathname.split("/")
  49.     var space = paths[1] || ""
  50.     var repoPath = paths[2] || ""
  51.     var pageLink = pagesHostTemplete.replace("{space}", space)
  52.  
  53.     if (repoPath.toLowerCase() !== pageLink.toLowerCase()) {
  54.       if (!document.querySelector(selectors.pagesEnv)) return
  55.  
  56.       pageLink = pageLink + "/" + repoPath
  57.     }
  58.     return pageLink
  59.   }
  60.  
  61.   function addPagesLink() {
  62.     var pagesLink = getPagesLink()
  63.     if (!pagesLink) return false
  64.  
  65.     var repoLinkGridPreSibling = document.querySelector(selectors.repoLinkGridPreSibling)
  66.     if (repoLinkGridPreSibling) {
  67.       var repoLinkGridContent = pagesLinkTemplete.replaceAll("{containerClass}", "mt-3").replaceAll("{pagesLink}", pagesLink)
  68.       repoLinkGridPreSibling.outerHTML += repoLinkGridContent
  69.     }
  70.  
  71.     var repoLinkHeaderPreSibling = document.querySelector(selectors.repoLinkHeaderPreSibling)
  72.     if (repoLinkHeaderPreSibling) {
  73.       var repoLinkHeaderContent = pagesLinkTemplete.replaceAll("{containerClass}", "mb-2").replaceAll("{pagesLink}", pagesLink)
  74.       repoLinkHeaderPreSibling.outerHTML += repoLinkHeaderContent
  75.     }
  76.  
  77.     return true
  78.   }
  79.  
  80.   function setup() {
  81.     return isEnablePages() && isNotFoundPagesLink() && addPagesLink()
  82.   }
  83.  
  84.   function init() {
  85.     var success = setup()
  86.     if (!success) {
  87.       window.setTimeout(init, 2000)
  88.     }
  89.   }
  90.  
  91.   document.addEventListener("pjax:end", init)
  92.   init()
  93. })()