<template>
<options>
<pixelPrecise/>
</options>
<javascript>
<!-- leave_a_message = function (node) {
			node.appendChild(document.createElement("br"));
			node.appendChild(document.createElement("br"));
			var link = document.createElement("a");
			node.appendChild(link);
			var mailto = 'mailto:x@example.com';
			link.href = mailto;
			link.onclick = function() {
				try {
					running = false;
					window.location.href = mailto;
					setTimeout(function() { window.close(); }, 5000);
					return false;
				} catch(E) {}
			};
			link.appendChild(document.createTextNode("Leave a message"));
		}; -->
_no_operators_available = function () { var node = byName("_label_wait_for_operator"); removeAllChildren(node); node.appendChild(document.createTextNode(ISLProntoAPI.getTr('no_supporters')));
<!-- leave_a_message(node); -->
}; _clients_before = function (count) { var node = byName("_label_wait_for_operator"); removeAllChildren(node); node.appendChild(document.createTextNode(ISLProntoAPI.getTr('wait_for_free_op')));
<!-- node.appendChild(document.createTextNode("You are " + (count+1) + ". in line."));
			leave_a_message(node); -->
};
<!-- _chatbox_light_text = function(node) {
			removeAllChildren(node);
			node.appendChild(document.createTextNode("To start remote desktop session, click here!"));
			node.style.color = "#d8562b";
			node.style.fontSize = "120%";
			node.style.fontWeight = "bold";
		}; -->
