imgur.direct

Adds image direct links for imgur uploads.

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         imgur.direct
// @namespace    imgurdir
// @version      1.0.0
// @description  Adds image direct links for imgur uploads.
// @author       Jakub Rychecký <[email protected]>
// @license      WTFPL 2
// @include      *imgur.com*
// ==/UserScript==






/*
 * Worker timeout in miliseconds, 500 ms is recommended
 * @type {Number}
 */
var timeout = 500;


/**
 * Prefix for direct link (choose http or https - https is recommended)
 * @type {String}
 */
var prefix = 'https';









/**
 * DOM initialization runs script worker which
 * @returns {undefined}
 */

$(function(){
  imgur_direct_worker(); // The first run of script worker
});





/**
 * Main script worker. Checks new images and put direct links to them. Repeats a few miliseconds again.
 * @returns {undefined}
 */

function imgur_direct_worker(){
  $('.post-image-container').each(function(){ // Every image container on imgur upload page...
    var img = $(this); // Image container itself

    if(!has_direct_link(img) && (is_image_ready(img) || is_video(img))){ // Doesn't have direct link yet and image is fully uploaded (or it's video)... 
      write_direct_link(img); // Create textarea with direct link  
    }
  });

  setTimeout(imgur_direct_worker, timeout); // Let's repeat
}





/**
 * Creates single direct link for image/video inside of its container.
 * @param {JQuery} img Image container jQuery element
 * @returns {String} Direct link to the image
 */

function get_direct_link(img){
  if(is_video(img)){ // Video direct link for videos...
    return get_direct_link_video(img); 
  }else{ // Everything else is image, let's give it image direct link... ^^
   return get_direct_link_image(img);
  }
}





/**
 * Generates direct MP4 link to video of container.
 * @param {type} img Image container jQuery element (contents video in this case)
 * @returns {unresolved}
 */

function get_direct_link_video(img){
  return img.find('meta[itemprop="contentURL"]').attr('content'); // Returns content of video meta tag   
}





/**
 * 
 * @param {type} img
 * @returns {String}
 */

function get_direct_link_image(img){
var zoom = img.find('.image .zoom, .post-image .zoom'); // Zoom element for larger images (difference way to get direct link)
  
   if(zoom.length > 0){ // If it is larger image having zoom...
      var link = zoom.attr('href'); // Link from zoom iself
   }else{ // ...smaller image with no zoom...
      var link = img.find('.image img, .post-image img').attr('src'); // Link from image iself
   }
   
   link = 'https:'+link; // Link with https:
    
   return link; // Returns link
}





/**
 * Is image ready? Is it fully uploaded yet?
 * @param {JQuery} img Image container jQuery element
 * @returns {Boolean} Is image ready?
 */

function is_image_ready(img){
  var link = get_direct_link(img); // Direct link from image

  return link.indexOf('undefined') == -1 && link.indexOf('blob') == -1; // If it DOES NOT contain 'undefined' or 'blob' strings, it's ready
}





/**
 * Checks if image container has direct link already. No need to write another one then.
 * @param {JQuery} img Image container jQuery element
 * @returns {Boolean} Has direct link already?
 */

function has_direct_link(img){
  return img.find('.direct').length > 0; // Is direct link inside image container?
}





/**
 * Writes single textarea with image direct link inside imgur page.
 * @param {JQuery} img Image container jQuery element
 * @returns {undefined}
 */

function write_direct_link(img){
   var css = { // CSS for direct link textarea
     'width': '100%',
     'background': '#2C2F34',
     'text-align': 'center',
     'font-weight': 'bold',
     'font-size': '0.8em',
     'height': '28px',
     'margin-bottom': '0px'
   };
    
   var html = $('<textarea onclick="$(this).select()">'+get_direct_link(img)+'</textarea>'); // Direct link textarea as JQuery element
    
   html.addClass('direct').css(css); // Putting class and CSS for textarea
    
   img.prepend(html); // Writes textarea
}





/**
 * Checks if content of container is video (gifv, mp4..).
 * @param {JQuery} img Image container jQuery element
 * @returns {Boolean} Is this container of video?
 */

function is_video(img){
   return img.find('.video-container').length > 0; // Video has .video-container
}