vaderjs 1.3.2 → 1.3.3-alpha-1

package/vaderRouter.js

@@ -1,231 +0,0 @@
-
-/**
- * @class VaderRouter
- * @description  - creates an instance of Vader Express Router
- *  
- * @param {String} path
- * @param {Function} handler
- * @param {object} req  request object
- * @param {object} res  response object
- * @returns {Object} Express
- *  
- */
-class VaderRouter{
-  /**
-   * @constructor
-   * @param {*} basePath 
-   *  
-   */
-  constructor(basePath) {
-    this.routes = [];
-    this.middlewares = [];
-    this.errorMiddlewares = [];
-    this.listeners = [];
-     
-    this.basePath = basePath;
-  }
-
-  /**
-   * @method get
-   * @param {String} path
-   * @param {Function} handler
-   * @description This method is used to register a get route
-   * @returns {void}
-   * @memberof Express
-   */
-  get(path, handler) {
-   
-    this.routes.push({
-      path,
-      handler,
-      method: 'get',
-    });
-  }
-  /**
-   * @method use
-   * @description This method allows you to use middlewares
-   * @param {Function} middleware 
-   */
-
-  use(/* path, */ middleware) {
-    this.middlewares.push(middleware);
-  }
-
-  /**
-   * @method listen
-   * @param {*} port - unique id for the listener
-   * @param {Function} callback - callback function
-   * @description This method is used to start listening to the routes
-   * @returns {void}
-   * 
-   */
-
-  listen(port, callback) {
-    if(!port){
-     port = Math.random().toString(36).substring(7);
-    }
-    this.listeners.push(port);
-    callback();
-    if (this.listeners.length === 1) {
-      this.handleRoute(window.location.hash);
-    }else{
-      this.listeners.pop();
-    }
-    if (callback) {
-      callback();
-    }
-    window.onhashchange = () => {
-      this.handleRoute(window.location.hash);
-    }
-  }
-  /**
-   * @method extractParams
-   * @description This method is used to extract parameters from the route path
-   * @param {*} routePath
-   * @param {*} hash 
-   * @returns  {Object} params
-   * @memberof Express
-   */
-
-  extractParams(routePath, hash) {
-    const routeParts = routePath.split('/');
-    const hashParts = hash.split('/');
-    const params = {};
-    routeParts.forEach((part, index) => {
-      if (part.startsWith(':')) {
-        const paramName = part.slice(1);
-        params[paramName] = hashParts[index];
-      }else if(part.startsWith('*')){
-        // remove queries from this par
-        params[0] = hashParts.slice(index).join('/').split('?')[0];
-      }
-    });
-    return params;
-  }
-  extractQueryParams(hash){
-    
-    const queryParams = hash.split('?')[1];
-    if(!queryParams){
-      return {};
-    }
-    const params = {};
-    queryParams.split('&').forEach((param)=>{
-      const [key, value] = param.split('=');
-      params[key] = value;
-    })
-    return params;
-  }
-
-  /**
-   * @method handleRoute
-   * @param {String} hash
-   * @description This method is used to handle the route
-   */
-
-  handleRoute(hash) {
-    hash = hash.slice(1);
-    let status = 200;
-    let route = this.routes.find((route) => {
-     
-      if (route.path === hash) {
-        return true;
-      }
-      const routePathParts = route.path.split('/');
-      const hashParts = hash.split('/');
-      if (routePathParts.length !== hashParts.length) {
-        return false;
-      }else if(routePathParts[routePathParts.length-1].startsWith('*')){
-        return true;
-      }
-      const params = this.extractParams( route.path, hash);
-      return Object.keys(params).length > 0;
-    });
-  
-    if (!route) {
-      route = this.routes.find((route) => {
-         
-         if(route.path === '/404'){
-          return  true;
-         }else{
-           window.location.hash = this.basePath  
-         }
-      });
-
-      route ? status = 200 :
-
-      status = 404;
-    }
-
-     
-    const queryParams = this.extractQueryParams(hash);
-    const params =  route && route.path ? this.extractParams(route.path, hash) : {};
-    const req = {
-      headers: {},
-      params: params,
-      query: queryParams,
-      path: hash,
-      method: route ? route.method : 'get',
-    };
-  
-    // @ts-ignore
-    window.$CURRENT_URL = req.path
-   
-    // @ts-ignore
-    window.$FULL_URL = window.location.href.replace('#', '')
-   
-    const res = {
-      status: status,
-      /**
-       * @method log
-       * @param {String} type 
-       * @description This method is used to log the request and response
-       */
-      log: (type) => {
-        if(type === undefined){
-          console.log(`${req.path} ${req.method} ${res.status} ${req.timestamp}`);
-        }else{
-          console.table({
-            'Request Path': req.path,
-            'Request Method': route.method,
-            'Response Status': res.status,
-            'Request Timestamp': req.timestamp,
-          });
-        }
-      },
-      send: (selector, data) => {
-        if(typeof selector === 'string'){
-          // @ts-ignore
-          document.querySelector(selector).innerHTML = data;
-        }else if(typeof selector === 'number'){
-          res.status = selector;
-        }else if(typeof selector === 'object'){
-          res.status = selector.status;
-        }
-      },
-      json: (selector, data) => {
-        
-        if(typeof selector === 'string'){
-          // @ts-ignore
-          let obj = document.createElement('object');
-           // data url
-          obj.data =  URL.createObjectURL(new Blob([JSON.stringify(data)], {type: 'application/json'}));
-          // @ts-ignore
-          document.querySelector(selector).appendChild(obj);
-        }else{
-          throw new Error('Selector must be a string');
-        }
-      },
-    };
-    this.middlewares.forEach((middleware) => {
-      middleware(req, res);
-    });
-  
-    route ? route.handler(req, res) : null;
-     
-  }
-  
-}
-
-export default VaderRouter;
- 
- 

