mirror of
https://github.com/discourse/discourse.git
synced 2024-12-05 11:46:18 +08:00
1506017767
The previous `createPreviewComponent` implementation was problematic for template colocation. We can achieve the same result using normal component class inheritance.
41 lines
908 B
JavaScript
41 lines
908 B
JavaScript
import { drawHeader } from "wizard/lib/preview";
|
|
import { observes } from "discourse-common/utils/decorators";
|
|
import WizardPreviewBaseComponent from "./wizard-preview-base";
|
|
|
|
export default WizardPreviewBaseComponent.extend({
|
|
width: 400,
|
|
height: 100,
|
|
image: null,
|
|
|
|
@observes("field.value")
|
|
imageChanged() {
|
|
this.reload();
|
|
},
|
|
|
|
images() {
|
|
return { image: this.get("field.value") };
|
|
},
|
|
|
|
paint({ ctx, colors, font, width, height }) {
|
|
const headerHeight = height / 2;
|
|
|
|
drawHeader(ctx, colors, width, headerHeight);
|
|
|
|
const image = this.image;
|
|
|
|
const headerMargin = headerHeight * 0.2;
|
|
|
|
const imageHeight = headerHeight - headerMargin * 2;
|
|
const ratio = imageHeight / image.height;
|
|
this.scaleImage(
|
|
image,
|
|
headerMargin,
|
|
headerMargin,
|
|
image.width * ratio,
|
|
imageHeight
|
|
);
|
|
|
|
this.drawPills(colors, font, height / 2);
|
|
},
|
|
});
|