mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Popups
synced 2024-12-18 02:00:53 +00:00
4492b54a44
Reduce layout/style thrashing by measuring all required geometries
at event handler, not waiting for delays/redux/style changes.
Use CSS bottom instead of top, to avoid having to measure the popup
before positioning it, if it's placed above the link ("flippedY").
Disable some test cases that relied on implementation detail of using
"top" CSS.
Change-Id: Id0cbf506009b824d0fb6af4d6fe220e2f69aaaad
43 lines
1,018 B
JavaScript
43 lines
1,018 B
JavaScript
import { SIZES } from '../../src/ui/thumbnail';
|
|
import { createPreviewWithType, layoutPreview, getClasses } from '../../src/ui/renderer.js';
|
|
import scaleDownThumbnail from './scaleDownThumbnail';
|
|
|
|
const POINTER_SIZE = 8;
|
|
|
|
/**
|
|
* Creates a static/stateless Popup and returns its HTML.
|
|
*
|
|
* @param {ext.popups.PreviewModel} model
|
|
* @param {object} layout
|
|
*
|
|
* @return {string} HTML
|
|
*/
|
|
function createPopup( model, layout ) {
|
|
if ( model.thumbnail ) {
|
|
model.thumbnail = scaleDownThumbnail( model.thumbnail );
|
|
}
|
|
|
|
const preview = createPreviewWithType( model );
|
|
|
|
Object.assign( layout, { dir: model.languageDirection } );
|
|
layout.offset = layout.flippedY ? {
|
|
left: layout.offset.left,
|
|
top: layout.offset.top + layout.flipOffset
|
|
} : layout.offset;
|
|
|
|
layoutPreview(
|
|
preview,
|
|
layout,
|
|
getClasses( preview, {
|
|
flippedX: layout.flippedX,
|
|
flippedY: layout.flippedY
|
|
} ),
|
|
SIZES.landscapeImage.h,
|
|
POINTER_SIZE,
|
|
window.innerHeight
|
|
);
|
|
return preview.el[ 0 ].outerHTML;
|
|
}
|
|
|
|
export default createPopup;
|