From e7c1962aa0a2093b4745b2bbbf3a8ff059b2cfc1 Mon Sep 17 00:00:00 2001 From: Robin Ward Date: Fri, 16 Sep 2016 17:02:45 -0400 Subject: [PATCH] Preview the favicon in the wizard --- .../image-preview-favicon-url.js.es6 | 45 ++++++++++++++++++ .../javascripts/wizard/models/wizard.js.es6 | 6 +++ public/images/wizard/tab.png | Bin 0 -> 10509 bytes 3 files changed, 51 insertions(+) create mode 100644 app/assets/javascripts/wizard/components/image-preview-favicon-url.js.es6 create mode 100644 public/images/wizard/tab.png diff --git a/app/assets/javascripts/wizard/components/image-preview-favicon-url.js.es6 b/app/assets/javascripts/wizard/components/image-preview-favicon-url.js.es6 new file mode 100644 index 000000000..7ef78e046 --- /dev/null +++ b/app/assets/javascripts/wizard/components/image-preview-favicon-url.js.es6 @@ -0,0 +1,45 @@ +import { observes } from 'ember-addons/ember-computed-decorators'; + +import { + createPreviewComponent, + loadImage, +} from 'wizard/lib/preview'; + +export default createPreviewComponent(371, 124, { + tab: null, + image: null, + + @observes('field.value') + imageChanged() { + this.reload(); + }, + + load() { + return Ember.RSVP.Promise.all([ + loadImage('/images/wizard/tab.png'), + loadImage(this.get('field.value')) + ]).then(result => { + this.tab = result[0]; + this.image = result[1]; + }); + + return loadImage(this.get('field.value')).then(image => { + this.image = image; + }); + }, + + paint(ctx, colors, width, height) { + ctx.drawImage(this.tab, 0, 0, width, height); + ctx.drawImage(this.image, 40, 25, 30, 30); + + ctx.font = `20px 'Arial'`; + ctx.fillStyle = '#000'; + + let title = this.get('wizard').getTitle(); + if (title.length > 20) { + title = title.substring(0, 20) + "..."; + } + + ctx.fillText(title, 80, 48); + } +}); diff --git a/app/assets/javascripts/wizard/models/wizard.js.es6 b/app/assets/javascripts/wizard/models/wizard.js.es6 index 156a55adc..64b28374a 100644 --- a/app/assets/javascripts/wizard/models/wizard.js.es6 +++ b/app/assets/javascripts/wizard/models/wizard.js.es6 @@ -7,6 +7,12 @@ const Wizard = Ember.Object.extend({ @computed('steps.length') totalSteps: length => length, + getTitle() { + const titleStep = this.get('steps').findProperty('id', 'forum-title'); + if (!titleStep) { return; } + return titleStep.get('fieldsById.title.value'); + }, + // A bit clunky, but get the current colors from the appropriate step getCurrentColors() { const colorStep = this.get('steps').findProperty('id', 'colors'); diff --git a/public/images/wizard/tab.png b/public/images/wizard/tab.png new file mode 100644 index 0000000000000000000000000000000000000000..9e6c50785db529a1d1dc20efe1c6d1dc1beeb946 GIT binary patch literal 10509 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 literal 0 HcmV?d00001