tecitheme 1.2.1 → 1.2.2

package/dist/components/CTASplitImage.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { getColorStyles, makeIdString } from '../utils'
+  import { getColorStyles, makeIdString, getTeciImageURL } from '../utils'
   import Button from './Button.svelte'
   export let data = {};
   let id = makeIdString(data.name);
@@ -7,7 +7,7 @@
 
 <section {id} class="relative {getColorStyles('background', data.color)} print:hidden">
   <div class="h-56 sm:h-72 md:absolute md:left-0 md:h-full md:w-1/2">
-    <img class="h-full w-full object-cover" src="https://files.thunderheadeng.com/www/images/{data.image}?w=608&fit=clip&auto=compress&auto=format" alt="Image for {data.preheading}">
+    <img class="h-full w-full object-cover" src={getTeciImageURL(data.image, data.site ? data.site : "www", 'w=608,fit=contain')} alt="Image for {data.preheading}">
   </div>
   <div class="relative mx-auto max-w-7xl py-12 px-6 lg:px-8 lg:py-16">
     <div class="md:ml-auto md:w-1/2 md:pl-10">

package/dist/components/Card.svelte

@@ -2,7 +2,7 @@
 import Button from './Button.svelte'
 
   //Allows icons from https://fonts.google.com/icons?selected=Material+Icons by name in the format 'icon-XXXX'.
-  import { getColorStyles } from '../utils'
+  import { getColorStyles, getTeciImageURL } from '../utils'
   import Icon from "./Icon.svelte";
   export let data = {};
   export let halfHeight = undefined;
@@ -11,12 +11,9 @@ import Button from './Button.svelte'
 
   if (data.image) {
     if (data.image.includes("gif")) {
-      backgroundImage = "https://files.thunderheadeng.com/www/images/" + data.image;
+      backgroundImage = getTeciImageURL(data.image, data.site ? data.site : "www", '');
     } else {
-      backgroundImage =
-        "https://files.thunderheadeng.com/www/images/" +
-        data.image +
-        "?w=698&h=392&fit=crop&auto=compress&auto=format";
+      backgroundImage = getTeciImageURL(data.image, data.site ? data.site : "www", 'w=698,h=392,fit=crop,scq=60,format=auto');
     }
   }
 </script>

package/dist/components/Carousel.svelte

@@ -1,5 +1,5 @@
 <script>
-    import { getColorStyles, makeIdString } from "../utils";
+    import { getColorStyles, makeIdString, getTeciImageURL } from "../utils";
 
     export let data;
     let { name, items } = data;
@@ -53,8 +53,8 @@
         <div id={`${makeIdString(name)}-item-${index}`} class="item snap-center flex flex-col sm:flex-row w-full items-center justify-center flex-shrink-0 p-2">
 
           <!-- Image -->
-          <a class="flex-grow flex-shrink-0 flex justify-center {item.cta ? "w-1/2" : "w-full"}" href={item.url ? item.url : item.image} target="_blank">
-            <img class="sm:h-72 lg:h-96 shadow" alt="" src={item.image} />
+          <a class="flex-grow flex-shrink-0 flex justify-center {item.cta ? "w-1/2" : "w-full"}" href={item.url ? item.url : getTeciImageURL(item.image, item.site ? item.site : "www", '')} target="_blank">
+            <img class="sm:h-72 lg:h-96 shadow" alt="" src={getTeciImageURL(item.image, item.site ? item.site : "www", '')} />
           </a>
 
           <!-- Caption -->

package/dist/components/FeatureAlternatingWithTestimonial.svelte

@@ -105,7 +105,7 @@
                 <div class="flex items-center space-x-3">
                   <img
                     class="size-6 rounded-full"
-                    src="https://files.thunderheadeng.com/www/images/{testimonial.image}?w=320&fit=facearea,crop&facepad=3&monochrome=9B9B9B&auto=compress&auto=format"
+                    src={getTeciImageURL(testimonial.image, testimonial.site ? testimonial.site : "www", 'w=320,fit=crop,gravity=face,zoom=1,saturation=0,scq=60,format=auto')}
                     alt="Image of {testimonial.name}"
                     title="{testimonial.name}"
                   />
