@vsllabs/webgl-react
Version:
VSL-Labs Webgl implementation for translating text into 3D sign language
3 lines (2 loc) • 14.2 kB
JavaScript
(function(g,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],l):(g=typeof globalThis<"u"?globalThis:g||self,l(g["@vsllabs/webgl-react"]={},g.React))})(this,function(g,l){"use strict";var b=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},V={},j={},A={};Object.defineProperty(A,"__esModule",{value:!0}),A.useUnityCanvasId=void 0;var ne=l,re=0,ae="react-unity-webgl-canvas",se=function(n){if(n.id!==void 0)return n.id;var o=(0,ne.useMemo)(function(){return[ae,++re].join("-")},[]);return o};A.useUnityCanvasId=se;var T={},E={};Object.defineProperty(E,"__esModule",{value:!0}),E.UnityLoaderStatus=void 0;var K;(function(n){n.Idle="Idle",n.Loading="Loading",n.Loaded="Loaded",n.Error="Error"})(K||(E.UnityLoaderStatus=K={}));var C={};Object.defineProperty(C,"__esModule",{value:!0}),C.isBrowserEnvironment=void 0,C.isBrowserEnvironment=typeof window<"u"&&typeof document<"u";var ie=b&&b.__awaiter||function(n,o,t,s){function a(e){return e instanceof t?e:new t(function(i){i(e)})}return new(t||(t=Promise))(function(e,i){function c(u){try{r(s.next(u))}catch(y){i(y)}}function d(u){try{r(s.throw(u))}catch(y){i(y)}}function r(u){u.done?e(u.value):a(u.value).then(c,d)}r((s=s.apply(n,o||[])).next())})},oe=b&&b.__generator||function(n,o){var t={label:0,sent:function(){if(e[0]&1)throw e[1];return e[1]},trys:[],ops:[]},s,a,e,i=Object.create((typeof Iterator=="function"?Iterator:Object).prototype);return i.next=c(0),i.throw=c(1),i.return=c(2),typeof Symbol=="function"&&(i[Symbol.iterator]=function(){return this}),i;function c(r){return function(u){return d([r,u])}}function d(r){if(s)throw new TypeError("Generator is already executing.");for(;i&&(i=0,r[0]&&(t=0)),t;)try{if(s=1,a&&(e=r[0]&2?a.return:r[0]?a.throw||((e=a.return)&&e.call(a),0):a.next)&&!(e=e.call(a,r[1])).done)return e;switch(a=0,e&&(r=[r[0]&2,e.value]),r[0]){case 0:case 1:e=r;break;case 4:return t.label++,{value:r[1],done:!1};case 5:t.label++,a=r[1],r=[0];continue;case 7:r=t.ops.pop(),t.trys.pop();continue;default:if(e=t.trys,!(e=e.length>0&&e[e.length-1])&&(r[0]===6||r[0]===2)){t=0;continue}if(r[0]===3&&(!e||r[1]>e[0]&&r[1]<e[3])){t.label=r[1];break}if(r[0]===6&&t.label<e[1]){t.label=e[1],e=r;break}if(e&&t.label<e[2]){t.label=e[2],t.ops.push(r);break}e[2]&&t.ops.pop(),t.trys.pop();continue}r=o.call(n,t)}catch(u){r=[6,u],a=0}finally{s=e=0}if(r[0]&5)throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}};Object.defineProperty(T,"__esModule",{value:!0}),T.useUnityInstance=void 0;var ue=l,le=E,ce=C,de=function(n,o,t,s){(0,ue.useEffect)(function(){(function(){return ie(void 0,void 0,void 0,function(){var a,e;return oe(this,function(i){switch(i.label){case 0:if(ce.isBrowserEnvironment===!1)return[2];if(n!==le.UnityLoaderStatus.Loaded||o===null)return s.setUnityInstance(null),s.setInitialisationError(null),[2];i.label=1;case 1:return i.trys.push([1,3,,4]),[4,window.createUnityInstance(o,t,s.setLoadingProgression)];case 2:return a=i.sent(),s.setUnityInstance(a),s.setInitialisationError(null),[3,4];case 3:return e=i.sent(),s.setUnityInstance(null),s.setInitialisationError(e),[3,4];case 4:return[2]}})})})()},[n,o,t,s])};T.useUnityInstance=de;var O={};Object.defineProperty(O,"__esModule",{value:!0}),O.useUnityArguments=void 0;var fe=l,ve=function(n){return(0,fe.useMemo)(function(){return{dataUrl:n.unityProvider.unityConfig.dataUrl,frameworkUrl:n.unityProvider.unityConfig.frameworkUrl,codeUrl:n.unityProvider.unityConfig.codeUrl,streamingAssetsUrl:n.unityProvider.unityConfig.streamingAssetsUrl,memoryUrl:n.unityProvider.unityConfig.memoryUrl,symbolsUrl:n.unityProvider.unityConfig.symbolsUrl,companyName:n.unityProvider.unityConfig.companyName,productName:n.unityProvider.unityConfig.productName,productVersion:n.unityProvider.unityConfig.productVersion,webglContextAttributes:n.unityProvider.unityConfig.webglContextAttributes||{},cacheControl:n.unityProvider.unityConfig.cacheControl||function(){return"must-revalidate"},devicePixelRatio:n.devicePixelRatio||1,matchWebGLToCanvasSize:typeof n.matchWebGLToCanvasSize=="boolean"?n.matchWebGLToCanvasSize:!0,disabledCanvasEvents:n.disabledCanvasEvents||["contextmenu","dragstart"],print:function(o){},printErr:function(o){}}},[])};O.useUnityArguments=ve;var P={};Object.defineProperty(P,"__esModule",{value:!0}),P.useUnityLoader=void 0;var X=l,ye=C,p=E,be=function(n){var o=(0,X.useState)(p.UnityLoaderStatus.Loading),t=o[0],s=o[1];return(0,X.useEffect)(function(){if(ye.isBrowserEnvironment!==!1){if(n.loaderUrl===null){s(p.UnityLoaderStatus.Idle);return}var a=window.document.querySelector('script[src="'.concat(n.loaderUrl,'"]'));a===null?(a=window.document.createElement("script"),a.type="text/javascript",a.src=n.loaderUrl,a.async=!0,a.setAttribute("data-status","loading"),window.document.body.appendChild(a),a.addEventListener("load",function(){return a==null?void 0:a.setAttribute("data-status","loaded")}),a.addEventListener("error",function(){return a==null?void 0:a.setAttribute("data-status","error")})):s(a.getAttribute("data-status")==="loaded"?p.UnityLoaderStatus.Loaded:p.UnityLoaderStatus.Error);var e=function(i){return s(i.type==="load"?p.UnityLoaderStatus.Loaded:p.UnityLoaderStatus.Error)};return a.addEventListener("load",e),a.addEventListener("error",e),function(){a!==null&&(a.removeEventListener("load",e),a.removeEventListener("error",e),window.document.body.removeChild(a))}}},[n.loaderUrl]),t};P.useUnityLoader=be,Object.defineProperty(j,"__esModule",{value:!0}),j.Unity=void 0;var Z=l,Y=l,me=A,_e=T,Ue=O,ge=P,he=(0,Y.forwardRef)(function(n,o){var t=(0,Y.useRef)(null),s=(0,me.useUnityCanvasId)(n),a=(0,Ue.useUnityArguments)(n),e=(0,ge.useUnityLoader)(n.unityProvider.unityConfig);return(0,_e.useUnityInstance)(e,t.current,a,n.unityProvider),(0,Z.useImperativeHandle)(o,function(){return t.current}),(0,Z.createElement)("canvas",{ref:t,id:s,style:n.style,className:n.className,tabIndex:n.tabIndex})});j.Unity=he;var F={},L={};Object.defineProperty(L,"__esModule",{value:!0}),L.errorMessages=void 0;var we={genericNoUnityInstance:"No Unity Instance found.",requestFullscreenNoUnityInstance:"Unable to Set Fullscreen while Unity is not Instantiated.",requestPointerLockNoUnityInstanceOrCanvas:"Unable to Request Pointer Lock while Unity is not Instantiated or the Canvas is not found.",sendMessageNoUnityInstance:"Unable to Send Message while Unity is not Instantiated.",quitNoUnityInstance:"Unable to Quit Unity while Unity is not Instantiated.",screenshotNoUnityInstanceOrCanvas:"Unable to Take Screenshot while Unity is not Instantiated or Canvas is not available.",noEventListener:"Unable to find Event Listener in Event System for Event"};L.errorMessages=we;var G={},Q=b&&b.__spreadArray||function(n,o,t){if(t||arguments.length===2)for(var s=0,a=o.length,e;s<a;s++)(e||!(s in o))&&(e||(e=Array.prototype.slice.call(o,0,s)),e[s]=o[s]);return n.concat(e||Array.prototype.slice.call(o))};Object.defineProperty(G,"__esModule",{value:!0}),G.useEventSystem=void 0;var M=l,Ce=L,pe=C,R=[],Ie=function(n){for(var o=[],t=1;t<arguments.length;t++)o[t-1]=arguments[t];var s=void 0;return R.forEach(function(a){s=a.apply(void 0,Q([n],o,!1))}),s};pe.isBrowserEnvironment===!0&&(window.dispatchReactUnityEvent=Ie);var Se=function(){var n=(0,M.useRef)([]),o=(0,M.useCallback)(function(a,e){n.current=Q(Q([],n.current,!0),[{eventName:a,callback:e}],!1)},[n]),t=(0,M.useCallback)(function(a,e){n.current=n.current.filter(function(i){return i.eventName!==a&&i.callback!==e})},[n]),s=(0,M.useCallback)(function(a){for(var e=[],i=1;i<arguments.length;i++)e[i-1]=arguments[i];var c=n.current.find(function(d){return d.eventName===a});if(typeof c>"u"){console.warn(Ce.errorMessages.noEventListener,{eventName:a});return}return c.callback.apply(c,e)},[n]);return(0,M.useEffect)(function(){return R.push(s),function(){R.splice(R.indexOf(s),1)}},[s]),{addEventListener:o,removeEventListener:t}};G.useEventSystem=Se;var W={};Object.defineProperty(W,"__esModule",{value:!0}),W.useNullableState=void 0;var Ee=l,Le=function(n){return(0,Ee.useState)(n||null)};W.useNullableState=Le;var Me=b&&b.__awaiter||function(n,o,t,s){function a(e){return e instanceof t?e:new t(function(i){i(e)})}return new(t||(t=Promise))(function(e,i){function c(u){try{r(s.next(u))}catch(y){i(y)}}function d(u){try{r(s.throw(u))}catch(y){i(y)}}function r(u){u.done?e(u.value):a(u.value).then(c,d)}r((s=s.apply(n,o||[])).next())})},ke=b&&b.__generator||function(n,o){var t={label:0,sent:function(){if(e[0]&1)throw e[1];return e[1]},trys:[],ops:[]},s,a,e,i=Object.create((typeof Iterator=="function"?Iterator:Object).prototype);return i.next=c(0),i.throw=c(1),i.return=c(2),typeof Symbol=="function"&&(i[Symbol.iterator]=function(){return this}),i;function c(r){return function(u){return d([r,u])}}function d(r){if(s)throw new TypeError("Generator is already executing.");for(;i&&(i=0,r[0]&&(t=0)),t;)try{if(s=1,a&&(e=r[0]&2?a.return:r[0]?a.throw||((e=a.return)&&e.call(a),0):a.next)&&!(e=e.call(a,r[1])).done)return e;switch(a=0,e&&(r=[r[0]&2,e.value]),r[0]){case 0:case 1:e=r;break;case 4:return t.label++,{value:r[1],done:!1};case 5:t.label++,a=r[1],r=[0];continue;case 7:r=t.ops.pop(),t.trys.pop();continue;default:if(e=t.trys,!(e=e.length>0&&e[e.length-1])&&(r[0]===6||r[0]===2)){t=0;continue}if(r[0]===3&&(!e||r[1]>e[0]&&r[1]<e[3])){t.label=r[1];break}if(r[0]===6&&t.label<e[1]){t.label=e[1],e=r;break}if(e&&t.label<e[2]){t.label=e[2],t.ops.push(r);break}e[2]&&t.ops.pop(),t.trys.pop();continue}r=o.call(n,t)}catch(u){r=[6,u],a=0}finally{s=e=0}if(r[0]&5)throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}};Object.defineProperty(F,"__esModule",{value:!0}),F.useUnityContext=void 0;var m=l,I=L,xe=G,q=W,Ne=function(n){var o=(0,q.useNullableState)(),t=o[0],s=o[1],a=(0,m.useState)(0),e=a[0],i=a[1],c=(0,m.useState)(!1),d=c[0],r=c[1],u=(0,q.useNullableState)(),y=u[0],k=u[1],x=(0,xe.useEventSystem)(),B=(0,m.useRef)({setLoadingProgression:i,setInitialisationError:k,setUnityInstance:s,setIsLoaded:r,unityConfig:n}),z=(0,m.useCallback)(function(v){if(t===null){console.warn(I.errorMessages.requestFullscreenNoUnityInstance);return}t.SetFullscreen(v===!0?1:0)},[t]),D=(0,m.useCallback)(function(){if(t===null||typeof t.Module.canvas>"u"){console.warn(I.errorMessages.requestPointerLockNoUnityInstanceOrCanvas);return}return t.Module.canvas.requestPointerLock()},[t]),h=(0,m.useCallback)(function(v,U,J){if(t===null){console.warn(I.errorMessages.sendMessageNoUnityInstance);return}t.SendMessage(v,U,J)},[t]),H=(0,m.useCallback)(function(v,U){if(t===null||typeof t.Module.canvas>"u"){console.warn(I.errorMessages.screenshotNoUnityInstanceOrCanvas);return}return t.Module.canvas.toDataURL(v,U)},[t]),_=(0,m.useCallback)(function(){return t===null?(console.warn(I.errorMessages.quitNoUnityInstance),Promise.reject()):t.Quit()},[t]),N=(0,m.useCallback)(function(){return Me(void 0,void 0,void 0,function(){var v;return ke(this,function(U){switch(U.label){case 0:return t===null||typeof t.Module.canvas>"u"?(console.warn(I.errorMessages.genericNoUnityInstance),[2,Promise.reject()]):(v=t.Module.canvas,document.body.appendChild(v),v.style.display="none",[4,_()]);case 1:return U.sent(),v.remove(),[2]}})})},[t]);return(0,m.useEffect)(function(){r(e===1)},[e]),{unityProvider:B.current,loadingProgression:e,initialisationError:y,isLoaded:d,UNSAFE__unityInstance:t,requestFullscreen:z,requestPointerLock:D,sendMessage:h,takeScreenshot:H,unload:_,UNSAFE__detachAndUnloadImmediate:N,addEventListener:x.addEventListener,removeEventListener:x.removeEventListener}};F.useUnityContext=Ne,function(n){Object.defineProperty(n,"__esModule",{value:!0}),n.useUnityContext=n.Unity=void 0;var o=j;Object.defineProperty(n,"Unity",{enumerable:!0,get:function(){return o.Unity}});var t=F;Object.defineProperty(n,"useUnityContext",{enumerable:!0,get:function(){return t.useUnityContext}})}(V);const $=async(n,o)=>await(await fetch("https://api.vsllabs.com/api/v2/models/clerc/0",{method:"POST",headers:{"Content-Type":"application/json","x-api-key":n},body:JSON.stringify({user_input:o,settings_nlp:{synonyms:!1,details:!1,ner:!1,numbers:!1,nmm:!1,emotions:!1,translation_model:{model_type:"SEQ2SEQ",model_id:""}}})})).json();function je(n){return n.endsWith(".loader.js")||n.endsWith(".framework.js.br")?"no-store":"must-revalidate"}const Ae=({API_KEY:n,loaderUrl:o,dataUrl:t,frameworkUrl:s,codeUrl:a,streaming_mode:e=!1})=>{const[i,c]=l.useState(""),[d,r]=l.useState(""),[u,y]=l.useState([]),[k,x]=l.useState(!1),[B,z]=l.useState(!1),[D,h]=l.useState(""),{unityProvider:H,sendMessage:_,isLoaded:N}=V.useUnityContext({loaderUrl:o,dataUrl:t,frameworkUrl:s,codeUrl:a,cacheControl:je}),v=l.useCallback(async(f,S)=>{var ee,te;try{!S&&c(""),x(!0);const w=await $(n,f);S?r(((ee=w==null?void 0:w.NLP)==null?void 0:ee.unity_3d_input)||""):c(((te=w==null?void 0:w.NLP)==null?void 0:te.unity_3d_input)||""),x(!1),h("")}catch{h("Invalid API Key!"),console.error("Invalid API Key!")}},[n]),U=l.useCallback(async f=>{N&&B&&f&&(e?y(S=>[...S,f]):await v(f,!1))},[N,n,B,e]),J=l.useCallback(()=>{i&&!e?_("Gabi","GetWordsFromUser",i):h("Cannot reply, either no text provided or streaming mode is enabled.")},[i,e]),Te=l.useCallback(f=>{f&&_("BGcontroller","ChangeColorFromUserInput",f)},[]),Oe=l.useCallback(f=>{_("Main Camera","ToggleRotationFromStringInput",f?"true":"false")},[]),Pe=l.useCallback(f=>{_("speedController","SetSpeedFromUserInput",f)},[]);return l.useEffect(()=>{n?(async()=>{try{await $(n,"test"),z(!0)}catch{h("Invalid API Key!"),console.error("Invalid API Key!")}})():(h("Missing API_KEY!"),console.error("Missing API_KEY!"))},[n]),l.useEffect(()=>{i&&_("Gabi","GetWordsFromUser",i)},[i]),l.useEffect(()=>{d&&_("Gabi","GetWordsFromUserStream",d)},[d]),l.useEffect(()=>{!k&&u.length&&(async()=>{const f=u[0];y(S=>S.slice(1)),await v(f,!0)})()},[u.length,k]),{VSLWebGl:V.Unity,translateTextToASL:U,isUnityLoaded:N,isTranslating:k,unityProvider:H,replay:J,error:D,changeBgColor:Te,toggleCameraRotation:Oe,setAnimationSpeed:Pe}};g.useVslWebGL=Ae,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})});
//# sourceMappingURL=index.umd.js.map