/***************************************
  In order to carry out this simple A/B test 
  based on your Hackle workspace you will
  need to edit the SDK key and experiment key values below.
  The event key does not have to be modified.
***************************************/
// SDK key
HACKLE_SDK_KEY = "0wXYq7fkt1wnthsG5kmO2c3SKAI98PIh";
// Experiment Key
const experimentKey = 9;
// Event Key
const eventKey = "hackle_test_event_key";

/***************************************
  Do not modify! - Hackle SDK Integration
***************************************/
!function(e,t){var n,a=3e3,c=!1,l=[];function r(){}r.prototype.onReady=function(e,t){var n={block:e,timeout:t};l.push(n)},r.prototype.setUserId=function(e){n=e},e.Hackle=e.Hackle||new r,e.hackleClient=e.hackleClient||new r;var o=setInterval(function(){if(c){clearInterval(o);for(var t=0;t<l.length;t++)
  e.hackleClient.onReady(l[t].block,l[t].timeout);l.length=0}(a-=50)<0&&clearInterval(o)},50),i=t.createElement("script");i.type="text/javascript",i.crossOrigin="anonymous",i.src="https://cdn.jsdelivr.net/npm/@hackler/js-client-sdk@2.0.0/lib/umd/hackle-js-client-sdk.min.js",
  i.async=!0;var s=t.getElementsByTagName("script")[0];s.parentNode.insertBefore(i,s),i.onload=function(){c=!0,e.Hackle=Hackle,n&&Hackle.setUserId(n),e.hackleClient=Hackle.createInstance(HACKLE_SDK_KEY)},i.onerror=function(){clearInterval(o)}}(window,document);

/********************************
  Function called when the "distribute traffic" button is clicked
********************************/
function FuncHackleSdk() {
  // Get the inputted User ID
  var userId = document.getElementById("uname").value;
  
  // Warning window displayed when there is no User ID inputted
  if (userId == "") {
    alert("Please enter your USER ID.");
    return;
  }
  
  // Change to a format suitable for SDK transfer
  var user = { id: userId };
  
  /*********************************
    SDK Function 1. Traffic distribution
  **********************************/
  const decision = hackleClient.variationDetail(experimentKey, user);
  const variation = decision.variation;
  const reason = decision.reason;
  
  // Different results are shown depending on distribution results
  if (variation.toString() == "A") {
    // Screen,function or logic to show to users in test group A
    document.getElementById("bgcolor").style.backgroundColor = "#FFCCFF";
    document.getElementById("result").innerHTML = "The traffic distribution result of " + userId + " is <font color=\"red\">the control group (test group A)</font>.";
    document.getElementById("reason").innerText = "* Reason for Distribution: " + reason;
  }
  else if (variation.toString() == "B") {
    // Screen,function or logic to show to users in test group B
    document.getElementById("bgcolor").style.backgroundColor = "#99CCFF";
    document.getElementById("result").innerHTML = "The traffic distribution result of " + userId + " is <font color=\"blue\">the experimental group (test group B)</font>.";
    document.getElementById("reason").innerText = "* Reason for Distribution: " + reason;
  }
  else {
    // When there is an error in the traffic distribution result
    document.getElementById("result").innerHTML = "An error occurred while distributing the traffic into test groups.";
  }
  
  /**********************************
     SDK Function 2. Send user events
  **********************************/
  hackleClient.track(eventKey, user);
  alert("User event sent.\neventKey = " + eventKey);
}