Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@akkadu/rsi-api-vue

Package Overview
Dependencies
Maintainers
4
Versions
23
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@akkadu/rsi-api-vue - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

36

dist/rsi-api-vue.esm.js

@@ -31,3 +31,3 @@ import events_1 from 'events';

html: "\n <body>\n <div class=\"select\">\n <div class=\"selectWrapper\" >\n <div class=\"selectCustom js-selectCustom\">\n <div id=\"interpretation-player-custom-value\" class=\"selectCustom-trigger\"> <img src=''/> <h3> </h3> </div>\n <div id=\"interpretation-player-options\" class=\"selectCustom-options\">\n </div>\n </div>\n </div>\n </body>\n ",
css: "\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: \"Helvetica Neue\", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: \"\u25BE\";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n "
css: "\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: \"Helvetica Neue\", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n color: #2C3D4F;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: \"\u25BE\";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n "
};

@@ -101,6 +101,7 @@ var _default$1 = component;

var _this = _super.call(this) || this;
var apiKey = config.apiKey, roomName = config.roomName, container = config.container, positionMenu = config.positionMenu;
var apiKey = config.apiKey, roomName = config.roomName, container = config.container, positionMenu = config.positionMenu, isBoxShadow = config.isBoxShadow;
_this.apiKey = apiKey;
_this.roomName = roomName;
_this.positionMenu = positionMenu;
_this.isBoxShadow = isBoxShadow;
_this.consumerConfig = defaultConsumerConfig;

@@ -166,2 +167,3 @@ _this.consumerConfig.container = container;

newText.textContent = languagesList[i].name;
newText.id = i;
newImage = document.createElement('img');

@@ -187,6 +189,10 @@ newImage.src = this.getFlagUrl(languagesList[i].iso);

elOption.addEventListener("click", function (e) {
console.log(e, 'click language event');
// Update custom select text
var languageSelected;
var idOption = e.target.id;
console.log(e.target, 'e.target');
console.log(e.target.id, 'e.target');
languageSelected = languagesList[idOption];
console.log(languagesList, 'languagesList');
elSelectCustomValue.getElementsByTagName("h3")[0].textContent = languageSelected.name;

@@ -210,16 +216,14 @@ elSelectCustomValue.getElementsByTagName("img")[0].src = that.getFlagUrl(languageSelected.iso);

});
// prop for position box - should do an auto one first ?
// 6px -1px 8px 1px #e3e3e3 !important
// bottom: 55px; top 0px for .selectCustom-options
};
InterpretationPlayer.prototype.updateStylesWithProps = function () {
var propsDefault = {
'positionMenu': 'bottom'
};
var stylesStr;
var styles = [];
if (this.positionMenu !== propsDefault['positionMenu']) {
if (this.positionMenu === 'top') {
var style = ".selectCustom-options{\n box-shadow:6px -1px 8px 1px #e3e3e3 !important;\n top: -130px !important;\n }";
styles.push(style);
}
if (this.isBoxShadow === false) {
var style = "\n #akkadu-interpretation-player .selectCustom-options{\n box-shadow:none !important;\n }";
styles.push(style);
}
stylesStr = styles.join(' ');

@@ -248,2 +252,7 @@ return stylesStr;

default: 'bottom'
},
isBoxShadow: {
required: false,
type: Boolean,
default: true
}

@@ -280,3 +289,4 @@ },

container: 'akkadu-interpretation-player',
positionMenu: this.positionMenu
positionMenu: this.positionMenu,
isBoxShadow: this.isBoxShadow
};

