/** * SSE */ var SSE=function(t,e){if(!(this instanceof SSE))return new SSE(t,e);this.INITIALIZING=-1,this.CONNECTING=0,this.OPEN=1,this.CLOSED=2,this.url=t,e=e||{},this.headers=e.headers||{},this.payload=void 0!==e.payload?e.payload:"",this.method=e.method||this.payload&&"POST"||"GET",this.withCredentials=!!e.withCredentials,this.debug=!!e.debug,this.FIELD_SEPARATOR=":",this.listeners={},this.xhr=null,this.readyState=this.INITIALIZING,this.progress=0,this.chunk="",this.addEventListener=function(t,e){void 0===this.listeners[t]&&(this.listeners[t]=[]),-1===this.listeners[t].indexOf(e)&&this.listeners[t].push(e)},this.removeEventListener=function(t,e){if(void 0!==this.listeners[t]){var s=[];this.listeners[t].forEach(function(t){t!==e&&s.push(t)}),0===s.length?delete this.listeners[t]:this.listeners[t]=s}},this.dispatchEvent=function(t){if(!t)return!0;this.debug&&console.debug(t),t.source=this;var e="on"+t.type;return(!this.hasOwnProperty(e)||(this[e].call(this,t),!t.defaultPrevented))&&(!this.listeners[t.type]||this.listeners[t.type].every(function(e){return e(t),!t.defaultPrevented}))},this._setReadyState=function(t){var e=new CustomEvent("readystatechange");e.readyState=t,this.readyState=t,this.dispatchEvent(e)},this._onStreamFailure=function(t){var e=new CustomEvent("error");e.data=t.currentTarget.response,this.dispatchEvent(e),this.close()},this._onStreamAbort=function(t){this.dispatchEvent(new CustomEvent("abort")),this.close()},this._onStreamProgress=function(t){if(this.xhr){if(200!==this.xhr.status){this._onStreamFailure(t);return}this.readyState==this.CONNECTING&&(this.dispatchEvent(new CustomEvent("open")),this._setReadyState(this.OPEN));var e=this.xhr.responseText.substring(this.progress);this.progress+=e.length;var s=(this.chunk+e).split(/(\r\n\r\n|\r\r|\n\n)/g),i=s.pop();s.forEach((function(t){t.trim().length>0&&this.dispatchEvent(this._parseEventChunk(t))}).bind(this)),this.chunk=i}},this._onStreamLoaded=function(t){this._onStreamProgress(t),this.dispatchEvent(this._parseEventChunk(this.chunk)),this.chunk=""},this._parseEventChunk=function(t){if(!t||0===t.length)return null;this.debug&&console.debug(t);var e={id:null,retry:null,data:null,event:null};t.split(/\n|\r\n|\r/).forEach((function(t){var s,i,h=t.indexOf(this.FIELD_SEPARATOR);if(h>0){var r=" "===t[h+1]?2:1;s=t.substring(0,h),i=t.substring(h+r)}else{if(!(h<0))return;s=t,i=""}s in e&&("data"===s&&null!==e[s]?e.data+="\n"+i:e[s]=i)}).bind(this));var s=new CustomEvent(e.event||"message");return s.data=e.data||"",s.id=e.id,s},this._checkStreamClosed=function(){this.xhr&&this.xhr.readyState===XMLHttpRequest.DONE&&this._setReadyState(this.CLOSED)},this.stream=function(){if(!this.xhr){for(var t in this._setReadyState(this.CONNECTING),this.xhr=new XMLHttpRequest,this.xhr.addEventListener("progress",this._onStreamProgress.bind(this)),this.xhr.addEventListener("load",this._onStreamLoaded.bind(this)),this.xhr.addEventListener("readystatechange",this._checkStreamClosed.bind(this)),this.xhr.addEventListener("error",this._onStreamFailure.bind(this)),this.xhr.addEventListener("abort",this._onStreamAbort.bind(this)),this.xhr.open(this.method,this.url),this.headers)this.xhr.setRequestHeader(t,this.headers[t]);this.xhr.withCredentials=this.withCredentials,this.xhr.send(this.payload)}},this.close=function(){this.readyState!==this.CLOSED&&(this.xhr.abort(),this.xhr=null,this._setReadyState(this.CLOSED))},(void 0===e.start||e.start)&&this.stream()};"undefined"!=typeof exports&&(exports.SSE=SSE); /** * DAYJS-START */ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs=e()}(this,(function(){"use strict";var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return"["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return!r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return(e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()1)return t(u[0])}else{var a=e.name;D[a]=e,i=a}return!r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init()},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},m.$utils=function(){return b},m.isValid=function(){return!(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)'); } else { $(".ivid-block-player").remove(); } if (isFirstLook_{{uid}} && window.c8_chatbot_convid_{{uid}} != null) { setTimeout(() => { renderMessages_{{uid}}({ message: "{{{welcomeMessage}}}", date: Date.now(), messageFrom: "bot", }); }, 300); } if ( c8PlayerApi.getRuntime() == "PLAYER" && window.c8_chatbot_convid_{{uid}} == null ) { $(".body-{{uid}}").append("

"); setTimeout(() => { fetch( "https://ai.cinema8.com/c8gpt/chatbot/conversation/" + chatbotId_{{uid}} ) .then((response) => response.json()) .then((data) => { window.c8_chatbot_convid_{{uid}} = data.conversationID; $(".loading-{{uid}}").remove(); renderMessages_{{uid}}({ message: "{{{welcomeMessage}}}", date: Date.now(), messageFrom: "bot", }); }); }, 1000); } }); $(".close-{{uid}}").on("click", function () { $(".toggle-{{uid}}").removeClass("open-{{uid}}"); // $(".container-{{uid}}").removeClass("active-{{uid}}"); panelToggle_{{uid}}(); }); // FORM ON SUBMIT EVENT form_{{uid}}.on("submit", function (event) { event.preventDefault(); form_{{uid}}.addClass("disable-{{uid}}"); var message = textarea_{{uid}}.val(); textarea_{{uid}}.val(""); renderMessages_{{uid}}({ message: message, date: Date.now(), messageFrom: "user", }); $(".container-{{uid}}").removeClass("entrance-{{uid}}"); document.querySelector(".form-{{uid}} textarea").rows = 1; sendMessage_{{uid}}(message) }); form_{{uid}}.keypress(function (e) { var code = e.keyCode ? e.keyCode : e.which; var isFormDisable = form_{{uid}}.hasClass("disable-{{uid}}"); if (code == 13 && !e.shiftKey && !isFormDisable) { e.preventDefault(); if (textarea_{{uid}}.val().replaceAll(" ", "").length > 0) { form_{{uid}}.submit(); } } }); function renderMessages_{{uid}}(val) { var msgListHTML = ""; console.log("Sended Message: ", val.message); mainData_{{uid}}.messages = [...mainData_{{uid}}.messages, val]; mainData_{{uid}}.messages.forEach((msg) => { if (msg.messageFrom == "bot") { currentBotAnswer_{{uid}} = msg.message; } msgListHTML += `

${msg.message}

`; }); $(".messages-{{uid}}") .html(msgListHTML) .ready(function () { setTimeout(() => { document .querySelector(".messages-{{uid}} li:last-child") .scrollIntoView({ behavior: "smooth" }); }, 100); }); if (val.messageFrom == "bot" && isFirstLook_{{uid}}) { botAnswerAnim_{{uid}}(); } } // function textAnimEnd_{{uid}}() { // console.log("Text anim end"); // //debugger // } function botAnswerAnim_{{uid}}() { var txt = currentBotAnswer_{{uid}}; var i = 0; function typeWriter() { if (i < txt.length) { document.querySelector( ".messages-{{uid}} li[data-msg-from='bot']:last-child" ).innerHTML += txt.charAt(i); i++; setTimeout(typeWriter, 10); } else { form_{{uid}}.removeClass("disable-{{uid}}"); clearInterval(myInterval); } } $(".messages-{{uid}} li[data-msg-from='bot']:last-child").html(""); typeWriter(); var myInterval = setInterval(function () { document .querySelector(".messages-{{uid}} li:last-child") .scrollIntoView({ behavior: "smooth" }); }, 500); isFirstLook_{{uid}} = false; } function sendMessage_{{uid}}(question) { $(".messages-{{uid}}").append( "

" ); let payload = { conversationId: window.c8_chatbot_convid_{{uid}}, question: question, }; var source = new SSE("https://ai.cinema8.com/c8gpt/chatbot/chat-v2", { method: "POST", headers: { "Content-Type": "application/json", }, payload: JSON.stringify(payload), }); source.addEventListener("message", function (e) { // Assuming we receive JSON-encoded data payloads: // console.log("e.data: ", e.data); //msgEl.innerHTML += e.data var data = JSON.parse(e.data); $(".messages-{{uid}} li[data-msg-from='bot']:last-child").html(data.message.answer + "|"); document.querySelector(".messages-{{uid}} li:last-child").scrollIntoView({ behavior: "smooth" }); if(data.message.status == "finished"){ renderMessages_{{uid}}({ message: data.message.answer, date: Date.now(), messageFrom: "bot", }); form_{{uid}}.removeClass("disable-{{uid}}"); if (data.message != null && data.message.items != null && data.message.items.length > 0) { c8PlayerApi.setVariable("p_recommendations", data.message.items); } else { c8PlayerApi.setVariable("p_recommendations", null); } } }); } // CONTROL OF THE TEXTAREA HEIGHT function getScrollHeight_{{uid}}(elm) { var savedValue = elm.value; elm.value = ""; elm._baseScrollHeight = elm.scrollHeight; elm.value = savedValue; } function onExpandableTextareaInput_{{uid}}({ target: elm }) { // make sure the input event originated from a textarea and it's desired to be auto-expandable if (!elm.nodeName == "TEXTAREA") return; var minRows = elm.getAttribute("data-min-rows") | 0, rows; !elm._baseScrollHeight && getScrollHeight_{{uid}}(elm); elm.rows = minRows; rows = Math.ceil((elm.scrollHeight - elm._baseScrollHeight) / 16); elm.rows = minRows + rows; } form_{{uid}}.on("input", onExpandableTextareaInput_{{uid}}); // PANEL OPENNINGS function panelToggle_{{uid}}() { $(".container-{{uid}}").toggleClass("active-{{uid}}"); if (selectedPanelDir_{{uid}} != "Top") { if ($(".container-{{uid}}").hasClass("active-{{uid}}")) { tlPanels_{{uid}}.play(); $(".toggle-{{uid}}").css("display", "none"); } else { tlPanels_{{uid}}.reverse(); $(".toggle-{{uid}}").css("display", "block"); setTimeout(() => { document.querySelector(".container-{{uid}}").style = ""; }, 400); } } }

Name	Type	Default Value
Chatbot ID	Text	-
Title	Text	-
Description	Text	-
Welcome Message	Text	-
Message Input Placeholder	Text	-
Icon	Image
Primary Color	Color	rgba(47,103,219,1)
Suggested Questions	Text List	Just browsing! What is Cinema8? Is there a free plan? What are some use cases?
Layout	Select	Default Left Sidebar Right Sidebar

Chatbot

Category