@pie-api/pie-element-extensions - npm Package Compare versions

Comparing version 1.6.1 to 1.6.2

dist/pies/ConstructedResponse.js

@@ -13,5 +13,5 @@ import{a as s,r as e,b as t,d as r,h as a}from"./cssUtils-9e0d40cc.js";import{C as n}from"./CustomLitElement-d7d74aaf.js";import{u as i}from"./unsafe-html-50c739ac.js";import{p as o,g as p}from"./utils-dc176e4d.js";class d extends n{static get styles(){return[s,e,t`
         }
-      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1}}}_renderResponse(){const{choices:s,markup:e}=this.model||{},{value:t}=this.session||{};if(!t||!e)return"";return o(e).replace(/\{\{(.)\}\}/g,(e,r)=>{const a=s[r].find(s=>s.label===t[r]);return`\n        <span class="answer">\n        ${t[r]}\n        <span class="correctness-indicator">${p(a,!0)}</span>\n        </span>`})}render(){return a`<div class="response">
+      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1}}}_renderResponse(){const{choices:s,markup:e}=this.model||{},{value:t}=this.session||{};if(!t||!e)return"";return o(e).replace(/\{\{(.)\}\}/g,(e,r)=>{const a=s[r].find(s=>s.label===t[r]);return`\n        <span class="answer">\n        ${t[r]||""}\n        <span class="correctness-indicator">${p(a,!0)}</span>\n        </span>`})}render(){return a`<div class="response">
       ${i(this._renderResponse())}
     </div>`}}export default d;export{d as ConstructedResponse};
 //# sourceMappingURL=ConstructedResponse.js.map

dist/pies/DragInTheBlankResponse.js

