import Ember from 'ember'; export default Ember.Component.extend({ classNames: ['btn-group'], didReceiveAttrs() { let me = this; let iconUrl = me.get('iconUrl'); let iconImg; if (iconUrl) { iconImg = new Image(); iconImg.src = iconUrl; me.set('iconImg', iconImg); } // let label = me.get('label'); let label = null; me.set('qrConfigMerged', Ember.$.extend({ // render method: 'canvas', 'image' or 'div' render: 'canvas', // version range somewhere in 1 .. 40 minVersion: 1, maxVersion: 40, // error correction level: 'L', 'M', 'Q' or 'H' ecLevel: 'Q', // size in pixel size: 320, // code color or image element fill: '#333', // background color or image element, null for transparent background background: null, // content text: me.get('text'), // corner radius relative to module width: 0.0 .. 0.5 radius: 0.1, // quiet zone in modules quiet: 4, // modes // 0: normal // 1: label strip // 2: label box // 3: image strip // 4: image box mode: iconUrl ? 4 : label ? 2 : 0, label: label, fontname: 'sans', fontcolor: '#ff9818', mSize: 0.13, mPosX: 0.5, mPosY: 0.5, image: iconImg }, me.get('qrConfig'))); }, didInsertElement() { let me = this; me._super(...arguments); let iconImg = me.get('iconImg'); if (iconImg) { iconImg.onload = function() { me.renderQrCode(); }; } else { me.renderQrCode(); } }, renderQrCode() { this.$('.qr-code').qrcode(this.get('qrConfigMerged')); } });