123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182 |
- /*!
- * Retina.js v1.3.0
- *
- * Copyright 2014 Imulus, LLC
- * Released under the MIT license
- *
- * Retina.js is an open source script that makes it easy to serve
- * high-resolution images to devices with retina displays.
- */
- (function() {
- var root = (typeof exports === 'undefined' ? window : exports);
- var config = {
- // An option to choose a suffix for 2x images
- retinaImageSuffix : '@2x',
- // Ensure Content-Type is an image before trying to load @2x image
- // https://github.com/imulus/retinajs/pull/45)
- check_mime_type: true,
- // Resize high-resolution images to original image's pixel dimensions
- // https://github.com/imulus/retinajs/issues/8
- force_original_dimensions: true
- };
- function Retina() {}
- root.Retina = Retina;
- Retina.configure = function(options) {
- if (options === null) {
- options = {};
- }
- for (var prop in options) {
- if (options.hasOwnProperty(prop)) {
- config[prop] = options[prop];
- }
- }
- };
- Retina.init = function(context) {
- if (context === null) {
- context = root;
- }
- var existing_onload = context.onload || function(){};
- context.onload = function() {
- var images = document.getElementsByTagName('img'), retinaImages = [], i, image;
- for (i = 0; i < images.length; i += 1) {
- image = images[i];
- if (!!!image.getAttributeNode('data-no-retina')) {
- retinaImages.push(new RetinaImage(image));
- }
- }
- existing_onload();
- };
- };
- Retina.isRetina = function(){
- var mediaQuery = '(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-resolution: 1.5dppx)';
- if (root.devicePixelRatio > 1) {
- return true;
- }
- if (root.matchMedia && root.matchMedia(mediaQuery).matches) {
- return true;
- }
- return false;
- };
- var regexMatch = /\.\w+$/;
- function suffixReplace (match) {
- return config.retinaImageSuffix + match;
- }
- function RetinaImagePath(path, at_2x_path) {
- this.path = path || '';
- if (typeof at_2x_path !== 'undefined' && at_2x_path !== null) {
- this.at_2x_path = at_2x_path;
- this.perform_check = false;
- } else {
- if (undefined !== document.createElement) {
- var locationObject = document.createElement('a');
- locationObject.href = this.path;
- locationObject.pathname = locationObject.pathname.replace(regexMatch, suffixReplace);
- this.at_2x_path = locationObject.href;
- } else {
- var parts = this.path.split('?');
- parts[0] = parts[0].replace(regexMatch, suffixReplace);
- this.at_2x_path = parts.join('?');
- }
- this.perform_check = true;
- }
- }
- root.RetinaImagePath = RetinaImagePath;
- RetinaImagePath.confirmed_paths = [];
- RetinaImagePath.prototype.is_external = function() {
- return !!(this.path.match(/^https?\:/i) && !this.path.match('//' + document.domain) );
- };
- RetinaImagePath.prototype.check_2x_variant = function(callback) {
- var http, that = this;
- if (this.is_external()) {
- return callback(false);
- } else if (!this.perform_check && typeof this.at_2x_path !== 'undefined' && this.at_2x_path !== null) {
- return callback(true);
- } else if (this.at_2x_path in RetinaImagePath.confirmed_paths) {
- return callback(true);
- } else {
- http = new XMLHttpRequest();
- http.open('HEAD', this.at_2x_path);
- http.onreadystatechange = function() {
- if (http.readyState !== 4) {
- return callback(false);
- }
- if (http.status >= 200 && http.status <= 399) {
- if (config.check_mime_type) {
- var type = http.getResponseHeader('Content-Type');
- if (type === null || !type.match(/^image/i)) {
- return callback(false);
- }
- }
- RetinaImagePath.confirmed_paths.push(that.at_2x_path);
- return callback(true);
- } else {
- return callback(false);
- }
- };
- http.send();
- }
- };
- function RetinaImage(el) {
- this.el = el;
- this.path = new RetinaImagePath(this.el.getAttribute('src'), this.el.getAttribute('data-at2x'));
- var that = this;
- this.path.check_2x_variant(function(hasVariant) {
- if (hasVariant) {
- that.swap();
- }
- });
- }
- root.RetinaImage = RetinaImage;
- RetinaImage.prototype.swap = function(path) {
- if (typeof path === 'undefined') {
- path = this.path.at_2x_path;
- }
- var that = this;
- function load() {
- if (! that.el.complete) {
- setTimeout(load, 5);
- } else {
- if (config.force_original_dimensions) {
- that.el.setAttribute('width', that.el.offsetWidth);
- that.el.setAttribute('height', that.el.offsetHeight);
- }
- that.el.setAttribute('src', path);
- }
- }
- load();
- };
- if (Retina.isRetina()) {
- Retina.init(root);
- }
- })();
|