@@ -5,3 +5,3 @@ import{g as e,j as s,r as t,b as o,h as r}from"./cssUtils-9e0d40cc.js";import{C as i}from"./CustomLitElement-d7d74aaf.js";import"./unsafe-html-50c739ac.js";import{g as h,r as c}from"./utils-dc176e4d.js";class a extends i{static get styles(){return[e,s,t,o`
         }
-      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},hoveredChoice:{type:Object}}}set hoveredChoice(e){const s=this._hoveredChoice;s&&e&&s.value===e.value||(this._hoveredChoice=e,this.requestUpdate("hoveredChoice",s))}get hoveredChoice(){return this._hoveredChoice}constructor(){super(),this._hoveredChoice=null}mouseover(e,s){const t=e.target.closest(".choice-value"),{offsetTop:o,offsetHeight:r}=t;this.hoveredChoice={value:s,top:o+r/2}}mouseout(){this.hoveredChoice=null}_renderResponse(){const{correctResponse:e,choices:s}=this.model||{},{value:t}=this.session||{};if(!t||!e)return r``;return(Object.keys(e)||[]).map(o=>{const i=s.find(s=>s.id===e[o]);return r`<div
+      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},hoveredChoice:{type:Object}}}set hoveredChoice(e){const s=this._hoveredChoice;s&&e&&s.value===e.value||(this._hoveredChoice=e,this.requestUpdate("hoveredChoice",s))}get hoveredChoice(){return this._hoveredChoice}constructor(){super(),this._hoveredChoice=null}mouseover(e,s){const t=e.target.closest(".choice-value"),{offsetTop:o,offsetHeight:r}=t;this.hoveredChoice={value:s,top:o+r/2}}mouseout(){this.hoveredChoice=null}_renderResponse(){const{correctResponse:e,choices:s}=this.model||{},{value:t}=this.session||{};if(!t||!e)return r``;return(Object.keys(e)||[]).map(o=>{const i=s.find(e=>e.id===t[o]);return r`<div
         class="choice-value"
@@ -8,0 +8,0 @@ @mouseover=${e=>this.mouseover(e,i.value)}

dist/pies/DrawingResponse.js

@@ -1,2 +0,2 @@
-import{r as e,b as t,k as s,l as i,h as a}from"./cssUtils-9e0d40cc.js";import{C as r}from"./CustomLitElement-d7d74aaf.js";class n extends r{static get styles(){return[e,t`
+import{r as t,b as e,k as s,l as i,h as a}from"./cssUtils-9e0d40cc.js";import{C as r}from"./CustomLitElement-d7d74aaf.js";class n extends r{static get styles(){return[t,e`
         .response {
@@ -10,3 +10,2 @@ position: relative;
         .drawables {
-          background-color: var(--pie-live-session-background-color, transparent);
           position: absolute;
@@ -22,8 +21,8 @@ left: 0;
         }
-      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},containerDimensions:{type:Object}}}set containerDimensions(e){const t=this._containerDimensions;(!t&&e||t&&e&&(t.width!==e.width||t.height!==e.height))&&(this._containerDimensions=e,this.requestUpdate("containerDimensions",t))}get containerDimensions(){return this._containerDimensions}updated(e){super.updated(e);const{height:t,width:s}=this._containerDimensions||{};this.updateComplete.then(()=>{setTimeout(()=>{const{clientHeight:e,clientWidth:i}=this.shadowRoot.querySelector(".response");e&&i&&(t!==e||s!==i)&&(this.containerDimensions={width:i,height:e})},500)})}_getMinWidthAndHeight(){const{imageDimensions:e}=this.model||{},{drawables:t=[],texts:s=[]}=this.session||{};let{height:i,width:a}=e||{};return s.forEach(({x:e,y:t,width:s,fontSize:r})=>{e+s>a&&(a=e+s),t+r>i&&(i=t+r)}),t.reduce((e,t)=>{const{type:s,startx:i,starty:a,x:r,y:n,height:o,points:h,radius:l,width:c}=t||{};let d,m;switch(s){case"FreePathDrawable":case"EraserDrawable":d=Math.max(...h.filter((e,t)=>t%2==0)),m=Math.max(...h.filter((e,t)=>t%2==1));break;case"LineDrawable":d=Math.max(i,r),m=Math.max(a,n);break;case"RectangleDrawable":d=Math.max(i,i+c),m=Math.max(a,a+o);break;case"CircleDrawable":d=Math.max(i,i+l),m=Math.max(a,a+l)}return d>e.width&&(e.width=d),m>e.height&&(e.height=m),e},{width:a,height:i})}static _renderDrawing(e,t,s){const i=document.createElement("canvas"),r=i.getContext("2d");i.width=t,i.height=s,i.style.position="absolute",i.style.top="0",i.style.left="0";const{type:n,fillColor:o,outlineColor:h}=e;switch(r.fillStyle=o,r.strokeStyle=h,r.lineWidth=2,r.beginPath(),n){case"FreePathDrawable":case"EraserDrawable":{const{points:t}=e;"EraserDrawable"===n&&(r.strokeStyle="#fff",r.lineWidth=5);for(let e=0;e<t.length;e+=1)e%2!=0&&r.lineTo(t[e+1],t[e]);break}case"LineDrawable":{const{startx:t,starty:s,x:i,y:a}=e;r.moveTo(t,s),r.lineTo(i,a);break}case"RectangleDrawable":{const{startx:t,starty:s,width:i,height:a}=e;r.fillRect(t,s,i,a),r.strokeRect(t,s,i,a);break}case"CircleDrawable":{const{radius:t,startx:s,starty:i}=e;r.arc(s,i,t,0,2*Math.PI),r.fill();break}}return r.stroke(),a`${i}`}static _renderText({text:e,x:t,y:s,rotation:i,scaleX:r,scaleY:n}){return a`<span class="drawableText" style="${`top: ${s-3}px; left: ${t}px; transform: rotate(${i}deg) scaleX(${r}) scaleY(${n});`}">${e}</span>`}_renderImage(){const{imageUrl:e,imageDimensions:t}=this.model||{},{height:s,width:i}=t||{};return e?a`<img
+      `]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},containerDimensions:{type:Object}}}set containerDimensions(t){const e=this._containerDimensions;(!e&&t||e&&t&&(e.width!==t.width||e.height!==t.height))&&(this._containerDimensions=t,this.requestUpdate("containerDimensions",e))}get containerDimensions(){return this._containerDimensions}updated(t){super.updated(t);const{height:e,width:s}=this._containerDimensions||{};this.updateComplete.then(()=>{setTimeout(()=>{const{clientHeight:t,clientWidth:i}=this.shadowRoot.querySelector(".response");t&&i&&(e!==t||s!==i)&&(this.containerDimensions={width:i,height:t})},500)})}_getMinWidthAndHeight(){const{imageDimensions:t}=this.model||{},{drawables:e=[],texts:s=[]}=this.session||{};let{height:i,width:a}=t||{};return s.forEach(({x:t,y:e,width:s,fontSize:r})=>{t+s>a&&(a=t+s),e+r>i&&(i=e+r)}),e.reduce((t,e)=>{const{type:s,startx:i,starty:a,x:r,y:n,height:o,points:h,radius:l,width:c}=e||{};let d,m;switch(s){case"FreePathDrawable":case"EraserDrawable":d=Math.max(...h.filter((t,e)=>e%2==0)),m=Math.max(...h.filter((t,e)=>e%2==1));break;case"LineDrawable":d=Math.max(i,r),m=Math.max(a,n);break;case"RectangleDrawable":d=Math.max(i,i+c),m=Math.max(a,a+o);break;case"CircleDrawable":d=Math.max(i,i+l),m=Math.max(a,a+l)}return d>t.width&&(t.width=d),m>t.height&&(t.height=m),t},{width:a,height:i})}static _renderDrawing(t,e,s){const i=document.createElement("canvas"),r=i.getContext("2d");i.width=e,i.height=s,i.style.position="absolute",i.style.top="0",i.style.left="0";const{type:n,fillColor:o,outlineColor:h}=t;switch(r.fillStyle=o,r.strokeStyle=h,r.lineWidth=2,r.beginPath(),n){case"FreePathDrawable":case"EraserDrawable":{const{points:e}=t;"EraserDrawable"===n&&(r.strokeStyle="#fff",r.lineWidth=5);for(let t=0;t<e.length;t+=1)t%2!=0&&r.lineTo(e[t+1],e[t]);break}case"LineDrawable":{const{startx:e,starty:s,x:i,y:a}=t;r.moveTo(e,s),r.lineTo(i,a);break}case"RectangleDrawable":{const{startx:e,starty:s,width:i,height:a}=t;r.fillRect(e,s,i,a),r.strokeRect(e,s,i,a);break}case"CircleDrawable":{const{radius:e,startx:s,starty:i}=t;r.arc(s,i,e,0,2*Math.PI),r.fill();break}}return r.stroke(),a`${i}`}static _renderText({text:t,x:e,y:s,rotation:i,scaleX:r,scaleY:n}){return a`<span class="drawableText" style="${`top: ${s-3}px; left: ${e}px; transform: rotate(${i}deg) scaleX(${r}) scaleY(${n});`}">${t}</span>`}_renderImage(){const{imageUrl:t,imageDimensions:e}=this.model||{},{height:s,width:i}=e||{};return t?a`<img
       alt="Image"
-      src="${e}"
+      src="${t}"
       height="${s}px"
       width="${i}px"
-    />`:a``}_renderContent({height:e,width:t}){const{drawables:s,texts:i}=this.session||{},r=`width: ${t}px; height: ${e}px;`,o=s&&s.map(s=>n._renderDrawing(s,t,e));return a` <div class="scalable">
+    />`:a``}_renderContent({height:t,width:e}){const{drawables:s,texts:i}=this.session||{},r=`width: ${e}px; height: ${t}px;`,o=s&&s.map(s=>n._renderDrawing(s,e,t));return a` <div class="scalable">
       ${this._renderImage()}
@@ -34,5 +33,5 @@
       </div>
-    </div>`}render(){const{height:e,width:t}=this._getMinWidthAndHeight(),{height:s,width:i}=this._containerDimensions||{};return a` <style>
+    </div>`}render(){const{height:t,width:e}=this._getMinWidthAndHeight(),{height:s,width:i}=this._containerDimensions||{};return a` <style>
         .scalable {
-          transform: scale(min(${s/e}, ${i/t}, 1));
+          transform: scale(min(${s/t}, ${i/e}, 1));
         }
@@ -42,4 +41,4 @@ </style>
       <div class="response">
-        ${this._containerDimensions&&this._renderContent({height:e,width:t})}
+        ${this._containerDimensions&&this._renderContent({height:t,width:e})}
       </div>`}}export default n;export{n as DrawingResponse};
 //# sourceMappingURL=DrawingResponse.js.map

dist/pies/InlineDropdownResponse.js

@@ -10,3 +10,3 @@ import{g as e,j as s,r as t,b as o,h as r}from"./cssUtils-9e0d40cc.js";import{C as i}from"./CustomLitElement-d7d74aaf.js";import"./unsafe-html-50c739ac.js";import{g as h,r as c}from"./utils-dc176e4d.js";class a extends i{static get styles(){return[e,s,t,o`
       >
-        <p>${t}. ${h(i)}</p>
+        <p>${t}. ${c?h(i):""}</p>
       </div>`}):r``}render(){return r`
@@ -13,0 +13,0 @@ <div class="response">${this._renderResponse()}</div>

dist/pies/MatchResponse.js

@@ -37,3 +37,3 @@ import{g as e,r as t,b as s,d as o,m as r,h as i}from"./cssUtils-9e0d40cc.js";import{C as c}from"./CustomLitElement-d7d74aaf.js";import"./unsafe-html-50c739ac.js";import{g as h,r as d}from"./utils-dc176e4d.js";class a extends c{static get styles(){return[e,t,s`
 
-      ${t.map(e=>{const{values:t,title:r}=e,c=o[e.id];return i` <tr
+      ${t.map(e=>{const{values:t,title:r}=e,c=o?o[e.id]:[];return i` <tr
           class="choice-value"
@@ -40,0 +40,0 @@ @mouseover=${e=>this.mouseover(e,r)}

dist/pies/MathInlineResponse.js

@@ -1,4 +0,4 @@
-import{L as t,r as e,h as s}from"./cssUtils-9e0d40cc.js";import{u as a}from"./unsafe-html-50c739ac.js";const o={ROUND_BRACKETS:"round_brackets",SQUARE_BRACKETS:"square_brackets",DOLLAR:"dollar",DOUBLE_DOLLAR:"double_dollar"},r={[o.ROUND_BRACKETS]:["\\(","\\)"],[o.SQUARE_BRACKETS]:["\\[","\\]"],[o.DOLLAR]:["$","$"],[o.DOUBLE_DOLLAR]:["$$","$$"]};class n extends t{static get styles(){return[e]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},imgSrc:{type:String,attribute:!1},svgSrc:{type:String,attribute:!1},mathLoaded:{type:Boolean,attribute:!1}}}constructor(){super();const t=this;window.MathJax={jax:["input/TeX","output/SVG"],extensions:["tex2jax.js","MathMenu.js","MathZoom.js"],showMathMenu:!1,showProcessingMessages:!1,messageStyle:"none",SVG:{useGlobalCache:!1},TeX:{extensions:["AMSmath.js","AMSsymbols.js","autoload-all.js"],inlineMath:[["$","$"],["\\(","\\)"]]},AuthorInit(){window.MathJax.Hub.Register.StartupHook("End",(function(){const{completeAnswer:e}=t.session||{};n.mathToSvg(((t,e)=>{let s=e;s===o.SQUARE_BRACKETS&&(console.warn("\\[...\\] is not supported yet"),s=o.ROUND_BRACKETS),s===o.DOUBLE_DOLLAR&&(console.warn("$$...$$ is not supported yet"),s=o.DOLLAR);const[a,n]=r[s]||r[o.ROUND_BRACKETS];return`${a}${t}${n}`})(e)).then(e=>{t.svgSrc=e}).catch(t=>console.error(t))}))}},(t=>{const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js",t.getElementsByTagName("head")[0].appendChild(e)})(document)}static mathToSvg(t){return new Promise(e=>{const s=t,a=document.createElement("div");a.innerHTML=s,window.MathJax.Hub.Queue(["Typeset",window.MathJax.Hub,a]),window.MathJax.Hub.Queue(()=>{const t=a.getElementsByTagName("svg")[0];t.setAttribute("xmlns","http://www.w3.org/2000/svg"),e(t.outerHTML)})})}render(){return s`<div class="response">
+import{L as t,r as e,h as s}from"./cssUtils-9e0d40cc.js";import{u as a}from"./unsafe-html-50c739ac.js";const o={ROUND_BRACKETS:"round_brackets",SQUARE_BRACKETS:"square_brackets",DOLLAR:"dollar",DOUBLE_DOLLAR:"double_dollar"},r={[o.ROUND_BRACKETS]:["\\(","\\)"],[o.SQUARE_BRACKETS]:["\\[","\\]"],[o.DOLLAR]:["$","$"],[o.DOUBLE_DOLLAR]:["$$","$$"]};class n extends t{static get styles(){return[e]}static get properties(){return{model:{type:Object,attribute:!1},session:{type:Array,attribute:!1},imgSrc:{type:String,attribute:!1},svgSrc:{type:String,attribute:!1},mathLoaded:{type:Boolean,attribute:!1}}}constructor(){super();const t=this;window.MathJax={jax:["input/TeX","output/SVG"],extensions:["tex2jax.js","MathMenu.js","MathZoom.js"],showMathMenu:!1,showProcessingMessages:!1,messageStyle:"none",SVG:{useGlobalCache:!1},TeX:{extensions:["AMSmath.js","AMSsymbols.js","autoload-all.js"],inlineMath:[["$","$"],["\\(","\\)"]]},AuthorInit(){window.MathJax.Hub.Register.StartupHook("End",(function(){const{completeAnswer:e}=t.session||{};e&&n.mathToSvg(((t,e)=>{let s=e;s===o.SQUARE_BRACKETS&&(console.warn("\\[...\\] is not supported yet"),s=o.ROUND_BRACKETS),s===o.DOUBLE_DOLLAR&&(console.warn("$$...$$ is not supported yet"),s=o.DOLLAR);const[a,n]=r[s]||r[o.ROUND_BRACKETS];return`${a}${t}${n}`})(e)).then(e=>{t.svgSrc=e}).catch(t=>console.error(t))}))}},(t=>{const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js",t.getElementsByTagName("head")[0].appendChild(e)})(document)}static mathToSvg(t){return new Promise(e=>{const s=t,a=document.createElement("div");a.innerHTML=s,window.MathJax.Hub.Queue(["Typeset",window.MathJax.Hub,a]),window.MathJax.Hub.Queue(()=>{const t=a.getElementsByTagName("svg")[0];t.setAttribute("xmlns","http://www.w3.org/2000/svg"),e(t.outerHTML)})})}render(){return s`<div class="response">
       ${this.svgSrc?a(this.svgSrc):""}
     </div>`}}export default n;export{n as MathInlineResponse};
 //# sourceMappingURL=MathInlineResponse.js.map

package.json

@@ -6,3 +6,3 @@ {
   },
-  "version": "1.6.1",
+  "version": "1.6.2",
   "description": "Extended capabilites for pie-elements",
@@ -9,0 +9,0 @@ "author": "PIE Api Authors",

No alert changes

Worsened metrics

Total package byte prevSize

338458

decreased by-0.01%

Lines of code

1110

decreased by-0.09%

No dependency changes