The ability to attach `attrs` when embedding widgets

This commit is contained in:
Robin Ward 2017-09-28 16:08:14 -04:00
parent 502f910eb5
commit df81d109e5
4 changed files with 61 additions and 8 deletions

View File

@ -4,10 +4,10 @@ import hbs from 'discourse/widgets/hbs-compiler';
createWidget('header-contents', {
tagName: 'div.contents.clearfix',
template: hbs`
{{attach widget="home-logo"}}
{{attach widget="home-logo" attrs=attrs}}
<div class="panel clearfix">{{yield}}</div>
{{#if attrs.topic}}
{{attach widget="header-topic-info"}}
{{attach widget="header-topic-info" attrs=attrs}}
{{/if}}
`,
});

View File

@ -1,20 +1,45 @@
function resolve(path) {
if (path.indexOf('settings') === 0) {
return `this.${path}`;
} else if (path.indexOf('parentState') === 0) {
return `attrs._${path}`;
}
return path;
}
function sexp(value) {
if (value.path.original === "hash") {
let result = [];
value.hash.pairs.forEach(p => {
result.push(`"${p.key}": ${p.value.original}`);
});
return `{ ${result.join(", ")} }`;
}
}
function argValue(arg) {
let value = arg.value;
if (value.type === "SubExpression") {
return sexp(arg.value);
} else if (value.type === "PathExpression") {
return value.original;
}
}
function mustacheValue(node, state) {
let path = node.path.original;
switch(path) {
case 'attach':
const widgetName = node.hash.pairs.find(p => p.key === "widget").value.value;
return `this.attach("${widgetName}", state ? $.extend({}, attrs, { _parentState: state }) : attrs)`;
let widgetName = node.hash.pairs.find(p => p.key === "widget").value.value;
let attrs = node.hash.pairs.find(p => p.key === "attrs");
if (attrs) {
return `this.attach("${widgetName}", ${argValue(attrs)})`;
}
return `this.attach("${widgetName}", attrs)`;
break;
case 'yield':
return `this.attrs.contents()`;

View File

@ -0,0 +1,28 @@
template = <<~HBS
{{attach widget="widget-name" attrs=attrs}}
{{#if state.category}}
{{attach widget="category-display" attrs=(hash category=state.category)}}
{{/if}}
HBS
ctx = MiniRacer::Context.new(timeout: 15000)
ctx.eval("var self = this; #{File.read("#{Rails.root}/vendor/assets/javascripts/babel.js")}")
ctx.eval(File.read(Ember::Source.bundled_path_for('ember-template-compiler.js')))
ctx.eval("module = {}; exports = {};");
ctx.attach("rails.logger.info", proc { |err| puts(err.to_s) })
ctx.attach("rails.logger.error", proc { |err| puts(err.to_s) })
ctx.eval <<JS
console = {
prefix: "",
log: function(msg){ rails.logger.info(console.prefix + msg); },
error: function(msg){ rails.logger.error(console.prefix + msg); }
}
JS
source = File.read("#{Rails.root}/lib/javascripts/widget-hbs-compiler.js.es6")
ctx.eval(source)
js_source = ::JSON.generate(template, quirks_mode: true)
puts ctx.eval("exports.compile(#{js_source})");

View File

@ -188,7 +188,7 @@ widgetTest('widget attaching', {
createWidget('attach-test', {
tagName: 'div.container',
template: hbs`{{attach widget="test-embedded"}}`
template: hbs`{{attach widget="test-embedded" attrs=attrs}}`
});
},