Added support for resizing retina images.
Adding a class `retina` or naming an image with @2x resize the image to size 2x.
This commit is contained in:
parent
c50881c098
commit
fb1e6525f4
3 changed files with 16 additions and 4 deletions
File diff suppressed because one or more lines are too long
|
@ -44,7 +44,7 @@ jqueryFileUpload.on('begin', fileInfo => {
|
|||
fileInfo.name = fileInfo.name
|
||||
.toLowerCase()
|
||||
.replace(/ /g, '-')
|
||||
.replace(/[^a-z0-9+-.]+/g, '');
|
||||
.replace(/[^a-z0-9@+-.]+/g, '');
|
||||
});
|
||||
|
||||
const listImages = (dir, dirURL, callback) => {
|
||||
|
@ -422,7 +422,7 @@ router.post('/upload', passport.csrfProtection, (req, res) => {
|
|||
try {
|
||||
JSON.parse(mockres._getData()).files.forEach(file => {
|
||||
data.push({
|
||||
src: file.url
|
||||
src: decodeURIComponent(file.url)
|
||||
});
|
||||
});
|
||||
res.json({
|
||||
|
|
|
@ -255,6 +255,12 @@
|
|||
return a1.host === a2.host;
|
||||
};
|
||||
|
||||
var isRetina = function(element) {
|
||||
if (element.tagName === 'IMG' && element.src.indexOf('@2x') > -1) return true;
|
||||
if (element.classList.contains('retina')) return true;
|
||||
return element.parentNode && element.parentNode.tagName !== 'DIV' && isRetina(element.parentNode);
|
||||
}
|
||||
|
||||
frame.onload = function() {
|
||||
var imgs = frameDoc.querySelectorAll('img');
|
||||
|
||||
|
@ -290,7 +296,13 @@
|
|||
if (isLocalImage(decodeURIComponent(encodedSrc))) {
|
||||
img.onerror = function() { stats.failed++; };
|
||||
img.onloadend = function() { stats.processed++; };
|
||||
img.src = '/editorapi/img?src=' + encodedSrc + '&method=resize¶ms=' + img.clientWidth + '%2C' + img.clientHeight;
|
||||
var w = img.clientWidth;
|
||||
var h = img.clientHeight;
|
||||
if (isRetina(img)) {
|
||||
w = w * 2;
|
||||
h = h * 2;
|
||||
}
|
||||
img.src = '/editorapi/img?src=' + encodedSrc + '&method=resize¶ms=' + w + '%2C' + h;
|
||||
} else {
|
||||
stats.processed++;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue