UNPKG

supafeedback

Version:

Website Feedback Recorder is an innovative npm package designed to streamline the process of collecting user feedback and bug reports for your website. By integrating this package, users can easily record their screen as they navigate through your site, a

3 lines (2 loc) 13.3 kB
"use strict";function e(e,t,n,r,o,a,i){try{var c=e[a](i),u=c.value}catch(e){return void n(e)}c.done?t(u):Promise.resolve(u).then(r,o)}function t(t){return function(){var n=this,r=arguments;return new Promise((function(o,a){var i=t.apply(n,r);function c(t){e(i,o,a,c,u,"next",t)}function u(t){e(i,o,a,c,u,"throw",t)}c(void 0)}))}}function n(){n=function(){return t};var e,t={},r=Object.prototype,o=r.hasOwnProperty,a=Object.defineProperty||function(e,t,n){e[t]=n.value},i="function"==typeof Symbol?Symbol:{},c=i.iterator||"@@iterator",u=i.asyncIterator||"@@asyncIterator",s=i.toStringTag||"@@toStringTag";function l(e,t,n){return Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{l({},"")}catch(e){l=function(e,t,n){return e[t]=n}}function d(e,t,n,r){var o=Object.create((t&&t.prototype instanceof b?t:b).prototype),i=new N(r||[]);return a(o,"_invoke",{value:M(e,n,i)}),o}function p(e,t,n){try{return{type:"normal",arg:e.call(t,n)}}catch(e){return{type:"throw",arg:e}}}t.wrap=d;var f="suspendedStart",h="executing",m="completed",v={};function b(){}function y(){}function g(){}var x={};l(x,c,(function(){return this}));var w=Object.getPrototypeOf,k=w&&w(w(O([])));k&&k!==r&&o.call(k,c)&&(x=k);var E=g.prototype=b.prototype=Object.create(x);function L(e){["next","throw","return"].forEach((function(t){l(e,t,(function(e){return this._invoke(t,e)}))}))}function T(e,t){function n(r,a,i,c){var u=p(e[r],e,a);if("throw"!==u.type){var s=u.arg,l=s.value;return l&&"object"==typeof l&&o.call(l,"__await")?t.resolve(l.__await).then((function(e){n("next",e,i,c)}),(function(e){n("throw",e,i,c)})):t.resolve(l).then((function(e){s.value=e,i(s)}),(function(e){return n("throw",e,i,c)}))}c(u.arg)}var r;a(this,"_invoke",{value:function(e,o){function a(){return new t((function(t,r){n(e,o,t,r)}))}return r=r?r.then(a,a):a()}})}function M(t,n,r){var o=f;return function(a,i){if(o===h)throw Error("Generator is already running");if(o===m){if("throw"===a)throw i;return{value:e,done:!0}}for(r.method=a,r.arg=i;;){var c=r.delegate;if(c){var u=S(c,r);if(u){if(u===v)continue;return u}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(o===f)throw o=m,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);o=h;var s=p(t,n,r);if("normal"===s.type){if(o=r.done?m:"suspendedYield",s.arg===v)continue;return{value:s.arg,done:r.done}}"throw"===s.type&&(o=m,r.method="throw",r.arg=s.arg)}}}function S(t,n){var r=n.method,o=t.iterator[r];if(o===e)return n.delegate=null,"throw"===r&&t.iterator.return&&(n.method="return",n.arg=e,S(t,n),"throw"===n.method)||"return"!==r&&(n.method="throw",n.arg=new TypeError("The iterator does not provide a '"+r+"' method")),v;var a=p(o,t.iterator,n.arg);if("throw"===a.type)return n.method="throw",n.arg=a.arg,n.delegate=null,v;var i=a.arg;return i?i.done?(n[t.resultName]=i.value,n.next=t.nextLoc,"return"!==n.method&&(n.method="next",n.arg=e),n.delegate=null,v):i:(n.method="throw",n.arg=new TypeError("iterator result is not an object"),n.delegate=null,v)}function _(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function H(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function N(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(_,this),this.reset(!0)}function O(t){if(t||""===t){var n=t[c];if(n)return n.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,a=function n(){for(;++r<t.length;)if(o.call(t,r))return n.value=t[r],n.done=!1,n;return n.value=e,n.done=!0,n};return a.next=a}}throw new TypeError(typeof t+" is not iterable")}return y.prototype=g,a(E,"constructor",{value:g,configurable:!0}),a(g,"constructor",{value:y,configurable:!0}),y.displayName=l(g,s,"GeneratorFunction"),t.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===y||"GeneratorFunction"===(t.displayName||t.name))},t.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,g):(e.__proto__=g,l(e,s,"GeneratorFunction")),e.prototype=Object.create(E),e},t.awrap=function(e){return{__await:e}},L(T.prototype),l(T.prototype,u,(function(){return this})),t.AsyncIterator=T,t.async=function(e,n,r,o,a){void 0===a&&(a=Promise);var i=new T(d(e,n,r,o),a);return t.isGeneratorFunction(n)?i:i.next().then((function(e){return e.done?e.value:i.next()}))},L(E),l(E,s,"Generator"),l(E,c,(function(){return this})),l(E,"toString",(function(){return"[object Generator]"})),t.keys=function(e){var t=Object(e),n=[];for(var r in t)n.push(r);return n.reverse(),function e(){for(;n.length;){var r=n.pop();if(r in t)return e.value=r,e.done=!1,e}return e.done=!0,e}},t.values=O,N.prototype={constructor:N,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=e,this.done=!1,this.delegate=null,this.method="next",this.arg=e,this.tryEntries.forEach(H),!t)for(var n in this)"t"===n.charAt(0)&&o.call(this,n)&&!isNaN(+n.slice(1))&&(this[n]=e)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var n=this;function r(r,o){return c.type="throw",c.arg=t,n.next=r,o&&(n.method="next",n.arg=e),!!o}for(var a=this.tryEntries.length-1;a>=0;--a){var i=this.tryEntries[a],c=i.completion;if("root"===i.tryLoc)return r("end");if(i.tryLoc<=this.prev){var u=o.call(i,"catchLoc"),s=o.call(i,"finallyLoc");if(u&&s){if(this.prev<i.catchLoc)return r(i.catchLoc,!0);if(this.prev<i.finallyLoc)return r(i.finallyLoc)}else if(u){if(this.prev<i.catchLoc)return r(i.catchLoc,!0)}else{if(!s)throw Error("try statement without catch or finally");if(this.prev<i.finallyLoc)return r(i.finallyLoc)}}}},abrupt:function(e,t){for(var n=this.tryEntries.length-1;n>=0;--n){var r=this.tryEntries[n];if(r.tryLoc<=this.prev&&o.call(r,"finallyLoc")&&this.prev<r.finallyLoc){var a=r;break}}a&&("break"===e||"continue"===e)&&a.tryLoc<=t&&t<=a.finallyLoc&&(a=null);var i=a?a.completion:{};return i.type=e,i.arg=t,a?(this.method="next",this.next=a.finallyLoc,v):this.complete(i)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),v},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.finallyLoc===e)return this.complete(n.completion,n.afterLoc),H(n),v}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.tryLoc===e){var r=n.completion;if("throw"===r.type){var o=r.arg;H(n)}return o}}throw Error("illegal catch attempt")},delegateYield:function(t,n,r){return this.delegate={iterator:O(t),resultName:n,nextLoc:r},"next"===this.method&&(this.arg=e),v}},t}Object.defineProperty(exports,"__esModule",{value:!0});var r=document.createElement("style");r.innerHTML="\n\n#supafeedback-modal{\n font-family: Arial, sans-serif;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0,0,0,0.5);\n z-index: 9999;\n}\n\n.supafeedback-content {\n margin: 100px auto;\n padding: 20px;\n background-color: white;\n border-radius: 5px;\n box-shadow: 0 0 10px rgba(0,0,0,0.5);\n width: 70%;\n max-width: 500px;\n position: relative;\n}\n\n.supafeedback-close {\n position: absolute;\n top: 5px;\n right: 5px;\n cursor: pointer;\n}\n\n.supafeedback-form {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.supafeedback-form input, .supafeedback-form textarea {\n padding: 10px;\n border-radius: 5px;\n border: 1px solid purple;\n resize: none;\n}\n\n.supafeedback-title {\n font-size: 24px;\n margin: 0;\n margin-bottom: 8px;\n}\n\n.supafeedback-btn-main {\n position: fixed;\n bottom: 20px;\n right: 20px;\n z-index: 9999;\n}\n\n.supafeedback-btn {\n font-family: Arial, sans-serif;\n padding: 4px;\n background-color: transparent;\n color: purple;\n cursor: pointer;\n border-radius: 5px;\n border: 2px solid #9370DB;\n}\n\n.supafeedback-btn-active, .supafeedback-btn:focus, .supafeedback-btn:hover {\n border: 2px solid purple;\n color: white;\n background-color: purple; \n transition: 0.5s; \n}\n\n.supafeedback-btn:hover {\n border: 2px solid purple;\n}\n\n",document.head.appendChild(r);var o=!1,a=!1,i=null,c=[],u=null,s=function(e){a=!0;var r=document.getElementById("supafeedback-modal");if(r)r.style.display="block";else{(r=document.createElement("div")).id="supafeedback-modal",r.onclick=function(e){l(),e.stopPropagation()};var o=document.createElement("div");o.className="supafeedback-content",o.onclick=function(e){e.stopPropagation()};var i=document.createElement("div");i.innerHTML="X",i.className="supafeedback-close",i.onclick=function(){l()};var s=document.createElement("h1");s.className="supafeedback-title",s.innerHTML="Report a bug";var p=document.createElement("form");p.className="supafeedback-form",p.onsubmit=function(){var r=t(n().mark((function t(r){var o,a;return n().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(r.preventDefault(),(o=document.querySelector("#supafeedback-submit"))&&(o.setAttribute("disabled","true"),o.innerHTML="Uploading..."),u){t.next=6;break}return console.error("No video recorded"),t.abrupt("return");case 6:return(a=new FormData).append("file",u,"bug_report.webm"),a.append("description",document.querySelector("textarea").value),t.prev=9,t.next=12,fetch("https://zb5qarphvg.execute-api.ap-south-1.amazonaws.com/SFB/upload",{method:"POST",body:a,headers:{"x-access-token":e}});case 12:t.sent.ok?(console.log("Video uploaded successfully"),l(),p.reset(),u=null,c=[],o&&(o.removeAttribute("disabled"),o.innerHTML="Submit")):(console.error("Video upload failed"),o&&(o.removeAttribute("disabled"),o.innerHTML="Submit")),t.next=20;break;case 16:t.prev=16,t.t0=t.catch(9),console.error("Error uploading video:",t.t0),o&&(o.removeAttribute("disabled"),o.innerHTML="Error Submitting, Please submit again");case 20:case"end":return t.stop()}}),t,null,[[9,16]])})));return function(e){return r.apply(this,arguments)}}();var f=document.createElement("textarea");f.name="description",f.rows=6,f.placeholder="Enter your bug report",f.required=!0,f.className="supafeedback-input";var h=document.createElement("p");h.innerHTML="Record a video of the bug and describe it above";var m=document.createElement("button");m.id="supafeedback-record-screen",m.type="button",m.innerHTML=u?"Re-record":"Record screen",m.className="supafeedback-btn",m.onclick=function(){l(),d(e),console.log("Recording screen")};var v=document.createElement("button");v.id="supafeedback-submit",v.type="submit",v.innerHTML="Submit",v.className="supafeedback-btn";var b=document.createElement("div");b.id="video-container",b.style.display="none";var y=document.createElement("video");y.id="recorded-video",y.controls=!0,y.style.width="100%",y.style.height="auto",b.appendChild(y),p.appendChild(f),p.appendChild(h),p.appendChild(b),p.appendChild(m),p.appendChild(v),o.appendChild(i),o.appendChild(s),o.appendChild(p),r.appendChild(o),document.body.appendChild(r)}},l=function(){var e=document.getElementById("supafeedback-modal");if(e){a=!1,e.style.display="none";var t=document.getElementById("video-container");if(t){t.style.display="none",u=null,c=[];var n=document.querySelector("#supafeedback-record-screen");n&&(n.innerHTML="Record screen")}}},d=function(){var e=t(n().mark((function e(r){var o,a,l,d;return n().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,navigator.mediaDevices.getDisplayMedia({video:!0});case 3:o=e.sent,i=new MediaRecorder(o),(a=document.querySelector("#supafeedback"))&&(a.innerHTML="Recording will stop in 10"),l=9,d=setInterval((function(){l>0?(a&&(a.innerHTML="Recording will stop in "+l.toString()),l--):(clearInterval(d),a&&(a.innerHTML="Report a bug"))}),1e3),i.ondataavailable=function(e){e.data.size>0&&c.push(e.data)},i.onstop=t(n().mark((function e(){var t,i,l,p,f;return n().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:clearInterval(d),a&&(a.innerHTML="Report a bug"),o.getTracks().forEach((function(e){return e.stop()})),s(r),t=new Blob(c,{type:"video/webm"}),i=URL.createObjectURL(t),(l=document.getElementById("recorded-video"))&&(l.src=i,(p=document.getElementById("video-container"))&&(p.style.display="block")),(f=document.querySelector("#supafeedback-record-screen"))&&(f.innerHTML="Re-record"),u=t,console.log("Video blob:",u);case 12:case"end":return e.stop()}}),e)}))),i.start(),setTimeout((function(){var e;null==(e=i)||e.stop()}),1e4),e.next=18;break;case 15:e.prev=15,e.t0=e.catch(0),console.error("Error: "+e.t0);case 18:case"end":return e.stop()}}),e,null,[[0,15]])})));return function(t){return e.apply(this,arguments)}}();exports.initSupaFeedback=function(e){if(!o){var t=document.getElementById("supafeedback");t||((t=document.createElement("div")).id="supafeedback",t.className="supafeedback-btn supafeedback-btn-main"),t.innerHTML="Report a bug",t.onclick=function(){a||s(e)},document.getElementById("supafeedback")||document.body.appendChild(t),o=!0}}; //# sourceMappingURL=supafeedback.cjs.production.min.js.map