ordersprinter/webapp/preferences.html

496 lines
22 KiB
HTML

<html>
<head>
<title>Ansicht persönliche Einstellungen</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="author" content="Stefan Pichel">
<link rel="stylesheet" type="text/css" href="css/bestformat.css?v=1.1.12">
<link rel="stylesheet" href="php/3rdparty/orderstyle/orderstyle.min.css" />
<link rel="stylesheet" href="php/3rdparty/orderstyle/jquery.mobile.icons.min.css" />
<link rel="stylesheet" href="php/3rdparty/jquery.mobile-1.4.0.min.css" type="text/css" />
<script src="php/3rdparty/jquery-1.11.3.min.js"></script>
<script src="php/3rdparty/jquery.mobile-1.4.5.min.js"></script>
<script src="utilities.js"></script>
</head>
<body>
<script>
var PREF_HEADER = ["Persönliche Einstellungen für ","User specific settings for ","Propriedades para usario "];
var PREF_PASSWORD = ["Passwort","Password","Contraseña"];
var PREF_OLD_PASSWORD = ["Altes Passwort:","Old password:","Contraseña obsoleta:"];
var PREF_NEW_PASSWORD = ["Neues Passwort:","New password:","Contraseña nueva:"];
var PREF_LANGUAGE = ["Sprache","Language","Idioma"];
var PREF_ORDERTON = ["Orderton","Order sound","Sonido de la orden"];
var PREF_CHANGE_PASSWD = ["Passwort ändern","Change password","Cambiar contraseña"];
var PREF_WRONG_OLDASS = ["Das Passwort konnte nicht geändert werden. Bitte prüfen Sie, ob das alte Passwort korrekt eingegeben wurde.",
"The password could not be changed. Please verify that the old password was entered correctly.",
"No se puede cambiar la contraseña. Has enterado corectamente la contraseña vieja?"];
var PREF_PASS_CHANGED = ["Das Passwort wurde geändert.","Password changed.","La contraseña esta cambiado."];
var PREF_VOL = ["Lautstärke:", "Volume:", "Volumen:"];
var PREF_RECEIPT_PRINTER = ["Bondrucker","Receipt printer","Impresora de tique"];
var PREF_PRINTER_HEAD = ["Kassendrucker","Paydesk printer","Impresora de tique"];
var PREF_PRINTER_DETAILS = ["Die Auswahl des Bondruckers wirkt sich nur bei Server-Print aus.","The selection of the receipt printers is only relevant for server print.","La selección de la impresora solo sirve para 'server print'"];
var PREF_SIZE_SMALL = ["klein","small","pequeño"];
var PREF_SIZE_MIDDLE = ["mittel","middle","medio"];
var PREF_SIZE_BIG = ["groß","big","grande"];
var PREF_ROOM_BTN_SIZE = ["Raumauswahl","Room selection","Selección de espacio"];
var PREF_TABLE_BTN_SIZE = ["Tischauswahl","Table selection","Selección de mesas"];
var PREF_PROD_BTN_SIZE = ["Produktauswahl","Product selection","Selección de productos"];
var PREF_BTN_SIZE_TXT = ["Buttongrößen","Button sizes","Tamaño de los botones"];
var PREF_TM = ["Tischauswahl bevorzugt","Prefer table selection","Prerefir selección de mesas"];
var PREF_TM_GR = ["Grafische Tischkarte","Tablemap as image","Mapa de cartas"];
var PREF_TM_TEXT = ["Text-Buttons","Text buttons","botones con textos"];
var PREF_KTL_TITEL = ["Navigation in der Bestellansicht","Order Navigation","Navigacion de ordenar"];
var PREF_KTL = ["Bestellnavigation","Order Navigation","Navigacion de ordenar"];
var PREF_KTL_KEEP = ["Produktkategorie beibehalten","Keep on product type level","No cambiar categoría"];
var PREF_KTL_GO_HIGH = ["-> oberste Produkthierarchie","-> top product hierarchy","-> empezar ariba"];
var PREF_KTL_DESC = ["Soll in der Bestellansicht nach Auswahl eines Produktes wieder an den Anfang der Produkthierarchie gesprungen werden?",
"Do you prefer to jump to the top of the product hierachy after selecting a product in the waiter view?",
"Donde quiere Usted empezar después de seleccion de un producto?"];
var PREF_APPLY_EXTRA_POS = ["Position Extras-Anwenden-Button","Position apply extras button","Posicion aplicar boton extras"];
var PREF_APPLY_EXTRAS_OPTION_TOP = ["Listenanfang","Start of list","Al inicio de la lista"];
var PREF_APPLY_EXTRAS_OPTION_BOTTOM = ["Listenende","End of list","Al final de la lista"];
var PREF_APPLY_EXTRAS_OPTION_BOTH = ["Listenanfang und -ende","Start and end of list","Al inicio y final de la lista"];
var l=0;
function doAjaxPasswordChange(oldPass,newPass,errorMsg) {
var data = {
oldPass: oldPass,
newPass: newPass
};
doAjax("POST","php/contenthandler.php?module=admin&command=changeOwnPassword",data,changePassword,"Passwortproblem");
}
function getGeneralConfigItems() {
doAjax("GET", "php/contenthandler.php?module=admin&command=getGeneralConfigItems", null, insertGeneralConfigItems, "Fehler Konfigurationsdaten");
}
function insertGeneralConfigItems(configResult) {
if (configResult.status == "OK") {
var values = configResult.msg;
$("#pref-page").data("receiptprinter",values.receiptprinter);
$("#pref-page").data("userlanguage",values.userlanguage);
setLanguage(values.userlanguage);
} else {
setTimeout(function(){document.location.href = "index.html"},250); // not logged in
//alert("Fehler beim Aufruf der Seite: " + configResult.msg);
}
}
function createLanguagePart(language) {
var html = '<div class="ui-field-contain">';
html += '<label for="language">' + PREF_LANGUAGE[language] + ':</label>';
html += '<select name="language" id="language" data-theme="e">';
if (language == '0') {
html += '<option value="0" selected>Deutsch</option>';
html += '<option value="1">English</option>';
html += '<option value="2">Español</option>';
} else if (language == '1'){
html += '<option value="0">Deutsch</option>';
html += '<option value="1" selected>English</option>';
html += '<option value="2">Español</option>';
} else {
html += '<option value="0">Deutsch</option>';
html += '<option value="1">English</option>';
html += '<option value="2" selected>Español</option>';
}
html += '</select></div>';
return html;
}
function isSelected(currentIndex,searchIndex) {
if (currentIndex == searchIndex) {
return " selected";
} else {
return "";
}
}
function createReceiptPrinterPart(language) {
var printer = $("#pref-page").data("receiptprinter");
var html = PREF_PRINTER_DETAILS[language] + '<br><div class="ui-field-contain">';
html += '<label for="receiptprinter">' + PREF_PRINTER_HEAD[language] + ':</label>';
html += '<select name="receiptprinter" id="receiptprinter" data-theme="e">';
html += '<option value="1"' + isSelected(1,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #1</option>';
html += '<option value="2"' + isSelected(2,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #2</option>';
html += '<option value="3"' + isSelected(3,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #3</option>';
html += '<option value="4"' + isSelected(4,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #4</option>';
html += '<option value="5"' + isSelected(5,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #5</option>';
html += '<option value="6"' + isSelected(6,printer) + '>' + PREF_RECEIPT_PRINTER[language] + ' #6</option>';
html += '</select></div>';
return html;
}
function setLanguage(lang) {
l = lang;
$("#languagepart").html(createLanguagePart(lang));
$("#languagebox").trigger("create");
$("#receiptprinterpart").html(createReceiptPrinterPart(lang));
$("#receiptprinterpartbox").trigger("create");
$("#prefheader").html(PREF_HEADER[lang]);
$("#passwordgen").html(PREF_PASSWORD[lang]);
$("#oldpassword").html(PREF_OLD_PASSWORD[lang]);
$("#newpassword").html(PREF_NEW_PASSWORD[lang]);
$("#languagetxt").html(PREF_LANGUAGE[lang]);
$("#printertxt").html(PREF_PRINTER_HEAD[lang]);
$("#ordertonetxt").html(PREF_ORDERTON[lang]);
var changepassbtn = '<input type="submit" value="' + PREF_CHANGE_PASSWD[lang] + '" data-theme="d" id="changepasswordbutton"/>';
$("#changepassbtnpart").html(changepassbtn);
$("#userpart").trigger("create");
$("#language").off('change').on('change', function(e) {
e.stopImmediatePropagation();
e.preventDefault();
var newLang = $("#language").find(":selected").val();
doAjax("POST","php/contenthandler.php?module=admin&command=setUserLanguage",{language:newLang},null,"Sprachenaenderung");
setLanguage(newLang);
});
$("#OLDPASSW_WRONG").html(PREF_WRONG_OLDASS[lang]);
$("#PASSWORD_CHANGED").html(PREF_PASS_CHANGED[lang]);
$("#voltxt").html(PREF_VOL[lang]);
$("#btnsizetxt").html(PREF_BTN_SIZE_TXT[lang]);
$("#roombtnsizetxt").html(PREF_ROOM_BTN_SIZE[lang]);
$("#tablebtnsizetxt").html(PREF_TABLE_BTN_SIZE[lang]);
$("#prodbtnsizetxt").html(PREF_PROD_BTN_SIZE[lang]);
$("#prefertmtxt").html(PREF_TABLE_BTN_SIZE[lang]);
$("#prefertmlabeltxt").html(PREF_TM[lang]);
$("#preferktltxt").html(PREF_KTL_TITEL[lang]);
$("#preferktldesc").html(PREF_KTL_DESC[lang]);
initializeMainMenu("#modulemenu");
binding();
}
function changePassword(jsonContent) {
if (jsonContent == "OK") {
$("#passwordchangedpopup").popup( "open", {transition: 'flip'} );
} else {
$("#passwordnotchangedpopup").popup( "open", {transition: 'flip'} );
}
}
function fillCurrentUserIntoMask(username) {
$("#username").html(username);
}
function setCurrentUserIntoMask() {
doAjax("GET","php/contenthandler.php?module=admin&command=getCurrentUser",null,fillCurrentUserIntoMask,"Keine Benutzerinfo");
}
function setVolume() {
doAjax("GET","php/contenthandler.php?module=admin&command=getOrderVolume",null,fillOrderVolume,"Keine Ordertoninformation");
}
function setButtonSizes() {
doAjax("GET","php/contenthandler.php?module=admin&command=getButtonSizes",null,fillButtonSizes,"Keine Buttongroesseninformation");
}
function setPreferTablemap() {
doAjax("GET","php/contenthandler.php?module=admin&command=getPreferTableMap",null,fillPreferTableMap,"Keine Information über Bevorzugung grafischer Tischpläne");
}
function setKeepTypeLevel() {
doAjax("GET","php/contenthandler.php?module=admin&command=getKeepTypeLevel",null,fillKeepTypeLevel,"Keine Information über Bevorzugung Bestellnavigation");
}
function setApplyBtnPos() {
doAjax("GET","php/contenthandler.php?module=admin&command=getApplyExtrasBtnPos",null,fillExtrasApplyBtnPosPart,"Keine Information über Position Extra-Anwenden-Button");
}
function fillOrderVolume(volume) {
$("#slidervolume").val(volume);
$("#slidervolume").slider('refresh');
}
function createBtnSizePart(size,label,labeltxt) {
var html = '<div class="ui-field-contain">';
html += '<label for="' + label + '"><span id="' + label + 'txt">' + labeltxt + '</span> :</label>';
html += '<select name="' + label + '" id="' + label + '" data-theme="e">';
html += '<option value="0"' + isSelected(0,size) + '>' + PREF_SIZE_SMALL[l] + '</option>';
html += '<option value="1"' + isSelected(1,size) + '>' + PREF_SIZE_MIDDLE[l] + '</option>';
html += '<option value="2"' + isSelected(2,size) + '>' + PREF_SIZE_BIG[l] + '</option>';
html += '</select></div>';
return html;
}
function createPreferTMPart(prefervalue,label,labeltxt) {
var html = '<div class="ui-field-contain">';
html += '<label for="' + label + '"><span id="' + label + 'txt">' + labeltxt + '</span> :</label>';
html += '<select name="' + label + '" id="' + label + '" data-theme="e">';
html += '<option value="0"' + isSelected(0,prefervalue) + '>' + PREF_TM_TEXT[l] + '</option>';
html += '<option value="1"' + isSelected(1,prefervalue) + '>' + PREF_TM_GR[l] + '</option>';
html += '</select></div>';
return html;
}
function createPreferKTLPart(prefervalue,label,labeltxt) {
var html = '<div class="ui-field-contain">';
html += '<label for="' + label + '"><span id="' + label + 'txt">' + labeltxt + '</span> :</label>';
html += '<select name="' + label + '" id="' + label + '" data-theme="e">';
html += '<option value="1"' + isSelected(1,prefervalue) + '>' + PREF_KTL_KEEP[l] + '</option>';
html += '<option value="0"' + isSelected(0,prefervalue) + '>' + PREF_KTL_GO_HIGH[l] + '</option>';
html += '</select></div>';
return html;
}
function createPreferExtrasApplyBtnPosPart(prefervalue,label,labeltxt) {
var html = '<div class="ui-field-contain">';
html += '<label for="' + label + '"><span id="' + label + 'txt">' + labeltxt + '</span> :</label>';
html += '<select name="' + label + '" id="' + label + '" data-theme="e">';
html += '<option value="1"' + isSelected(1,prefervalue) + '>' + PREF_APPLY_EXTRAS_OPTION_BOTTOM[l] + '</option>';
html += '<option value="2"' + isSelected(2,prefervalue) + '>' + PREF_APPLY_EXTRAS_OPTION_TOP[l] + '</option>';
html += '<option value="3"' + isSelected(3,prefervalue) + '>' + PREF_APPLY_EXTRAS_OPTION_BOTH[l] + '</option>';
html += '</select></div>';
return html;
}
function fillButtonSizes(buttonsizes) {
$("#roombtnpart").html(createBtnSizePart(buttonsizes.roombtnsize, "roombtnsize", PREF_ROOM_BTN_SIZE[l]));
$("#tablebtnpart").html(createBtnSizePart(buttonsizes.tablebtnsize, "tablebtnsize", PREF_TABLE_BTN_SIZE[l]));
$("#prodbtnpart").html(createBtnSizePart(buttonsizes.prodbtnsize, "prodbtnsize", PREF_PROD_BTN_SIZE[l]));
$("#btnsizepartbox").trigger("create");
}
function fillPreferTableMap(preferTablemap) {
$("#prefertmbtnpart").html(createPreferTMPart(preferTablemap, "prefertmlabel", PREF_TM[l]));
$("#prefertmpartbox").trigger("create");
}
function fillKeepTypeLevel(preferKeepTypeLevel) {
$("#preferktlbtnpart").html(createPreferKTLPart(preferKeepTypeLevel, "preferktllabel", PREF_KTL[l]));
$("#preferktlpartbox").trigger("create");
}
// REM* position iof apply button for extras
function fillExtrasApplyBtnPosPart(applyPos) {
$("#preferapplypospart").html(createPreferExtrasApplyBtnPosPart(applyPos, "preferapplyposlabel", PREF_APPLY_EXTRA_POS[l]));
$("#preferktlpartbox").trigger("create");
}
function handleBtnSize(jsonResult) {
if (jsonResult != "OK") {
alert("Fehler");
}
}
function handleGeneralAnswer(json) {
if (json.status != "OK") {
alert("Fehler");
}
}
function binding() {
// Help buttons
$("#changepasswordbutton").off("click").on("click", function (e) {
e.stopImmediatePropagation();
e.preventDefault();
var oldp = $("#oldpass").val();
var newp = $("#newpass").val();
doAjaxPasswordChange(oldp,newp,"Password change impossible");
$("#oldpass").val("");
$("#newpass").val("");
});
$("#slidervolume").off('slidestop').on('slidestop', function(e) {
doAjax("POST","php/contenthandler.php?module=admin&command=setOrderVolume",{volume:$("#slidervolume").val()},null,"Orderton nicht einstellbar");
});
$("#receiptprinter").off('change').on('change', function(e) {
e.stopImmediatePropagation();
e.preventDefault();
var newPrinter = $("#receiptprinter").find(":selected").val();
$("#pref-page").data("receiptprinter",newPrinter);
$("#receiptprinterpart").html(createReceiptPrinterPart($("#pref-page").data("userlanguage")));
$("#receiptprinterpartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setUserReceiptPrinter",{printer:newPrinter},null,"Bondruckeränderung");
binding();
});
$("#roombtnsize").off('change').on('change', function(e) {
var newSize = $("#roombtnsize").find(":selected").val();
$("#roombtnpart").html(createBtnSizePart(newSize, "roombtnsize", PREF_ROOM_BTN_SIZE[l]));
$("#btnsizepartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setBtnSize",{btn:0,size:newSize},handleBtnSize,"Buttonsize");
binding();
});
$("#tablebtnsize").off('change').on('change', function(e) {
var newSize = $("#tablebtnsize").find(":selected").val();
$("#tablebtnpart").html(createBtnSizePart(newSize, "tablebtnsize", PREF_TABLE_BTN_SIZE[l]));
$("#btnsizepartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setBtnSize",{btn:1,size:newSize},handleBtnSize,"Buttonsize");
binding();
});
$("#prodbtnsize").off('change').on('change', function(e) {
var newSize = $("#prodbtnsize").find(":selected").val();
$("#prodbtnpart").html(createBtnSizePart(newSize, "prodbtnsize", PREF_PROD_BTN_SIZE[l]));
$("#btnsizepartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setBtnSize",{btn:2,size:newSize},handleBtnSize,"Buttonsize");
binding();
});
$("#prefertmlabel").off('change').on('change', function(e) {
var newVal = $("#prefertmlabel").find(":selected").val();
$("#prefertmbtnpart").html(createPreferTMPart(newVal, "prefertmlabel", PREF_TM[l]));
$("#prefertmpartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setPreferTableMap",{prefertablemap:newVal},handleGeneralAnswer,"Table Map");
binding();
});
$("#preferktllabel").off('change').on('change', function(e) {
var newVal = $("#preferktllabel").find(":selected").val();
$("#preferktlbtnpart").html(createPreferKTLPart(newVal, "preferktllabel", PREF_KTL[l]));
$("#preferktlpartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setKeepTypeLevel",{keeptypelevel:newVal},handleGeneralAnswer,"Keep Type Level");
binding();
});
$("#preferapplyposlabel").off('change').on('change', function(e) {
var newVal = $("#preferapplyposlabel").find(":selected").val();
$("#preferapplypospart").html(createPreferExtrasApplyBtnPosPart(newVal, "preferapplyposlabel", PREF_APPLY_EXTRA_POS[l]));
$("#preferktlpartbox").trigger("create");
doAjax("POST","php/contenthandler.php?module=admin&command=setApplyExtrasBtnPos",{applyextrasbtnpos:newVal},handleGeneralAnswer,"Apply Extras Button Position");
binding();
});
}
$(document).on("pageinit", "#pref-page", function () {
initializeMainMenu("#modulemenu");
hideMenu();
getGeneralConfigItems();
setCurrentUserIntoMask();
setVolume();
setButtonSizes();
setPreferTablemap();
setKeepTypeLevel();
setApplyBtnPos();
binding();
});
</script>
<div data-role="page" id="pref-page">
<div data-role="panel" id="modulepanel" data-position="right" data-display="overlay" class="noprint">
<ul data-role="listview" id="modulemenu" data-divider-theme="a" data-inset="true">
<li data-role="list-divider" data-theme="b" data-role="heading">Module</li>
</ul>
</div><!-- /panel -->
<div data-role="header" data-theme="b" data-position="fixed" id="theheader" class="noprint">
<h1><span id=prefheader></span></span><span id="username"></span></h1>
<div data-type="horizontal" style="top:0px;position:absolute;float:right;z-index:10;display:inline;" align="right" class="ui-btn-right">
<a href="#" data-role="button" data-icon="arrow-d" data-ajax="false" id="menuswitch">Module</a>
</div>
</div>
<div data-role="content">
<div id="userpart" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id=passwordgen>Passwort</span></h3>
<form>
<span id=oldpassword>Altes Passwort:</span><input type="password" name="oldpassword" id="oldpass"/><br />
<span id=newpassword>Neues Passwort:</span><input type="password" name="newpassword" id="newpass"/><br />
<div id="changepassbtnpart"></div>
</form>
</div> <!-- Benutzerpasswort -->
<div id="volume" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="ordertonetxt">Orderton</span></h3>
<label for="slidervolume"><span id="voltxt">Lautstärke:</span></label>
<input type="range" name="slidervolume" id="slidervolume" value="0" min="0" max="10" />
</div>
<div id="languagebox" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="languagetxt">Sprache</span></h3>
<div id="languagepart"></div>
</div>
<div id="receiptprinterpartbox" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="printertxt">Kassendrucker</span></h3>
<div id="receiptprinterpart"></div>
</div>
<div id="btnsizepartbox" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="btnsizetxt">Buttongrößen</span></h3>
<div id="roombtnpart"></div>
<div id="tablebtnpart"></div>
<div id="prodbtnpart"></div>
</div>
<div id="prefertmpartbox" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="prefertmtxt">Tischplan</span></h3>
<div id="prefertmbtnpart"></div>
</div>
<div id="preferktlpartbox" data-role="collapsible" data-collapsed="false" data-theme="e" data-content-theme="c" class="noprint">
<h3><span id="preferktltxt">Bestellnavigation</span></h3>
<p><span id="preferktldesc">Beschreibung</span></p>
<div id="preferktlbtnpart"></div>
<div id="preferapplypospart"></div>
</div>
</div>
<div data-role="footer" data-theme="b" id="thefooterr">
<div class="ui-grid-a">
<div class="ui-block-a userinfo" id="loggedinuser"></div>
<div class="ui-block-b grid_right" id="versioninfo"></div>
</div><!-- /grid-a -->
</div> <!-- footer -->
<div data-role="popup" id="passwordchangedpopup" name="passwordchangedpopup" data-overlay-theme="a" style="max-width:70%;" class="ui-corner-all">
<div data-role="header" class="ui-corner-top">
<h1>Passwordänderung</h1>
</div>
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right"></a>
<div data-role="content" class="ui-corner-bottom ui-content">
<p><span id="PASSWORD_CHANGED">Das Passwort wurde geändert.</span></p>
</div>
</div> <!-- popup for changed password -->
<div data-role="popup" id="passwordnotchangedpopup" name="passwordnotchangedpopup" data-overlay-theme="a" style="max-width:70%;" class="ui-corner-all">
<div data-role="header" class="ui-corner-top">
<h1>Passwortänderung</h1>
</div>
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right"></a>
<div data-role="content" class="ui-corner-bottom ui-content">
<p><span id="OLDPASSW_WRONG">Das Passwort konnte nicht geändert werden. Bitte prüfen Sie, ob das alte Passwort korrekt eingegeben wurde.</span></p>
</div>
</div> <!-- popup for failed password change -->
</div>
</body>
</html>