@@ -127,7 +127,8 @@
               in:conditionalTransition={{ fn: fade, condition: animate, delay: 200, duration: 1250, easing:cubicInOut, x: textPosition == "left" ? '100%' : '-100%'}}
               out:conditionalTransition={{fn: fade, condition: animate, delay: 200, duration: 1250, easing:cubicInOut, x: textPosition == "left" ? '100%' : '-100%'}}
             >
-              <img class="w-full shadow-xl ring-1 ring-black/5 lg:absolute {textPosition == "left" ? "lg:left-0" : "right-0"} lg:h-full lg:w-auto lg:max-w-none" src={getTeciImageURL(image.url, image.site ? image.site : "www")} alt={image.alt}>
+              <img class="w-full shadow-xl ring-1 ring-black/5 lg:absolute {textPosition == "left" ? "lg:left-0" : "right-0"} lg:h-full lg:w-auto lg:max-w-none"
+              src={getTeciImageURL(image.url, image.site ? image.site : "www", 'w=760,fit=crop,scq=60,format=auto')} alt={image.alt}>
             </div>
           {:else if animate}
             <div 

package/dist/components/Header.svelte

@@ -1,9 +1,10 @@
 <script>
-  import {PUBLIC_BUILD_MODE} from '$env/static/public';
+  import { PUBLIC_BUILD_MODE } from '$env/static/public';
   import Icon from "./Icon.svelte";
   import SearchBar from './Search/SearchBar.svelte';
   import { fade, slide } from "svelte/transition";
   import { cubicIn, cubicOut } from "svelte/easing";
+  import { getTeciImageURL } from '../utils'
 
   let openMenu = "";
 
@@ -590,7 +591,7 @@
           >
             <img
               class="h-10 w-auto"
-              src="https://files.thunderheadeng.com/www/images/teci_logo.svg"
+              src={getTeciImageURL("teci_logo.svg", "www", '')}
               alt="Thunderhead Engineering"
             />
           </a>

package/dist/components/Hero.svelte

@@ -1,7 +1,7 @@
 <script>
 import Icon from './Icon.svelte'
 
-  import { getColorStyles, makeIdString } from '../utils'
+  import { getColorStyles, makeIdString, getTeciImageURL } from '../utils'
   export let data = {};
   let id = makeIdString(data.name);
 </script>
