revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-24 14:30:56 +01:00
Code Issues Releases Wiki Activity

Use CSS to resize the lightboxed image instead of Javascript

Browse source 
Summary: We can let the browser do the scaling with some simpler CSS rules.

Test Plan: Opened very large images in Safari, Firefox and Chrome and resized the browser. Observed smooth scaling and no issues with the image overlapping UI elements, etc.

Reviewers: btrahan, vrana

Reviewed By: btrahan

CC: aran

Maniphest Tasks: T1896

Differential Revision: https://secure.phabricator.com/D3802
This commit is contained in:
epriestley 2012-10-23 12:09:59 -07:00
parent 9dd9189283
commit d984a3ffa4
2 changed files with 3 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
webroot/rsrc/css/aphront/lightbox-attachment.css
View file

@ -19,7 +19,9 @@
}
.lightbox-attachment img {
margin: 50px auto 0;
margin: 3% auto 0;
max-height: 90%;
max-width: 90%;
}
.lightbox-attachment .loading {

37
webroot/rsrc/js/application/core/behavior-lightbox-attachments.js
View file

@ -4,7 +4,6 @@
* javelin-stratcom
* javelin-dom
* javelin-mask
* javelin-vector
* javelin-util
*/
@ -233,37 +232,7 @@ JX.behavior('lightbox-attachments', function (config) {
return;
}
var img = JX.DOM.find(lightbox, 'img');
var d = JX.Vector.getDim(img);
JX.Stratcom.addData(img, { x : d.x, y : d.y } );
return resizeLightBox(e);
}
function resizeLightBox(e) {
if (!lightbox) {
return;
}
var img = JX.DOM.find(lightbox, 'img');
var v = JX.Vector.getViewport();
var d = JX.Stratcom.getData(img);
var w = d.x;
var h = d.y;
var scale = 0;
if (w > (v.x - x_margin)) {
scale = (v.x - x_margin) / w;
w = w * scale;
h = h * scale;
}
if (h > (v.y - y_margin)) {
scale = (v.y - y_margin) / h;
w = w * scale;
h = h * scale;
}
JX.DOM.alterClass(img, 'loading', false);
JX.$V(w, h).setDim(img);
JX.Vector.getViewport().setDim(lightbox);
}
JX.Stratcom.listen(
@ -272,12 +241,6 @@ JX.behavior('lightbox-attachments', function (config) {
loadLightBox
);
JX.Stratcom.listen(
'resize',
null,
resizeLightBox
);
JX.Stratcom.listen(
'keydown',
null,