From 0ededf23cedb4e1f20fa887658e650a9bc4d73ed Mon Sep 17 00:00:00 2001
From: TeshuKatepalli <teshu.katepalli@gspann.com>
Date: Tue, 17 Oct 2023 16:05:35 +0530
Subject: [PATCH] Template boiler plate code

---
 scripts/scripts.js        | 29 +++++++++++++++++++++++++++++
 templates/green/green.css |  1 +
 templates/green/green.js  |  1 +
 templates/red/red.css     |  1 +
 templates/red/red.js      |  1 +
 5 files changed, 33 insertions(+)
 create mode 100644 templates/green/green.css
 create mode 100644 templates/green/green.js
 create mode 100644 templates/red/red.css
 create mode 100644 templates/red/red.js

diff --git a/scripts/scripts.js b/scripts/scripts.js
index ae5daf9b..656a7d37 100644
--- a/scripts/scripts.js
+++ b/scripts/scripts.js
@@ -11,6 +11,8 @@ import {
   waitForLCP,
   loadBlocks,
   loadCSS,
+  toClassName,
+  getMetadata,
 } from './aem.js';
 
 const LCP_BLOCKS = []; // add your LCP blocks to the list
@@ -42,6 +44,32 @@ async function loadFonts() {
   }
 }
 
+const TEMPLATE_LIST = [
+  'red',
+  'green',
+];
+
+/**
+ * Run template specific decoration code.
+ * @param {Element} main The container element
+ */
+async function decorateTemplates(main) {
+  try {
+    const template = toClassName(getMetadata('template'));
+    const templates = TEMPLATE_LIST;
+    if (templates.includes(template)) {
+      const mod = await import(`../templates/${template}/${template}.js`);
+      loadCSS(`${window.hlx.codeBasePath}/templates/${template}/${template}.css`);
+      if (mod.default) {
+        await mod.default(main);
+      }
+    }
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.error('Auto Blocking failed', error);
+  }
+}
+
 /**
  * Builds all synthetic blocks in a container element.
  * @param {Element} main The container element
@@ -79,6 +107,7 @@ async function loadEager(doc) {
   const main = doc.querySelector('main');
   if (main) {
     decorateMain(main);
+    await decorateTemplates(main);
     document.body.classList.add('appear');
     await waitForLCP(LCP_BLOCKS);
   }
diff --git a/templates/green/green.css b/templates/green/green.css
new file mode 100644
index 00000000..ed42a359
--- /dev/null
+++ b/templates/green/green.css
@@ -0,0 +1 @@
+/* green template css */
diff --git a/templates/green/green.js b/templates/green/green.js
new file mode 100644
index 00000000..b1077c14
--- /dev/null
+++ b/templates/green/green.js
@@ -0,0 +1 @@
+// green template
diff --git a/templates/red/red.css b/templates/red/red.css
new file mode 100644
index 00000000..5bf2ee94
--- /dev/null
+++ b/templates/red/red.css
@@ -0,0 +1 @@
+/* red template css */
diff --git a/templates/red/red.js b/templates/red/red.js
new file mode 100644
index 00000000..a3b8d6ea
--- /dev/null
+++ b/templates/red/red.js
@@ -0,0 +1 @@
+// red template