@@ -299,3 +309,3 @@ this.stream = new _default(config);

}) => {
console.info('interpretation-player:on-ready', isReady);
console.info('emit interpretation-player:on-ready', isReady);
this.$emit("onReady", {

@@ -308,3 +318,3 @@ isReady

}) => {
console.info('interpretation-player:on-language-selected', languageSelected);
console.info('emit interpretation-player:on-language-selected', languageSelected);
this.$emit("onLanguageSelected", {

@@ -317,3 +327,3 @@ languageSelected

}) => {
console.info('interpretation-player:on-connection-status-updated', connection);
console.info('emit interpretation-player:on-connection-status-updated', connection);
this.$emit("onConnectionStatusUpdated", {

@@ -320,0 +330,0 @@ connection

@@ -1,1 +0,1 @@

var RsiApiVue=function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);function r(e,t,n,r,o,i,a){try{var s=e[i](a),l=s.value}catch(e){return void n(e)}s.done?t(l):Promise.resolve(l).then(r,o)}function o(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=e&&("undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"]);if(null==n)return;var r,o,i=[],a=!0,s=!1;try{for(n=n.call(e);!(a=(r=n.next()).done)&&(i.push(r.value),!t||i.length!==t);a=!0);}catch(e){s=!0,o=e}finally{try{a||null==n.return||n.return()}finally{if(s)throw o}}return i}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return i(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var a,s="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},l=function(){function e(){this.emitter=new n.default.EventEmitter}return e.prototype.gatewayRequest=function(e,t){if(!e)throw Error("base akadu-rsi: apiKey is undefined.");if(!t)throw Error("base akkadu-rsi: roomname is undefined.");return"test gateway"},e.prototype.on=function(e,t){this.emitter.on(e,t)},e}(),u=Object.defineProperty({default:l},"__esModule",{value:!0}),p={html:'\n <body>\n <div class="select">\n <div class="selectWrapper" >\n <div class="selectCustom js-selectCustom">\n <div id="interpretation-player-custom-value" class="selectCustom-trigger"> <img src=\'\'/> <h3> </h3> </div>\n <div id="interpretation-player-options" class="selectCustom-options">\n </div>\n </div>\n </div>\n </body>\n ',css:'\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: "Helvetica Neue", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: "▾";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n '},c=Object.defineProperty({default:p},"__esModule",{value:!0}),d=s&&s.__extends||(a=function(e,t){return(a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)},function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}a(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),f=s&&s.__awaiter||function(e,t,n,r){return new(n||(n=Promise))((function(o,i){function a(e){try{l(r.next(e))}catch(e){i(e)}}function s(e){try{l(r.throw(e))}catch(e){i(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,s)}l((r=r.apply(e,t||[])).next())}))},m=s&&s.__generator||function(e,t){var n,r,o,i,a={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(i){return function(s){return function(i){if(n)throw new TypeError("Generator is already executing.");for(;a;)try{if(n=1,r&&(o=2&i[0]?r.return:i[0]?r.throw||((o=r.return)&&o.call(r),0):r.next)&&!(o=o.call(r,i[1])).done)return o;switch(r=0,o&&(i=[2&i[0],o.value]),i[0]){case 0:case 1:o=i;break;case 4:return a.label++,{value:i[1],done:!1};case 5:a.label++,r=i[1],i=[0];continue;case 7:i=a.ops.pop(),a.trys.pop();continue;default:if(!(o=a.trys,(o=o.length>0&&o[o.length-1])||6!==i[0]&&2!==i[0])){a=0;continue}if(3===i[0]&&(!o||i[1]>o[0]&&i[1]<o[3])){a.label=i[1];break}if(6===i[0]&&a.label<o[1]){a.label=o[1],o=i;break}if(o&&a.label<o[2]){a.label=o[2],a.ops.push(i);break}o[2]&&a.ops.pop(),a.trys.pop();continue}i=t.call(e,a)}catch(e){i=[6,e],r=0}finally{n=o=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,s])}}},y={languages:[],container:null},h=function(e){function t(t){var n=e.call(this)||this,r=t.apiKey,o=t.roomName,i=t.container,a=t.positionMenu;if(n.apiKey=r,n.roomName=o,n.positionMenu=a,n.consumerConfig=y,n.consumerConfig.container=i,n.consumerConfig.domContainer=document.querySelector("#"+n.consumerConfig.container),!n.apiKey)throw Error("InterpretationPlayer: apiKey is undefined");if(!n.roomName)throw Error("InterpretationPlayer: roomName is undefined");if(!n.consumerConfig.domContainer)throw new Error("Unable to detect stream container "+n.consumerConfig.container+" on the DOM");return n}return d(t,e),t.prototype.init=function(){return f(this,void 0,void 0,(function(){return m(this,(function(e){return this.gatewayRequest(this.apiKey,this.roomName),this.initListeners(),this.addInterpretationPlayer(),[2]}))}))},t.prototype.initListeners=function(){},t.prototype.addInterpretationPlayer=function(){this.emitter.emit("interpretation-player:on-ready",{isReady:!0});var e=c.default;this.consumerConfig.domContainer.insertAdjacentHTML("beforeend",e.html);var t=document.createElement("style");t.textContent=e.css,document.head.appendChild(t);var n=this.updateStylesWithProps();if(n){var r=document.createElement("style");r.textContent=n,document.head.appendChild(r)}for(var o=[{iso:"us",name:"english"},{iso:"es",name:"spanish"},{iso:"cn",name:"chinese"}],i=document.createDocumentFragment(),a=0;a<o.length;a++){var s=void 0,l=void 0,u=void 0;(s=document.createElement("div")).className="selectCustom-option",s.id=a,(u=document.createElement("h3")).textContent=o[a].name,(l=document.createElement("img")).src=this.getFlagUrl(o[a].iso),s.appendChild(l),s.appendChild(u),i.appendChild(s)}document.getElementById("interpretation-player-options").appendChild(i);var p=document.createElement("script");p.textContent=e.js,document.body.appendChild(p);var d=document.getElementsByClassName("js-selectCustom")[0],f=document.getElementById("interpretation-player-custom-value"),m=document.getElementById("interpretation-player-options");f.getElementsByTagName("h3")[0].textContent=o[0].name,f.getElementsByTagName("img")[0].src=this.getFlagUrl(o[0].iso);var y=this;Array.from(m.children).forEach((function(e){e.addEventListener("click",(function(e){var t,n=e.target.id;t=o[n],f.getElementsByTagName("h3")[0].textContent=t.name,f.getElementsByTagName("img")[0].src=y.getFlagUrl(t.iso),y.emitter.emit("interpretation-player:on-language-selected",{languageSelected:t}),d.classList.remove("isActive")}))})),f.addEventListener("click",(function(e){d.classList.toggle("isActive")})),document.addEventListener("click",(function(e){!d.contains(event.target)&&d.classList.remove("isActive")}))},t.prototype.updateStylesWithProps=function(){var e=[];if("bottom"!==this.positionMenu){e.push(".selectCustom-options{\n box-shadow:6px -1px 8px 1px #e3e3e3 !important;\n top: -130px !important;\n }")}return e.join(" ")},t.prototype.getFlagUrl=function(e){return"https://www.countryflags.io/"+e+"/flat/64.png"},t}(u.default);function g(e,t,n,r,o,i,a,s,l,u){"boolean"!=typeof a&&(l=s,s=a,a=!1);const p="function"==typeof n?n.options:n;let c;if(e&&e.render&&(p.render=e.render,p.staticRenderFns=e.staticRenderFns,p._compiled=!0,o&&(p.functional=!0)),r&&(p._scopeId=r),i?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,l(e)),e&&e._registeredComponents&&e._registeredComponents.add(i)},p._ssrRegister=c):t&&(c=a?function(e){t.call(this,u(e,this.$root.$options.shadowRoot))}:function(e){t.call(this,s(e))}),c)if(p.functional){const e=p.render;p.render=function(t,n){return c.call(n),e(t,n)}}else{const e=p.beforeCreate;p.beforeCreate=e?[].concat(e,c):[c]}return n}var v=g({render:function(){var e=this.$createElement;return(this._self._c||e)("div",{attrs:{id:"akkadu-interpretation-player"}})},staticRenderFns:[]},undefined,{props:{apiKey:{required:!0,type:String,default:null},positionMenu:{required:!1,type:String,default:"bottom"}},data:function(){return{stream:null}},mounted:function(){this.init()},methods:{init:function(){var e,t=this;return(e=regeneratorRuntime.mark((function e(){var n,r;return regeneratorRuntime.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(n=t.getRoomname(),console.info(t.apiKey,"api key"),n){e.next=4;break}throw Error("interpretation-player: roomname is not defined");case 4:if(t.apiKey){e.next=6;break}throw Error("interpretation-player: apiKey is not defined");case 6:r={apiKey:t.apiKey,roomName:n,container:"akkadu-interpretation-player",positionMenu:t.positionMenu},t.stream=new h(r),t.initListeners(),t.stream.init();case 10:case"end":return e.stop()}}),e)})),function(){var t=this,n=arguments;return new Promise((function(o,i){var a=e.apply(t,n);function s(e){r(a,o,i,s,l,"next",e)}function l(e){r(a,o,i,s,l,"throw",e)}s(void 0)}))})()},getRoomname:function(){return"test"},initListeners:function(){var e=this;this.stream.on("interpretation-player:on-ready",(function(t){var n=t.isReady;console.info("interpretation-player:on-ready",n),e.$emit("onReady",{isReady:n})})),this.stream.on("interpretation-player:on-language-selected",(function(t){var n=t.languageSelected;console.info("interpretation-player:on-language-selected",n),e.$emit("onLanguageSelected",{languageSelected:n})})),this.stream.on("interpretation-player:on-connection-status-updated",(function(t){var n=t.connection;console.info("interpretation-player:on-connection-status-updated",n),e.$emit("onConnectionStatusUpdated",{connection:n})}))}}},undefined,false,undefined,!1,void 0,void 0,void 0),b=Object.freeze({__proto__:null,RsiApiInterpretationPlayer:v}),x=function(e){Object.entries(b).forEach((function(t){var n=o(t,2),r=n[0],i=n[1];e.component(r,i)}))},k=Object.freeze({__proto__:null,default:x,RsiApiInterpretationPlayer:v});return Object.entries(k).forEach((function(e){var t=o(e,2),n=t[0],r=t[1];"default"!==n&&(x[n]=r)})),x}(events_1);
var RsiApiVue=function(e){"use strict";function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(e);function o(e,t,n,o,r,i,a){try{var s=e[i](a),l=s.value}catch(e){return void n(e)}s.done?t(l):Promise.resolve(l).then(o,r)}function r(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=e&&("undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"]);if(null==n)return;var o,r,i=[],a=!0,s=!1;try{for(n=n.call(e);!(a=(o=n.next()).done)&&(i.push(o.value),!t||i.length!==t);a=!0);}catch(e){s=!0,r=e}finally{try{a||null==n.return||n.return()}finally{if(s)throw r}}return i}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return i(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return i(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var a,s="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},l=function(){function e(){this.emitter=new n.default.EventEmitter}return e.prototype.gatewayRequest=function(e,t){if(!e)throw Error("base akadu-rsi: apiKey is undefined.");if(!t)throw Error("base akkadu-rsi: roomname is undefined.");return"test gateway"},e.prototype.on=function(e,t){this.emitter.on(e,t)},e}(),u=Object.defineProperty({default:l},"__esModule",{value:!0}),p={html:'\n <body>\n <div class="select">\n <div class="selectWrapper" >\n <div class="selectCustom js-selectCustom">\n <div id="interpretation-player-custom-value" class="selectCustom-trigger"> <img src=\'\'/> <h3> </h3> </div>\n <div id="interpretation-player-options" class="selectCustom-options">\n </div>\n </div>\n </div>\n </body>\n ',css:'\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: "Helvetica Neue", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n color: #2C3D4F;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: "▾";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n '},c=Object.defineProperty({default:p},"__esModule",{value:!0}),d=s&&s.__extends||(a=function(e,t){return(a=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)},function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}a(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}),f=s&&s.__awaiter||function(e,t,n,o){return new(n||(n=Promise))((function(r,i){function a(e){try{l(o.next(e))}catch(e){i(e)}}function s(e){try{l(o.throw(e))}catch(e){i(e)}}function l(e){var t;e.done?r(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,s)}l((o=o.apply(e,t||[])).next())}))},m=s&&s.__generator||function(e,t){var n,o,r,i,a={label:0,sent:function(){if(1&r[0])throw r[1];return r[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(i){return function(s){return function(i){if(n)throw new TypeError("Generator is already executing.");for(;a;)try{if(n=1,o&&(r=2&i[0]?o.return:i[0]?o.throw||((r=o.return)&&r.call(o),0):o.next)&&!(r=r.call(o,i[1])).done)return r;switch(o=0,r&&(i=[2&i[0],r.value]),i[0]){case 0:case 1:r=i;break;case 4:return a.label++,{value:i[1],done:!1};case 5:a.label++,o=i[1],i=[0];continue;case 7:i=a.ops.pop(),a.trys.pop();continue;default:if(!(r=a.trys,(r=r.length>0&&r[r.length-1])||6!==i[0]&&2!==i[0])){a=0;continue}if(3===i[0]&&(!r||i[1]>r[0]&&i[1]<r[3])){a.label=i[1];break}if(6===i[0]&&a.label<r[1]){a.label=r[1],r=i;break}if(r&&a.label<r[2]){a.label=r[2],a.ops.push(i);break}r[2]&&a.ops.pop(),a.trys.pop();continue}i=t.call(e,a)}catch(e){i=[6,e],o=0}finally{n=r=0}if(5&i[0])throw i[1];return{value:i[0]?i[1]:void 0,done:!0}}([i,s])}}},y={languages:[],container:null},h=function(e){function t(t){var n=e.call(this)||this,o=t.apiKey,r=t.roomName,i=t.container,a=t.positionMenu,s=t.isBoxShadow;if(n.apiKey=o,n.roomName=r,n.positionMenu=a,n.isBoxShadow=s,n.consumerConfig=y,n.consumerConfig.container=i,n.consumerConfig.domContainer=document.querySelector("#"+n.consumerConfig.container),!n.apiKey)throw Error("InterpretationPlayer: apiKey is undefined");if(!n.roomName)throw Error("InterpretationPlayer: roomName is undefined");if(!n.consumerConfig.domContainer)throw new Error("Unable to detect stream container "+n.consumerConfig.container+" on the DOM");return n}return d(t,e),t.prototype.init=function(){return f(this,void 0,void 0,(function(){return m(this,(function(e){return this.gatewayRequest(this.apiKey,this.roomName),this.initListeners(),this.addInterpretationPlayer(),[2]}))}))},t.prototype.initListeners=function(){},t.prototype.addInterpretationPlayer=function(){this.emitter.emit("interpretation-player:on-ready",{isReady:!0});var e=c.default;this.consumerConfig.domContainer.insertAdjacentHTML("beforeend",e.html);var t=document.createElement("style");t.textContent=e.css,document.head.appendChild(t);var n=this.updateStylesWithProps();if(n){var o=document.createElement("style");o.textContent=n,document.head.appendChild(o)}for(var r=[{iso:"us",name:"english"},{iso:"es",name:"spanish"},{iso:"cn",name:"chinese"}],i=document.createDocumentFragment(),a=0;a<r.length;a++){var s=void 0,l=void 0,u=void 0;(s=document.createElement("div")).className="selectCustom-option",s.id=a,(u=document.createElement("h3")).textContent=r[a].name,u.id=a,(l=document.createElement("img")).src=this.getFlagUrl(r[a].iso),s.appendChild(l),s.appendChild(u),i.appendChild(s)}document.getElementById("interpretation-player-options").appendChild(i);var p=document.createElement("script");p.textContent=e.js,document.body.appendChild(p);var d=document.getElementsByClassName("js-selectCustom")[0],f=document.getElementById("interpretation-player-custom-value"),m=document.getElementById("interpretation-player-options");f.getElementsByTagName("h3")[0].textContent=r[0].name,f.getElementsByTagName("img")[0].src=this.getFlagUrl(r[0].iso);var y=this;Array.from(m.children).forEach((function(e){e.addEventListener("click",(function(e){var t;console.log(e,"click language event");var n=e.target.id;console.log(e.target,"e.target"),console.log(e.target.id,"e.target"),t=r[n],console.log(r,"languagesList"),f.getElementsByTagName("h3")[0].textContent=t.name,f.getElementsByTagName("img")[0].src=y.getFlagUrl(t.iso),y.emitter.emit("interpretation-player:on-language-selected",{languageSelected:t}),d.classList.remove("isActive")}))})),f.addEventListener("click",(function(e){d.classList.toggle("isActive")})),document.addEventListener("click",(function(e){!d.contains(event.target)&&d.classList.remove("isActive")}))},t.prototype.updateStylesWithProps=function(){var e=[];if("top"===this.positionMenu){var t=".selectCustom-options{\n box-shadow:6px -1px 8px 1px #e3e3e3 !important;\n top: -130px !important;\n }";e.push(t)}if(!1===this.isBoxShadow){t="\n #akkadu-interpretation-player .selectCustom-options{\n box-shadow:none !important;\n }";e.push(t)}return e.join(" ")},t.prototype.getFlagUrl=function(e){return"https://www.countryflags.io/"+e+"/flat/64.png"},t}(u.default);function g(e,t,n,o,r,i,a,s,l,u){"boolean"!=typeof a&&(l=s,s=a,a=!1);const p="function"==typeof n?n.options:n;let c;if(e&&e.render&&(p.render=e.render,p.staticRenderFns=e.staticRenderFns,p._compiled=!0,r&&(p.functional=!0)),o&&(p._scopeId=o),i?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),t&&t.call(this,l(e)),e&&e._registeredComponents&&e._registeredComponents.add(i)},p._ssrRegister=c):t&&(c=a?function(e){t.call(this,u(e,this.$root.$options.shadowRoot))}:function(e){t.call(this,s(e))}),c)if(p.functional){const e=p.render;p.render=function(t,n){return c.call(n),e(t,n)}}else{const e=p.beforeCreate;p.beforeCreate=e?[].concat(e,c):[c]}return n}var v=g({render:function(){var e=this.$createElement;return(this._self._c||e)("div",{attrs:{id:"akkadu-interpretation-player"}})},staticRenderFns:[]},undefined,{props:{apiKey:{required:!0,type:String,default:null},positionMenu:{required:!1,type:String,default:"bottom"},isBoxShadow:{required:!1,type:Boolean,default:!0}},data:function(){return{stream:null}},mounted:function(){this.init()},methods:{init:function(){var e,t=this;return(e=regeneratorRuntime.mark((function e(){var n,o;return regeneratorRuntime.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(n=t.getRoomname(),console.info(t.apiKey,"api key"),n){e.next=4;break}throw Error("interpretation-player: roomname is not defined");case 4:if(t.apiKey){e.next=6;break}throw Error("interpretation-player: apiKey is not defined");case 6:o={apiKey:t.apiKey,roomName:n,container:"akkadu-interpretation-player",positionMenu:t.positionMenu,isBoxShadow:t.isBoxShadow},t.stream=new h(o),t.initListeners(),t.stream.init();case 10:case"end":return e.stop()}}),e)})),function(){var t=this,n=arguments;return new Promise((function(r,i){var a=e.apply(t,n);function s(e){o(a,r,i,s,l,"next",e)}function l(e){o(a,r,i,s,l,"throw",e)}s(void 0)}))})()},getRoomname:function(){return"test"},initListeners:function(){var e=this;this.stream.on("interpretation-player:on-ready",(function(t){var n=t.isReady;console.info("emit interpretation-player:on-ready",n),e.$emit("onReady",{isReady:n})})),this.stream.on("interpretation-player:on-language-selected",(function(t){var n=t.languageSelected;console.info("emit interpretation-player:on-language-selected",n),e.$emit("onLanguageSelected",{languageSelected:n})})),this.stream.on("interpretation-player:on-connection-status-updated",(function(t){var n=t.connection;console.info("emit interpretation-player:on-connection-status-updated",n),e.$emit("onConnectionStatusUpdated",{connection:n})}))}}},undefined,false,undefined,!1,void 0,void 0,void 0),b=Object.freeze({__proto__:null,RsiApiInterpretationPlayer:v}),x=function(e){Object.entries(b).forEach((function(t){var n=r(t,2),o=n[0],i=n[1];e.component(o,i)}))},w=Object.freeze({__proto__:null,default:x,RsiApiInterpretationPlayer:v});return Object.entries(w).forEach((function(e){var t=r(e,2),n=t[0],o=t[1];"default"!==n&&(x[n]=o)})),x}(events_1);

@@ -118,3 +118,3 @@ 'use strict';var events_1=require('events');function _interopDefaultLegacy(e){return e&&typeof e==='object'&&'default'in e?e:{'default':e}}var events_1__default=/*#__PURE__*/_interopDefaultLegacy(events_1);function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {

html: "\n <body>\n <div class=\"select\">\n <div class=\"selectWrapper\" >\n <div class=\"selectCustom js-selectCustom\">\n <div id=\"interpretation-player-custom-value\" class=\"selectCustom-trigger\"> <img src=''/> <h3> </h3> </div>\n <div id=\"interpretation-player-options\" class=\"selectCustom-options\">\n </div>\n </div>\n </div>\n </body>\n ",
css: "\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: \"Helvetica Neue\", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: \"\u25BE\";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n "
css: "\n\n #akkadu-interpretation-player {\n display: inline-table;\n position: relative;\n font-family: \"Helvetica Neue\", Arial, sans-serif;\n }\n #akkadu-interpretation-player .select {\n position: relative;\n }\n #akkadu-interpretation-player .selectLabel {\n display: block;\n margin-bottom: 10px;\n }\n #akkadu-interpretation-player .selectWrapper {\n position: relative;\n }\n #akkadu-interpretation-player .selectCustom {\n position: relative;\n height: 100%;\n }\n #akkadu-interpretation-player .selectCustom-trigger {\n display: flex;\n position: relative;\n min-width: 150px;\n background-color: white;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n cursor: pointer;\n padding: 10px 15px;\n width: 100%;\n height: 100%;\n }\n #akkadu-interpretation-player h3{\n margin:0px;\n padding:0px;\n }\n #akkadu-interpretation-player img{\n margin:0px;\n padding:0px;\n max-width: 20px;\n margin-right:10px;\n }\n #akkadu-interpretation-player h3, #akkadu-interpretation-player .selectCustom-trigger{\n font-size: 16px;\n color: #2C3D4F;\n font-weight: 400;\n text-transform: capitalize;\n }\n #akkadu-interpretation-player .selectCustom-trigger::after {\n content: \"\u25BE\";\n color:#908f8f;\n position: absolute;\n top: 7px;\n line-height: 20px;\n right: 10px;\n }\n \n #akkadu-interpretation-player .selectCustom-trigger:hover {\n box-shadow: 0 0 4px #e9e1f8;\n }\n #akkadu-interpretation-player .selectCustom-options {\n position: absolute;\n top: 45px;\n left: 0;\n width: 100%;\n border: 1px solid #dbdbdb;\n border-radius: 5px;\n background-color: #fff;\n box-shadow: 0 0 4px #e9e1f8;\n z-index: 1;\n padding:0px;\n display: none;\n cursor: pointer;\n box-shadow: 3px 6px 7px 4px #e3e3e3;\n }\n \n #akkadu-interpretation-player .selectCustom.isActive .selectCustom-options {\n display: block;\n min-width: 260px;\n }\n \n #akkadu-interpretation-player .selectCustom-option {\n position: relative;\n padding: 10px 15px;\n display: flex;\n }\n \n #akkadu-interpretation-player .selectCustom-option:hover {\n background-color: #F2F2F2;\n }\n \n #akkadu-interpretation-player .selectCustom-option:not(:last-of-type)::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 5px;\n width: 95%;\n border-bottom: 1px solid #e0e7ef;\n }\n \n\n \n "
};

@@ -186,6 +186,7 @@ var _default$1 = component;

var _this = _super.call(this) || this;
var apiKey = config.apiKey, roomName = config.roomName, container = config.container, positionMenu = config.positionMenu;
var apiKey = config.apiKey, roomName = config.roomName, container = config.container, positionMenu = config.positionMenu, isBoxShadow = config.isBoxShadow;
_this.apiKey = apiKey;
_this.roomName = roomName;
_this.positionMenu = positionMenu;
_this.isBoxShadow = isBoxShadow;
_this.consumerConfig = defaultConsumerConfig;

@@ -251,2 +252,3 @@ _this.consumerConfig.container = container;

newText.textContent = languagesList[i].name;
newText.id = i;
newImage = document.createElement('img');

@@ -272,6 +274,10 @@ newImage.src = this.getFlagUrl(languagesList[i].iso);

elOption.addEventListener("click", function (e) {
console.log(e, 'click language event');
// Update custom select text
var languageSelected;
var idOption = e.target.id;
console.log(e.target, 'e.target');
console.log(e.target.id, 'e.target');
languageSelected = languagesList[idOption];
console.log(languagesList, 'languagesList');
elSelectCustomValue.getElementsByTagName("h3")[0].textContent = languageSelected.name;

@@ -295,16 +301,14 @@ elSelectCustomValue.getElementsByTagName("img")[0].src = that.getFlagUrl(languageSelected.iso);

});
// prop for position box - should do an auto one first ?
// 6px -1px 8px 1px #e3e3e3 !important
// bottom: 55px; top 0px for .selectCustom-options
};
InterpretationPlayer.prototype.updateStylesWithProps = function () {
var propsDefault = {
'positionMenu': 'bottom'
};
var stylesStr;
var styles = [];
if (this.positionMenu !== propsDefault['positionMenu']) {
if (this.positionMenu === 'top') {
var style = ".selectCustom-options{\n box-shadow:6px -1px 8px 1px #e3e3e3 !important;\n top: -130px !important;\n }";
styles.push(style);
}
if (this.isBoxShadow === false) {
var style = "\n #akkadu-interpretation-player .selectCustom-options{\n box-shadow:none !important;\n }";
styles.push(style);
}
stylesStr = styles.join(' ');

@@ -330,2 +334,7 @@ return stylesStr;

default: 'bottom'
},
isBoxShadow: {
required: false,
type: Boolean,
default: true
}

@@ -375,3 +384,4 @@ },

container: 'akkadu-interpretation-player',
positionMenu: _this.positionMenu
positionMenu: _this.positionMenu,
isBoxShadow: _this.isBoxShadow
};

@@ -404,3 +414,3 @@ _this.stream = new _default(config);

var isReady = _ref.isReady;
console.info('interpretation-player:on-ready', isReady);
console.info('emit interpretation-player:on-ready', isReady);

@@ -413,3 +423,3 @@ _this2.$emit("onReady", {

var languageSelected = _ref2.languageSelected;
console.info('interpretation-player:on-language-selected', languageSelected);
console.info('emit interpretation-player:on-language-selected', languageSelected);

@@ -422,3 +432,3 @@ _this2.$emit("onLanguageSelected", {

var connection = _ref3.connection;
console.info('interpretation-player:on-connection-status-updated', connection);
console.info('emit interpretation-player:on-connection-status-updated', connection);

@@ -531,3 +541,3 @@ _this2.$emit("onConnectionStatusUpdated", {

var __vue_module_identifier__ = "data-v-e1aef9a2";
var __vue_module_identifier__ = "data-v-a9fd2278";
/* functional template */

@@ -534,0 +544,0 @@

{
"name": "@akkadu/rsi-api-vue",
"version": "1.0.7",
"version": "1.0.8",
"description": "",

@@ -5,0 +5,0 @@ "main": "dist/rsi-api-vue.ssr.js",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc