35 lines
793 B
JavaScript
35 lines
793 B
JavaScript
import { observes } from "discourse-common/utils/decorators";
|
|
import WizardPreviewBaseComponent from "./wizard-preview-base";
|
|
|
|
export default WizardPreviewBaseComponent.extend({
|
|
width: 371,
|
|
height: 124,
|
|
tab: null,
|
|
image: null,
|
|
|
|
@observes("field.value")
|
|
imageChanged() {
|
|
this.reload();
|
|
},
|
|
|
|
images() {
|
|
return { tab: "/images/wizard/tab.png", image: this.get("field.value") };
|
|
},
|
|
|
|
paint(options) {
|
|
const { ctx, width, height } = options;
|
|
this.scaleImage(this.tab, 0, 0, width, height);
|
|
this.scaleImage(this.image, 40, 25, 30, 30);
|
|
|
|
ctx.font = `20px 'Arial'`;
|
|
ctx.fillStyle = "#000";
|
|
|
|
let title = this.wizard.getTitle();
|
|
if (title.length > 20) {
|
|
title = title.substring(0, 20) + "...";
|
|
}
|
|
|
|
ctx.fillText(title, 80, 48);
|
|
},
|
|
});
|