@@ -65,11 +65,11 @@ import Icon from './Icon.svelte'
     </div>
     <div class="relative hidden md:block md:col-span-4 lg:col-span-5 xl:col-span-6">
       {#if data.video}
-      <video src="https://files.thunderheadeng.com/www/videos/{data.video}" autoplay="true" loop muted 
+      <video src="https://media.thunderheadeng.net/www/videos/{data.video}" autoplay="true" loop muted 
         class="absolute object-cover h-full w-full">
       </video>
       {:else if data.image}
-        <img src="https://files.thunderheadeng.com/www/images/{data.image}?fmt=auto" alt={data.heading}
+        <img src={getTeciImageURL(data.image, data.site ? data.site : "www", '')} alt={data.heading}
         class="absolute object-cover h-full w-full"
         >
       {/if}

package/dist/components/Icon.svelte

@@ -1,9 +1,9 @@
 <script>
-    import { makeIdString } from "../utils";
+    import { makeIdString, getTeciImageURL } from "../utils";
 
   // Allows icons from https://fonts.google.com/icons?selected=Material+Icons by name in the format 'icon-XXXX'.
-  export let icon = undefined;
-  export let classes = undefined;
+  export let icon = "";
+  export let classes = "";
 
   let id = makeIdString(icon);
 </script>
@@ -12,7 +12,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pyrosim_icon.svg"
+      src={getTeciImageURL("pyrosim_icon.svg", "www", '')}
       alt="PyroSim"
       title="PyroSim Icon"
     />
@@ -21,7 +21,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pyrosim-results_icon.svg"
+      src={getTeciImageURL("pyrosim-results_icon.svg", "www", '')}
       alt="PyroSim Results"
       title="PyroSim Results Icon"
     />
@@ -30,7 +30,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pyrosim_logo.svg"
+      src={getTeciImageURL("pyrosim_logo.svg", "www", '')}
       alt="PyroSim Logo"
       title="PyroSim Logo"
     />
@@ -39,7 +39,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pathfinder_icon.svg"
+      src={getTeciImageURL("pathfinder_icon.svg", "www", '')}
       alt="Pathfinder"
       title="Pathfinder Icon"
     />
@@ -48,7 +48,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pathfinder-results_icon.svg"
+      src={getTeciImageURL("pathfinder-results_icon.svg", "www", '')}
       alt="Pathfinder Results"
       title="Pathfinder Results Icon"
     />
@@ -57,7 +57,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/pathfinder_logo.svg"
+      src={getTeciImageURL("pathfinder_logo.svg", "www", '')}
       alt="Pathfinder Logo"
       title="Pathfinder Logo"
     />
@@ -66,7 +66,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/ventus_icon.svg"
+      src={getTeciImageURL("ventus_icon.svg", "www", '')}
       alt="Ventus"
       title="Ventus Icon"
     />
@@ -75,7 +75,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/ventus_logo.svg"
+      src={getTeciImageURL("ventus_logo.svg", "www", '')}
       alt="Ventus Logo"
       title="Ventus Logo"
     />
@@ -84,7 +84,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/petrasim_icon.svg"
+      src={getTeciImageURL("petrasim_icon.svg", "www", '')}
       alt="PetraSim"
       title="PetraSim Icon"
     />
@@ -93,7 +93,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/petrasim_logo.svg"
+      src={getTeciImageURL("petrasim_logo.svg", "www", '')}
       alt="PetraSim Logo"
       title="PetraSim Logo"
     />
@@ -102,7 +102,7 @@
   <span {id} class="not-prose">
     <img
       class={classes}
-      src="https://files.thunderheadeng.com/www/images/teci_logo.svg"
+      src={getTeciImageURL("teci_logo.svg", "www", '')}
       alt="Thunderhead Logo"
       title="Thunderhead Logo"
     />

package/dist/components/Icon.svelte.d.ts

@@ -2,8 +2,8 @@
 /** @typedef {typeof __propDef.events}  IconEvents */
 /** @typedef {typeof __propDef.slots}  IconSlots */
 export default class Icon extends SvelteComponent<{
-    icon?: any;
-    classes?: any;
+    icon?: string;
+    classes?: string;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> {
@@ -14,8 +14,8 @@ export type IconSlots = typeof __propDef.slots;
 import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
-        icon?: any;
-        classes?: any;
+        icon?: string;
+        classes?: string;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/components/MediaFeature.svelte

@@ -1,7 +1,7 @@
 <script>
 import Video from './Video.svelte'
 
-  import { getColorStyles, makeIdString } from '../utils'
+  import { getColorStyles, makeIdString, getTeciImageURL } from '../utils'
   export let data = {};
 
   let figureImage;
@@ -13,18 +13,15 @@ import Video from './Video.svelte'
       figureImage = data.image;
       figureLink = data.link ? data.link : data.image;
     } else if (data.image.includes("gif")) {
-      figureImage = "https://files.thunderheadeng.com/www/images/" + data.image;
+      figureImage = getTeciImageURL(data.image, data.site ? data.site : "www", '');
       figureLink = data.link
         ? data.link
-        : "https://files.thunderheadeng.com/www/images/" + data.image;
+        : getTeciImageURL(data.image, data.site ? data.site : "www", '');
     } else {
-      figureImage =
-        "https://files.thunderheadeng.com/www/images/" +
-        data.image +
-        "?w=576&ar=16:9&fit=crop&auto=compress&auto=format";
+      figureImage = getTeciImageURL(data.image, data.site ? data.site : "www", 'w=576,h=324,fit=crop,scq=60,format=auto');
       figureLink = data.link
         ? data.link
-        : "https://files.thunderheadeng.com/www/images/" + data.image;
+        : getTeciImageURL(data.image, data.site ? data.site : "www", '');
     }
   }
 </script>

package/dist/components/SidebarContent.svelte

@@ -82,7 +82,6 @@
             ? 'border-opacity-100 bg-opacity-100 text-opacity-100'
             : 'border-opacity-60 bg-opacity-20 text-opacity-60 hover:border-opacity-100 hover:bg-opacity-100 hover:text-opacity-100'}"
           title="Table of Contents Toggle"
