mirror of https://github.com/IoTcat/ushio-img.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
202 lines
5.6 KiB
202 lines
5.6 KiB
4 years ago
|
// ==========================================================================
|
||
|
//
|
||
|
// Media
|
||
|
// Adds additional media type support
|
||
|
//
|
||
|
// ==========================================================================
|
||
|
(function($) {
|
||
|
"use strict";
|
||
|
|
||
|
// Formats matching url to final form
|
||
|
|
||
|
var format = function(url, rez, params) {
|
||
|
if (!url) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
params = params || "";
|
||
|
|
||
|
if ($.type(params) === "object") {
|
||
|
params = $.param(params, true);
|
||
|
}
|
||
|
|
||
|
$.each(rez, function(key, value) {
|
||
|
url = url.replace("$" + key, value || "");
|
||
|
});
|
||
|
|
||
|
if (params.length) {
|
||
|
url += (url.indexOf("?") > 0 ? "&" : "?") + params;
|
||
|
}
|
||
|
|
||
|
return url;
|
||
|
};
|
||
|
|
||
|
// Object containing properties for each media type
|
||
|
|
||
|
var defaults = {
|
||
|
youtube: {
|
||
|
matcher: /(youtube\.com|youtu\.be|youtube\-nocookie\.com)\/(watch\?(.*&)?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*))(.*)/i,
|
||
|
params: {
|
||
|
autoplay: 1,
|
||
|
autohide: 1,
|
||
|
fs: 1,
|
||
|
rel: 0,
|
||
|
hd: 1,
|
||
|
wmode: "transparent",
|
||
|
enablejsapi: 1,
|
||
|
html5: 1
|
||
|
},
|
||
|
paramPlace: 8,
|
||
|
type: "iframe",
|
||
|
url: "//www.youtube.com/embed/$4",
|
||
|
thumb: "//img.youtube.com/vi/$4/hqdefault.jpg"
|
||
|
},
|
||
|
|
||
|
vimeo: {
|
||
|
matcher: /^.+vimeo.com\/(.*\/)?([\d]+)(.*)?/,
|
||
|
params: {
|
||
|
autoplay: 1,
|
||
|
hd: 1,
|
||
|
show_title: 1,
|
||
|
show_byline: 1,
|
||
|
show_portrait: 0,
|
||
|
fullscreen: 1,
|
||
|
api: 1
|
||
|
},
|
||
|
paramPlace: 3,
|
||
|
type: "iframe",
|
||
|
url: "//player.vimeo.com/video/$2"
|
||
|
},
|
||
|
|
||
|
instagram: {
|
||
|
matcher: /(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i,
|
||
|
type: "image",
|
||
|
url: "//$1/p/$2/media/?size=l"
|
||
|
},
|
||
|
|
||
|
// Examples:
|
||
|
// http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16
|
||
|
// https://www.google.com/maps/@37.7852006,-122.4146355,14.65z
|
||
|
// https://www.google.com/maps/@52.2111123,2.9237542,6.61z?hl=en
|
||
|
// https://www.google.com/maps/place/Googleplex/@37.4220041,-122.0833494,17z/data=!4m5!3m4!1s0x0:0x6c296c66619367e0!8m2!3d37.4219998!4d-122.0840572
|
||
|
gmap_place: {
|
||
|
matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(((maps\/(place\/(.*)\/)?\@(.*),(\d+.?\d+?)z))|(\?ll=))(.*)?/i,
|
||
|
type: "iframe",
|
||
|
url: function(rez) {
|
||
|
return (
|
||
|
"//maps.google." +
|
||
|
rez[2] +
|
||
|
"/?ll=" +
|
||
|
(rez[9] ? rez[9] + "&z=" + Math.floor(rez[10]) + (rez[12] ? rez[12].replace(/^\//, "&") : "") : rez[12] + "").replace(/\?/, "&") +
|
||
|
"&output=" +
|
||
|
(rez[12] && rez[12].indexOf("layer=c") > 0 ? "svembed" : "embed")
|
||
|
);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
// Examples:
|
||
|
// https://www.google.com/maps/search/Empire+State+Building/
|
||
|
// https://www.google.com/maps/search/?api=1&query=centurylink+field
|
||
|
// https://www.google.com/maps/search/?api=1&query=47.5951518,-122.3316393
|
||
|
gmap_search: {
|
||
|
matcher: /(maps\.)?google\.([a-z]{2,3}(\.[a-z]{2})?)\/(maps\/search\/)(.*)/i,
|
||
|
type: "iframe",
|
||
|
url: function(rez) {
|
||
|
return "//maps.google." + rez[2] + "/maps?q=" + rez[5].replace("query=", "q=").replace("api=1", "") + "&output=embed";
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
$(document).on("objectNeedsType.fb", function(e, instance, item) {
|
||
|
var url = item.src || "",
|
||
|
type = false,
|
||
|
media,
|
||
|
thumb,
|
||
|
rez,
|
||
|
params,
|
||
|
urlParams,
|
||
|
paramObj,
|
||
|
provider;
|
||
|
|
||
|
media = $.extend(true, {}, defaults, item.opts.media);
|
||
|
|
||
|
// Look for any matching media type
|
||
|
$.each(media, function(providerName, providerOpts) {
|
||
|
rez = url.match(providerOpts.matcher);
|
||
|
|
||
|
if (!rez) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
type = providerOpts.type;
|
||
|
provider = providerName;
|
||
|
paramObj = {};
|
||
|
|
||
|
if (providerOpts.paramPlace && rez[providerOpts.paramPlace]) {
|
||
|
urlParams = rez[providerOpts.paramPlace];
|
||
|
|
||
|
if (urlParams[0] == "?") {
|
||
|
urlParams = urlParams.substring(1);
|
||
|
}
|
||
|
|
||
|
urlParams = urlParams.split("&");
|
||
|
|
||
|
for (var m = 0; m < urlParams.length; ++m) {
|
||
|
var p = urlParams[m].split("=", 2);
|
||
|
|
||
|
if (p.length == 2) {
|
||
|
paramObj[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
params = $.extend(true, {}, providerOpts.params, item.opts[providerName], paramObj);
|
||
|
|
||
|
url =
|
||
|
$.type(providerOpts.url) === "function" ? providerOpts.url.call(this, rez, params, item) : format(providerOpts.url, rez, params);
|
||
|
|
||
|
thumb =
|
||
|
$.type(providerOpts.thumb) === "function" ? providerOpts.thumb.call(this, rez, params, item) : format(providerOpts.thumb, rez);
|
||
|
|
||
|
if (providerName === "youtube") {
|
||
|
url = url.replace(/&t=((\d+)m)?(\d+)s/, function(match, p1, m, s) {
|
||
|
return "&start=" + ((m ? parseInt(m, 10) * 60 : 0) + parseInt(s, 10));
|
||
|
});
|
||
|
} else if (providerName === "vimeo") {
|
||
|
url = url.replace("&%23", "#");
|
||
|
}
|
||
|
|
||
|
return false;
|
||
|
});
|
||
|
|
||
|
// If it is found, then change content type and update the url
|
||
|
|
||
|
if (type) {
|
||
|
if (!item.opts.thumb && !(item.opts.$thumb && item.opts.$thumb.length)) {
|
||
|
item.opts.thumb = thumb;
|
||
|
}
|
||
|
|
||
|
if (type === "iframe") {
|
||
|
item.opts = $.extend(true, item.opts, {
|
||
|
iframe: {
|
||
|
preload: false,
|
||
|
attr: {
|
||
|
scrolling: "no"
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
|
||
|
$.extend(item, {
|
||
|
type: type,
|
||
|
src: url,
|
||
|
origSrc: item.src,
|
||
|
contentSource: provider,
|
||
|
contentType: type === "image" ? "image" : provider == "gmap_place" || provider == "gmap_search" ? "map" : "video"
|
||
|
});
|
||
|
} else if (url) {
|
||
|
item.type = item.opts.defaultType;
|
||
|
}
|
||
|
});
|
||
|
})(window.jQuery || jQuery);
|