@lrnwebcomponents/a11y-gif-player - npm Package Compare versions

Comparing version 0.0.34 to 0.0.35

a11y-gif-player.amd.js

@@ -1,1 +0,1 @@
-define(["./node_modules/@polymer/polymer/polymer-legacy.js","./node_modules/@polymer/iron-a11y-keys/iron-a11y-keys.js","./node_modules/@polymer/iron-image/iron-image.js","./node_modules/@lrnwebcomponents/hax-body-behaviors/lib/HAXWiring.js","./node_modules/@lrnwebcomponents/schema-behaviors/schema-behaviors.js"],function(_polymerLegacy){"use strict";function _templateObject_47787ec0ecf211e8b93b0798991f43e5(){var data=babelHelpers.taggedTemplateLiteral(["\n    <style>\n      :host {\n        display: block;\n      }\n      :host #gifbutton > * {\n        position: relative;\n      }\n      :host #svg {\n        position: absolute;\n        top: 35%;\n        left: 35%;\n      }\n      :host #gifbutton:active,\n      :host #gifbutton:focus,\n      :host #gifbutton:hover {\n        cursor: pointer;\n        outline: 1px solid blue;\n      }\n      :host #preload {\n        display: none;\n      }\n    </style>\n    <div id=\"gifbutton\" aria-role=\"button\" aria-controls=\"gif\" tabindex=\"0\">\n      <div>\n        <img id=\"gif\" alt$=\"[[alt]]\" src$=\"[[srcWithoutAnimation]]\" style=\"width:100%;height:100%;\">\n        <svg id=\"svg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 200\" width=\"30%\" height=\"30%\">\n          <g opacity=\".5\">\n            <polygon points=\"30,20 30,180 170,100\" fill=\"#000000\" stroke=\"#ffffff\" stroke-width=\"15px\"></polygon>\n            <text x=\"50\" y=\"115\" fill=\"#ffffff\" font-size=\"40px\">GIF</text>\n          </g>\n        </svg>\n      </div>\n    </div>\n    <iron-image id=\"preload\" src$=\"[[src]]\" hidden=\"\"></iron-image>\n    <iron-a11y-keys id=\"a11y\" keys=\"enter space\" on-keys-pressed=\"toggleAnimation\"></iron-a11y-keys>\n"],["\n    <style>\n      :host {\n        display: block;\n      }\n      :host #gifbutton > * {\n        position: relative;\n      }\n      :host #svg {\n        position: absolute;\n        top: 35%;\n        left: 35%;\n      }\n      :host #gifbutton:active,\n      :host #gifbutton:focus,\n      :host #gifbutton:hover {\n        cursor: pointer;\n        outline: 1px solid blue;\n      }\n      :host #preload {\n        display: none;\n      }\n    </style>\n    <div id=\"gifbutton\" aria-role=\"button\" aria-controls=\"gif\" tabindex=\"0\">\n      <div>\n        <img id=\"gif\" alt\\$=\"[[alt]]\" src\\$=\"[[srcWithoutAnimation]]\" style=\"width:100%;height:100%;\">\n        <svg id=\"svg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 200\" width=\"30%\" height=\"30%\">\n          <g opacity=\".5\">\n            <polygon points=\"30,20 30,180 170,100\" fill=\"#000000\" stroke=\"#ffffff\" stroke-width=\"15px\"></polygon>\n            <text x=\"50\" y=\"115\" fill=\"#ffffff\" font-size=\"40px\">GIF</text>\n          </g>\n        </svg>\n      </div>\n    </div>\n    <iron-image id=\"preload\" src\\$=\"[[src]]\" hidden=\"\"></iron-image>\n    <iron-a11y-keys id=\"a11y\" keys=\"enter space\" on-keys-pressed=\"toggleAnimation\"></iron-a11y-keys>\n"]);_templateObject_47787ec0ecf211e8b93b0798991f43e5=function(){return data};return data}(0,_polymerLegacy.Polymer)({_template:(0,_polymerLegacy.html)(_templateObject_47787ec0ecf211e8b93b0798991f43e5()),is:"a11y-gif-player",behaviors:[HAXBehaviors.PropertiesBehaviors,SchemaBehaviors.Schema],listeners:{tap:"toggleAnimation"},properties:{src:{type:String,value:null},srcWithoutAnimation:{type:String,value:null},alt:{type:String,value:null}},ready:function ready(){this.stop();this.$.a11y.target=this.$.gifbutton},play:function play(){this.__stopped=!0;this.toggleAnimation()},stop:function stop(){this.__stopped=!1;this.toggleAnimation()},toggleAnimation:function toggleAnimation(){if(this.__stopped){this.__stopped=!1;this.$.svg.style.visibility="hidden";if(null!=this.src){this.$.gif.src=this.src}this.$.gif.alt=this.alt+" (Stop animation.)"}else{this.__stopped=!0;this.$.svg.style.visibility="visible";if(null!=this.srcWithoutAnimation){this.$.gif.src=this.srcWithoutAnimation}this.$.gif.alt=this.alt+" (Play animation.)"}},attached:function attached(){this.setHaxProperties({canScale:!0,canPosition:!0,canEditSource:!1,gizmo:{title:"Accessible GIF",description:"Makes animated GIFs accessible.",icon:"gif",color:"grey",groups:["Images","Media"],handles:[{type:"image",source:"src",source2:"srcWithoutAnimation",alt:"alt"}],meta:{author:"LRNWebComponents"}},settings:{quick:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],configure:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],advanced:[]}})}})});
+define(["./node_modules/@polymer/polymer/polymer-legacy.js","./node_modules/@polymer/iron-a11y-keys/iron-a11y-keys.js","./node_modules/@polymer/iron-image/iron-image.js","./node_modules/@lrnwebcomponents/hax-body-behaviors/lib/HAXWiring.js","./node_modules/@lrnwebcomponents/schema-behaviors/schema-behaviors.js"],function(_polymerLegacy,_ironA11yKeys,_ironImage,_HAXWiring,_schemaBehaviors){"use strict";function _templateObject_ecd500e0f1e411e8b272efc8d17c20ce(){var data=babelHelpers.taggedTemplateLiteral(["\n    <style>\n      :host {\n        display: block;\n      }\n      :host #gifbutton > * {\n        position: relative;\n      }\n      :host #svg {\n        position: absolute;\n        top: 35%;\n        left: 35%;\n      }\n      :host #gifbutton:active,\n      :host #gifbutton:focus,\n      :host #gifbutton:hover {\n        cursor: pointer;\n        outline: 1px solid blue;\n      }\n      :host #preload {\n        display: none;\n      }\n    </style>\n    <div id=\"gifbutton\" aria-role=\"button\" aria-controls=\"gif\" tabindex=\"0\">\n      <div>\n        <img id=\"gif\" alt$=\"[[alt]]\" src$=\"[[srcWithoutAnimation]]\" style=\"width:100%;height:100%;\">\n        <svg id=\"svg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 200\" width=\"30%\" height=\"30%\">\n          <g opacity=\".5\">\n            <polygon points=\"30,20 30,180 170,100\" fill=\"#000000\" stroke=\"#ffffff\" stroke-width=\"15px\"></polygon>\n            <text x=\"50\" y=\"115\" fill=\"#ffffff\" font-size=\"40px\">GIF</text>\n          </g>\n        </svg>\n      </div>\n    </div>\n    <iron-image id=\"preload\" src$=\"[[src]]\" hidden=\"\"></iron-image>\n    <iron-a11y-keys id=\"a11y\" keys=\"enter space\" on-keys-pressed=\"toggleAnimation\"></iron-a11y-keys>\n"],["\n    <style>\n      :host {\n        display: block;\n      }\n      :host #gifbutton > * {\n        position: relative;\n      }\n      :host #svg {\n        position: absolute;\n        top: 35%;\n        left: 35%;\n      }\n      :host #gifbutton:active,\n      :host #gifbutton:focus,\n      :host #gifbutton:hover {\n        cursor: pointer;\n        outline: 1px solid blue;\n      }\n      :host #preload {\n        display: none;\n      }\n    </style>\n    <div id=\"gifbutton\" aria-role=\"button\" aria-controls=\"gif\" tabindex=\"0\">\n      <div>\n        <img id=\"gif\" alt\\$=\"[[alt]]\" src\\$=\"[[srcWithoutAnimation]]\" style=\"width:100%;height:100%;\">\n        <svg id=\"svg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 200\" width=\"30%\" height=\"30%\">\n          <g opacity=\".5\">\n            <polygon points=\"30,20 30,180 170,100\" fill=\"#000000\" stroke=\"#ffffff\" stroke-width=\"15px\"></polygon>\n            <text x=\"50\" y=\"115\" fill=\"#ffffff\" font-size=\"40px\">GIF</text>\n          </g>\n        </svg>\n      </div>\n    </div>\n    <iron-image id=\"preload\" src\\$=\"[[src]]\" hidden=\"\"></iron-image>\n    <iron-a11y-keys id=\"a11y\" keys=\"enter space\" on-keys-pressed=\"toggleAnimation\"></iron-a11y-keys>\n"]);_templateObject_ecd500e0f1e411e8b272efc8d17c20ce=function _templateObject_ecd500e0f1e411e8b272efc8d17c20ce(){return data};return data}(0,_polymerLegacy.Polymer)({_template:(0,_polymerLegacy.html)(_templateObject_ecd500e0f1e411e8b272efc8d17c20ce()),is:"a11y-gif-player",behaviors:[HAXBehaviors.PropertiesBehaviors,SchemaBehaviors.Schema],listeners:{tap:"toggleAnimation"},properties:{src:{type:String,value:null},srcWithoutAnimation:{type:String,value:null},alt:{type:String,value:null}},ready:function ready(){this.stop();this.$.a11y.target=this.$.gifbutton},play:function play(){this.__stopped=!0;this.toggleAnimation()},stop:function stop(){this.__stopped=!1;this.toggleAnimation()},toggleAnimation:function toggleAnimation(){if(this.__stopped){this.__stopped=!1;this.$.svg.style.visibility="hidden";if(null!=this.src){this.$.gif.src=this.src}this.$.gif.alt=this.alt+" (Stop animation.)"}else{this.__stopped=!0;this.$.svg.style.visibility="visible";if(null!=this.srcWithoutAnimation){this.$.gif.src=this.srcWithoutAnimation}this.$.gif.alt=this.alt+" (Play animation.)"}},attached:function attached(){var props={canScale:!0,canPosition:!0,canEditSource:!1,gizmo:{title:"Accessible GIF",description:"Makes animated GIFs accessible.",icon:"gif",color:"grey",groups:["Images","Media"],handles:[{type:"image",source:"src",source2:"srcWithoutAnimation",alt:"alt"}],meta:{author:"LRNWebComponents"}},settings:{quick:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],configure:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],advanced:[]}};this.setHaxProperties(props)}})});