-          alt="Table of Contents Toggle"
         >
           <span class="material-icons-outlined">menu_open</span>
         </button>

package/dist/components/Stats.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { getColorStyles, getGridSizeStyles, makeIdString } from '../utils'
+  import { getColorStyles, getGridSizeStyles, makeIdString, getTeciImageURL } from '../utils'
   export let data = {};
 
   let {
@@ -55,7 +55,7 @@
         <!-- Image -->
         {#if image}
           <figure>
-            <img class="w-full" alt="{(imageAltText ? imageAltText : heading)}" src="https://files.thunderheadeng.com/www/images/{image}?w=1152&fit=crop&auto=compress&auto=format">
+            <img class="w-full" alt={imageAltText ? imageAltText : heading} src={getTeciImageURL(image, "www", 'w=1152,fit=crop,scq=60,format=auto')}>
           </figure>
         {/if}
       </div>

package/dist/components/Testimonial.svelte

@@ -2,7 +2,7 @@
 import Button from './Button.svelte'
 import Icon from './Icon.svelte'
 
-  import { getColorStyles, makeIdString } from '../utils'
+  import { getColorStyles, makeIdString, getTeciImageURL } from '../utils'
   import { slide } from 'svelte/transition';
   import { quintInOut } from 'svelte/easing';
   import { onMount } from 'svelte'
@@ -85,7 +85,7 @@ import Icon from './Icon.svelte'
           <div class="hidden lg:block lg:flex-shrink-0">
             <img
               class="h-64 w-64 rounded-full xl:h-80 xl:w-80"
-              src="https://files.thunderheadeng.com/www/images/{quote.image}?w=320&fit=facearea,crop&facepad=3&monochrome=9B9B9B&auto=compress&auto=format"
+              src={getTeciImageURL(quote.image, quote.site ? quote.site : "www", 'w=320,h=320,fit=crop,gravity=face,zoom=0.5,saturation=0,scq=60,format=auto')}
               alt="Image of {quote.fullname}"
               title="{quote.fullname}"
             />
@@ -125,7 +125,7 @@ import Icon from './Icon.svelte'
                     <div class="flex-shrink-0 lg:hidden">
                       <img
                         class="h-12 w-12 rounded-full"
-                        src="https://files.thunderheadeng.com/www/images/{quote.image}?w=48&fit=clip&monochrome=9B9B9B&auto=compress&auto=format"
+                        src={getTeciImageURL(quote.image, quote.site ? quote.site : "www", 'w=48,h=48,fit=crop,gravity=face,zoom=0.7,saturation=0,scq=60,format=auto')}
                         alt="Thumbnail Image of {quote.fullname}"
                       />
                     </div>

package/dist/components/Video.svelte

@@ -1,5 +1,6 @@
 <script>
   import { onMount } from 'svelte'
+  import { getTeciImageURL } from '../utils'
 
   export let data={};
   export let v = undefined;
@@ -47,7 +48,7 @@
   if (v) {
     if (v.includes("mp4")) {
       youtube = false;
-      videoURL = `https://files.thunderheadeng.com/www/videos/${v}`;
+      videoURL = `https://media.thunderheadeng.net/www/videos/${v}`;
     } else {
       youtube = true;
       videoID = v;
@@ -55,7 +56,7 @@
   } else if (data.v) {
     if (data.v.includes("mp4")) {
       youtube = false;
-      videoURL = `https://files.thunderheadeng.com/www/videos/${data.v}`;
+      videoURL = `https://media.thunderheadeng.net/www/videos/${data.v}`;
     } else {
       youtube = true;
       videoID = data.v;
@@ -66,13 +67,11 @@
   };
 
   if (thumbnail) {
-    thumb = `https://files.thunderheadeng.com/www/images/${thumbnail}?w=1214&fit=clip&auto=compress&auto=format`;
+    thumb = getTeciImageURL(thumbnail, "www", 'w=1214,fit=crop,scq=60,format=auto');
   } else if (data.thumbnail) {
-    thumb = `https://files.thunderheadeng.com/www/images/${data.thumbnail}?w=1214&fit=clip&auto=compress&auto=format`;
+    thumb = getTeciImageURL(data.thumbnail, "www", 'w=1214,fit=crop,scq=60,format=auto');
   } else if (videoID) {
-    if (youtube) {
-      thumb = `https://i.ytimg.com/vi/${videoID}/maxresdefault.jpg`;
-    }
+    if (youtube) { thumb = `https://i.ytimg.com/vi/${videoID}/maxresdefault.jpg`; }
   }
 </script>
 

package/dist/layouts/blocks.svelte

@@ -25,7 +25,9 @@
   import PartnersList from "../components/PartnersList.svelte";
   import DescriptionList  from "../components/DescriptionList.svelte";
   import Carousel from "../components/Carousel.svelte";
-    import { setContext } from "svelte";
+  
+  import { setContext } from "svelte";
+  import { getTeciImageURL } from '../utils'
 
   let blocks = [
     { ref: "accordion", component: Accordion },
@@ -71,9 +73,9 @@
   let featuredImage;
 
   if (image) {
-    featuredImage = "https://files.thunderheadeng.com/www/images/" + image + "?w=1200&h=627&fit=crop&auto=compress&auto=format";
+    featuredImage = getTeciImageURL(image, "www", 'w=1200,h=627,fit=crop,scq=60,format=auto');
   } else {
-    featuredImage = "https://files.thunderheadeng.com/www/images/teci_icon_250.png";
+    featuredImage = getTeciImageURL("teci_icon_250.png", "www", 'format=auto');
   }
 
   let pageNav = page_sections ? page_sections.filter(sect => sect.fieldGroup === "pageNav")[0] : undefined;

package/dist/utils.d.ts

@@ -47,7 +47,7 @@ export function makeIdString(text: any): string;
  * @param {*} imageSrc The image source string
  * @param {*} site ('www' or 'support') TECi image folder to pull from
  */
-export function getTeciImageURL(imageSrc: any, site?: any): any;
+export function getTeciImageURL(imageSrc: any, site: any, params: any): any;
 /**
  * Convenience function that sets the state of a Svelte Store to true when an element is visible on the screen. Useful for triggering animations.
  *

package/dist/utils.js

@@ -527,10 +527,11 @@ export function makeIdString(text) {
  * @param {*} imageSrc The image source string
  * @param {*} site ('www' or 'support') TECi image folder to pull from 
  */
-export function getTeciImageURL(imageSrc, site = "www") {
-  return imageSrc.startsWith("http") ? imageSrc : `https://files.thunderheadeng.com/${site}/images/${imageSrc}`
+export function getTeciImageURL(imageSrc, site = "www", params) {
+  return imageSrc.startsWith("http") ? imageSrc : `https://media.thunderheadeng.net/cdn-cgi/image/${params??''}/${site}/images/${imageSrc}`
 }
 
+
 /**
  * Convenience function that sets the state of a Svelte Store to true when an element is visible on the screen. Useful for triggering animations.
  * 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tecitheme",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "license": "MIT",
   "scripts": {
     "dev": "vite dev",