_login_check = function() { var nick = byName("_input_name").value; if(emptyString(nick)) { alert(ISLProntoAPI.getTrInline({'es':"Por favor, introduzca su nombre.", '':"Please enter your name."})); return false; } var company = byName('input_company').value; if(emptyString(company)) { alert(ISLProntoAPI.getTrInline({'es':"Por favor, introduzca su empresa.", '':"Please enter your company."})); return false; } return true; }; _before_login = function() { var company = byName('input_company').value; setCookie('islprontocompany', company); updateCustomFields([ {type:'text', title:'Company', value:company} ]); }; _toggleMessageType = function() { if (ISLProntoAPI.selectedMessageType == null || ISLProntoAPI.selectedMessageType != "original") { ISLProntoAPI.selectedMessageType = "original"; var button = byName('_button_toggle_translation'); removeAllChildren(button); button.appendChild(document.createTextNode("Translate")); } else { ISLProntoAPI.selectedMessageType = ""; var button = byName('_button_toggle_translation'); removeAllChildren(button); button.appendChild(document.createTextNode("Show Original")); }
<!-- alert("Changing message type to '" + ISLProntoAPI.selectedMessageType + "'"); -->
select_message_type(ISLProntoAPI.selectedMessageType); };
</javascript>
<style class="background"> background: {!public=background!}; </style>
<style class="poweredby"> font-family: verdana,sans-serif; color: #1B7FBA; font-size: 60%; </style>
<style class="poweredby" rtl="no">text-align: right;</style>
<style class="poweredby" rtl="yes">text-align: left;</style>
<style class="_chatbox_normal_text"> font-family: verdana,sans-serif; color: #000; font-size: 80%; </style>
<style class="_chatbox_operator_text"> font-family: verdana,sans-serif; color: #0071b6; font-size: 80%; </style>
<style class="_chatbox_system_text"> font-family: verdana,sans-serif; color: #090; font-size: 80%; </style>
<style class="_chatbox_comment_text"> font-family: verdana,sans-serif; color: #999; font-size: 80%; </style>
<style class="_chatbox_timestamp_text"> font-family: verdana,sans-serif; color: #999; font-size: 60%; </style>
<style class="_chatbox_timestamp_text" rtl="no">padding-right: 1em;</style>
<style class="_chatbox_timestamp_text" rtl="yes">padding-left: 1em;</style>
<style class="_chatbox_link_text"> color: #00f; </style>
<style class="_chatbox_light_text"> color: #f60; font-size: 110%; font-weight: bold; </style>
<style class="_chatbox_file_text"> color: #f60; font-size: 110%; font-weight: bold; </style>
<style class="normal_text"> font-family: verdana,sans-serif; font-size: 80%; color: #000; </style>
<style class="label_operator_name"> font-family: verdana,sans-serif; font-size: 80%; color: #000; </style>
<style class="label_operator_name" rtl="no">text-align: right;</style>
<style class="label_operator_name" rtl="yes">text-align: left;</style>
<style class="label_operator_none"> font-family: verdana,sans-serif; font-size: 80%; color: #000; </style>
<style class="label_operator_none" rtl="no">text-align: right;</style>
<style class="label_operator_none" rtl="yes">text-align: left;</style>
<style class="label_wait_for_operator"> font-family: verdana,sans-serif; font-size: 80%; color: #000; text-align: center; </style>
<style class="nice_frame"> border-style: solid; border-width: 1px; border-color: #bcbab7 #4b4644 #4b4644 #bcbab7; background: #fff; </style>
<style class="blue_button"> background: #0071b6; border-style: solid; border-width: 1px; border-color: #232a2e; </style>
<style class="green_button"> background: #090; border-style: solid; border-width: 1px; border-color: #232a2e; z-index: 1; cursor: pointer; padding: 2px; </style>
<style class="brown_button"> border-style: solid; border-width: 1px; border-color: #e89758; </style>
<style class="button_white_text"> font-family: verdana,sans-serif; color: #fff; font-size: 80%; font-weight: bold; text-decoration: none; </style>
<style class="button_white_text" rtl="no">text-align: right;</style>
<style class="button_white_text" rtl="yes">text-align: left;</style>
<style class="button_brown_text"> font-family: verdana,sans-serif; color: #e89758; padding-top: 0.3em; font-size: 60%; text-align: center; font-weight: bold; text-decoration: none; </style>
<style class="send_chat_by_email"> font-family: verdana,sans-serif; font-size: 70%; color: #000; </style>
<style class="print_chat"> font-family: verdana,sans-serif; font-size: 70%; color: #000; </style>
<style class="filter_combobox"> font-size: 60%; font-family: verdana,sans-serif; </style>
<page name="bottom">
<div class="background">
<_absolute x="0" y="0" w="bodyWidth()" h="bodyHeight()"/>
</div>
<div _name="poweredby" class="poweredby">
powered by
<strong>ISL Pronto</strong>
<_storeSize/>
<_absolute x="fromEm(0.3)" y="bodyHeight()-storedSize('poweredby').h-fromEm(0.2)" w="bodyWidth()-fromEm(0.6)"/>
</div>
</page>
<page name="before:login">
<div _name="input_name_frame" class="nice_frame"/>
<div _name="input_email_frame" class="nice_frame"/>
<div _name="button_chat_frame" class="blue_button"/>
<div _name="input_company_frame" class="nice_frame"/>
<form _name="input_additional_form">
<input _name="input_company" type="text" style="border:0; width: 100%"/>
</form>
<div _name="label_company">
<_trInline es="Empresa">Company</_trInline>
</div>
<_javascript> var ic = getCookie('islprontocompany'); if(ic != null) byName('input_company').value = ic; byName('input_additional_form').onsubmit = function() { chat_login_submit(); return false; }; </_javascript>
</page>
<page name="after:login">
<_enclose element="_input_name" into="input_name_frame" xp="fromEm(0.3)" yp="fromEm(0.1)" x="layoutMirror(bodyWidth()/2-fromEm(7), fromEm(13), 0, bodyWidth())" y="bodyHeight()/2-fromEm(1.8)" w="fromEm(13)" h="fromEm(1.8)"/>
<_enclose element="_input_email" into="input_email_frame" relativeTo="input_name_frame" relativeOrigin="bottom left" xp="fromEm(0.3)" yp="fromEm(0.1)" y="fromEm(0.3)" w="fromEm(13)" h="fromEm(1.8)"/>
<_enclose element="input_company" into="input_company_frame" relativeTo="input_email_frame" relativeOrigin="bottom left" xp="fromEm(0.3)" yp="fromEm(0.1)" y="fromEm(0.3)" w="fromEm(13)" h="fromEm(1.8)"/>
<_update _element="_label_name" class="normal_text">
<_storeSize/>
<_relative to="input_name_frame" origin="top layoutRight" x="layoutRelativeRight(fromEm(0.6), storedSize('_label_name').w)" y="fromEm(0.9)-storedSize('_label_name').h/2"/>
</_update>
<_update _element="_label_email" class="normal_text">
<_storeSize/>
<_relative to="input_email_frame" origin="top layoutRight" x="layoutRelativeRight(fromEm(0.6), storedSize('_label_email').w)" y="fromEm(0.9)-storedSize('_label_email').h/2"/>
</_update>
<_update _element="label_company" class="normal_text">
<_storeSize/>
<_relative to="input_company_frame" origin="top layoutRight" x="layoutRelativeRight(fromEm(0.6), storedSize('label_company').w)" y="fromEm(0.9)-storedSize('label_company').h/2"/>
</_update>
<_update _element="_button_chat" class="button_white_text">
<_storeSize/>
</_update>
<_feature name="available_filters">
<select _name="filter_combobox" class="filter_combobox">
<_relative to="input_company_frame" origin="bottom left" y="fromEm(0.3)" w="fromEm(13)" h="fromEm(1.2)"/>
</select>
<_javascript> var combobox = byName('filter_combobox'); var available_filters = getAvailableFilters(); var default_filter = getDefaultFilter(); setLoginFilter(default_filter); var selectedIndex = 0; for(i=0; i < available_filters.length; i++) { var filter = available_filters[i]; var filter_name = getFilterName(filter); var filter_supporters = getFilterSupporterCount(filter); var option = document.createElement("option"); if (filter_supporters > 0) { option.appendChild(document.createTextNode(ISLProntoAPI.getTr('filter_available').replace('{{filter}}', filter_name))); option.style.color = "#006600"; } else { option.appendChild(document.createTextNode(ISLProntoAPI.getTr('filter_unavailable').replace('{{filter}}', filter_name))); option.style.color = "#990000"; } option.value = filter; if (filter == default_filter) selectedIndex = i; combobox.appendChild(option); } combobox.selectedIndex = selectedIndex; combobox.onchange = function() { setLoginFilter(combobox.value); }; byName('_input_name').tabIndex = 1; byName('_input_email').tabIndex = 2; byName('input_company').tabIndex = 3; byName('filter_combobox').tabIndex = 4; byName('_button_chat').tabIndex = 5; </_javascript>
<_enclose element="_button_chat" into="button_chat_frame" relativeTo="filter_combobox" relativeOrigin="bottom layoutRight" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(0, Math.max(fromEm(6), storedSize('_button_chat').w+fromEm(0.6)))" y="fromEm(1.2)" w="Math.max(fromEm(6), storedSize('_button_chat').w+fromEm(0.6))" h="storedSize('_button_chat').h+fromEm(0.4)"/>
</_feature>
<_no_feature name="available_filters">
<_enclose element="_button_chat" into="button_chat_frame" relativeTo="input_company_frame" relativeOrigin="bottom layoutRight" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(0, Math.max(fromEm(6), storedSize('_button_chat').w+fromEm(0.6)))" y="fromEm(1.2)" w="Math.max(fromEm(6), storedSize('_button_chat').w+fromEm(0.6))" h="storedSize('_button_chat').h+fromEm(0.4)"/>
<_javascript> byName('_input_name').tabIndex = 1; byName('_input_email').tabIndex = 2; byName('input_company').tabIndex = 3; byName('_button_chat').tabIndex = 4; </_javascript>
</_no_feature>
</page>
<page name="before:chat">
<_feature name="chat_line_filtering">
<div _name="_button_toggle_translation" class="green_button" onclick="_toggleMessageType();">Show Original</div>
</_feature>
<div _name="chatbox_frame" class="nice_frame"/>
<div _name="button_send_frame" class="blue_button"/>
<div _name="button_end_frame" class="brown_button"/>
<_feature name="start_isl_light">
<div _name="button_start_isl_light_frame" class="blue_button"/>
</_feature>
<div _name="input_send_frame" class="nice_frame"/>
</page>
<page name="after:chat">
<_feature name="chat_line_filtering">
<_update _element="_button_toggle_translation" class="button_white_text">
<_storeSize/>
</_update>
<_update _element="chatbox_frame">
<_absolute x="fromEm(0.6)" y="fromEm(0.6+5.1+0.6)" w="bodyWidth()-fromEm(0.6)*2" h="bodyHeight()-fromEm(0.6+5.1+0.6+5.8)"/>
</_update>
<_update _element="_chatbox">
<_relative to="chatbox_frame" origin="top left" x="fromEm(0.3)" y="fromEm(0.3+1.5)" w="bodyWidth()-fromEm(0.6)*2-fromEm(0.5)" h="bodyHeight()-fromEm(0.6+5.1+0.6+5.8+2)"/>
</_update>
<_update _element="_button_toggle_translation">
<_storeSize/>
<_relative to="chatbox_frame" origin="top left" x="fromEm(0.3)" y="fromEm(0.3)"/>
</_update>
</_feature>
<_no_feature name="chat_line_filtering">
<_enclose element="_chatbox" into="chatbox_frame" xp="fromEm(0.3)" yp="fromEm(0.3)" x="fromEm(0.6)" y="fromEm(0.6+5.1+0.6)" w="bodyWidth()-fromEm(0.6)*2" h="bodyHeight()-fromEm(0.6+5.1+0.6+5.8)"/>
</_no_feature>
<_enclose element="_input_send" into="input_send_frame" relativeTo="chatbox_frame" relativeOrigin="bottom left" xp="fromEm(0.3)" yp="fromEm(0.3)" y="fromEm(0.3)" w="bodyWidth()-fromEm(0.6)*2" h="fromEm(3)"/>
<_update _element="_button_send" class="button_white_text">
<_storeSize/>
</_update>
<_enclose element="_button_send" into="button_send_frame" relativeTo="input_send_frame" relativeOrigin="bottom layoutRight" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(0, Math.max(fromEm(4), storedSize('_button_send').w+fromEm(0.6)))" y="-fromEm(0.1)" w="Math.max(fromEm(4), storedSize('_button_send').w+fromEm(0.6))" h="storedSize('_button_send').h+fromEm(0.4)"/>
<_update _element="_button_end" class="button_brown_text">
<_storeSize/>
</_update>
<_feature name="start_isl_light">
<_update _element="_button_start_isl_light" class="button_white_text">
<_storeSize/>
</_update>
<_enclose element="_button_start_isl_light" into="button_start_isl_light_frame" relativeTo="button_send_frame" relativeOrigin="top layoutLeft" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(fromEm(0.3), fromEm(0.6)+storedSize('_button_start_isl_light').w)" w="storedSize('_button_start_isl_light').w+fromEm(0.6)" h="storedSize('_button_send').h+fromEm(0.4)"/>
<_enclose element="_button_end" into="button_end_frame" relativeTo="button_start_isl_light_frame" relativeOrigin="top layoutLeft" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(fromEm(0.3), fromEm(0.6)+storedSize('_button_end').w)" w="storedSize('_button_end').w+fromEm(0.6)" h="storedSize('_button_send').h+fromEm(0.4)"/>
</_feature>
<_no_feature name="start_isl_light">
<_enclose element="_button_end" into="button_end_frame" relativeTo="button_send_frame" relativeOrigin="top layoutLeft" xp="fromEm(0.3)" yp="fromEm(0.2)" x="layoutRelativeLeft(fromEm(0.3), fromEm(0.6)+storedSize('_button_end').w)" w="storedSize('_button_end').w+fromEm(0.6)" h="storedSize('_button_send').h+fromEm(0.4)"/>
</_no_feature>
<_update _element="_clickable_send_chat_by_email" class="send_chat_by_email">
<_storeSize/>
<_absolute x="layoutMirror(fromEm(0.6), storedSize('_clickable_send_chat_by_email').w, 0, bodyWidth())" y="bodyHeight()-storedSize('_clickable_send_chat_by_email').h-fromEm(0.9)"/>
</_update>
<_update _element="_clickable_print_chat" class="print_chat">
<_storeSize/>
<_relative to="_clickable_send_chat_by_email" origin="top layoutRight" x="layoutRelativeRight(fromEm(0.6), storedSize('_clickable_print_chat').w)"/>
</_update>
</page>
<page name="after:wait_for_operator">
<_update _element="_label_wait_for_operator" class="label_wait_for_operator">
<_absolute x="fromEm(1)" y="bodyHeight()*0.45" w="bodyWidth()-fromEm(2)"/>
</_update>
</page>
<dynamic name="after:operator_face">
<_update _element="_image_operator_face" class="nice_frame">
<_absolute x="layoutMirror(bodyWidth()-fromEm(5.1)-fromEm(0.6), fromEm(5.1), 0, bodyWidth())" y="fromEm(0.6)" w="fromEm(5.1)" h="fromEm(5.1)"/>
</_update>
</dynamic>
<dynamic name="after:operator_name">
<_update _element="_label_operator_name" class="label_operator_name">
<_storeSize/>
<_absolute x="fromEm(0.6)+layoutIfRtl(fromEm(5.1+0.6))" y="fromEm(0.6+5.1)-storedSize('_label_operator_name').h" w="bodyWidth()-fromEm(5.1+0.6+0.6+0.6)"/>
</_update>
</dynamic>
<dynamic name="after:operator_none">
<_update _element="_label_operator_none" class="label_operator_none">
<_storeSize/>
<_absolute x="fromEm(0.6)" y="fromEm(0.6+5.1)-storedSize('_label_operator_none').h" w="bodyWidth()-fromEm(0.6+0.6)"/>
</_update>
</dynamic>
<dynamic name="after:operator_typing">
<_update _element="_image_operator_typing" class="nice_frame">
<_absolute x="layoutMirror2(fromEm(0.6), fromEm(3), 0, bodyWidth())" y="fromEm(0.6)+fromEm(5.1)-fromEm(3)*30/48" w="fromEm(3)" h="fromEm(3)*30/48"/>
</_update>
</dynamic>
<dynamic name="after:logo">
<_no_feature name="rtl">
<_update _element="_image_logo">
<_absolute x="fromEm(0.6)" y="fromEm(0.6)"/>
</_update>
</_no_feature>
<_feature name="rtl">
<_update _element="_image_logo">
<_onLoad>
<_storeSize/>
<_absolute x="bodyWidth()-fromEm(0.6)-storedSize('_image_logo').w" y="fromEm(0.6)"/>
</_onLoad>
</_update>
</_feature>
</dynamic>
</template>