mymirror/WebContent/WEB-INF/Configuration.jsp
2018-06-03 11:34:09 +02:00

2508 lines
102 KiB
Plaintext
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<%@ page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="language"
value="${not empty param.language ? param.language : not empty language ? language : pageContext.request.locale}"
scope="session" />
<fmt:setLocale value="${language}" />
<fmt:setBundle basename="mymirror.i18n.Message" />
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Theme Made By www.w3schools.com - No Copyright -->
<title>MyMirror - Personalize MyMirror</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="http://fonts.googleapis.com/css?family=Montserrat"
rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Lato"
rel="stylesheet" type="text/css">
<link rel="stylesheet"
href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="inc/css/monCSS.css">
<link rel="stylesheet" href="inc/css/jquery-ui.css">
<link rel="stylesheet" href="inc/css/cssConfig.css">
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script
src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!--
<script src="inc/js/jquery-1.12.4.js"></script>
-->
<script src="inc/js/jquery-ui.js"></script>
<script src="inc/js/jsConfig.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.js" type="text/javascript"></script>
<script src="jquery-hex-colorpicker.min.js"></script>
<link rel="stylesheet" href="jquery-hex-colorpicker.css">
<style>
footer .glyphicon {
font-size: 20px;
margin-bottom: 20px;
color: #3366ff;
}
.container-fluid {
padding: 60px 50px;
}
.jumbotron {
background-color: #f6f6f6;
color: #b3b3b3;
padding: 50px 25px;
font-family: Montserrat, sans-serif;
}
#CryptoDrawId {
position: absolute;
width: 160px;
height: 120px;
padding: 0.5em;
float: left;
margin: 0 10px 10px 0;
}
h3 {
color: #4d79ff;
}
</style>
</head>
<body id="myPage" data-spy="scroll" data-target=".navbar"
data-offset="60">
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#myNavbar">
<span class="icon-bar"></span> <span class="icon-bar"></span> <span
class="icon-bar"></span>
</button>
<a class="navbar-brand" href="Home"> <c>My</c>Mirror
</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<!-- <li><a href="#connect" data-toggle="modal"
data-target="#myModal">Thomas <span
class="glyphicon glyphicon-log-in"></span></a></li>
-->
<c:if test="${!empty sessionScope.sessionUtilisateur}">
<li class="dropdown"><a class="dropdown-toggle"
data-toggle="dropdown" href="#"><span
class="glyphicon glyphicon-user"></span>
${sessionScope.sessionUtilisateur.firstName} <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="Configuration"><fmt:message
key="home.configureMirror" /> <span
class="glyphicon glyphicon-wrench"></span></a></li>
<li><a href="Settings"><fmt:message
key="home.changesettings" /> <span
class="glyphicon glyphicon-edit"></span> </a></li>
<li><a href="Deconnection"><fmt:message
key="home.deconnection" /> <span
class="glyphicon glyphicon-off"></span> </a></li>
</ul></li>
</c:if>
<li class="dropdown"><a href="#" class="dropdown-toggle"
data-toggle="dropdown" role="button" aria-expanded="false"> <c:if
test="${sessionScope.sessionUtilisateur.language == 'FR'}">
<img id="imgNavSel" src="images/fr.png" alt="..."
class=" icon-small">
</c:if> <c:if test="${sessionScope.sessionUtilisateur.language == 'BE'}">
<img id="imgNavSel" src="images/be.png" alt="..."
class=" icon-small">
</c:if> <c:if test="${sessionScope.sessionUtilisateur.language == 'DE'}">
<img id="imgNavSel" src="images/de.png" alt="..."
class=" icon-small">
</c:if> <c:if test="${sessionScope.sessionUtilisateur.language == 'EN'}">
<img id="imgNavSel" src="images/en.png" alt="..."
class=" icon-small">
</c:if> <c:if test="${sessionScope.sessionUtilisateur.language == 'ES'}">
<img id="imgNavSel" src="images/es.png" alt="..."
class=" icon-small">
</c:if> <c:if test="${sessionScope.sessionUtilisateur.language == 'IT'}">
<img id="imgNavSel" src="images/it.png" alt="..."
class=" icon-small">
</c:if> <span id="lanNavSel"></span> <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a id="navBe" href="Configuration?lg=BE"
class="language"> <img id="imgNavBe" src="images/be.png"
alt="Belgium" class=" icon-small">  <span id="lanNavBe">Nederlands</span></a></li>
<li><a id="navFr" href="Configuration?lg=FR"
class="language"> <img id="imgNavFr" src="images/fr.png"
alt="France" class=" icon-small">  <span id="lanNavFr">Français</span></a></li>
<li><a id="navEn" href="Configuration?lg=EN"
class="language"> <img id="imgNavEn" src="images/en.png"
alt="Great-Britain" class=" icon-small">  <span
id="lanNavEn">English</span></a></li>
<li><a id="navDe" href="Configuration?lg=DE"
class="language"> <img id="imgNavDe" src="images/de.png"
alt="Germany" class=" icon-small">  <span id="lanNavDe">Deutsch</span></a></li>
<li><a id="navEs" href="Configuration?lg=ES"
class="language"> <img id="imgNavEs" src="images/es.png"
alt="Spain" class=" icon-small">  <span id="lanNavEs">Español</span></a></li>
<li><a id="navIt" href="Configuration?lg=IT"
class="language"> <img id="imgNavIt" src="images/it.png"
alt="Italy" class=" icon-small">  <span id="lanNavIt">Italiano</span></a></li>
</ul></li>
</ul>
</div>
</div>
</nav>
<!-- <div class="container" id="AllParameter">
<div class="jumbotron">
<h3><fmt:message key="configuration.perso" /></h3>
<p><fmt:message key="configuration.Messperso" /></p>
</div>
<hr>
<ul class="nav nav-pills">
<li class="active"><a data-toggle="pill" href="#Welcome"><fmt:message key="configuration.Welcome" /></a></li>
<li><a data-toggle="pill" href="#Date"><fmt:message key="configuration.DateHour" /></a></li>
<li><a data-toggle="pill" href="#Weather"><fmt:message key="configuration.Weather" /></a></li>
<li><a data-toggle="pill" href="#News"><fmt:message key="configuration.News" /></a></li>
<li><a data-toggle="pill" href="#Agenda"><fmt:message key="configuration.Agenda" /></a></li>
<li><a data-toggle="pill" href="#Traffic"><fmt:message key="configuration.Traffic" /></a></li>
<li><a data-toggle="pill" href="#Radio"><fmt:message key="configuration.Radio" /></a></li>
<li><a data-toggle="pill" href="#SocialNetworks"><fmt:message key="configuration.SocialNetworks" /></a></li>
<li><a data-toggle="pill" href="#SmartHome"><fmt:message key="configuration.SmartHome" /></a></li>
<li><a data-toggle="pill" href="#Crypto"><fmt:message key="configuration.SelectCrypto" /></a></li>
</ul>
</div> -->
<div id="WidgetBar" class="panel-group" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#WidgetBar" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Widgets fonctionnels
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body">
<ul class="nav nav-pills nav-stacked">
<li id="listWelcome">
<a data-toggle="modal" href="#modalWidgetWelcome"><fmt:message key="configuration.Welcome"/></a>
<span id="spanWelcomeAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#WelcomeDrawId','#spanWelcomeAdd','#spanWelcomeMinus','input[name=welcome][value=activate]');"></span>
<span id="spanWelcomeMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#WelcomeDrawId','#spanWelcomeAdd','#spanWelcomeMinus','input[name=welcome][value=desactivate]');"></span>
<span id="spanWelcomeSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetWelcome');"></span>
</li>
<li id="listDate">
<a data-toggle="modal" href="#modalWidgetDateHour"><fmt:message key="configuration.DateHour" /></a>
<span id="spanDateAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#HorlogeDrawId','#spanDateAdd','#spanDateMinus','input[name=date][value=activate]');"></span>
<span id="spanDateMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#HorlogeDrawId','#spanDateAdd','#spanDateMinus','input[name=date][value=desactivate]');"></span>
<span id="spanDateSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetDateHour');"></span>
</li>
<li id="listWeather">
<a data-toggle="modal" href="#modalWidgetWeather"><fmt:message key="configuration.Weather" /></a>
<span id="spanWeatherAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#WeatherDrawId','#spanWeatherAdd','#spanWeatherMinus','input[name=weather][value=activate]');"></span>
<span id="spanWeatherMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#WeatherDrawId','#spanWeatherAdd','#spanWeatherMinus','input[name=weather][value=desactivate]');"></span>
<span id="spanWeatherSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetWeather');"></span>
</li>
<li id="listNews">
<a data-toggle="modal" href="#modalWidgetNews"><fmt:message key="configuration.News" /></a>
<span id="spanNewsAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#NewsDrawId','#spanNewsAdd','#spanNewsMinus','input[name=news][value=activate]');"></span>
<span id="spanNewsMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#NewsDrawId','#spanNewsAdd','#spanNewsMinus','input[name=news][value=desactivate]');"></span>
<span id="spanNewsSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetNews');"></span>
</li>
<li id="listAgenda">
<a data-toggle="modal" href="#modalWidgetAgenda"><fmt:message key="configuration.Agenda" /></a>
<span id="spanAgendaAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#AgendaDrawId','#spanAgendaAdd','#spanAgendaMinus','input[name=agenda][value=activate]');"></span>
<span id="spanAgendaMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#AgendaDrawId','#spanAgendaAdd','#spanAgendaMinus','input[name=agenda][value=desactivate]');"></span>
<span id="spanAgendaSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetAgenda');"></span>
</li>
<li id="listTraffic">
<a data-toggle="modal" href="#modalWidgetTraffic"><fmt:message key="configuration.Traffic" /></a>
<span id="spanTrafficAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#TrafficDrawId','#spanTrafficAdd','#spanTrafficMinus','input[name=traffic][value=activate]');"></span>
<span id="spanTrafficMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#TrafficDrawId','#spanTrafficAdd','#spanTrafficMinus','input[name=traffic][value=desactivate]');"></span>
<span id="spanTrafficSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetTraffic');"></span>
</li>
<li id="listRadio">
<a data-toggle="modal" href="#modalWidgetRadio"><fmt:message key="configuration.Radio" />&nbsp&nbsp<img id="radioPower" style="display:none" src="images/speakerLoud.png" alt="..." class=" icon-small"></a>
<span id="spanRadioAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#RadioDrawId','#spanRadioAdd','#spanRadioMinus','input[name=radioStatus][value=activate]');"></span>
<span id="spanRadioMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#RadioDrawId','#spanRadioAdd','#spanRadioMinus','input[name=radioStatus][value=desactivate]');"></span>
<span id="spanRadioSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetRadio');"></span>
</li>
<li id="listSmartHome">
<a data-toggle="modal" href="#modalWidgetSmartHome"><fmt:message key="configuration.SmartHome" /></a>
<span id="spanSmartHomeAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#HouseDrawId','#spanSmartHomeAdd','#spanSmartHomeMinus','input[name=smartHome][value=activate]');"></span>
<span id="spanSmartHomeMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#HouseDrawId','#spanSmartHomeAdd','#spanSmartHomeMinus','input[name=smartHome][value=desactivate]');"></span>
<span id="spanSmartHomeSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetSmartHome');"></span>
</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingTwo">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#WidgetBar" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Widgets en développement
</a>
</h4>
</div>
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="panel-body">
<ul class="nav nav-pills nav-stacked">
<li id="listSocialNetworks">
<a data-toggle="modal" href="#modalWidgetSocialNetworks"><fmt:message key="configuration.SocialNetworks" /></a>
<span id="spanSocialNetworksAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#SocialDrawId','#spanSocialNetworksAdd','#spanSocialNetworksMinus');"></span>
<span id="spanSocialNetworksMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#SocialDrawId','#spanSocialNetworksAdd','#spanSocialNetworksMinus');"></span>
<span id="spanSocialNetworksSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetSocialNetworks');"></span>
</li>
<li id="listCrypto">
<a data-toggle="modal" href="#modalWidgetCrypto"><fmt:message key="configuration.SelectCrypto" /></a>
<span id="spanCryptoAdd" class="glyphicon glyphicon-plus-sign" onclick="addWidget('#CryptoDrawId','#spanCryptoAdd','#spanCryptoMinus');"></span>
<span id="spanCryptoMinus" class="glyphicon glyphicon-minus-sign" onclick="removeWidget('#CryptoDrawId','#spanCryptoAdd','#spanCryptoMinus');"></span>
<span id="spanCryptoSetting" class="glyphicon glyphicon-edit" onclick="setWidget('#modalWidgetCrypto');"></span>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- MODALS -->
<!-- MODAL DATE HOUR -->
<div id="modalWidgetDateHour" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.DateHour" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form Date/Hour -->
<!-- Date/Hour - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusDate"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="date" value="activate"
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="date" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Date/Hour - TimeZone-->
<div class="form-group">
<label class="col-md-4 control-label" for="TimeZone"><fmt:message key="home.SignUpTimeZone"/></label>
<div class="col-md-4">
<select id="TimeZone" name="TimeZone" class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('hour').timeZone}</option>
<option value="">GMT (-10) Hawai</option>
<option value="">GMT (-9) Alaska</option>
</select>
</div>
</div>
<!-- Date/Hour - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="FormDate"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="FormDate" name="FormDate" class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetForm != '1'}">
<option value="">1</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnDate" class="btn btn-primary">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL DATE HOUR -->
<!-- MODAL MESSAGE -->
<div id="modalWidgetWelcome" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.Welcome" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form Welcome-->
<!-- Welcome - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusWelcome"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="welcome" value="activate"
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="welcome" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Welcome - Message-->
<div class="form-group">
<label class="col-md-4 control-label" for="Message"><fmt:message key="configuration.YourMessage"/></label>
<div class="col-md-4">
<input id="messWelcome" name="Message" type="text"
placeholder="" class="form-control input-md"
value="${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').message}">
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnWelcome" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL MESSAGE -->
<!-- MODAL WEATHER -->
<div id="modalWidgetWeather" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.Weather" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form Weather-->
<!-- Weather - Status-->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusWeather"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="weather" value="activate"
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="weather" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Weather - City-->
<div class="form-group">
<label class="col-md-4 control-label" for="City"><fmt:message key="configuration.YourCity"/></label>
<div class="col-md-4">
<input id="CityWeather" name="City" type="text" placeholder=""
class="form-control input-md"
value="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').city}">
</div>
</div>
<!-- Weather - Parameters -->
<div class="form-group">
<label class="col-md-4 control-label" for="ParametersWeather"><fmt:message key="configuration.Parameters"/></label>
<div class="col-md-4">
<div class="checkbox">
<label for="ParametersWeather-0"> <input
type="checkbox" name="ParametersWeather"
id="ParametersWeather-0" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').wind}"> checked="checked"
</c:if>> <fmt:message key="configuration.Wind"/>
</label>
</div>
<div class="checkbox">
<label for="ParametersWeather-1"> <input
type="checkbox" name="ParametersWeather"
id="ParametersWeather-1" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').rain}"> checked="checked"
</c:if>> <fmt:message key="configuration.Rain"/>
</label>
</div>
<div class="checkbox">
<label for="ParametersWeather-2"> <input
type="checkbox" name="ParametersWeather"
id="ParametersWeather-2" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').nextDays}"> checked="checked"
</c:if>> <fmt:message key="configuration.NextDays"/>
</label>
</div>
</div>
</div>
<!-- Weather - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="FormWeather"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="FormWeather" name="FormWeather"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetForm != '1'}">
<option value="">1</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnWeather" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL WEATHER -->
<!-- MODAL NEWS -->
<div id="modalWidgetNews" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.News" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form News-->
<!-- News - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusNews"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="news" value="activate"
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="news" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- News - Country -->
<div class="form-group">
<label class="col-md-4 control-label" for="countryNews"><fmt:message key="home.SignUpCountry"/></label>
<div class="col-md-4">
<select id="countryNews" name="countryNews"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('news').country}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').country != 'Belgique'}">
<option value=""><fmt:message key="configuration.Belgium"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').country != 'France'}">
<option value=""><fmt:message key="configuration.France"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').country != 'Luxembourg'}">
<option value=""><fmt:message key="configuration.Luxembourg"/></option>
</c:if>
</select>
</div>
</div>
<!-- News - Provider -->
<div class="form-group">
<label class="col-md-4 control-label" for="NewsProvider"><fmt:message key="configuration.NewsProvider"/></label>
<div class="col-md-4">
<select id="NewsProvider" name="NewsProvider"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews != 'RTL'}">
<option value="">RTL</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews != 'RTBF'}">
<option value="">RTBF</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews != 'AVENIR'}">
<option value="">AVENIR</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews != 'SUDPRESSE'}">
<option value="">SUDPRESSE</option>
</c:if>
</select>
</div>
</div>
<!-- News - Speed -->
<div class="form-group">
<label class="col-md-4 control-label" for="ChangeSpeed"><fmt:message key="configuration.Speed"/></label>
<div class="col-md-4">
<select id="ChangeSpeed" name="ChangeSpeed"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('news').speed}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').speed != 'Slow'}">
<option value=""><fmt:message key="configuration.Slow"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').speed != 'Medium'}">
<option value=""><fmt:message key="configuration.Medium"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').speed != 'Fast'}">
<option value=""><fmt:message key="configuration.Fast"/></option>
</c:if>
</select>
</div>
</div>
<!-- News - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="FormNews"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="FormNews" name="FormNews" class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetForm != '1'}">
<option value="">1></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnNews" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL NEWS -->
<!-- MODAL AGENDA -->
<div id="modalWidgetAgenda" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.Agenda" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form Agenda-->
<!-- Agenda - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusAgenda"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="agenda" value="activate"
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="agenda" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetActivate}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Agenda - Provider -->
<div class="form-group">
<label class="col-md-4 control-label" for="AgendaProvider"><fmt:message key="configuration.AgendaProvider"/></label>
<div class="col-md-4">
<select id="AgendaProvider" name="AgendaProvider"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').provider}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').provider != 'Google'}">
<option value="">Google</option>
</c:if>
</select>
</div>
</div>
<!-- Agenda - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="FormAgenda"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="FormAgenda" name="FormAgenda"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetForm != '1'}">
<option value="">1</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnAgenda" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL AGENDA -->
<!-- MODAL TRAFFIC -->
<div id="modalWidgetTraffic" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.Traffic" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form Traffic -->
<!-- Traffic - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusTraffic"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="traffic" value="activate" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="traffic" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Traffic - WorkPlace-->
<div class="form-group">
<label class="col-md-4 control-label" for="WorkCity"><fmt:message key="configuration.CityWork"/></label>
<div class="col-md-4">
<input id="WorkCity" name="WorkCity" type="text"
placeholder="" class="form-control input-md" value="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workCity}">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="WorkAddress"><fmt:message key="configuration.AddressWork"/></label>
<div class="col-md-4">
<input id="WorkAddress" name="WorkAddress" type="text"
placeholder="" class="form-control input-md" value="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workAddress}">
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="WorkPostCode"><fmt:message key="configuration.PCWork"/></label>
<div class="col-md-2">
<input id="WorkPostCode" name="WorkPostCode" type="number"
placeholder="" class="form-control input-md" value="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workPostCode}">
</div>
</div>
<!-- Traffic - WorkingDays -->
<div class="form-group">
<label class="col-md-4 control-label" for="WorkingDays"><fmt:message key="configuration.WorkDay"/></label>
<div class="col-md-4">
<div class="checkbox">
<label for="WorkingDays-0"> <input type="checkbox"
name="WorkingDays" id="WorkingDays-0" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').monday}"> checked="checked"
</c:if>>
<fmt:message key="configuration.Monday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-1"> <input type="checkbox"
name="WorkTime" id="WorkTime-1" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').tuesday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Tuesday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-2"> <input type="checkbox"
name="WorkTime" id="WorkTime-2" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').wednesday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Wednesday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-3"> <input type="checkbox"
name="WorkTime" id="WorkTime-3" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').thursday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Thursday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-4"> <input type="checkbox"
name="WorkTime" id="WorkTime-4" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').friday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Friday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-5"> <input type="checkbox"
name="WorkTime" id="WorkTime-5" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').saturday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Saturday"/>
</label>
</div>
<div class="checkbox">
<label for="WorkTime-6"> <input type="checkbox"
name="WorkTime" id="WorkTime-6" value="" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').sunday}"> checked="checked"
</c:if>> <fmt:message key="configuration.Sunday"/>
</label>
</div>
</div>
</div>
<!-- Traffic - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="FormTraffic"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="FormTraffic" name="FormTraffic"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetForm != '1'}">
<option value="">1</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnTraffic" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL TRAFFIC -->
<!-- MODAL RADIO -->
<div id="modalWidgetRadio" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.Radio" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Radio - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusRadio"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="radioStatus" value="activate" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="radioStatus" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- Radio - Provider -->
<div class="form-group">
<label class="col-md-4 control-label" for="ProviderRadio"><fmt:message key="configuration.Radio"/></label>
<div class="col-md-4">
<select id="ProviderRadio" name="ProviderRadio"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio != 'La Premiere'}">
<option value=""><fmt:message key="configuration.LaPremiere"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio != 'RTL'}">
<option value=""><fmt:message key="configuration.RTL"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio != 'NRJ'}">
<option value=""><fmt:message key="configuration.NRJ"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio != 'Radio Contact'}">
<option value=""><fmt:message key="configuration.RadioContact"/></option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio != 'Pure FM'}">
<option value=""><fmt:message key="configuration.PureFM"/></option>
</c:if>
</select>
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" for="DisplayRadio">Logo</label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="radioDisplay" value="activate" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('radio').logo}"> checked="checked"
</c:if>>Affiché
</label> <br> <label class="radio-inline"> <input
type="radio" name="radioDisplay" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('radio').logo}"> checked="checked"
</c:if>>Caché
</label> <br>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnRadio" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL RADIO -->
<!-- MODAL SOCIAL NETWORK -->
<div id="modalWidgetSocialNetworks" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.SocialNetworks" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form SocialNetworks-->
<!-- SocialNetworks - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusNetworks"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="social" value="activate" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="social" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- SocialNetworks - SocialNetwork Select -->
<div class="form-group">
<label class="col-md-4 control-label" for="SocialNetwork"><fmt:message key="configuration.SocialNetwork"/></label>
<div class="col-md-4">
<select id="SocialNetwork" name="SocialNetwork"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksSocialNetwork}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksSocialNetwork != 'Facebook'}">
<option value="">Facebook</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksSocialNetwork != 'Google+'}">
<option value="">Google</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksSocialNetwork != 'Twitter'}">
<option value="">Twitter</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksSocialNetwork != 'Instagram'}">
<option value="">Instagram</option>
</c:if>
</select>
</div>
</div>
<!-- SocialNetworks - Form -->
<div class="form-group">
<label class="col-md-4 control-label" for="formNetwork"><fmt:message key="configuration.Form"/></label>
<div class="col-md-4">
<select id="formNetwork" name="formNetwork"
class="form-control">
<option value="">${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksForm}</option>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksForm != '1'}">
<option value="">1</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksForm != '2'}">
<option value="">2</option>
</c:if>
<c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksForm != '3'}">
<option value="">3</option>
</c:if>
</select>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnNetwork" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL SOCIAL NETWORK -->
<!-- MODAL SMART HOME -->
<div id="modalWidgetSmartHome" class="modal fade modalWidget" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title"><fmt:message key="configuration.SmartHome" /></h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<fieldset>
<!-- Form SmartHome-->
<!-- SmartHome - Status -->
<div class="form-group">
<label class="col-md-4 control-label" for="StatusSmartHome"><fmt:message key="configuration.Status"/></label>
<div class="col-md-4">
<label class="radio-inline"> <input type="radio"
name="smartHome" value="activate" <c:if
test="${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Activate"/>
</label> <br> <label class="radio-inline"> <input
type="radio" name="smartHome" value="desactivate"
<c:if
test="${!sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetActivate}"> checked="checked"
</c:if>> <fmt:message key="configuration.Desactivate"/>
</label> <br>
</div>
</div>
<!-- SmartHome - Add device-->
<div class="form-group">
<label class="col-md-4 control-label" for="AddDevice"></label>
<div class="col-md-4">
<div class="collapse" id="collapseDevice">
<div>
<h1>text</h1>
<h1>text</h1>
<button class="btn btn-primary">Add</button>
</div>
</div>
<!--
<button onclick="addDevice()" type="button" id="btnAddDevice" class="btn btn-primary btn-lg">Add Device</button>
-->
</div>
</div>
<!-- Champ dynamique configuration devices -->
<div class="form-group">
<div class="col-md-4" id="divChampAdd">
<ol id="listDevice">
</ol>
</div>
</div>
<!-- SmartHome - Activate Devices -->
<div class="form-group">
<label class="col-md-4 control-label" for="ActivateDevices">Activate
Device</label>
<div class="col-md-4">
<div class="checkbox">
<label for="ActivateDevices-0"> <input
type="checkbox" name="ActivateDevices"
id="ActivateDevices-0" value=""> Home Temperature
</label>
</div>
<div class="checkbox">
<label for="ActivateDevices-1"> <input
type="checkbox" name="ActivateDevices"
id="ActivateDevices-1" value=""> Home Security
System
</label>
</div>
</div>
</div>
</fieldset>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="btnSenseur" class="btn btn-primary" data-dismiss="modal">
<fmt:message key="configuration.Submit"/>
<span class="glyphicon glyphicon-send"></span>
</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- END MODAL SMART HOME -->
<!-- END MODALS -->
<div class="container" id="DragPanel">
<div class="jumbotron">
<h3><fmt:message key="configuration.PlaceYourComponents"/></h3>
<p><fmt:message key="configuration.PlaceYourComponentsMess"/></p>
</div>
</div>
<div id="configPanelId" class="drop parent">
<div id="WelcomeDrawId" class="drag ui-widget-content">
<p><fmt:message key="configuration.Welcome"/></p>
<img src="images/arrowResize.png" alt="..." class="icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="HorlogeDrawId" class="drag ui-widget-content">
<p>Date et Heure</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="WeatherDrawId" class="drag ui-widget-content">
<p>Meteo</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="NewsDrawId" class="drag ui-widget-content">
<p>News</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="AgendaDrawId" class="drag ui-widget-content">
<p>Agenda</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="TrafficDrawId" class="drag ui-widget-content">
<p>Traffic</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="RadioDrawId" class="drag ui-widget-content">
<p>Radio</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<div id="HouseDrawId" class="drag ui-widget-content">
<p>House</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
<!--
<div id="CryptoDrawId" class="drag ui-widget-content">
<p>Crypto</p>
</div>
<div id="SocialDrawId" class="drag ui-widget-content">
<p>Social Network</p>
<img id="imgNavSel" src="images/arrowResize.png" alt="..." class=" icon-small arrowResize">
<img src="images/brush.png" alt="..." class="icon-small brushColor">
<img src="images/font.png" alt="..." class="icon-small fontSelect">
</div>
-->
<div class="paletteColor">
<ul class="ulPaletteColor"></ul>
</div>
<div class="paletteFont">
<ul class="ulPaletteFont">
<li style="font-family:arial">Arial</li>
<li style="font-family:georgia">Georgia</li>
<li style="font-family:arial black">Arial Black</li>
<li style="font-family:comic sans ms">Comic Sans MS</li>
</ul>
</div>
</div>
<br></br>
<br>
<footer class="container-fluid text-center">
<div class="col-md-6 text-left copy">
<p>
Copyright &copy; 2017 MyMirror.
<fmt:message key="home.AllRights" />
</p>
</div>
</footer>
<script type="text/javascript">
var configPanelHeight = 0;
var configPanelWidth = 0;
var mirrorWidth = 1366;
var mirrorHeight = 768;
var coefSize;
var configPanelWidth;
var configPanelHeight;
var email= "${sessionScope.sessionUtilisateur.email}";
var sendAll = false;
var parentToColor="";
var parentToFont="";
$(".brushColor").hover(function(){
parent = "#"+$(this).closest('div').attr('id');
parentToColor = parent;
var posTopParent = parseFloat($(parent).css("top").replace('px',''));
var heightParent = parseFloat($(parent).css("height").replace('px',''));
$(".paletteColor").css("top", (posTopParent+heightParent));
$(".paletteColor").css("left", $(parent).css("left"));
$(".paletteColor").css({position:"absolute", display: "block"});
}, function(){
$(".paletteColor").hover(function(){
$(".paletteColor").css("display","block");
},function(){
$(".paletteColor").css("display","none");
});
$(".paletteColor").css("display","none");
});
$(".fontSelect").hover(function(){
parent = "#"+$(this).closest('div').attr('id');
parentToFont = parent;
var posTopParent = parseFloat($(parent).css("top").replace('px',''));
var heightParent = parseFloat($(parent).css("height").replace('px',''));
$(".paletteFont").css("top", (posTopParent+heightParent));
$(".paletteFont").css("left", $(parent).css("left"));
$(".paletteFont").css({position:"absolute", display: "block"});
}, function(){
$(".paletteFont").hover(function(){
$(".paletteFont").css("display","block");
},function(){
$(".paletteFont").css("display","none");
});
$(".paletteFont").css("display","none");
});
$(document).on("mouseout", ".ulPaletteColor > li", function(event){
switch (parentToColor){
case "#WelcomeDrawId":
$("#WelcomeDrawId").css("color",affWelcome.color);
break;
case "#HorlogeDrawId":
$("#HorlogeDrawId").css("color",affHorloge.color);
break;
case "#WeatherDrawId":
$("#WeatherDrawId").css("color",affWeather.color);
break;
case "#NewsDrawId":
$("#NewsDrawId").css("color",affNews.color);
break;
case "#AgendaDrawId":
$("#AgendaDrawId").css("color",affAgenda.color);
break;
case "#TrafficDrawId":
$("#TrafficDrawId").css("color",affTraffic.color);
break;
case "#HouseDrawId":
$("#HouseDrawId").css("color",affSenseur.color);
break;
}
});
$(document).on("mouseout", ".ulPaletteFont > li", function(event){
switch (parentToFont){
case "#WelcomeDrawId":
$("#WelcomeDrawId").css("font-family",affWelcome.font);
break;
case "#HorlogeDrawId":
$("#HorlogeDrawId").css("font-family",affHorloge.font);
break;
case "#WeatherDrawId":
$("#WeatherDrawId").css("font-family",affWeather.font);
break;
case "#NewsDrawId":
$("#NewsDrawId").css("font-family",affNews.font);
break;
case "#AgendaDrawId":
$("#AgendaDrawId").css("font-family",affAgenda.font);
break;
case "#TrafficDrawId":
$("#TrafficDrawId").css("font-family",affTraffic.font);
break;
case "#HouseDrawId":
$("#HouseDrawId").css("font-family",affSenseur.font);
break;
}
});
$(document).on("mouseover", ".ulPaletteColor > li", function(event){
switch (parentToColor){
case "#WelcomeDrawId":
$("#WelcomeDrawId").css("color",$(this).css('background-color'));
break;
case "#HorlogeDrawId":
$("#HorlogeDrawId").css("color",$(this).css('background-color'));
break;
case "#WeatherDrawId":
$("#WeatherDrawId").css("color",$(this).css('background-color'));
break;
case "#NewsDrawId":
$("#NewsDrawId").css("color",$(this).css('background-color'));
break;
case "#AgendaDrawId":
$("#AgendaDrawId").css("color",$(this).css('background-color'));
break;
case "#TrafficDrawId":
$("#TrafficDrawId").css("color",$(this).css('background-color'));
break;
case "#HouseDrawId":
$("#HouseDrawId").css("color",$(this).css('background-color'));
break;
}
});
$(document).on("mouseover", ".ulPaletteFont > li", function(event){
switch (parentToFont){
case "#WelcomeDrawId":
$("#WelcomeDrawId").css("font-family",$(this).css('font-family'));
break;
case "#HorlogeDrawId":
$("#HorlogeDrawId").css("font-family",$(this).css('font-family'));
break;
case "#WeatherDrawId":
$("#WeatherDrawId").css("font-family",$(this).css('font-family'));
break;
case "#NewsDrawId":
$("#NewsDrawId").css("font-family",$(this).css('font-family'));
break;
case "#AgendaDrawId":
$("#AgendaDrawId").css("font-family",$(this).css('font-family'));
break;
case "#TrafficDrawId":
$("#TrafficDrawId").css("font-family",$(this).css('font-family'));
break;
case "#HouseDrawId":
$("#HouseDrawId").css("font-family",$(this).css('font-family'));
break;
}
});
$(document).on("click", ".ulPaletteColor > li", function(event){
switch (parentToColor){
case "#WelcomeDrawId":
affWelcome.color=rgb2hex($(this).css('background-color'));
saveSendColor(affWelcome,'#WelcomeDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affWelcome.color.replace("#","H") + ',"widget":' + 'Welcome' +'}');
break;
case "#HorlogeDrawId":
affHorloge.color=rgb2hex($(this).css('background-color'));
saveSendColor(affHorloge,'#HorlogeDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affHorloge.color.replace("#","H") + ',"widget":' + 'Hour' +'}');
break;
case "#WeatherDrawId":
affWeather.color=rgb2hex($(this).css('background-color'));
saveSendColor(affWeather,'#WeatherDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affWeather.color.replace("#","H") + ',"widget":' + 'Weather' +'}');
break;
case "#NewsDrawId":
affNews.color=rgb2hex($(this).css('background-color'));
saveSendColor(affNews,'#NewsDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affNews.color.replace("#","H") + ',"widget":' + 'News' +'}');
break;
case "#AgendaDrawId":
affAgenda.color=rgb2hex($(this).css('background-color'));
saveSendColor(affAgenda,'#AgendaDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affAgenda.color.replace("#","H") + ',"widget":' + 'Agenda' +'}');
break;
case "#TrafficDrawId":
affTraffic.color=rgb2hex($(this).css('background-color'));
saveSendColor(affTraffic,'#TrafficDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affTraffic.color.replace("#","H") + ',"widget":' + 'Traffic' +'}');
break;
case "#HouseDrawId":
affSenseur.color=rgb2hex($(this).css('background-color'));
saveSendColor(affSenseur,'#HouseDrawId');
ajaxFct('UpdateWidgetColor','{"email":' + email + ',"color":' + affSenseur.color.replace("#","H") + ',"widget":' + 'SmartHome' +'}');
break;
}
$(".paletteColor").css("display","none");
});
$(document).on("click", ".ulPaletteFont > li", function(event){
switch (parentToFont){
case "#WelcomeDrawId":
affWelcome.font=$(this).css('font-family');
saveSendFont(affWelcome,'#WelcomeDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affWelcome.font + ',"widget":' + 'Welcome' +'}');
break;
case "#HorlogeDrawId":
affHorloge.font=$(this).css('font-family');
saveSendFont(affHorloge,'#HorlogeDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affHorloge.font + ',"widget":' + 'Hour' +'}');
break;
case "#WeatherDrawId":
affWeather.font=$(this).css('font-family');
saveSendFont(affWeather,'#WeatherDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affWeather.font + ',"widget":' + 'Weather' +'}');
break;
case "#NewsDrawId":
affNews.font=$(this).css('font-family');
saveSendFont(affNews,'#NewsDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affNews.font + ',"widget":' + 'News' +'}');
break;
case "#AgendaDrawId":
affAgenda.font=$(this).css('font-family');
saveSendFont(affAgenda,'#AgendaDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affAgenda.font + ',"widget":' + 'Agenda' +'}');
break;
case "#TrafficDrawId":
affTraffic.font=$(this).css('font-family');
saveSendFont(affTraffic,'#TrafficDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affTraffic.font + ',"widget":' + 'Traffic' +'}');
break;
case "#HouseDrawId":
affSenseur.font=$(this).css('font-family');
saveSendFont(affSenseur,'#HouseDrawId');
ajaxFct('UpdateWidgetFont','{"email":' + email + ',"font":' + affSenseur.font + ',"widget":' + 'SmartHome' +'}')
break;
}
$(".paletteFont").css("display","none");
});
window.onload = function() {
};
$(document).ready(function(){
//alert(affWelcome.color);
var $palette = $('.ulPaletteColor');
for (var i = 0; i < colours.length; i++)
{
$palette.append($('<li />').css('background-color', colours[i].hex));
};
configPanelWidth = document.getElementById('configPanelId').offsetWidth;
$("#configPanelId").css('width',configPanelWidth+'px' );
configPanelHeight = (configPanelWidth*mirrorHeight)/mirrorWidth;
$("#configPanelId").css('height',configPanelHeight+'px' );
// coefSize est le coeficient avec lequel il faut multiplier les position et les tailles pour que la preview corresponde au miroir réel.
coefSize=configPanelWidth/mirrorWidth;
/*alert('coef width ='+(configPanelWidth/mirrorWidth));
alert('coef height ='+(configPanelHeight/mirrorHeight));*/
//alert(coefSize);
var email= "${sessionScope.sessionUtilisateur.email}";
displaySpan("#listWelcome","#spanWelcomeSetting","#spanWelcomeAdd","#spanWelcomeMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetActivate}", '#WelcomeDrawId');
displaySpan("#listDate","#spanDateSetting","#spanDateAdd","#spanDateMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetActivate}",'#HorlogeDrawId');
displaySpan("#listWeather","#spanWeatherSetting","#spanWeatherAdd","#spanWeatherMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetActivate}", '#WeatherDrawId');
displaySpan("#listNews","#spanNewsSetting","#spanNewsAdd","#spanNewsMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetActivate}", '#NewsDrawId');
displaySpan("#listAgenda","#spanAgendaSetting","#spanAgendaAdd","#spanAgendaMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetActivate}",'#AgendaDrawId');
displaySpan("#listTraffic","#spanTrafficSetting","#spanTrafficAdd","#spanTrafficMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetActivate}",'#TrafficDrawId');
displaySpan("#listSocialNetworks","#spanSocialNetworksSetting","#spanSocialNetworksAdd","#spanSocialNetworksMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('socialNetwork').widgetSocialNetworksActivate}",'#SocialDrawId');
displaySpan("#listSmartHome","#spanSmartHomeSetting","#spanSmartHomeAdd","#spanSmartHomeMinus","${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetActivate}",'#HouseDrawId');
$("#listRadio").hover(function(){
$("#spanRadioSetting").css("display", "inline-block");
//alert($(drawId).css("display"));
//if (sessionScope=="false"){
if ($("#radioPower").css("display")=="none"){
$("#spanRadioAdd").css("display", "inline-block");
$("#spanRadioMinus").css("display", "none");
}
else {
$("#spanRadioAdd").css("display", "none");
$("#spanRadioMinus").css("display", "inline-block");
}
}, function(){
$("#spanRadioAdd").css("display", "none");
$("#spanRadioMinus").css("display", "none");
$("#spanRadioSetting").css("display", "none");
});
$("#checkSubmitWelcome").hide();
$("#checkSubmitDate").hide();
$("#checkSubmitWeather").hide();
$("#checkSubmitNews").hide();
$("#checkSubmitAgenda").hide();
$("#checkSubmitTraffic").hide();
$("#checkSubmitSocial").hide();
$("#checkSubmitRadio").hide();
$("#checkSubmitSenseur").hide();
$("#checkSubmitCrypto").hide();
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetActivate}"=="false") $("#WelcomeDrawId").hide();
initDraw("#WelcomeDrawId",affWelcome);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetActivate}"=="false") $("#HorlogeDrawId").hide();
initDraw("#HorlogeDrawId",affHorloge);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetActivate}"=="false") $("#WeatherDrawId").hide();
initDraw("#WeatherDrawId",affWeather);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetActivate}"=="false") $("#NewsDrawId").hide();
initDraw("#NewsDrawId",affNews);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetActivate}"=="false") $("#AgendaDrawId").hide();
initDraw("#AgendaDrawId",affAgenda);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetActivate}"=="false") $("#TrafficDrawId").hide();
initDraw("#TrafficDrawId",affTraffic);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('radio').logo}"=="false" || "${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetActivate}"=="false") $("#RadioDrawId").hide();
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetActivate}"=="false"){
$("#radioPower").css("display","none")
}
else {$("#radioPower").css("display","inline-block")}
initDraw("#RadioDrawId",affRadio);
if ("${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetActivate}"=="false") $("#HouseDrawId").hide();
initDraw("#HouseDrawId",affSenseur);
});
var wsbroker = "m21.cloudmqtt.com"; //mqtt websocket enabled broker
var wsport = 38932 // port for above
var client = new Paho.MQTT.Client(wsbroker, wsport,
"web_" + parseInt(Math.random() * 100, 10));//alert("Client_" + parseInt(Math.random() * 100, 10));
// set callback handlers
var open = "true";
client.onConnectionLost = onConnectionLost;
//client.onConnectionLost = onConnectionLost;
//client.onMessageArrived = onMessageArrived;
var options = {
useSSL: true,
userName: "oilkfgjy",
password: "lEyZb90q49Rf",
onSuccess:onConnect,
onFailure:doFail
}
// connect the client
client.connect(options);
/*message = new Paho.MQTT.Message("5");
message.destinationName = "temp";
client.send(message);*/
// called when the client connects
function onConnect() {
client.subscribe("MAJ");
//alert("connect");
$("#btnWelcome").click(function(){
//alert('send2');
message = new Paho.MQTT.Message("Welcome");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnDate").click(function(){
message = new Paho.MQTT.Message("Date");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnWeather").click(function(){
message = new Paho.MQTT.Message("Weather");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnNews").click(function(){
message = new Paho.MQTT.Message("News");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnAgenda").click(function(){
message = new Paho.MQTT.Message("Agenda");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnRadio").click(function(){
message = new Paho.MQTT.Message("Radio");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnSenseur").click(function(){
message = new Paho.MQTT.Message("Senseur");
message.destinationName = "MAJ";
client.send(message);
});
$("#btnSubmitPos").click(function(){
message = new Paho.MQTT.Message("SubmitPos");
message.destinationName = "MAJ";
client.send(message);
//alert('submit');
});
}
function doFail(e){
//console.log(e);
}
function doSend(e){
//console.log(e);
}
// called when the client loses its connection
function onConnectionLost(responseObject) {
if (responseObject.errorCode !== 0) {
//console.log("onConnectionLost:"+responseObject.errorMessage);
//alert("onConnectionLost:"+responseObject.errorMessage);
}
}
//client.publish("temp", payload="5", qos=0, retain=False);
var affWelcome = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetCoordY}",
message:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').message}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('welcome').widgetColor}",
size:"",
top:0,
left:0
};
var affHorloge = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetCoordY}",
timezone:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').timeZone}",
form:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetForm}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('hour').widgetColor}",
size:"",
top:0,
left:0
};
var affWeather = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetCoordY}",
city:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').city}",
parametre0:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').wind}",
parametre1:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').rain}",
parametre2:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').nextDays}",
form:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetForm}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('weather').widgetColor}",
size:"",
top:0,
left:0
};
var affNews ={
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetCoordY}",
country:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').country}",
provider:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').providerNews}",
speed:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').speed}",
form:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetForm}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('news').widgetColor}",
size:"",
top:0,
left:0
};
var affAgenda = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetCoordY}",
provider:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').provider}",
form:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetForm}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('agenda').widgetColor}",
size:"",
top:0,
left:0
};
var affTraffic = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetCoordY}",
workcity:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workCity}",
workaddress:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workAddress}",
workpostcode:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').workPostCode}",
monday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').monday}",
tuesday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').tuesday}",
wednesday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').wednesday}",
thursday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').thursday}",
friday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').friday}",
saturday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').saturday}",
sunday:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').sunday}",
form:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetForm}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('traffic').widgetColor}",
size:"",
top:0,
left:0
};
var affSocial = {
hauteur:"0px",
largeur:"0px",
width:0,
height:0,
coordX:"1000px",
coordY:"1000px",
network:"",
form:"",
font:"",
color:"",
size:"",
top:0,
left:0
};
var affRadio = {
hauteur:"${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetHeight}",
largeur:"${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetWidth}",
width:0,
height:0,
coordX:"${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetCoordX}",
coordY:"${sessionScope.sessionUtilisateur.display.widgetList.get('radio').widgetCoordY}",
provider:"${sessionScope.sessionUtilisateur.display.widgetList.get('radio').providerRadio}",
show: "${sessionScope.sessionUtilisateur.display.widgetList.get('radio').logo}",
color: "",
top:0,
left:0
};
var affSenseur = {
hauteur : "${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetHeight}",
largeur : "${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetWidth}",
width:0,
height:0,
coordX : "${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetCoordX}",
coordY : "${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetCoordY}",
font:"${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetFont}",
color:"${sessionScope.sessionUtilisateur.display.widgetList.get('smartHome').widgetColor}",
top:0,
left:0
};
var affCrypto = {
hauteur:"0px",
largeur:"0px",
width:0,
height:0,
coordX:"1000px",
coordY:"1000px",
bitcoin:"",
ethereum:"",
litecoin:"",
ripple:"",
eos:"",
percentageHour:"",
percentage24Hour:"",
percentageDay:"",
form:"",
font:"",
color:"",
size:"",
top:0,
left:0
};
var colours = [
{ name: 'Yellow', hex: '#FFFF00' },
{ name: 'LawnGreen', hex: '#7CFC00' },
{ name: 'Aqua', hex: '#00FFFF' },
{ name: 'Fuchsia', hex: '#FF00FF' },
{ name: 'Blue', hex: '#0000FF' },
{ name: 'Red', hex: '#FF0000' },
{ name: 'DarkBlue', hex: '#00008B' },
{ name: 'DarkCyan', hex: '#008B8B' },
{ name: 'DarkGreen', hex: '#006400' },
{ name: 'DarkMagenta', hex: '#8B008B' },
{ name: 'DarkRed', hex: '#8B0000' },
{ name: 'DarkGoldenRod', hex: '#B8860B' },
{ name: 'DarkGray', hex: '#A9A9A9' },
{ name: 'LightGray', hex: '#D3D3D3' },
{ name: 'White', hex: '#FFFFFF' }
];
$('.drop').droppable({
tolerance: 'fit'
});
$('.drag').resizable({
//maxWidth: mirrorWidth - posXElmt
//maxWidth : 300
handles: 'se',
aspectRatio: true,
stop: function(){
switch (this.id){
case "WelcomeDrawId":
saveSendSize(affWelcome,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affWelcome.hauteur + ',"width":' + affWelcome.largeur + ',"widget":' + 'Welcome' +'}')
break;
case "HorlogeDrawId":
saveSendSize(affHorloge,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affHorloge.hauteur + ',"width":' + affHorloge.largeur + ',"widget":' + 'Hour' +'}');
break;
case "WeatherDrawId":
saveSendSize(affWeather,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affWeather.hauteur + ',"width":' + affWeather.largeur + ',"widget":' + 'Weather' +'}');
break;
case "NewsDrawId":
saveSendSize(affNews,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affNews.hauteur + ',"width":' + affNews.largeur + ',"widget":' + 'News' +'}');
break;
case "AgendaDrawId":
saveSendSize(affAgenda,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affAgenda.hauteur + ',"width":' + affAgenda.largeur + ',"widget":' + 'Agenda' +'}');
break;
case "TrafficDrawId":
saveSendSize(affTraffic,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affTraffic.hauteur + ',"width":' + affTraffic.largeur + ',"widget":' + 'Traffic' +'}');
break;
case "SocialDrawId":
saveSendSize(affSocial,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affSocial.hauteur + ',"width":' + affSocial.largeur + ',"widget":' + 'SocialNetworks' +'}');
break;
case "CryptoDrawId":
saveSendSize(affCrypto,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affCrypto.hauteur + ',"width":' + affCrypto.largeur + ',"widget":' + 'Crypto' +'}');
break;
case "HouseDrawId":
saveSendSize(affSenseur,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affSenseur.hauteur + ',"width":' + affSenseur.largeur + ',"widget":' + 'SmartHome' +'}');
break;
case "RadioDrawId":
saveSendSize(affRadio,this);
ajaxFct('UpdateWidgetSize','{"email":' + email + ',"height":' + affRadio.hauteur + ',"width":' + affRadio.largeur + ',"widget":' + 'Radio' +'}');
break;
}
}
});
$('.drag').draggable({
containment: "parent",
//snap : true,
grid: [ 1, 1 ],
revert: 'invalid',
stop: function(){
//$(this).draggable('option','revert','invalid');
switch (this.id){
case "WelcomeDrawId":
saveSendPos(affWelcome,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affWelcome.coordX + ',"coordY":' + affWelcome.coordY + ',"widget":' + 'Welcome' +'}');
break;
case "HorlogeDrawId":
saveSendPos(affHorloge,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affHorloge.coordX + ',"coordY":' + affHorloge.coordY + ',"widget":' + 'Hour' +'}');
break;
case "WeatherDrawId":
saveSendPos(affWeather,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affWeather.coordX + ',"coordY":' + affWeather.coordY + ',"widget":' + 'Weather' +'}');
break;
case "NewsDrawId":
saveSendPos(affNews,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affNews.coordX + ',"coordY":' + affNews.coordY + ',"widget":' + 'News' +'}');
break;
case "AgendaDrawId":
saveSendPos(affAgenda,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affAgenda.coordX + ',"coordY":' + affAgenda.coordY + ',"widget":' + 'Agenda' +'}');
break;
case "TrafficDrawId":
saveSendPos(affTraffic,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affTraffic.coordX + ',"coordY":' + affTraffic.coordY + ',"widget":' + 'Traffic' +'}');
break;
case "SocialDrawId":
saveSendPos(affSocial,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affSocial.coordX + ',"coordY":' + affSocial.coordY + ',"widget":' + 'SocialNetworks' +'}');
break;
case "CryptoDrawId":
saveSendPos(affCrypto,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affCrypto.coordX + ',"coordY":' + affCrypto.coordY + ',"widget":' + 'Crypto' +'}');
break;
case "HouseDrawId":
saveSendPos(affSenseur,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affSenseur.coordX + ',"coordY":' + affSenseur.coordY + ',"widget":' + 'SmartHome' +'}');
break;
case "RadioDrawId":
saveSendPos(affRadio,this);
ajaxFct('UpdateWidgetPos','{"email":' + email + ',"coordX":' + affRadio.coordX + ',"coordY":' + affRadio.coordY + ',"widget":' + 'Radio' +'}');
break;
}
}
});
$('.drag').droppable({
greedy: true,
tolerance: 'fit',
drop: function(event,ui){
ui.draggable.draggable('option','revert',true);
}
});
function ajaxFct(url,data){
$.ajax({
url : url,
type : 'POST',
data : data,
dataType : 'html',
success : function(result){
},
});
};
// A moi //
function ajaxFct2(url,data){
$.ajax({
url : url,
type : 'POST',
data : data,
dataType : 'html',
success : function(result){
},
});
};
$("#btnWelcome").click(function(){
sendAll = true;
var message=$("#messWelcome").val();
affWelcome.message=message;
var activate=$('input[name=welcome]:checked').val();
if (activate == "activate"){
addWidget('#WelcomeDrawId','#spanWelcomeAdd','#spanWelcomeMinus','input[name=welcome][value=activate]');
$("#spanWelcomeMinus").css("display","none");
}
else {
removeWidget('#WelcomeDrawId','#spanWelcomeAdd','#spanWelcomeMinus','input[name=welcome][value=desactivate]');
$("#spanWelcomeAdd").css("display","none");
}
});
$("#btnDate").click(function(){
var timezone=$("#TimeZone option:selected").text();
affHorloge.timezone=timezone;
var form=$("#FormDate option:selected").text();
affHorloge.form=form;
var activate=$('input[name=date]:checked').val();
if (activate == "activate"){
addWidget('#HorlogeDrawId','#spanDateAdd','#spanDateMinus','input[name=date][value=activate]');
$("#spanDateMinus").css("display","none");
}
else {
removeWidget('#HorlogeDrawId','#spanDateAdd','#spanDateMinus','input[name=date][value=activate]');
$("#spanDateAdd").css("display","none");
}
});
$("#btnWeather").click(function(){
var city=$("#CityWeather").val();
affWeather.city=city;
//alert(affWeather.city);
//var parametre0=$("#ParametersWeather-0 is:checked");
var wind=$('#ParametersWeather-0').is(':checked');
//alert($('#ParametersWeather-0').is(':checked'));
affWeather.parametre0=wind;
var rain=$('#ParametersWeather-1').is(':checked');
//alert($('#ParametersWeather-1').is(':checked'));
affWeather.parametre1=rain;
var nextdays=$('#ParametersWeather-2').is(':checked');
//alert($('#ParametersWeather-2').is(':checked'));
affWeather.parametre2=nextdays;
var form=$("#FormWeather option:selected").text();
affWeather.form=form;
var activate=$('input[name=weather]:checked').val();
if (activate == "activate"){
addWidget('#WeatherDrawId','#spanWeatherAdd','#spanWeatherMinus','input[name=weather][value=activate]');
$("#spanWeatherMinus").css("display","none");
}
else {
removeWidget('#WeatherDrawId','#spanWeatherAdd','#spanWeatherMinus','input[name=weather][value=desactivate]');
$("#spanWeatherAdd").css("display","none");
}
});
$("#btnNews").click(function(){
var country=$("#countryNews option:selected").text();
affNews.country=country;
var provider=$("#NewsProvider option:selected").text();
affNews.provider=provider;
var speed=$("#ChangeSpeed option:selected").text();
affNews.speed=speed;
var form=$("#FormNews option:selected").text();
affNews.form=form;
var activate=$('input[name=news]:checked').val();
if (activate == "activate"){
addWidget('#NewsDrawId','#spanNewsAdd','#spanNewsMinus','input[name=news][value=activate]');
$("#spanNewsMinus").css("display","none");
}
else {
removeWidget('#NewsDrawId','#spanNewsAdd','#spanNewsMinus','input[name=news][value=desactivate]');
$("#spanNewsAdd").css("display","none");
}
});
$("#btnAgenda").click(function(){
var provider=$("#AgendaProvider option:selected").text();
affAgenda.provider=provider;
var form=$("#FormAgenda option:selected").text();
affAgenda.form=form;
var font=$("#FontAgenda option:selected").text();
affAgenda.font=font;
var color=$("#ColorAgenda option:selected").text();
affAgenda.color=color;
var activate=$('input[name=agenda]:checked').val();
if (activate == "activate"){
addWidget('#AgendaDrawId','#spanAgendaAdd','#spanAgendaMinus','input[name=agenda][value=activate]');
$("#spanAgendaMinus").css("display","none");
}
else {
removeWidget('#AgendaDrawId','#spanAgendaAdd','#spanAgendaMinus','input[name=agenda][value=desactivate]');
$("#spanAgendaAdd").css("display","none");
}
});
$("#btnTraffic").click(function(){
var workcity=$("#WorkCity").val();
affTraffic.workcity=workcity;
var workaddress=$("#WorkAddress").val();
affTraffic.workaddress=workaddress;
var workpostcode=$("#WorkPostCode").val();
affTraffic.workpostcode=workpostcode;
var monday=$('#WorkingDays-0').is(':checked');
affTraffic.monday=monday;
var tuesday=$('#WorkTime-1').is(':checked');
affTraffic.tuesday=tuesday;
var wednesday=$('#WorkTime-2').is(':checked');
affTraffic.wednesday=wednesday;
var thursday=$('#WorkTime-3').is(':checked');
affTraffic.thursday=thursday;
var friday=$('#WorkTime-4').is(':checked');
affTraffic.friday=friday;
var saturday=$('#WorkTime-5').is(':checked');
affTraffic.saturday=saturday;
var sunday=$('#WorkTime-6').is(':checked');
affTraffic.sunday=sunday;
var form=$("#FormTraffic option:selected").text();
affTraffic.form=form;
var activate=$('input[name=traffic]:checked').val();
if (activate == "activate"){
addWidget('#TrafficDrawId','#spanTrafficAdd','#spanTrafficMinus','input[name=traffic][value=activate]');
$("#spanTrafficMinus").css("display","none");
}
else {
removeWidget('#TrafficDrawId','#spanTrafficAdd','#spanTrafficMinus','input[name=traffic][value=desactivate]');
$("#spanTrafficAdd").css("display","none");
}
});
$("#btnNetwork").click(function(){
var network=$("#SocialNetwork option:selected").text();
affSocial.network=network;
//alert(affSocial.network);
var activate=$('input[name=social]:checked').val();
if (activate == "activate"){
addWidget('#SocialDrawId','#spanSocialNetworksAdd','#spanSocialNetworksMinus');
$("#spanSocialNetworksMinus").css("display","none");
}
else {
removeWidget('#SocialDrawId','#spanSocialNetworksAdd','#spanSocialNetworksMinus');
$("#spanSocialNetworksAdd").css("display","none");
}
//alert (activate);
var form=$("#formNetwork option:selected").text();
affSocial.form=form;
//alert(affSocial.form);
var font=$("#FontNetwork option:selected").text();
affSocial.font=font;
//alert(affSocial.font);
var color=$("#ColorNetwork option:selected").text();
affSocial.color=color;
//alert(affSocial.color);
var size=$("#SizeNetwork option:selected").text();
//alert (size);
var email= "${sessionScope.sessionUtilisateur.email}";
$.ajax({
url : 'UpdateWidgetSocialNetworksParam',
type : 'POST',
data : '{"email":' + email + ',"network":' + network + ',"form":' + form + ',"font":' + font + ',"color":' + color + ',"activate":' + activate + ',"size":' + size + '}',
dataType : 'html',
success : function(result){
},
});
$("#checkSubmitSocial").show(1000);
$("#checkSubmitSocial").hide(2000);
});
$("#btnRadio").click(function(){
var provider=$("#ProviderRadio option:selected").text();
affRadio.provider=provider;
var activate=$('input[name=radioStatus]:checked').val();
var show=$('input[name=radioDisplay]:checked').val();
affRadio.show=show;
//alert(activate);
if(activate == "activate"){
$("#radioPower").css("display","inline-block");
addWidget('#RadioDrawId','#spanRadioAdd','#spanRadioMinus','input[name=radioStatus][value=activate]');
$("#spanRadioMinus").css("display","none");
if(show == "activate"){
addWidget('#RadioDrawId','#spanRadioAdd','#spanRadioMinus','input[name=radioStatus][value=activate]');
$("#RadioDrawId").css("display","block");
$("#spanRadioMinus").css("display","none");
}
else {
$("#RadioDrawId").css("display","none");
}
}
else {
removeWidget('#RadioDrawId','#spanRadioAdd','#spanRadioMinus','input[name=radioStatus][value=desactivate]');
$("#radioPower").css("display","none");
$("#spanRadioAdd").css("display","none");
}
});
$("#btnSenseur").click(function(){
var font=$("#FontSmartHome option:selected").text();
affSenseur.font=font;
var color=$("#ColorSmartHome option:selected").text();
affSenseur.color=color;
var activate=$('input[name=smartHome]:checked').val();
if (activate == "activate"){
addWidget('#HouseDrawId','#spanSmartHomeAdd','#spanSmartHomeMinus','input[name=smartHome][value=activate]');
$("#spanSmartHomeMinus").css("display","none");
}
else {
removeWidget('#HouseDrawId','#spanSmartHomeAdd','#spanSmartHomeMinus','input[name=smartHome][value=desactivate]');
$("#spanSmartHomeAdd").css("display","none");
}
});
$("#btnCrypto").click(function(){ // ICICIHCIHCHHHHHhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhDDDDDDDD
var bitcoin=$("#SelectCrypto-0").is(':checked');
affCrypto.bitcoin=bitcoin;
var ethereum=$("#SelectCrypto-1").is(':checked');
affCrypto.ethereum=ethereum;
var litecoin=$("#SelectCrypto-2").is(':checked');
affCrypto.litecoin=litecoin;
var ripple=$("#SelectCrypto-3").is(':checked');
affCrypto.ripple=ripple;
var eos=$("#SelectCrypto-4").is(':checked');
affCrypto.eos=eos;
var percentageHour=$('#ParamCrypto-0').is(':checked');
affCrypto.percentageHour=percentageHour;
var percentage24Hour=$('#ParamCrypto-1').is(':checked');
affCrypto.percentage24Hour=percentage24Hour;
var percentageDay=$('#ParamCrypto-2').is(':checked');
affCrypto.percentageDay=percentageDay;
var activate=$('input[name=crypto]:checked').val();
if (activate == "activate"){
addWidget('#CryptoDrawId','#spanCryptoAdd','#spanCryptoMinus');
$("#spanCryptoMinus").css("display","none");
}
else {
removeWidget('#CryptoDrawId','#spanCryptoAdd','#spanCryptoMinus');
$("#spanCryptoAdd").css("display","none");
}
//alert (activate);
var form=$("#FormCrypto option:selected").text();
affCrypto.form=form;
var font=$("#FontCrypto option:selected").text();
affCrypto.font=font;
var color=$("#ColorCrypto option:selected").text();
affCrypto.color=color;
var size=$("#SizeCrypto option:selected").text();
//alert (size);
affCrypto.size=size;
if (size == "Small"){
affCrypto.larg="100px";
affCrypto.haut="100px";
}
else if (size == "Medium"){
affCrypto.larg="150px";
affCrypto.haut="150px";
}
else if (size == "Big"){
affCrypto.larg="200px";
affCrypto.haut="200px";
}
var email= "${sessionScope.sessionUtilisateur.email}";
$.ajax({
url : 'UpdateWidgetCryptoParam',
type : 'GET',
data : 'email=' + email + '&bitcoin=' + bitcoin + '&ethereum=' + ethereum + '&litecoin=' + litecoin + '&ripple=' + ripple + '&eos=' + eos + '&percentageHour=' + percentageHour + '&percentage24Hour=' + percentage24Hour + '&percentageDay=' + percentageDay +'&form=' + form + '&font=' + font + '&color=' + color + '&activate=' + activate + '&size=' + size ,
dataType : 'html',
success : function(result){
},
});
$("#checkSubmitCrypto").show(1000);
$("#checkSubmitCrypto").hide(2000);
});
function toggleText(button_id) {
var el = document.getElementById(button_id);
if (el.innerHTML == "Show")
{
el.innerHTML = "Hide";
}
else
{
el.innerHTML = "Show";
}
};
function fondu(id, opacity){
opacity = (!opacity ? 0 : opacity)+20;
var item = document.getElementById(id).style;
item.opacity = (opacity/100);
item.filter = 'alpha(opacity='+opacity+')';
if(opacity < 100){
var time = 100;
setTimeout('fondu(\''+id+'\', '+opacity+')', time);
}
}
</script>
</body>
</html>