Skip to content

Commit

Permalink
feat(templiteral): v2 refactor
Browse files Browse the repository at this point in the history 
BREAKING CHANGE: New compiler
  • Loading branch information
@calebdwilliams
calebdwilliams committed Dec 27, 2017
1 parent c2a920c commit cca2c71
Show file tree
Hide file tree
Showing 17 changed files with 2,336 additions and 691 deletions.
Binary file removed .DS_Store
View file
Binary file not shown.
2 changes: 1 addition & 1 deletion .gitignore
View file
@@ -1,2 +1,2 @@
node_modules/

.DS_Store
73 changes: 35 additions & 38 deletions dist/templiteral.cjs.js
View file
Expand Up @@ -73,9 +73,8 @@ class AttributeNode {
updateAttributes(name, newAttr) {
const attributeName = name.slice(1, -1);
if (newAttr.value) {
const parsedValue = JSON.parse(decodeURIComponent(newAttr.value));
this.node[attributeName] = parsedValue;
typeof parsedValue === 'object' ? this.node.setAttribute(attributeName, newAttr.value) : null;
this.node[attributeName] = newAttr.value;
this.node.setAttribute(attributeName, newAttr.value);
} else {
this.node.removeAttribute(attributeName);
}
Expand Down Expand Up @@ -134,40 +133,45 @@ class Template {
while (walker.nextNode()) {
index += 1;
const { currentNode } = walker;
switch (currentNode.nodeType) {
case 1: {
const { attributes } = currentNode;
if (attributes.length) {
const boundAttrs = new Map();
const boundEvents = new Map();
for (let i = 0; i < attributes.length; i += 1) {
const attribute = attributes[i];
if (attribute.value.match(valuePattern) || attribute.name.match(propPattern)) {
boundAttrs.set(attribute.name, attribute);
if (!currentNode.__templiteralCompiler) {
switch (currentNode.nodeType) {
case 1: {
const { attributes } = currentNode;
if (attributes.length) {
const boundAttrs = new Map();
const boundEvents = new Map();
for (let i = 0; i < attributes.length; i += 1) {
const attribute = attributes[i];
if (attribute.value.match(valuePattern) || attribute.name.match(propPattern)) {
boundAttrs.set(attribute.name, attribute);
}
if (setup && attribute.name.match(eventPattern)) {
const eventName = attribute.name.substring(1, attribute.name.length - 1);
boundEvents.set(eventName, attribute.value);
this.eventHandlers.push({ eventName, currentNode });
}
}
if (setup && attribute.name.match(eventPattern)) {
const eventName = attribute.name.substring(1, attribute.name.length - 1);
boundEvents.set(eventName, attribute.value);
this.eventHandlers.push({ eventName, currentNode });
if (boundAttrs.size >= 1 || boundEvents.size >= 1 || this.parts.has(index)) {
const attrNode = new AttributeNode(currentNode, index, boundAttrs, boundEvents, this.context);
parts.set(index, attrNode);
attrNode.cleanUp();
}
}
if (boundAttrs.size >= 1 || boundEvents.size >= 1 || this.parts.has(index)) {
const attrNode = new AttributeNode(currentNode, index, boundAttrs, boundEvents, this.context);
parts.set(index, attrNode);
attrNode.cleanUp();
break;
}
case 3: {
if (currentNode.textContent && currentNode.textContent.match(valuePattern) || this.parts.has(index)) {
const contentNode = new ContentNode(currentNode, index);
parts.set(index, contentNode);
contentNode.cleanUp();
}
break;
}
break;
}
case 3: {
if (currentNode.textContent && currentNode.textContent.match(valuePattern) || this.parts.has(index)) {
const contentNode = new ContentNode(currentNode, index);
parts.set(index, contentNode);
contentNode.cleanUp();
}
break;
}
} else {
this.templiteralParts.add(currentNode);
}

}

return parts;
Expand All @@ -176,17 +180,10 @@ class Template {

const templateCache = new Map();

function parseObject(value) {
if (typeof value === 'object') {
return encodeURIComponent(JSON.stringify(value));
}
return value;
}

function html(location) {
return function(strings, ...values) {
const output = strings.map((string, index) =>
`${string ? string : ''}${values[index] ? '---!{' + parseObject(values[index]) + '}!---' : ''}`).join('');
`${string ? string : ''}${values[index] ? '---!{' + values[index] + '}!---' : ''}`).join('');
const templateKey = btoa(strings.join(''));

let compiler = templateCache.get(templateKey);
Expand Down
2 changes: 1 addition & 1 deletion dist/templiteral.cjs.min.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

73 changes: 35 additions & 38 deletions dist/templiteral.es.js
View file
Expand Up @@ -69,9 +69,8 @@ class AttributeNode {
updateAttributes(name, newAttr) {
const attributeName = name.slice(1, -1);
if (newAttr.value) {
const parsedValue = JSON.parse(decodeURIComponent(newAttr.value));
this.node[attributeName] = parsedValue;
typeof parsedValue === 'object' ? this.node.setAttribute(attributeName, newAttr.value) : null;
this.node[attributeName] = newAttr.value;
this.node.setAttribute(attributeName, newAttr.value);
} else {
this.node.removeAttribute(attributeName);
}
Expand Down Expand Up @@ -130,40 +129,45 @@ class Template {
while (walker.nextNode()) {
index += 1;
const { currentNode } = walker;
switch (currentNode.nodeType) {
case 1: {
const { attributes } = currentNode;
if (attributes.length) {
const boundAttrs = new Map();
const boundEvents = new Map();
for (let i = 0; i < attributes.length; i += 1) {
const attribute = attributes[i];
if (attribute.value.match(valuePattern) || attribute.name.match(propPattern)) {
boundAttrs.set(attribute.name, attribute);
if (!currentNode.__templiteralCompiler) {
switch (currentNode.nodeType) {
case 1: {
const { attributes } = currentNode;
if (attributes.length) {
const boundAttrs = new Map();
const boundEvents = new Map();
for (let i = 0; i < attributes.length; i += 1) {
const attribute = attributes[i];
if (attribute.value.match(valuePattern) || attribute.name.match(propPattern)) {
boundAttrs.set(attribute.name, attribute);
}
if (setup && attribute.name.match(eventPattern)) {
const eventName = attribute.name.substring(1, attribute.name.length - 1);
boundEvents.set(eventName, attribute.value);
this.eventHandlers.push({ eventName, currentNode });
}
}
if (setup && attribute.name.match(eventPattern)) {
const eventName = attribute.name.substring(1, attribute.name.length - 1);
boundEvents.set(eventName, attribute.value);
this.eventHandlers.push({ eventName, currentNode });
if (boundAttrs.size >= 1 || boundEvents.size >= 1 || this.parts.has(index)) {
const attrNode = new AttributeNode(currentNode, index, boundAttrs, boundEvents, this.context);
parts.set(index, attrNode);
attrNode.cleanUp();
}
}
if (boundAttrs.size >= 1 || boundEvents.size >= 1 || this.parts.has(index)) {
const attrNode = new AttributeNode(currentNode, index, boundAttrs, boundEvents, this.context);
parts.set(index, attrNode);
attrNode.cleanUp();
break;
}
case 3: {
if (currentNode.textContent && currentNode.textContent.match(valuePattern) || this.parts.has(index)) {
const contentNode = new ContentNode(currentNode, index);
parts.set(index, contentNode);
contentNode.cleanUp();
}
break;
}
break;
}
case 3: {
if (currentNode.textContent && currentNode.textContent.match(valuePattern) || this.parts.has(index)) {
const contentNode = new ContentNode(currentNode, index);
parts.set(index, contentNode);
contentNode.cleanUp();
}
break;
}
} else {
this.templiteralParts.add(currentNode);
}

}

return parts;
Expand All @@ -172,17 +176,10 @@ class Template {

const templateCache = new Map();

function parseObject(value) {
if (typeof value === 'object') {
return encodeURIComponent(JSON.stringify(value));
}
return value;
}

function html(location) {
return function(strings, ...values) {
const output = strings.map((string, index) =>
`${string ? string : ''}${values[index] ? '---!{' + parseObject(values[index]) + '}!---' : ''}`).join('');
`${string ? string : ''}${values[index] ? '---!{' + values[index] + '}!---' : ''}`).join('');
const templateKey = btoa(strings.join(''));

let compiler = templateCache.get(templateKey);
Expand Down

0 comments on commit cca2c71

Please sign in to comment.