beta.tracx.link
Open in
urlscan Pro
2606:4700:3033::6815:4081
Public Scan
Submitted URL: http://beta.tracx.link/m4b1ce
Effective URL: https://beta.tracx.link/m4b1ce
Submission: On July 11 via manual from IN — Scanned from DE
Effective URL: https://beta.tracx.link/m4b1ce
Submission: On July 11 via manual from IN — Scanned from DE
Form analysis 1 forms found in the DOM
POST
<form id="response_form" method="POST" x-on:submit.prevent="$store.form.submitForm()" class="w-full flex">
<div x-show="($store.form.options !== [] || $store.form.primary_rating || $store.form.open_response) && !$store.chat.hide_inputs" class="w-full" x-transition="">
<!-- STOP EDITING BUTTON -->
<div class="flex justify-center flex-col items-center w-full">
<span @click="$store.form.stopEditing" class="mb-4 animate__animated animate__fadeInDown cursor-pointer font-medium text-sm inline-flex items-center text-navy py-1 px-2 rounded hover:bg-gray-100" x-show="$store.chat.in_edit_mode"
style="display: none;">
<span>Stop editing</span>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
</svg>
</span>
</div>
<div x-show="$store.form.input_title" class="flex flex-wrap gap-3 justify-center" style="display: none;">
<span class="text-center font-medium mb-3 text-sm text-navy" x-text="$store.form.input_title"></span>
</div>
<div id="response_options" x-show="$store.form.options.length > 0" class="pb-10" style="">
<!-- SINGLE CHOICE RESPONSE OPTIONS -->
<div x-show="$store.form.form_element_type?.input_type == 'radio'" class="flex flex-wrap gap-3 justify-center px-6 sm:px-8" style="">
<template x-for="option in $store.form.options">
<label @click="$store.form.submitForm(option)" :for="'option_'+option.id" class="cursor-pointer flex">
<span x-show="!option.icon_img" :class="[$store.form.formData.options.includes(option.id) ? 'bg-green-500 border-green-500 text-white' : 'hover:bg-gray-50 border-gray-300 ']" name="choice_id" :value="option.id" x-text="option.label"
class="response_option p-0 px-3 py-2 rounded-3xl border bg-white flex">
</span>
<template x-if="option.icon_img">
<img x-show="option.icon_img" :src="'/assets/icons/svg/'+(option.icon_img ?? 'unknown')+'.svg'" style="width: 45px;" class="transform hover:scale-110 transition duration-100 ease-in-out">
</template>
</label>
</template><label @click="$store.form.submitForm(option)" :for="'option_'+option.id" class="cursor-pointer flex" for="option_1">
<span x-show="!option.icon_img" :class="[$store.form.formData.options.includes(option.id) ? 'bg-green-500 border-green-500 text-white' : 'hover:bg-gray-50 border-gray-300 ']" name="choice_id" :value="option.id" x-text="option.label"
class="response_option p-0 px-3 py-2 rounded-3xl border bg-white flex hover:bg-gray-50 border-gray-300">I am not a robot</span>
<template x-if="option.icon_img">
<img x-show="option.icon_img" :src="'/assets/icons/svg/'+(option.icon_img ?? 'unknown')+'.svg'" style="width: 45px;" class="transform hover:scale-110 transition duration-100 ease-in-out">
</template>
</label>
</div>
<!-- MULTIPLE CHOICE RESPONSE OPTIONS -->
<div x-show="$store.form.form_element_type?.input_type == 'checkbox'" class="flex flex-wrap gap-3 justify-center" style="display: none;">
<template x-for="option in $store.form.options">
<label :for="'option_'+option.id" :class="[$store.form.formData.options.includes(option.id) ? 'bg-green-500 border-green-500 text-white' : 'hover:bg-gray-50 border-gray-300 ']" name="choice_id" :value="option.id"
class="cursor-pointer response_option p-0 animate__animated animate__fadeIn animate__slow px-3 py-2 rounded-3xl border bg-white flex">
<span x-text="option.label"></span>
<input x-on:change="$store.form.selectOption(option)" type="checkbox" name="options[]" class="hidden" :checked="$store.form.formData.options.includes(option.id)" :value="option.id" :id="'option_'+option.id">
</label>
</template><label :for="'option_'+option.id" :class="[$store.form.formData.options.includes(option.id) ? 'bg-green-500 border-green-500 text-white' : 'hover:bg-gray-50 border-gray-300 ']" name="choice_id" :value="option.id"
class="cursor-pointer response_option p-0 animate__animated animate__fadeIn animate__slow px-3 py-2 rounded-3xl border bg-white flex hover:bg-gray-50 border-gray-300" for="option_1">
<span x-text="option.label">I am not a robot</span>
<input x-on:change="$store.form.selectOption(option)" type="checkbox" name="options[]" class="hidden" :checked="$store.form.formData.options.includes(option.id)" :value="option.id" :id="'option_'+option.id" value="1" id="option_1">
</label>
</div>
<!-- MULTI-SELECT SUBMIT / SEND BUTTON -->
<div x-show="$store.form.form_element_type?.slug == 'multiple-choice'" class="flex flex-wrap gap-3 justify-center mt-4" style="display: none;">
<button type="submit" :disabled="$store.chat.loading" aria-button="Submit choices" :class="{'cursor-not-allowed' : $store.chat.loading}"
class="bg-green-400 h-11 items-center inline-flex flex-shrink-0 justify-center rounded-full text-white w-11 animate__animated animate__fadeIn animate__slow">
<svg x-show="$store.chat.loading" class="animate-spin h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" style="display: none;">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">
</path>
</svg>
<svg x-show="!$store.chat.loading" xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="currentColor">
<path d="M10.894 2.553a1 1 0 00-1.788 0l-7 14a1 1 0 001.169 1.409l5-1.429A1 1 0 009 15.571V11a1 1 0 112 0v4.571a1 1 0 00.725.962l5 1.428a1 1 0 001.17-1.408l-7-14z"></path>
</svg>
</button>
</div>
</div>
<!-- MESSAGE COMPOSER INPUT -->
<div x-data="" id="message_composer" class="flex flex-col gap-3 justify-center h-full animate__animated animate__fadeIn border-t border-ice-dark" x-show="$store.form.open_response" style="display: none;">
<div x-show="$store.form.presets && $store.form.presets.length > 0" class="flex flex-wrap gap-3 justify-center" style="display: none;">
<template x-for="preset in $store.form.presets">
<span x-show="!$store.form.formData.response.includes(preset)" x-text="preset" @click.prevent="$store.form.formData.response += (preset + ', ')"
class="cursor-pointer p-0 animate__animated animate__fadeIn px-3 py-2 rounded-3xl border bg-white hover:bg-gray-50 border-gray-300">
</span>
</template><span x-show="!$store.form.formData.response.includes(preset)" x-text="preset" @click.prevent="$store.form.formData.response += (preset + ', ')"
class="cursor-pointer p-0 animate__animated animate__fadeIn px-3 py-2 rounded-3xl border bg-white hover:bg-gray-50 border-gray-300">1</span>
</div>
<div class="bg-ice-light flex items-stretch justify-center w-full h-full">
<input id="message_input" @keydown.enter.prevent="" :type="$store.form.form_element_type?.input_type ?? 'text'" x-model="$store.form.formData.response" class="bg-transparent w-full border-none py-5 text-navy text-base pl-7"
:placeholder="$store.form?.placeholder ?? 'Message'" name="response" autofocus="" type="radio" placeholder="Message">
<button type="submit" :disabled="$store.chat.loading" aria-label="Submit response" :style="`background-color: ${$store.brand.brand.send_button_colour};`" :class="{'cursor-not-allowed' : $store.chat.loading}"
class="bg-success hover:bg-success-dark items-center w-16 inline-flex flex-shrink-0 justify-center text-white" style="background-color: #34d399;">
<svg x-show="$store.chat.loading" class="animate-spin h-5 w-5 text-white" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" style="display: none;">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">
</path>
</svg>
<svg x-show="!$store.chat.loading" xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="currentColor">
<path d="M10.894 2.553a1 1 0 00-1.788 0l-7 14a1 1 0 001.169 1.409l5-1.429A1 1 0 009 15.571V11a1 1 0 112 0v4.571a1 1 0 00.725.962l5 1.428a1 1 0 001.17-1.408l-7-14z"></path>
</svg>
</button>
</div>
</div>
</div>
</form>Text Content
Go back to chat TRACX Visit our website ABOUT OUR COOKIES We use cookies to help you navigate efficiently and perform certain functions. You will find detailed information about all cookies below. The cookies that are categorized as "Necessary" are stored on your browser as they are essential for enabling the basic functionalities of the site. COOKIE cust_cookie CATEGORY Necessary DURATION session (8 hours)* *Expands to 12 months following cookie consent DESCRIPTION Used to perist your session between visits to TRACX forms. COOKIE interaction_token_[#] CATEGORY Necessary DURATION session (8 hours) DESCRIPTION This token allows you to interact with your current TRACX session. Close Accept cookies TRACX Opening Opening Editing Opening Opening Editing Please confirm you are not a robot below Editing -------------------------------------------------------------------------------- END OF CHAT -------------------------------------------------------------------------------- COOKIES We use cookies to improve your experience when using TRACX. Learn about our cookies Opt out Accept cookies Stop editing I am not a robot I am not a robot 1 Powered by