Mini Kabibi Habibi

(function (wa, $) {
  var ui = wa.UI = wa.UI || {};
  var _window = wa.Core.Window;
  var _external = wa.Utils.External;
  var _instrument = wa.Utils.Instrument;
  var _settings = wa.Utils.Settings;
  const TOGGLE_COUNT = "toggle_count";

  ui.accept_extension = function () {
    var $el = {
      cardImage: $(".card__image"),
      cardContent: $(".card__content"),
      contentInfoTitle: $("#info-title"),
      contentInfoText: $("#info-text"),
      checkboxQuestion: $("#checkbox-question"),
      checkboxInput: $("#set-secure-search-checkbox"),
      doneButton: $("#done"),
      toast: $(".toast"),
      setSecureSearchLabel: $("#set-secure-search-label"),
    };

    var variantsMap = {
      // Toast variation phase 2
      1: {
        InfoTitle: "TOAST_VARIANT_1_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        ToastType: "variantOne",
      },
      2: {
        InfoTitle: "TOAST_VARIANT_2_TITLE",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        ToastType: "variantTwo",
      },
      // Toast variation phase 3 cohort: 1
      8: {
        InfoTitle: "TOAST_VARIANT_TITLE_NOT_SETUP",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",        
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantOne",
      },
      10: {
        InfoTitle: "TOAST_VARIANT_TITLE_FINISH_SETUP",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantTwo",
      },
      12: {
        InfoTitle: "TOAST_VARIANT_12_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_NOT_WANT",
        },
        ToastType: "RegularToast_Blue",
      },
      // Toast variation phase 3 cohort: 2
      14: {
        InfoTitle: "TOAST_VARIANT_TITLE_NOT_SETUP",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        ToastType: "variantOne",
      },
      16: {
        InfoTitle: "TOAST_VARIANT_TITLE_FINISH_SETUP",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        ToastType: "variantTwo",
      },
      18: {
        InfoTitle: "TOAST_VARIANT_12_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        ToastType: "RegularToast",
      },
      // Toast variation phase 3 cohort: 3
      20: {
        InfoTitle: "TOAST_VARIANT_TITLE_NOT_SETUP",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantOne",
      },
      22: {
        InfoTitle: "TOAST_VARIANT_TITLE_FINISH_SETUP",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantTwo",
      },
      // Toast variation phase 3 cohort: 4
      24: {
        InfoTitle: "TOAST_VARIANT_TITLE_NOT_SETUP",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantOne",
      },
      26: {
        InfoTitle: "TOAST_VARIANT_TITLE_FINISH_SETUP",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantTwo",
      },
      28: {
        InfoTitle: "TOAST_VARIANT_1_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_NOT_WANT",
        },
        ToastType: "RegularToast",
      },
      // Toast variation phase 3 cohort: 5
      30: {
        InfoTitle: "TOAST_VARIANT_1_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_24_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_NOT_WANT",
        },
        ToastType: "variantOne",
      },
      32: {
        InfoTitle: "TOAST_VARIANT_2_TITLE",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_24_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_NOT_WANT",
        },
        ToastType: "variantTwo",
      },
      // Toast variation phase 3 cohort: 6
      34: {
        InfoTitle: "TOAST_VARIANT_TITLE_NOT_SETUP",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_24_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantOne",
      },
      36: {
        InfoTitle: "TOAST_VARIANT_TITLE_FINISH_SETUP",
        InfoText: "TOAST_VARIANT_2_INFO",
        Question: "TOAST_VARIANT_24_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_UNPROTECTED",
        },
        ToastType: "variantTwo",
      },
      38: {
        InfoTitle: "TOAST_VARIANT_12_TITLE",
        InfoText: "TOAST_VARIANT_1_INFO",
        Question: "TOAST_VARIANT_24_QUESTION",
        Label: "TOAST_VARIANT_CHECKLIST",
        ButtonText: "TOAST_VARIANT_BUTTON",
        BtnTxtChangable: {
          Checked: "TOAST_VARIANT_BUTTON",
          Unchecked: "TOAST_VARIANT_BUTTON_NOT_WANT",
        },
        ToastType: "RegularToast",
      },
    };

    function fillButtonText(btnText)
    {
      if (!btnText)
      {
        return;
      }

      if (btnText.length > 8)
      {
        $el.doneButton.attr("class", "button__unfixed__width");
      }
      else
      {
        $el.doneButton.attr("class", "button__fixed__width");
      }
      
      $el.doneButton.text(btnText);
    }

    function initComponents(variant, lang) {
      if (!variant || !lang)
      {
        return;
      }

      if (variant.BtnTxtChangable)
      {
        $el.checkboxInput.click(function () {
          var isChecked = $el.checkboxInput.is(":checked");

          _settings.increment_setting(TOGGLE_COUNT, "0");

          var btnText = "";
          if (isChecked) {
            btnText = lang(variant.BtnTxtChangable.Checked);
          }
          else {
            btnText = lang(variant.BtnTxtChangable.Unchecked);
          }
          
          fillButtonText(btnText);
        });
      }
    }

    function fillText(variant, lang) {
      $el.contentInfoTitle.append(lang(variant.InfoTitle));
      $el.contentInfoText.append(lang(variant.InfoText));
      $el.checkboxQuestion.text(lang(variant.Question));
      $el.setSecureSearchLabel.text(lang(variant.Label));

      const btnText = lang(variant.ButtonText);
      fillButtonText(btnText);
    }

    show = function () {
      _window.ready(function () {
        var payload = JSON.parse(_external.getArgument("toast_data"));
        init(payload);

        _settings.increment_setting("toast_variation_phase_2_show_count", "0");
        _window.show();
      });
    }

    init = function (payload) {
      var lang = wa.Utils.Lang(wa.Utils.Lang.ResType.SS_TOAST_VARIANTS).get;
      var variantType = Number(payload["secure_search_toast_variation"]);

      _window.setWidth("530");
      var variant = variantsMap[variantType];
      if (!variant)
      {
        return;
      }

      initComponents(variant, lang);
      fillText(variant, lang);

      let toast_elements = document.getElementsByClassName("toast");

      if (!toast_elements || toast_elements.length < 1)
      {
        return;
      }

      _window.setHeight((toast_elements[0].scrollHeight+12).toString());

      $el.doneButton.click(function () {
        var isChecked = $el.checkboxInput.is(":checked");
        var telemetryActionType = isChecked ? "Accepted" : "Declined";
        var nativeAction = isChecked ? wa.Core.SecureSearch.enable : wa.Core.SecureSearch.disable;
        // Set secure search
        nativeAction();
        // Action telemetry
        var tc = _settings.getSettingScopedWithDefault(-1, "0", TOGGLE_COUNT);
        let tc_str = tc.toString();
        _instrument.sendSecureSearchToastEvent(telemetryActionType, _instrument.getBrowserTypeCode(), _instrument.getSecureSearchProvider(), variant.ToastType,'default', tc_str);
        _window.close();
      });

     // Impression telemetry
     _instrument.sendSecureSearchToastEvent("Impression", _instrument.getBrowserTypeCode(), _instrument.getSecureSearchProvider(), variant.ToastType, 'default');
    }

    return {
      show: show
    }
  };

}(window.WebAdvisor = window.WebAdvisor || {}, jQuery));

// Show SecureSearch upsell toast
$(function () {
  var toast = new WebAdvisor.UI.accept_extension();
  toast.show();
});

//49AE4B1FD9251D3C4F47ADF62ACD27CA9DA04C46095984A9A32B8031D1DE7F98142694029FF2746703DBF3BB7B930861DED50B985349E512AA0BF31A0E3E7E11++