a11y-gif-player.es6.js

@@ -37,2 +37,2 @@ import{html,Polymer}from"./node_modules/@polymer/polymer/polymer-legacy.js";import"./node_modules/@polymer/iron-a11y-keys/iron-a11y-keys.js";import"./node_modules/@polymer/iron-image/iron-image.js";import"./node_modules/@lrnwebcomponents/hax-body-behaviors/lib/HAXWiring.js";import"./node_modules/@lrnwebcomponents/schema-behaviors/schema-behaviors.js";Polymer({_template:html`
     <iron-a11y-keys id="a11y" keys="enter space" on-keys-pressed="toggleAnimation"></iron-a11y-keys>
-`,is:"a11y-gif-player",behaviors:[HAXBehaviors.PropertiesBehaviors,SchemaBehaviors.Schema],listeners:{tap:"toggleAnimation"},properties:{src:{type:String,value:null},srcWithoutAnimation:{type:String,value:null},alt:{type:String,value:null}},ready:function(){this.stop();this.$.a11y.target=this.$.gifbutton},play:function(){this.__stopped=!0;this.toggleAnimation()},stop:function(){this.__stopped=!1;this.toggleAnimation()},toggleAnimation:function(){if(this.__stopped){this.__stopped=!1;this.$.svg.style.visibility="hidden";if(null!=this.src){this.$.gif.src=this.src}this.$.gif.alt=this.alt+" (Stop animation.)"}else{this.__stopped=!0;this.$.svg.style.visibility="visible";if(null!=this.srcWithoutAnimation){this.$.gif.src=this.srcWithoutAnimation}this.$.gif.alt=this.alt+" (Play animation.)"}},attached:function(){this.setHaxProperties({canScale:!0,canPosition:!0,canEditSource:!1,gizmo:{title:"Accessible GIF",description:"Makes animated GIFs accessible.",icon:"gif",color:"grey",groups:["Images","Media"],handles:[{type:"image",source:"src",source2:"srcWithoutAnimation",alt:"alt"}],meta:{author:"LRNWebComponents"}},settings:{quick:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],configure:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],advanced:[]}})}});
+`,is:"a11y-gif-player",behaviors:[HAXBehaviors.PropertiesBehaviors,SchemaBehaviors.Schema],listeners:{tap:"toggleAnimation"},properties:{src:{type:String,value:null},srcWithoutAnimation:{type:String,value:null},alt:{type:String,value:null}},ready:function(){this.stop();this.$.a11y.target=this.$.gifbutton},play:function(){this.__stopped=!0;this.toggleAnimation()},stop:function(){this.__stopped=!1;this.toggleAnimation()},toggleAnimation:function(){if(this.__stopped){this.__stopped=!1;this.$.svg.style.visibility="hidden";if(null!=this.src){this.$.gif.src=this.src}this.$.gif.alt=this.alt+" (Stop animation.)"}else{this.__stopped=!0;this.$.svg.style.visibility="visible";if(null!=this.srcWithoutAnimation){this.$.gif.src=this.srcWithoutAnimation}this.$.gif.alt=this.alt+" (Play animation.)"}},attached:function(){let props={canScale:!0,canPosition:!0,canEditSource:!1,gizmo:{title:"Accessible GIF",description:"Makes animated GIFs accessible.",icon:"gif",color:"grey",groups:["Images","Media"],handles:[{type:"image",source:"src",source2:"srcWithoutAnimation",alt:"alt"}],meta:{author:"LRNWebComponents"}},settings:{quick:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],configure:[{property:"src",title:"Animated GIF",description:"The URL to your animated GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"srcWithoutAnimation",title:"Still Image",description:"The URL to a still image version of your GIF.",inputMethod:"textfield",icon:"link",validationType:"url",required:!0},{property:"alt",title:"Alt Text",description:"Alternative text for the image.",inputMethod:"textfield",icon:"accessibility",required:!0}],advanced:[]}};this.setHaxProperties(props)}});

build/es5-amd/a11y-gif-player.js

@@ -7,5 +7,11 @@ define([
   "./node_modules/@lrnwebcomponents/schema-behaviors/schema-behaviors.js"
-], function(_polymerLegacy) {
+], function(
+  _polymerLegacy,
+  _ironA11yKeys,
+  _ironImage,
+  _HAXWiring,
+  _schemaBehaviors
+) {
   "use strict";
-  function _templateObject_47787ec0ecf211e8b93b0798991f43e5() {
+  function _templateObject_ecd500e0f1e411e8b272efc8d17c20ce() {
     var data = babelHelpers.taggedTemplateLiteral(
@@ -19,3 +25,3 @@ [
     );
-    _templateObject_47787ec0ecf211e8b93b0798991f43e5 = function() {
+    _templateObject_ecd500e0f1e411e8b272efc8d17c20ce = function _templateObject_ecd500e0f1e411e8b272efc8d17c20ce() {
       return data;
@@ -27,3 +33,3 @@ };
     _template: (0, _polymerLegacy.html)(
-      _templateObject_47787ec0ecf211e8b93b0798991f43e5()
+      _templateObject_ecd500e0f1e411e8b272efc8d17c20ce()
     ),
@@ -68,3 +74,3 @@ is: "a11y-gif-player",
     attached: function attached() {
-      this.setHaxProperties({
+      var props = {
         canScale: !0,
@@ -148,5 +154,6 @@ canPosition: !0,
         }
-      });
+      };
+      this.setHaxProperties(props);
     }
   });
 });

build/es6/a11y-gif-player.js

@@ -85,3 +85,3 @@ import {
   attached: function() {
-    this.setHaxProperties({
+    let props = {
       canScale: !0,
@@ -165,4 +165,5 @@ canPosition: !0,
       }
-    });
+    };
+    this.setHaxProperties(props);
   }
 });

package.json

@@ -14,3 +14,3 @@ {
   },
-  "version": "0.0.34",
+  "version": "0.0.35",
   "description": "Play gifs in an accessible way by having the user click to play their animation",
@@ -39,4 +39,4 @@ "repository": {
   "dependencies": {
-    "@lrnwebcomponents/hax-body-behaviors": "^0.0.34",
-    "@lrnwebcomponents/schema-behaviors": "^0.0.34",
+    "@lrnwebcomponents/hax-body-behaviors": "^0.0.35",
+    "@lrnwebcomponents/schema-behaviors": "^0.0.35",
     "@polymer/iron-a11y-keys": "^3.0.0",
@@ -47,3 +47,3 @@ "@polymer/iron-image": "^3.0.0",
   "devDependencies": {
-    "@lrnwebcomponents/deduping-fix": "^0.0.34",
+    "@lrnwebcomponents/deduping-fix": "^0.0.35",
     "@polymer/iron-component-page": "github:PolymerElements/iron-component-page",
@@ -68,3 +68,3 @@ "@polymer/iron-demo-helpers": "3.0.2",
   ],
-  "gitHead": "85bf1e684f0f88c1ce807c92255af222057eeaa0"
+  "gitHead": "71dcc2b61045070a009e654226e6c0892f11a854"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 1 instance in 1 package

Improved metrics

Lines of code

1508

increased by0.53%

Number of medium supply chain risk alerts

2

decreased by-33.33%

Worsened metrics

Total package byte prevSize

1999014

decreased by-48.62%

Number of package files

30

decreased by-3.23%

Dependency changes

• + Added@lrnwebcomponents/hax-body-behaviors@0.0.35(transitive)

• + Added@lrnwebcomponents/schema-behaviors@0.0.35(transitive)

• - Removed@lrnwebcomponents/hax-body-behaviors@0.0.34(transitive)

• - Removed@lrnwebcomponents/schema-behaviors@0.0.34(transitive)

• Updated@lrnwebcomponents/hax-body-behaviors@^0.0.35

• Updated@lrnwebcomponents/schema-behaviors@^0.0.35