package/worker-min.js

@@ -1 +0,0 @@
-onmessage=e=>{let a=Date.now(),l=e.data.strings,s=e.data.args,t="",r=e.data.location.split("/").slice(0,-1).join("/"),c="";for(let e=0;e<l.length;e++)c+=l[e],e<s.length&&(c+=s[e]);let o=c.match(/--([^>]*)--/gs);if(o)for(;o.length;){let e=o.pop();console.log(e),c=c.replace(e,"")}if(c=c.replace(/(#+)(.*)/g,((e,a,l)=>{if(console.log(e),e.includes("<")&&e.includes(">"))return e;{let e=a.length;return`<h ${e} class="markdown_heading">${l}</h${e}>`}})),c=c.replace(/\*\*(.*?)\*\*/g,((e,a)=>`<b class="markdown_bold">${a}</b>`)),c=c.replace(/\*(.*?)\*/g,((e,a)=>`<i class="markdown_italic">${a}</i>`)),c=c.replace(/`(.*?)`/g,((e,a)=>`<code>${a}</code>`)),c=c.replace(/\[([^\]]+)\]\(([^)]+)\)/g,((e,a,l)=>`<a  class="markdown_link" href="${l}">${a}</a>`)),c=c.replace(/!\[([^\]]+)\]\(([^)]+)\)/g,((e,a,l)=>`<img  class="markdown_image" src="${l}" alt="${a}" />`)),c.split("\n").forEach(((e,a,l)=>{e.match(/^\s*-\s+(.*?)$/gm)&&(c=0!==a&&l[a-1].match(/^\s*-\s+(.*?)$/gm)?a!==l.length-1&&l[a+1].match(/^\s*-\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li></ul>`):c.replace(e,`<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${e.replace(/^\s*-\s+(.*?)$/gm,"$1")}</li>`))})),c.split("\n").forEach(((e,a,l)=>{e.match(/^\s*\d+\.\s+(.*?)$/gm)&&(c=0!==a&&l[a-1].match(/^\s*\d+\.\s+(.*?)$/gm)?a!==l.length-1&&l[a+1].match(/^\s*\d+\.\s+(.*?)$/gm)?c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`):c.replace(e,`<li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li></ol>`):c.replace(e,`<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${e.replace(/^\s*\d+\.\s+(.*?)$/gm,"$1")}</li>`))})),c=c.replace(/^\s*-\s+(.*?)$/gm,((e,a)=>`<li class="markdown_list_item">${a}</li>`)),c=c.replace(/^\s*---\s*$/gm,'<hr class="markdown_horizontal" />'),c=c.replace(/^\s*> (.*)$/gm,((e,a)=>`<blockquote class="markdown_blockquote">${a}</blockquote>`)),c=c.replace(/((?: *\|.*?)+)\n((?: *\|.*?)+)/gm,((e,a,l)=>{const s=a.split("|").slice(1,-1),t=l.split("|").slice(1,-1);let r='<table class="markdown_table">';return r+='<thead class="markdown_table_head"><tr class="markdown_table_row">',s.forEach((e=>{r+=`<th class="markdown_table_header_cell">${e}</th>`})),r+='</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">',t.forEach((e=>{r+=`<td class="markdown_table_body_cell">${e}</td>`})),r+="</tr></tbody></table>",r})),!c.includes("<body>"))throw new Error(`Vader Error: You must enclose your html in a body tag for all components. \n\n${c}`);c=c.replace(/classname/g,"class");let i=c.match(/<img([^>]*)>/g);if(i)for(let a=0;a<i.length;a++){let l=i[a],s=l.match(/src="([^"]*)"/),t=l.match(/alt="([^"]*)"/);if(s)if(s[1].includes("http")||c.includes("\x3c!-- #vader-disable_relative-paths --\x3e")){if(!s[1].includes("http")&&s[1].startsWith(".")&&!c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${s[1]}`)}else c=c.replace(s[1],`${r}/${s[1]}`);if(!t&&!c.includes("\x3c!-- #vader-disable_accessibility --\x3e"))throw new Error(`Vader Error: You must include an alt attribute in the image tag  \n\n${l} of class ${e.data.name}. `);caches.match(`${r}/${s[1]}`)?console.log("already cached",caches.match(`${r}/${s[1]}`)):caches.open("vader").then((e=>{e.add(`${r}/${s[1]}`),console.log("cached",`${r}/${s[1]}`)})).catch((e=>{console.log(e)}))}let n=c.match(/href="([^"]*)"/g);if(n)for(;n.length;){let a=n.pop();if(a=a.replace('href="',"").replace('"',""),a.includes("http")||c.includes("\x3c!-- #vader-disable_relative-paths --\x3e")){if(!a.includes("http")&&a.startsWith(".")&&!c.includes("\x3c!-- #vader-disable_relative-paths --\x3e"))throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${a}`)}else c=c.replace(`href="${a}"`,`href="#${a}"`)}let d=Date.now()-a,h=!1;(r.includes("localhost")||r.includes("127.0.0.1")&&!h)&&(h=!0,c+=`\${console.log('%c${e.data.name} component rendered in ${d}ms','color:#fff;background:#000;padding:5px;border-radius:5px;font-size:12px;font-weight:bold'),""}`);const p=c.split("<script>");p&&p.forEach(((e,a)=>{if(0===a)c=e;else{if(e.includes("// <![CDATA[  <-- For SVG support"))return;let a=e.split("<\/script>")[0];t+=a}}));let $=c.match(/(\$\(.*?\))/gs);if($)for(;$.length;){let e=$.pop();c=c.replace(e,`\${${e.replace("$(","").replace(")","")}}`)}postMessage({template:`<div data-component=${e.data.name}>${c}</div>`,js:t||""})};

package/worker.js

@@ -1,226 +0,0 @@
- 
-onmessage = (e)=>{
-  let time_started = Date.now()
-  let strings =  e.data.strings
-  let args =   e.data.args
-  let js = ''
-  let l =  e.data.location.split('/').slice(0,-1).join('/')
-  let result = "";
-  for (let i = 0; i < strings.length; i++) {
-    result += strings[i];
-    if (i < args.length) {
-      result += args[i];
-    }
-  }
-
-  let comments = result.match(/--([^>]*)--/gs)
-  if(comments){
-      while(comments.length){
-          let comment = comments.pop()
-          console.log(comment)
-          // @ts-ignore
-          result = result.replace(comment,'')
-      }
-  }
-
-
-  // Convert headings (e.g., #1-6 Heading => <h1-6>Heading</h1-6>)
-  // @ts-ignore
-    result = result.replace(/(#+)(.*)/g, (match, hashes, text) => {
-      console.log(match)
-      if(!match.includes('<') || !match.includes('>')){ 
-        let level = hashes.length;
-          return `<h ${level} class="markdown_heading">${text}</h${level}>`;
-      }else{
-          return match
-      }
-    });
-
-    
-
-  
-    // Convert bold (e.g., **Bold** => <b>Bold</b>)
-    result = result.replace(/\*\*(.*?)\*\*/g, (match, text) => {
-      return `<b class="markdown_bold">${text}</b>`;
-    });
-  
-    // Convert italic (e.g., *Italic* => <i>Italic</i>)
-    result = result.replace(/\*(.*?)\*/g, (match, text) => {
-      return `<i class="markdown_italic">${text}</i>`;
-    });
-  
-    // Convert code (e.g., `code` => <code>code</code>)
-    result = result.replace(/`(.*?)`/g, (match, text) => {
-      return `<code>${text}</code>`;
-    });
-  
-    // Convert links (e.g., [Text](URL) => <a href="URL">Text</a>)
-    result = result.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (match, text, url) => {
-      return `<a  class="markdown_link" href="${url}">${text}</a>`;
-    });
-  
-    // Convert images (e.g., ![Alt](URL) => <img src="URL" alt="Alt" />)
-    result = result.replace(/!\[([^\]]+)\]\(([^)]+)\)/g, (match, alt, src) => {
-      return `<img  class="markdown_image" src="${src}" alt="${alt}" />`;
-    });
-  
-    // Convert unordered lists (e.g., * Item => <ul><li>Item</li></ul>)
-    result.split('\n').forEach((line, index, arr) => {
-      if (line.match(/^\s*-\s+(.*?)$/gm)) {
-        if (index === 0 || !arr[index - 1].match(/^\s*-\s+(.*?)$/gm)) {
-          result = result.replace(line, `<ul class="markdown_unordered" style="list-style-type:disc;list-style:inside"><li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li>`);
-        } else if (index === arr.length - 1 || !arr[index + 1].match(/^\s*-\s+(.*?)$/gm)) {
-          result = result.replace(line, `<li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li></ul>`);
-        } else {
-          result = result.replace(line, `<li>${line.replace(/^\s*-\s+(.*?)$/gm, '$1')}</li>`);
-        }
-      }
-    });
-
-    // Convert ordered lists (e.g., 1. Item => <ol><li>Item</li></ol>) in order
-  
-     result.split('\n').forEach((line, index, arr) => {
-      if (line.match(/^\s*\d+\.\s+(.*?)$/gm)) {
-        if (index === 0 || !arr[index - 1].match(/^\s*\d+\.\s+(.*?)$/gm)) {
-          result = result.replace(line, `<ol class="markdown_ordered" style="list-style-type:decimal;"><li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li>`);
-        } else if (index === arr.length - 1 || !arr[index + 1].match(/^\s*\d+\.\s+(.*?)$/gm)) {
-          result = result.replace(line, `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li></ol>`);
-        } else {
-          result = result.replace(line, `<li>${line.replace(/^\s*\d+\.\s+(.*?)$/gm, '$1')}</li>`);
-        }
-      }
-     });
-
-     
-     result = result.replace(/^\s*-\s+(.*?)$/gm, (match, text) => {
-      return `<li class="markdown_list_item">${text}</li>`;
-    });
-    result = result.replace(/^\s*---\s*$/gm, '<hr class="markdown_horizontal" />');
-   
-    // Convert blockquotes (e.g., > Quote => <blockquote>Quote</blockquote>)
-    result = result.replace(/^\s*> (.*)$/gm, (match, text) => {
-      return `<blockquote class="markdown_blockquote">${text}</blockquote>`;
-    });
-
-    // Convert tables (e.g., | Header | Cell | => <table><thead><tr><th>Header</th><th>Cell</th></tr></thead></table>)
-    result = result.replace(/((?: *\|.*?)+)\n((?: *\|.*?)+)/gm, (match, header, cell) => {
-      const headerCells = header.split('|').slice(1, -1);
-      const cells = cell.split('|').slice(1, -1);
-      let table = '<table class="markdown_table">';
-      table += '<thead class="markdown_table_head"><tr class="markdown_table_row">';
-      headerCells.forEach((headerCell) => {
-        table += `<th class="markdown_table_header_cell">${headerCell}</th>`;
-      });
-      table += '</tr></thead><tbody class="markdown_table_body"><tr class="markdown_table_row">';
-      cells.forEach((cell) => {
-        table += `<td class="markdown_table_body_cell">${cell}</td>`;
-      });
-      table += '</tr></tbody></table>';
-      return table;
-    });
-
-    
-  
-
-  if(!result.includes('<body>')){
-      throw new Error(`Vader Error: You must enclose your html in a body tag for all components. \n\n${result}`)
-  }
-  /**
-   * @type {string[]}
-   * @description - grabbing all className attributes and replace them with  class
-   */
-  // @ts-ignore
-   result = result.replace(/classname/g,'class')
-       /**
-   * @type {string[]}
-   * @description - grabbing all image tags and replace the src attribute with the absolute path
-   */
-  // @ts-ignore
-  let images = result.match(/<img([^>]*)>/g)
-   if(images){
-      for(let i = 0; i < images.length; i++){
-    let image = images[i]
-    let src = image.match(/src="([^"]*)"/)
-    let alt = image.match(/alt="([^"]*)"/)
-    if(src){
-      if(!src[1].includes('http') && !result.includes('<!-- #vader-disable_relative-paths -->')){
-          // @ts-ignore
-          result = result.replace(src[1],`${l}/${src[1]}`)
-      } else if(!src[1].includes('http') && src[1].startsWith('.') && !result.includes('<!-- #vader-disable_relative-paths -->')){
-        throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${src[1]}`)
-    }
-    }
-    if(!alt && !result.includes('<!-- #vader-disable_accessibility -->')){
-       throw new Error(`Vader Error: You must include an alt attribute in the image tag  \n\n${image} of class ${e.data.name}. `)
-    }
-
-    // @ts-ignore
-     if(!caches.match(`${l}/${src[1]}`)){
-      caches.open('vader').then((cache)=>{
-          // @ts-ignore
-          cache.add(`${l}/${src[1]}`)
-          // @ts-ignore
-          console.log('cached', `${l}/${src[1]}`)
-         }).catch((err)=>{
-           console.log(err)
-         })
-     }else{
-      // @ts-ignore
-          console.log('already cached', caches.match(`${l}/${src[1]}`))
-     }
-  }
-   }
-
-  let href =  result.match(/href="([^"]*)"/g)
-  if(href){
-      while(href.length){
-          let h = href.pop()
-          // @ts-ignore
-          h = h.replace('href="','').replace('"','')
-          if(!h.includes('http') && !result.includes('<!-- #vader-disable_relative-paths -->')){
-             result = result.replace(`href="${h}"`,`href="#${h}"`)
-          }else if(!h.includes('http') && h.startsWith('.') && !result.includes('<!-- #vader-disable_relative-paths -->')){
-            throw new Error(`Vader Error: You cannot use absolute paths since relative paths are not disabled in ${e.data.file}. Use relative paths instead. \n\n${h}`)
-          }
-      }
-  }
-  
-  let time_ended = Date.now()
-  let time_taken = time_ended - time_started
-  let hasran = false
-  if(l.includes('localhost') || l.includes('127.0.0.1') && !hasran){
-      hasran = true
-      result+= `\$\{console.log('%c${e.data.name} component rendered in ${time_taken}ms','color:#fff;background:#000;padding:5px;border-radius:5px;font-size:12px;font-weight:bold'),""\}`
-  }
- 
- 
-  const d = result.split('<script>')
-
-  if (d) {
-    d.forEach((scriptTag, index) => {
-      if (index === 0) {
-        result = scriptTag;
-      } else {
-        if(scriptTag.includes('// <![CDATA[  <-- For SVG support')){
-          return
-        }
-        let script = scriptTag.split('</script>')[0];
-        js += script;
-      }
-    });
-  }
-   
-  let  jstemplates = result.match(/(\$\(.*?\))/gs)
-  if(jstemplates){
-      while(jstemplates.length){
-          let jstemplate = jstemplates.pop()
-          // @ts-ignore
-          result = result.replace(jstemplate,`$\{${jstemplate.replace('$(','').replace(')','')}\}`)
-      }
-  }
-  postMessage({
-    template: `<div data-component=${e.data.name}>${result}</div>`,
-    js: js ? js : ''
-  })
- 
-}