This is an automated email from the git hooks/post-receive script. New commit to branch refonteUI in repository pollen. See http://git.chorem.org/pollen.git commit 333c56754d2b3056fb58ec1a047ed189304d78e6 Author: Léo Kaufmann <kaufmann@codelutin.com> Date: Tue Mar 17 16:16:52 2015 +0100 Refs #1204 : Continuing page reorganization and new design integration --- pollen-ui-angular/pom.xml | 1 + .../src/main/webapp/font/Pacifico.ttf | Bin 0 -> 43632 bytes pollen-ui-angular/src/main/webapp/i18n/en.js | 9 +- pollen-ui-angular/src/main/webapp/i18n/fr.js | 12 +- pollen-ui-angular/src/main/webapp/index.html | 204 ++++--- pollen-ui-angular/src/main/webapp/less/main.less | 629 +++++++++++++++++++++ .../src/main/webapp/less/variables.less | 4 +- .../src/main/webapp/partials/footer.html | 14 + .../src/main/webapp/partials/home.html | 39 +- .../src/main/webapp/partials/inline-poll.html | 226 ++++---- .../src/main/webapp/partials/poll-info.html | 101 ++-- .../src/main/webapp/partials/poll-link.html | 5 +- .../src/main/webapp/partials/poll-list.html | 70 ++- .../src/main/webapp/partials/poll-poll.html | 92 +-- .../src/main/webapp/partials/poll-settings.html | 56 +- .../webapp/partials/{home.html => poll-vote.html} | 21 +- .../src/main/webapp/partials/poll.html | 212 ++++--- .../src/main/webapp/partials/user-edit.html | 22 +- 18 files changed, 1221 insertions(+), 496 deletions(-) diff --git a/pollen-ui-angular/pom.xml b/pollen-ui-angular/pom.xml index 8bb0819..8e3d003 100644 --- a/pollen-ui-angular/pom.xml +++ b/pollen-ui-angular/pom.xml @@ -148,6 +148,7 @@ <compress>true</compress> <includes> <include>style.less</include> + <include>main.less</include> </includes> </configuration> <executions> diff --git a/pollen-ui-angular/src/main/webapp/font/Pacifico.ttf b/pollen-ui-angular/src/main/webapp/font/Pacifico.ttf new file mode 100644 index 0000000..122e451 Binary files /dev/null and b/pollen-ui-angular/src/main/webapp/font/Pacifico.ttf differ diff --git a/pollen-ui-angular/src/main/webapp/i18n/en.js b/pollen-ui-angular/src/main/webapp/i18n/en.js index 3643d2c..a833ec5 100644 --- a/pollen-ui-angular/src/main/webapp/i18n/en.js +++ b/pollen-ui-angular/src/main/webapp/i18n/en.js @@ -8,12 +8,12 @@ * it under the terms of the GNU Affero General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. - * + * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. - * + * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see <http://www.gnu.org/licenses/>. * #L% @@ -37,6 +37,7 @@ var translateEN = { 'home.description' : 'Create now your poll. Share the vote link. And show the result.', 'home.newPoll' : 'Create a poll', 'home.register' : 'Sign-in now', +'home.userAccount' : 'Un compte personnel vous permettra de retrouver facilement les sondages que vous avez créé et ceux auxquels vous avez participés.', 'admin' : 'Administration', 'admin.listPoll' : 'List of Polls', @@ -119,7 +120,7 @@ var translateEN = { 'poll.edit.choice' : 'Click to edit the choice', 'poll.edit.title' : 'Click to edit the title', 'poll.title' : 'Title', -'poll.desc' : 'Description is optional. This message will not visible in vote page.', +'poll.desc' : 'Description', 'poll.saved' : 'Poll saved.', 'poll.created.printLink' : 'You can modify your poll to using this address when you are not connected: {{url}}', 'poll.cloned' : 'Poll cloned', @@ -151,6 +152,7 @@ var translateEN = { 'poll.config.title.poll.validityDates' : 'Validity dates', 'poll.config.title.poll.voteCountingType': 'Vote counting Type', 'poll.config.title.choice' : 'Choice config', +'poll.config.title.choice.availableChoices' : 'Available choices', 'poll.config.title.vote' : 'Vote config', 'poll.config.title.visibility' : 'Visibility and restrictions', 'poll.config.label.creatorName' : 'Your name', @@ -345,4 +347,3 @@ var i18n_EN = { "id": "en", "pluralCat": function (n) { if (n == 1) { return PLURAL_CATEGORY.ONE; } return PLURAL_CATEGORY.OTHER;} } - diff --git a/pollen-ui-angular/src/main/webapp/i18n/fr.js b/pollen-ui-angular/src/main/webapp/i18n/fr.js index d1e74a6..8ce661d 100644 --- a/pollen-ui-angular/src/main/webapp/i18n/fr.js +++ b/pollen-ui-angular/src/main/webapp/i18n/fr.js @@ -8,12 +8,12 @@ * it under the terms of the GNU Affero General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. - * + * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. - * + * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see <http://www.gnu.org/licenses/>. * #L% @@ -37,6 +37,7 @@ var translateFR = { 'home.description' : 'Créer dès maintenant votre sondage gratuitement. Partager le lien de vote. Et regarder le résultat.', 'home.newPoll' : 'Créer dès maintenant un sondage gratuitement', 'home.register' : 'Créer un compte gratuitement', +'home.userAccount' : 'Un compte personnel vous permettra de retrouver facilement les sondages que vous avez créé et ceux auxquels vous avez participés.', 'admin' : 'Administration', 'admin.listPoll' : 'Liste des sondages', @@ -72,8 +73,8 @@ var translateFR = { 'user.generatePassword.success' : 'Un mail avec le nouveau mot de passe vient d\'être envoyé.', 'user.validate.success' : 'Vous venez de valider votre courriel, connectez-vous dès maintenants.', 'user.validate.error' : 'Erreur lors de la validation, courriel déjà validé ou invalide', -'user.tab.viewProfile' : 'Voir son profile', -'user.tab.editProfile' : 'Modifier son profile', +'user.tab.viewProfile' : 'Voir son profil', +'user.tab.editProfile' : 'Modifier son profil', 'user.tab.editPassword' : 'Modifier son Password', 'user.warning.emailNotValidate' : 'Vous n\'avez pas validé votre email', 'user.error.password.diff' : 'Mot de passe différent', @@ -119,7 +120,7 @@ var translateFR = { 'poll.edit.choice' : 'Cliquez pour modifier le choix', 'poll.edit.title' : 'Cliquez pour modifier le titre', 'poll.title' : 'Titre', -'poll.desc' : 'Description (facultative). Ce cadre n\'apparait pas si aucune description n\'est saisie.', +'poll.desc' : 'Description', 'poll.saved' : 'Sondage sauvegardé', 'poll.created.printLink' : 'Garder le lien suivant pour pouvoir modifier votre sondage plus tard, lorsque vous n\'êtes pas connecté : {{url}}', 'poll.cloned' : 'Sondage cloné', @@ -151,6 +152,7 @@ var translateFR = { 'poll.config.title.poll.validityDates' : 'Période de validité', 'poll.config.title.poll.voteCountingType': 'Type de scrutin', 'poll.config.title.choice' : 'Configuration des choix', +'poll.config.title.choice.availableChoices' : 'Choix proposés', 'poll.config.title.vote' : 'Configuration des votes', 'poll.config.title.visibility' : 'Visibilité et restrictions', 'poll.config.label.creatorName' : 'Votre nom', diff --git a/pollen-ui-angular/src/main/webapp/index.html b/pollen-ui-angular/src/main/webapp/index.html index 703de08..5235f45 100644 --- a/pollen-ui-angular/src/main/webapp/index.html +++ b/pollen-ui-angular/src/main/webapp/index.html @@ -37,120 +37,117 @@ --> <!--<link rel="stylesheet/less" type="text/css" href="less/style.less" />--> <!--<script language="javascript" type="text/javascript" src="lib/less/dist/less-1.7.3.min.js"></script>--> - <link rel="stylesheet" type="text/css" href="css/style.css"/> + <link rel="stylesheet" type="text/css" href="css/main.css"/> </head> <body> -<nav id="pollenMenu" class="navbar navbar-inverse navbar-static-top"> - <div class="container-fluid"> - <div class="navbar-header"> - <a class="navbar-brand" href="#">Pollen</a> - </div> - <ul class="nav navbar-nav pull-right" ng-controller="LocaleCtrl"> - <li dropdown class="dropdown-toggle"> - <a> <img ng:attr-src="img/{{locale}}.png" /></a> - <ul class="dropdown-menu"> - <li><a ng-click="switchLocale('fr')"><img src="img/fr.png" /> Français </a></li> - <li><a ng-click="switchLocale('en')"><img src="img/en.png" /> English </a> </li> + <div id="top-bar"> + <div class="content"> + <div id="menu-toggle">Menu</div> + <div id="application-title"> + <a class="navbar-brand" href="#">Pollen</a> + </div> + + <div id="language" class="right-menu"> + <ul class="nav navbar-nav pull-right" ng-controller="LocaleCtrl"> + <li dropdown class="dropdown-toggle"> + <a> <img ng:attr-src="img/{{locale}}.png" /></a> + <ul class="dropdown-menu"> + <li><a ng-click="switchLocale('fr')"><img src="img/fr.png" /> Français </a></li> + <li><a ng-click="switchLocale('en')"><img src="img/en.png" /> English </a> </li> + </ul> + </li> + </ul> + </div> + <div id="user-info" class="right-menu" ng-controller="UserLoginCtrl"> + + <ul class="nav navbar-nav pull-right"> + <li ng-show="!currentUser.id"> + <a href="#/user/register/"> {{ 'action.register' | translate }} </a> + </li> + + <li class="divider-vertical" ng-show="!currentUser.id"></li> + + <li ng-show="!currentUser.id" dropdown> + <a href="#" role="button" class="dropdown-toggle"> + {{ 'action.login' | translate }} <strong class="caret"></strong> + </a> + + <div class="dropdown-menu form" role="menu" ng-click="$event.stopPropagation()"> + <div ng-include="'./partials/user-login.html'"></div> + </div> + </li> + + <li class="dropdown" ng-show="currentUser.administrator"> + <a href="#" role="button" class="dropdown-toggle"> + {{ 'admin' | translate }} <strong class="caret"></strong> + </a> + + <ul class="dropdown-menu" role="menu"> + <li><a href="#/poll/list">{{ 'admin.listPoll' | translate }}</a></li> + <li><a href="#/user/list">{{ 'admin.listUser' | translate }}</a></li> + <li><a href="#/conf">{{ 'admin.config' | translate }}</a></li> + </ul> + </li> + + <li class="dropdown" ng-show="currentUser.id"> + <a href="#" role="button" class="dropdown-toggle"> + {{ currentUser.name || currentUser.email }} <strong class="caret"></strong> + </a> + + <ul class="dropdown-menu" role="menu"> + <li> + <a href="#/user/edit">{{ 'user.edit' | translate }}</a> + </li> + + <li class="divider"></li> + + <li> + <a href="#/favoriteList">{{ 'user.favoriteList' | translate }}</a> + </li> + + <li class="divider"></li> + + <li> + <a href="#/poll/list/created"> {{ 'user.listPollCreated' | translate }} </a> + </li> + + <li> + <a href="#/poll/list/participated"> {{ 'user.listPollParticiped' | translate }} </a> + </li> + + <li> + <a href="#/poll/list/invited"> {{ 'user.listPollInvited' | translate }} </a> + </li> + + <li class="divider"></li> + + <li> + <a ng-click="logout()">{{ 'action.logout' | translate }}</a> + </li> + + </ul> + </li> </ul> - </li> - </ul> - <div class="collapse navbar-collapse" ng-controller="UserLoginCtrl"> - <ul class="nav navbar-nav"> - <li><a href="#/poll/create"> {{ 'poll.new' | translate }}</a></li> - </ul> - <ul class="nav navbar-nav pull-right"> - <li ng-show="!currentUser.id"> - <a href="#/user/register/"> {{ 'action.register' | translate }} </a> - </li> - - <li class="divider-vertical" ng-show="!currentUser.id"></li> - - <li ng-show="!currentUser.id" dropdown> - <a href="#" role="button" class="dropdown-toggle"> - {{ 'action.login' | translate }} <strong class="caret"></strong> - </a> - - <div class="dropdown-menu form" role="menu" ng-click="$event.stopPropagation()"> - <div ng-include="'./partials/user-login.html'"></div> - </div> - </li> - - <li class="dropdown" ng-show="currentUser.administrator"> - <a href="#" role="button" class="dropdown-toggle"> - {{ 'admin' | translate }} <strong class="caret"></strong> - </a> - - <ul class="dropdown-menu" role="menu"> - <li><a href="#/poll/list">{{ 'admin.listPoll' | translate }}</a></li> - <li><a href="#/user/list">{{ 'admin.listUser' | translate }}</a></li> - <li><a href="#/conf">{{ 'admin.config' | translate }}</a></li> - </ul> - </li> - - <li class="dropdown" ng-show="currentUser.id"> - <a href="#" role="button" class="dropdown-toggle"> - {{ currentUser.name || currentUser.email }} <strong class="caret"></strong> - </a> - - <ul class="dropdown-menu" role="menu"> - <li> - <a href="#/user/edit">{{ 'user.edit' | translate }}</a> - </li> - - <li class="divider"></li> - - <li> - <a href="#/favoriteList">{{ 'user.favoriteList' | translate }}</a> - </li> - - <li class="divider"></li> - - <li> - <a href="#/poll/list/created"> {{ 'user.listPollCreated' | translate }} </a> - </li> - - <li> - <a href="#/poll/list/participated"> {{ 'user.listPollParticiped' | translate }} </a> - </li> - - <li> - <a href="#/poll/list/invited"> {{ 'user.listPollInvited' | translate }} </a> - </li> - - <li class="divider"></li> - - <li> - <a ng-click="logout()">{{ 'action.logout' | translate }}</a> - </li> - - </ul> - </li> - </ul> + </div> + + <div class="right-menu collapse navbar-collapse" ng-controller="UserLoginCtrl"> + <ul class="nav navbar-nav"> + <li><a href="#/poll/create"> {{ 'poll.new' | translate }}</a></li> + </ul> + + </div> + </div> </div> -</nav> -<div ng-include="'partials/alerts.html'" ng-controller="printAlertCtrl"></div> -<div ng-view class='container-fluid' id="content"></div> - -<footer> - <a href="https://doc.chorem.org/pollen" target="_blank">Pollen</a> - <a href="https://forge.chorem.org/projects/pollen/files" target="_blank">{{version}}</a> - <span class="separator">-</span> - <a href="http://www.gnu.org/licenses/agpl.html" target="_blank">Licence</a> - <span class="separator">-</span> - ©2009-2014 - <a href="http://www.codelutin.com/" target="_blank">Code Lutin</a> - <span class="separator">-</span> - <a href="https://forge.chorem.org/projects/pollen/issues" target="_blank">Rapport de bug</a> - <span class="separator">-</span> - <a href="http://list.chorem.org/cgi-bin/mailman/listinfo/pollen-users" target="_blank">Support utilisateur</a> -</footer> + <div id="alerts" ng-include="'partials/alerts.html'" ng-controller="printAlertCtrl"></div> + <div ng-view id="wrapper"> + </div> <script language="javascript" type="text/javascript" src="js/conf.js"></script> @@ -191,4 +188,3 @@ <script language="javascript" type="text/javascript" src="js/scripts/sticky-inline-poll.js"></script> </body> </html> - diff --git a/pollen-ui-angular/src/main/webapp/less/main.less b/pollen-ui-angular/src/main/webapp/less/main.less new file mode 100644 index 0000000..5b33890 --- /dev/null +++ b/pollen-ui-angular/src/main/webapp/less/main.less @@ -0,0 +1,629 @@ +@import "variables.less"; + +/* General +-------------------------------------------------- */ +body { + margin: 0; + padding: 0; + background-color: @palette-light-grey; +} + +.clearfix:before, +.clearfix:after { + content: ""; + display: table; +} +.clearfix:after { + clear: both; +} +.clear { + clear: both; +} +.float-right { + float: right; +} + +ul { + list-style: none; + margin: 0; + padding: 0; +} + +h1 { + background-color: @palette-headings; + font-size: 22px; + font-weight: bold; + color: #FFF; +} +h2 { + color: @palette-headings; + font-size: 15px; + font-weight: bold; + text-transform: uppercase; +} + +/* Fonts +-------------------------------------------------- */ +@font-face { + font-family: "Pacifico"; + src: url('../font/Pacifico.ttf'); +} + +body { + font-family: Arial; +} + + +/* Layout +-------------------------------------------------- */ +#wrapper #side-menu { + width: 10%; +} +#top-bar .content, +#wrapper #poll-content { + margin-left: 10%; /* Same width as #wrapper #side-menu */ + position: relative; +} + +#main-wrapper { + height: 10%; +} + +#wrapper .content { + height: 10%; +} + +main .actions-buttons { + /*margin-left: 10%; + width: 90%;*/ +} + +/* Centered columns solution : http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-c... */ +.row-centered { + text-align: center; + + .col-centered { + display: inline-block; + float: none; + vertical-align: top; + } +} + +/* Top Bar : Application title, Menu, User info +-------------------------------------------------- */ +#top-bar { + background: @palette-headings; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 50px; + z-index: 9; + + #menu-toggle { + display: none; + background-color: @palette-headings; + color: #FFF; + padding: 0px 11px; + font-size: 12px; + float: left; + cursor: pointer; + } + + .content { + background: #FFF; + height: 100%; + width: auto; + line-height: 50px; /* Same as #top-bar height */ + + + #application-title { + float: left; + + a { + font-family: "Pacifico"; + font-size: 24px; + color: @palette-headings; + padding: 10px 25px; + } + } + + & > div { + display: inline-block; + *display: inline; /* Hack for old IE not supporting inline-block */ + *zoom: 1; + vertical-align: middle; + } + + & > .right-menu { + border-left: 1px solid #EEE; + float:right; + color: #abb3c1; + padding: 0; + + & > ul { + padding: 0 15px; + } + } + + } + +} + +/* Main wrapper - Side Menu +-------------------------------------------------- */ +#wrapper #side-menu { + background-color: @palette-light-grey; + position: absolute; + height: 100%; /* FIXME LK 24/02/15 : Replace by background image repeat-y for long page more than 100% height ? */ + transition: all 0.5s ease-out 0s; + z-index: 2; + + ul { + list-style: none; + margin: 0; + padding: 120px 0 0 0; + text-align: center; + + li { + font-size: 13px; + margin: 60px 0; + color: #CCC; + + &:hover { + color: #777; + } + &.current { + color: #777; + position: relative; + + &:after, + &:before { + right: -1px; + top: 50%; + border: solid transparent; + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; + } + &:after { + border-color: rgba(255, 255, 255, 0); + border-right-color: #FFF; + border-width: 10px; + margin-top: -10px; + } + &:before { + border-color: rgba(34, 34, 34, 0); + border-right-color: #AAA; + border-width: 11px; + margin-top: -11px; + } + } + } + } +} + +/* Main wrapper - Header +-------------------------------------------------- */ +#wrapper header { + background-color: @palette-headings; + padding: 100px 15px 0 15px; + border-bottom: 1px solid #AAA; + color: @palette-light-white; + + h1 { + margin: 0 0 20px 0; + } + + .header-catchphrase { + margin: 50px 0; + } + + ul.tabs li { + display: inline-block; + margin-bottom: -1px; + margin-right: 15px; + padding: 12px 15px; + + &.active { + background-color: #FFF; + color: #354052; + + a:hover { + color: #354052; + } + } + + a { + color: #bbbbcc; + font-size: 13px; + + &:hover { + color: #FFF; + } + + } + } +} + + +/* Main wrapper - Main content +-------------------------------------------------- */ +#wrapper { + + main { + margin: 0; + background-color: @palette-light-white; + border-left: 1px solid #AAA; + + .main-view { + padding: 20px 40px; + + h2 { + .fa { + font-size: 24px; + vertical-align: middle; + } + + & > span { + margin-left: 10px; + vertical-align: middle; + } + } + } + + .actions-buttons { + /*position: fixed; + bottom: 0; + left: 0; + border-left: 1px solid #AAA;*/ + border-top: 1px solid @palette-headings; + height: 100px; + background-color: #f8f8fa; + + & > div { + margin: 20px; + } + } + + .info-panel { + color: #BBB; + margin-bottom: 20px; + font-size: 13px; + + & > div { + margin-bottom: 15px; + + & > .fa { + float: left; + color: #D5D5D5; + font-size: 18px; + } + + & > div { + margin-left: 30px; + padding-top: 2px; + } + + } + + } + } +} + + + +/* Main wrapper - Main content - Forms +-------------------------------------------------- */ +main form fieldset { + border: 0 none; + margin: 0; + padding: 10px; + + .form-group { + margin: 0; + } + + label { + color: #999; + text-transform: uppercase; + padding: 7px 20px 7px 34px; + font-weight: normal; + margin-bottom: 0; + } + + .form-control { + border-radius: 0; + box-shadow: none; + background-color: #f8f8fa; + border-width: 1px; + border-style: solid; + border-color: #E5E5E5 #E5E5E5 transparent #E5E5E5; + } + + div:last-child .form-control { + border-color: #E5E5E5; + } + + input[type="text"] { + padding: 10px 20px; + + &:focus { + border-color: #CCC; + box-shadow: 0 0 4px 0px rgba(0,0,0,0.15); + } + } + + .input-date, + .input-time { + margin-right: 20px; + color: #999; + + input { + width: 70px !important; + margin-right: 10px; + margin-left: 10px; + padding: 10px 15px; + text-align: center; + + &:first-child { + margin-left: 0; + } + } + } + + .choices-list { + margin: 0 0 0 20px; + color: #999; + + & > div { + clear: left; + margin-bottom: 5px; + } + + input[type="radio"] { + float: left; + width: 5%; + margin: 0; + } + + .choice-title { + background: none repeat scroll 0 0 #fff; + float: left; + border-bottom: 1px solid transparent; + border-top: 1px solid transparent; + } + + .choice-description { + background: none repeat scroll 0 0 #fff; + border-top: 1px solid transparent; + display: none; + padding: 2px 0px; + font-size: 13px; + } + + input[type="radio"]:checked + span { + border-color: #ddd; + } + input[type="radio"]:checked ~ div { + border-color: #ddd; + display: inline-block; + } + } + +} + + +/* Main wrapper - Main content - Table +-------------------------------------------------- */ +#poll-inline { + tbody, thead { + tr td { + border: 1px solid #EEE; + padding: 5px; + + &.static { + color: #CCC; + } + } + } + + thead { + tr:first-child td:first-child { + border: 0; + } + } +} + + +/* Main wrapper - Footer +-------------------------------------------------- */ +footer { + background: none repeat scroll 0 0 @palette-headings; + border-top: 2px solid #777; + color: #fff; + height: 40px; + padding: 10px 50px; + text-align: center; + + & > a { + color: #DDF; + margin: 0 20px; + } +} + + +/* Buttons +-------------------------------------------------- */ +.action { + display: inline-block; + *display: inline; /* Hack for old IE not supporting inline-block */ + *zoom: 1; + border: 1px solid #DDD; + border-radius: 4px; + padding: 1px; + + .action-btn { + border: 1px solid #BBB; + border-radius: 4px; + box-shadow: 0 0 2px rgba(0, 0, 0, 0.2); + text-transform: uppercase; + text-decoration: none; + padding: 7px 20px; + font-family: Arial; + font-size: 14px; + position: relative; + + &.confirm { + background-color: rgba(122,186,189,0.5); + float: right; + color: #3e7b7d; + + &:hover { + color: #214243; + } + } + + &.cancel { + background-color: rgba(0,0,0,0.05); + color: #888; + + &:hover { + color: #555; + + } + } + + } +} + +.action .confirm, +.action .cancel { +} + +.action .confirm { +} + +.action .cancel { +} + + + +/* Alerts +-------------------------------------------------- */ + +#alerts { + position: absolute; + top: 50px; + right: 0; + z-index: 1; + + .alert { + white-space: nowrap; + } + + .alert-info { + background-color: transparent; + color: #FFF; + border: 0; + + } + +} + +/* Specific pages +-------------------------------------------------- */ +.home { + .main-view .col-centered { + + .col-sm-6:last-child { + border-left: 1px solid #DDD; + + .loginForm { + background: #FAFAFF; + padding: 10px; + } + } + } +} + +#poll-link { + border-top: 1px solid #bbb; + margin: 50px 80px 20px; + padding: 10px 0 20px; +} + +/* Layout & media queries +-------------------------------------------------- */ +#wrapper #side-menu { + width: 10%; +} +#top-bar .content, +#wrapper #poll-content { + margin-left: 10%; /* Same width as #wrapper #side-menu */ +} + +#main-wrapper { + height: 10%; +} + +#wrapper .content { + height: 10%; +} + +main .actions-buttons { + /*margin-left: 10%; + width: 90%;*/ +} + +.col-2bloc, +.col-3bloc, +.col-4bloc { + float: left; +} +.col-2bloc { + width: 50%; +} +.col-3bloc { + width: 33.33%; +} +.col-4bloc { + width: 25%; +} + +@media screen and (max-width: 980px) { + #side-menu ul li { + text-indent: -999px; /* FIXME LK 24/02/15 : Only keep icons in side-menu */ + } +} + +@media screen and (max-width: 860px) { + #top-bar .content, + #wrapper .content { + margin-left: 0; + } + main .actions-buttons { + margin-left: 0; + width: 100%; + } + + #top-bar #menu-toggle { + display: inline-block !important; + } + + #wrapper #side-menu { + position: fixed; + left: -100px; + width: 100px; + } + #wrapper #side-menu.opened { + left: 0; + box-shadow: 1px 0 4px rgba(0,0,0,0.2); + } + #wrapper #side-menu.opened ul li { + text-indent: 0; + } +} diff --git a/pollen-ui-angular/src/main/webapp/less/variables.less b/pollen-ui-angular/src/main/webapp/less/variables.less index fd5b19b..09a0223 100644 --- a/pollen-ui-angular/src/main/webapp/less/variables.less +++ b/pollen-ui-angular/src/main/webapp/less/variables.less @@ -27,7 +27,9 @@ @short-time-transition : 0.2s; @long-time-transition : 1.6s; -@background-color: #fff; +@palette-headings: #6f7c95; +@palette-light-white: #FFF; +@palette-light-grey: #e8e8e8; @border-color : #dddddd; diff --git a/pollen-ui-angular/src/main/webapp/partials/footer.html b/pollen-ui-angular/src/main/webapp/partials/footer.html new file mode 100644 index 0000000..887d8ab --- /dev/null +++ b/pollen-ui-angular/src/main/webapp/partials/footer.html @@ -0,0 +1,14 @@ + +<footer> + <a href="https://doc.chorem.org/pollen" target="_blank">Pollen</a> + <a href="https://forge.chorem.org/projects/pollen/files" target="_blank">{{version}}</a> + <span class="separator">-</span> + <a href="http://www.gnu.org/licenses/agpl.html" target="_blank">Licence</a> + <span class="separator">-</span> + ©2009-2014 + <a href="http://www.codelutin.com/" target="_blank">Code Lutin</a> + <span class="separator">-</span> + <a href="https://forge.chorem.org/projects/pollen/issues" target="_blank">Rapport de bug</a> + <span class="separator">-</span> + <a href="http://list.chorem.org/cgi-bin/mailman/listinfo/pollen-users" target="_blank">Support utilisateur</a> +</footer> diff --git a/pollen-ui-angular/src/main/webapp/partials/home.html b/pollen-ui-angular/src/main/webapp/partials/home.html index addf9a2..5d1a32b 100644 --- a/pollen-ui-angular/src/main/webapp/partials/home.html +++ b/pollen-ui-angular/src/main/webapp/partials/home.html @@ -8,29 +8,44 @@ it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. - + This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. - + You should have received a copy of the GNU Affero General Public License along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> +<header class="text-center"> + <h1> + {{ 'home.title' | translate }} + </h1> -<div class="jumbotron"> - <div class="container"> - <h1> - {{ 'home.title' | translate }} - </h1> + <div class="header-catchphrase"> <p> {{ 'home.description' | translate }} </p> - <p class=""> - <a href="#/poll/create" class="btn btn-primary btn-lg"><span class="fa fa-plus-circle"></span> {{ 'home.newPoll' | translate }}</a> - <a href="#/user/register" class="btn btn-default btn-lg" ng-if="!isConnected"><span class="fa fa-users"></span> {{ 'home.register' | translate }} </a> - </p> + <a href="#/poll/create" class="btn btn-primary btn-lg"><span class="fa fa-plus-circle"></span> {{ 'home.newPoll' | translate }}</a> </div> -</div> +</header> + +<main class="home"> + <div class="main-view row row-centered"> + <div class="col-sm-6 col-centered" ng-if="!isConnected"> + <div class="col-sm-6"> + <h2>{{ 'home.register' | translate }}</h2> + <p>{{ 'home.userAccount' | translate}}</p> + <a href="#/user/register" class="btn btn-default btn-lg"><span class="fa fa-users"></span> {{ 'home.register' | translate }} </a> + </div> + <div class="col-sm-6" ng-controller="UserLoginCtrl"> + <h2>{{ 'action.login' | translate }}</h2> + <div ng-include="'./partials/user-login.html'"></div> + </div> + </div> + </div> + + <div ng-include="'partials/footer.html'"></div> +</main> diff --git a/pollen-ui-angular/src/main/webapp/partials/inline-poll.html b/pollen-ui-angular/src/main/webapp/partials/inline-poll.html index c610940..0b8cb74 100644 --- a/pollen-ui-angular/src/main/webapp/partials/inline-poll.html +++ b/pollen-ui-angular/src/main/webapp/partials/inline-poll.html @@ -21,138 +21,144 @@ <table id="poll-inline"> <!-- begin print choices --> - <tr> - <td class="static"> - <!--<button ng-click="bigVersion()" class="btn btn-default" >Big version</button>--> - </td> - <td ng-repeat="choice in data.choices" class="pollChoice pollAnim" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> - - <div ng-if="choice.choiceType == 'TEXT'" edit-me="showEdit" > - - <div ng-hide="showEdit && ((data.poll.addChoiceAllowed && (choice.permission || !choice.id)) || globalVariables.editMode)" class="fixe-input" title="{{choice.description}}"> - {{ choice.choiceValue || ('poll.edit.choice' | translate) }} - <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> - <input type="button" class="btn btn-default" ng-if="(data.poll.choiceAddAllowed && (choice.permission || !choice.id)) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> + <thead> + <tr> + <td class="static"> + <div ng-show="globalVariables.editMode"> + Choix proposés aux participants : </div> + </td> + <td ng-repeat="choice in data.choices" class="pollChoice pollAnim" ng-mouseenter="showEditHover = true" ng-mouseleave="showEditHover = false"> - <div ng-show="showEdit && ((data.poll.addChoiceAllowed && (choice.permission || !choice.id)) || globalVariables.editMode)"> - <input type="text" class="form-control" ng-model="choice.choiceValue" focus-me="showEdit" ng-exit="showEdit = false;" auto-save="saveChoice(choice)" required/> - <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice, $event);" value="..."/> - </div> + <div ng-if="choice.choiceType == 'TEXT'" edit-me="showEdit" > - </div> + <div ng-hide="showEdit && ((data.poll.addChoiceAllowed && (choice.permission || !choice.id)) || globalVariables.editMode)" class="fixe-input" title="{{choice.description}}"> + {{ choice.choiceValue || ('poll.edit.choice' | translate) }} + <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> + <input type="button" class="btn btn-default" ng-if="(data.poll.choiceAddAllowed && (choice.permission || !choice.id)) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> + </div> - <div ng-if="choice.choiceType == 'DATE'" edit-me="showEdit" > + <div ng-show="showEdit && ((data.poll.addChoiceAllowed && (choice.permission || !choice.id)) || globalVariables.editMode)"> + <input type="text" class="form-control" ng-model="choice.choiceValue" focus-me="showEdit" ng-exit="showEdit = false;" auto-save="saveChoice(choice)" required/> + <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice, $event);" value="..."/> + </div> - <div ng-hide="showEdit && (data.poll.addChoiceAllowed && (choice.permission || !choice.id) || globalVariables.editMode)" class="fixe-input" title="{{choice.description}}"> - {{ (choice.choiceValue | date:globalVariables.dateTimeFormat) || ('poll.edit.choice' | translate) }} - <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> - <input type="button" class="btn btn-default" ng-if="(data.poll.choiceAddAllowed && (choice.permission || !choice.id)) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> </div> - <div ng-show="showEdit && (data.poll.choiceAddAllowed && (choice.permission || !choice.id) || globalVariables.editMode)" > - <datetimepicker ng-model="choice.choiceValue" focus="showEdit" ng-exit="showEdit = false" ng-save="saveChoice(choice)"></datetimepicker> - <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice, $event);" value="..."/> + <div ng-if="choice.choiceType == 'DATE'" edit-me="showEdit" > + + <div ng-hide="showEdit && (data.poll.addChoiceAllowed && (choice.permission || !choice.id) || globalVariables.editMode)" class="fixe-input" title="{{choice.description}}"> + {{ (choice.choiceValue | date:globalVariables.dateTimeFormat) || ('poll.edit.choice' | translate) }} + <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> + <input type="button" class="btn btn-default" ng-if="(data.poll.choiceAddAllowed && (choice.permission || !choice.id)) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> + </div> + + <div ng-show="showEdit && (data.poll.choiceAddAllowed && (choice.permission || !choice.id) || globalVariables.editMode)" > + <datetimepicker ng-model="choice.choiceValue" focus="showEdit" ng-exit="showEdit = false" ng-save="saveChoice(choice)"></datetimepicker> + <input type="button" class="btn btn-default" data-toggle="modal" data-target="#popupAddChoice" ng-click="editChoice(choice, $event);" value="..."/> + </div> + </div> - </div> + <div ng-if="choice.choiceType == 'RESOURCE'"> - <div ng-if="choice.choiceType == 'RESOURCE'"> + <div class="fixe-input" title="{{choice.description}}"> + {{choice.choiceValue.meta.name}} + <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> + <input type="button" class="btn btn-default" ng-if="data.poll.choiceAddAllowed && (choice.permission || !choice.id) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> + <br/> + <print-resource image="choice.choiceValue.id" meta="choice.choiceValue.meta"></print-resource> - <div class="fixe-input" title="{{choice.description}}"> - {{choice.choiceValue.meta.name}} - <info-error error="choice.restError.choiceValue[0]" data="choice.choiceValue" append-class="fa-lg"></info-error> - <input type="button" class="btn btn-default" ng-if="data.poll.choiceAddAllowed && (choice.permission || !choice.id) || globalVariables.editMode" ng-show="showEditHover" ng-click="editChoice(choice, $event);" value="..."/> - <br/> - <print-resource image="choice.choiceValue.id" meta="choice.choiceValue.meta"></print-resource> + </div> </div> - - </div> - </td> - <td ng-if="data.poll.choiceAddAllowed || globalVariables.editMode"><button class="btn btn-default btn-large" ng-click="addChoice()" tooltip="{{ 'action.choice.add' | translate }}"> <span class="fa fa-plus"></span> </button></td> - </tr> + </td> + <td ng-if="data.poll.choiceAddAllowed || globalVariables.editMode"><button class="btn btn-default btn-large" ng-click="addChoice()" tooltip="{{ 'action.choice.add' | translate }}"> <span class="fa fa-plus"></span> </button></td> + </tr> + </thead> <!-- end print choice --> + <tbody> <!-- begin input vote --> - <tr ng-if="!globalVariables.editMode && data.poll.canVote"> - <td class="pollChoice vote-input"> - <input-error error="data.vote.restError.voterName[0]" data="data.vote.voterName"> - <input type="text" class="form-control" placeholder="{{ 'user.name' | translate }}" ng-model="data.vote.voterName" input-error="data.vote.restError.voterName[0]" focus-me="true" /> - </input-error> - </td> - <td ng-repeat="choice in data.vote.choice" class="pollChoice" ng-click="toggleValue(choice, $event);"> - <input-error error="choice.restError[0]" data="choice.voteValue"> - <input type="{{data.voteCountingType.renderType}}" ng-class="{'form-control':(data.voteCountingType.renderType != 'checkbox')}" name="{{choice.choiceId}}" ng-model="choice.voteValue" ng-click="toggleValue(choice, $event);" /> - </input-error> - </td> - <td> - <input class="btn btn-primary btn-large" type="button" value="{{ 'action.vote' | translate }}" ng-click="voter()" /> - </td> - </tr> + <tr ng-if="!globalVariables.editMode && data.poll.canVote"> + <td class="pollChoice vote-input"> + <input-error error="data.vote.restError.voterName[0]" data="data.vote.voterName"> + <input type="text" class="form-control" placeholder="{{ 'user.name' | translate }}" ng-model="data.vote.voterName" input-error="data.vote.restError.voterName[0]" focus-me="true" /> + </input-error> + </td> + <td ng-repeat="choice in data.vote.choice" class="pollChoice" ng-click="toggleValue(choice, $event);"> + <input-error error="choice.restError[0]" data="choice.voteValue"> + <input type="{{data.voteCountingType.renderType}}" ng-class="{'form-control':(data.voteCountingType.renderType != 'checkbox')}" name="{{choice.choiceId}}" ng-model="choice.voteValue" ng-click="toggleValue(choice, $event);" /> + </input-error> + </td> + <td> + <input class="btn btn-primary btn-large" type="button" value="{{ 'action.vote' | translate }}" ng-click="voter()" /> + </td> + </tr> <!-- end input vote --> <!-- begin print vote --> - <tr ng-if="!globalVariables.editMode" ng-repeat="vote in data.votants track by $index" class="pollAnim"> - <td class="pollChoice"> - <div class="text-muted" ng-hide="vote.onEdit"> - {{vote.voterName}} - </div> - <div ng-show="vote.onEdit"> - <input-error error="vote.restError.voterName[0]" data="vote.voterName"> - <input type="text" - class="form-control" - placeholder="{{ 'user.name' | translate }}" - ng-model="vote.voterName" - input-error="vote.restError.voterName[0]" /> - </input-error> - </div> - </td> - <td ng-repeat="choice in vote.choice" - class="pollChoice" - ng-click="toggleVoteValue(choice, vote.onEdit, $event);" - ng-class="{ - voteTrue:choice.voteValue != null, - voteFalse:(choice.voteValue == null || (choice.voteValue == false && data.voteCountingType.renderType == 'checkbox'))}"> - - <div ng-hide="vote.onEdit"> - <div ng-show="choice.id"> - <div ng-show="data.voteCountingType.renderType == 'checkbox'" > - <span class="fa fa-check text-success" ng-show="choice.voteValue"></span> + <tr ng-if="!globalVariables.editMode" ng-repeat="vote in data.votants track by $index" class="pollAnim"> + <td class="pollChoice"> + <div class="text-muted" ng-hide="vote.onEdit"> + {{vote.voterName}} + </div> + <div ng-show="vote.onEdit"> + <input-error error="vote.restError.voterName[0]" data="vote.voterName"> + <input type="text" + class="form-control" + placeholder="{{ 'user.name' | translate }}" + ng-model="vote.voterName" + input-error="vote.restError.voterName[0]" /> + </input-error> + </div> + </td> + <td ng-repeat="choice in vote.choice" + class="pollChoice" + ng-click="toggleVoteValue(choice, vote.onEdit, $event);" + ng-class="{ + voteTrue:choice.voteValue != null, + voteFalse:(choice.voteValue == null || (choice.voteValue == false && data.voteCountingType.renderType == 'checkbox'))}"> + + <div ng-hide="vote.onEdit"> + <div ng-show="choice.id"> + <div ng-show="data.voteCountingType.renderType == 'checkbox'" > + <span class="fa fa-check text-success" ng-show="choice.voteValue"></span> + </div> + <div ng-show="data.voteCountingType.renderType != 'checkbox'"> + {{choice.voteValue}} + </div> </div> - <div ng-show="data.voteCountingType.renderType != 'checkbox'"> - {{choice.voteValue}} + <div ng-hide="choice.id"> + <span class="fa fa-eye-slash text-danger" tooltip="{{ 'poll.info.vote.noViewChoice' | translate }}"></span> </div> </div> - <div ng-hide="choice.id"> - <span class="fa fa-eye-slash text-danger" tooltip="{{ 'poll.info.vote.noViewChoice' | translate }}"></span> + <div ng-show="vote.onEdit"> + <input-error error="choice.restError[0]" data="choice.voteValue"> + <input type="{{data.voteCountingType.renderType}}" + ng-model="choice.voteValue" + ng-disabled="!vote.onEdit" + ng-click="toggleVoteValue(choice, vote.onEdit, $event);" /> + </input-error> </div> - </div> - <div ng-show="vote.onEdit"> - <input-error error="choice.restError[0]" data="choice.voteValue"> - <input type="{{data.voteCountingType.renderType}}" - ng-model="choice.voteValue" - ng-disabled="!vote.onEdit" - ng-click="toggleVoteValue(choice, vote.onEdit, $event);" /> - </input-error> - </div> - </td> - <td class="vote-action"> - <div ng-if="!data.poll.isClosed"> - <button class="btn btn-primary" ng-if="vote.permission && !globalVariables.editMode && vote.onEdit" ng-click="saveVote(vote)"> - <span class="fa fa-check"></span> - </button> - <button class="btn btn-default" ng-if="vote.permission && !globalVariables.editMode && vote.onEdit" ng-click="cancelVote(vote)"> - <span class="fa fa-remove"></span> - </button> - <button class="btn btn-info" ng-if="vote.permission && !globalVariables.editMode && !vote.onEdit" ng-click="editVote(vote)"> - <span class="fa fa-edit"></span> - </button> - <button class="btn btn-danger" ng-if="vote.permission && !globalVariables.editMode && !vote.onEdit" ng-click="deleteVote(vote)"> - <span class="fa fa-trash"></span> - </button> - </div> - </td> - </tr> + </td> + <td class="vote-action"> + <div ng-if="!data.poll.isClosed"> + <button class="btn btn-primary" ng-if="vote.permission && !globalVariables.editMode && vote.onEdit" ng-click="saveVote(vote)"> + <span class="fa fa-check"></span> + </button> + <button class="btn btn-default" ng-if="vote.permission && !globalVariables.editMode && vote.onEdit" ng-click="cancelVote(vote)"> + <span class="fa fa-remove"></span> + </button> + <button class="btn btn-info" ng-if="vote.permission && !globalVariables.editMode && !vote.onEdit" ng-click="editVote(vote)"> + <span class="fa fa-edit"></span> + </button> + <button class="btn btn-danger" ng-if="vote.permission && !globalVariables.editMode && !vote.onEdit" ng-click="deleteVote(vote)"> + <span class="fa fa-trash"></span> + </button> + </div> + </td> + </tr> <!-- end print vote --> + </tbody> </table> diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-info.html b/pollen-ui-angular/src/main/webapp/partials/poll-info.html index 7b294eb..f383976 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-info.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-info.html @@ -8,63 +8,76 @@ it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. - + This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. - + You should have received a copy of the GNU Affero General Public License along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> -<div ng-if="data.poll.isClosed" class="anim"> - <h4 class="text-warning">{{ 'poll.info.closed' | translate }}</h4> -</div> - -<div ng-if="!data.poll.isClosed && data.poll.endDate && data.poll.endDate <= now" class="anim"> - <h4 class="text-warning">{{ 'poll.info.timeoutVote' | translate:{'time':timeOfEndVote} }}</h4> -</div> +<div class="info-panel row"> + <div class="col-sm-3"> + <i class="fa fa-clock-o"></i> + <div ng-if="!data.poll.isClosed && data.poll.beginDate >= now" class="anim"> + {{ 'poll.info.beginVote' | translate:{'time':timeToBeginVote} }} + </div> -<div ng-if="!data.poll.isClosed && data.poll.beginDate >= now" class="anim"> - <h4>{{ 'poll.info.beginVote' | translate:{'time':timeToBeginVote} }}</h4> -</div> + <div ng-if="!data.poll.isClosed && data.poll.endDate && data.poll.beginDate < data.poll.endDate && timeToEndVote.value < 100" class="anim"> + {{ 'poll.info.endVote' | translate:{'time':timeToEndVote.label} }} + <div ng-if="timeToEndVote.value > 0" class="anim"> + <progressbar max="100" value="timeToEndVote.value" type="{{timeToEndVote.type}}"></progressbar> + </div> + </div> -<div ng-if="!data.poll.isClosed && data.poll.endDate && data.poll.beginDate < data.poll.endDate && timeToEndVote.value < 100" class="anim"> - <h4>{{ 'poll.info.endVote' | translate:{'time':timeToEndVote.label} }}</h4> - <div ng-if="timeToEndVote.value > 0" class="anim"> - <progressbar max="100" value="timeToEndVote.value" type="{{timeToEndVote.type}}"></progressbar> + <div ng-if="!data.poll.isClosed && !data.poll.endDate" class="anim"> + {{ 'poll.info.noEndDate' | translate }} + </div> </div> -</div> - -<div ng-if="!data.poll.isClosed && !data.poll.endDate" class="anim"> - <h4>{{ 'poll.info.noEndDate' | translate }}</h4> -</div> - -<div ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && data.poll.beginChoiceDate >= now" class="anim"> - <h4>{{ 'poll.info.beginAddChoiceAllowed' | translate:{'time':timeToBeginAddChoice} }}</h4> -</div> - -<div ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && timeToAddChoice.value < 100" class="anim"> - <h4>{{ 'poll.info.endAddChoiceAllowed' | translate:{'time':timeToAddChoice.label} }}</h4> - <div ng-if="timeToAddChoice.value > 0" class="anim"> - <progressbar max="100" value="timeToAddChoice.value" type="{{timeToAddChoice.type}}"></progressbar> + <div class="col-sm-3"> + <i class="fa fa-user"></i> + <div class="anim"> + {{ 'poll.config.title.poll.creator' | translate:{'name':data.poll.creatorName} }} + </div> + </div> + <div class="col-sm-3"> + <i class="fa fa-cogs"></i> + <div ng-if="data.voteCountingType" class="anim"> + {{ 'poll.info.voteCountingType' | translate:{'name':data.voteCountingType.name} }} + <p ng-bind-html="toHTML(data.voteCountingType.helper)"></p> + </div> + </div> + <div class="col-sm-3" ng-if="data.poll.isClosed" > + {{ 'poll.info.closed' | translate }} + </div> + <div class="col-sm-3" ng-if="!data.poll.isClosed && data.poll.endDate && data.poll.endDate <= now"> + {{ 'poll.info.timeoutVote' | translate:{'time':timeOfEndVote} }} + </div> + <div class="col-sm-3" ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && data.poll.beginChoiceDate >= now"> + {{ 'poll.info.beginAddChoiceAllowed' | translate:{'time':timeToBeginAddChoice} }} + </div> + <div class="col-sm-3" ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && timeToAddChoice.value < 100"> + {{ 'poll.info.endAddChoiceAllowed' | translate:{'time':timeToAddChoice.label} }} + <div ng-if="timeToAddChoice.value > 0" class="anim"> + <progressbar max="100" value="timeToAddChoice.value" type="{{timeToAddChoice.type}}"></progressbar> + </div> + </div> + <div class="col-sm-3" ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && (!data.poll.endChoiceDate || data.poll.endChoiceDate > data.poll.beginDate)"> + {{ 'poll.info.addChoiceAllowed.waring' | translate }} + <p> + {{ 'poll.info.addChoiceAllowed.waring.help' | translate }} + </p> + </div> + <div class="col-sm-3" ng-if="!data.poll.isClosed && data.poll.limitedVote && data.poll.maxChoiceNumber > 0"> + {{ 'poll.info.limitedChoice' | translate:{'nb':data.poll.maxChoiceNumber} }} </div> -</div> -<div ng-if="!data.poll.isClosed && data.poll.choiceAddAllowed && (!data.poll.endChoiceDate || data.poll.endChoiceDate > data.poll.beginDate)" class="anim"> - <h4>{{ 'poll.info.addChoiceAllowed.waring' | translate }}</h4> - <p> - {{ 'poll.info.addChoiceAllowed.waring.help' | translate }} - </p> -</div> + <div class="col-sm-12 clear"> + <i class="fa fa-info-circle"></i> + <div>{{data.poll.description}}</div> + </div> -<div ng-if="!data.poll.isClosed && data.poll.limitedVote && data.poll.maxChoiceNumber > 0" class="anim"> - <h4>{{ 'poll.info.limitedChoice' | translate:{'nb':data.poll.maxChoiceNumber} }}</h4> </div> - -<div ng-if="data.voteCountingType" class="anim"> - <h4>{{ 'poll.info.voteCountingType' | translate:{'name':data.voteCountingType.name} }}</h4> - <p ng-bind-html="toHTML(data.voteCountingType.helper)"></p> -</div> \ No newline at end of file diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-link.html b/pollen-ui-angular/src/main/webapp/partials/poll-link.html index bc06d02..e1862b3 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-link.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-link.html @@ -41,12 +41,12 @@ <input type="text" select-on-click value="{{globalVariables.linkResult}}" readonly class="form-control input-mini"/> </li> - <li ng-if="data.poll.commentIsVisible"> + <!--li ng-if="data.poll.commentIsVisible"> <a href="{{globalVariables.linkComment}}"> <span class="fa fa-comments-o"></span> <span class="text">{{ 'poll.link.comment' | translate }}</span> </a> - </li> + </li--> </ul> @@ -89,4 +89,3 @@ </a> </li> </ul> - diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-list.html b/pollen-ui-angular/src/main/webapp/partials/poll-list.html index 563694d..a8dc474 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-list.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-list.html @@ -19,30 +19,46 @@ #L% --> -<div ng-if="!data.polls[0]"><h1>{{ 'poll.error.listEmpty' | translate }}</h1></div> - -<table class="table table-hover"> - <tr ng-repeat="poll in data.polls" ng-class="{'active':poll.selected}" ng-click="toggleSelect(poll, $event)"> - <td style="vertical-align:middle"> - <input type="checkbox" ng-model="poll.selected" ng-click="toggleSelect(poll, $event)"/> - </td> - <td> - <h2><a href="#/poll/vote/{{poll.id}}">{{poll.title}}</a></h2> - </td> - <td> - <div ng-bind-html="toHTML(poll.description)"></div> - </td> - </tr> - <tr ng-show="data.polls.length > 0"> - <td colspan="3"> - <button class="btn btn-default" ng-click="selectAll()"><span class="fa fa-check-square-o"></span> {{ 'action.selectAll' | translate }}</button> - <button class="btn btn-default" ng-click="unselectAll()"><span class="fa fa-square-o"></span> {{ 'action.unselectAll' | translate }}</button> - <button class="btn btn-default" ng-click="toggleSelectAll()"><span class="fa fa-check-square"></span> {{ 'action.toggleSelectAll' | translate }}</button> - <button class="btn btn-danger" ng-click="deleteSelected()" ng-if="globalVariables.hasAllRight"><span class="fa fa-trash"></span> {{ 'action.deleteSelected' | translate }}</button> - </td> - </tr> -</table> - -<make-pagination current-page="data.pollsPagination.currentPage" - last-page="data.pollsPagination.lastPage" - page-size="data.pollsPagination.pageSize"></make-pagination> + +<header> + <div ng-if="!data.polls[0]"> + <h1>{{ 'poll.error.listEmpty' | translate }}</h1> + </div> + <div ng-if="data.polls[0]"> + <h1>{{ 'title.poll.list' | translate }}</h1> + </div> +</header> + +<main> + + <div class="main-view"> + + <table class="table table-hover"> + <tr ng-repeat="poll in data.polls" ng-class="{'active':poll.selected}" ng-click="toggleSelect(poll, $event)"> + <td style="vertical-align:middle"> + <input type="checkbox" ng-model="poll.selected" ng-click="toggleSelect(poll, $event)"/> + </td> + <td> + <h2><a href="#/poll/vote/{{poll.id}}">{{poll.title}}</a></h2> + </td> + <td> + <div ng-bind-html="toHTML(poll.description)"></div> + </td> + </tr> + <tr ng-show="data.polls.length > 0"> + <td colspan="3"> + <button class="btn btn-default" ng-click="selectAll()"><span class="fa fa-check-square-o"></span> {{ 'action.selectAll' | translate }}</button> + <button class="btn btn-default" ng-click="unselectAll()"><span class="fa fa-square-o"></span> {{ 'action.unselectAll' | translate }}</button> + <button class="btn btn-default" ng-click="toggleSelectAll()"><span class="fa fa-check-square"></span> {{ 'action.toggleSelectAll' | translate }}</button> + <button class="btn btn-danger" ng-click="deleteSelected()" ng-if="globalVariables.hasAllRight"><span class="fa fa-trash"></span> {{ 'action.deleteSelected' | translate }}</button> + </td> + </tr> + </table> + + <make-pagination current-page="data.pollsPagination.currentPage" + last-page="data.pollsPagination.lastPage" + page-size="data.pollsPagination.pageSize"></make-pagination> + + </div> + +</main> diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-poll.html b/pollen-ui-angular/src/main/webapp/partials/poll-poll.html index f4b8b04..79c05db 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-poll.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-poll.html @@ -19,66 +19,75 @@ #L% --> <form> - + <fieldset class="pollTitle" novalidate ng-hide="!globalVariables.editMode" > - <h2>{{'poll.config.title.poll.informations' |translate}}</h2> + <h2> + <i class="fa fa-info-circle"></i> + <span>{{'poll.config.title.poll.informations' |translate}}</span> + </h2> <div class="form-group row"> - <label class="col-sm-4 control-label">{{ 'poll.title' | translate}}</label> - <div class="col-sm-6"> + <label class="col-sm-2 control-label">{{ 'poll.title' | translate}}</label> + <div class="col-sm-9"> <input type="text" class="form-control" focus-me="showEditTitle" ng-model="data.poll.title" required/> <info-error error="restError.title[0]" data="data.poll.title" append-class="fa-lg"></info-error> </div> </div> <div class="form-group row"> - <label class="col-sm-4 control-label">{{ 'poll.desc' | translate}}</label> - <div class="col-sm-6"> + <label class="col-sm-2 control-label">{{ 'poll.desc' | translate}}</label> + <div class="col-sm-9"> <textarea id="descEditor" ng-model="data.poll.description" class="form-control"></textarea> </div> </div> </fieldset> - <fieldset class="pollAuthor" novalidate ng-hide="!globalVariables.editMode" > - <h2>{{ 'poll.config.title.creator' | translate }}</h2> + <fieldset class="pollAuthor" novalidate ng-hide="!globalVariables.editMode" > + <h2> + <i class="fa fa-user"></i> + <span>{{ 'poll.config.title.creator' | translate }}</span> + </h2> <div class="form-group row"> - <label class="col-sm-4 control-label" for="formCreatorName"> + <label class="col-sm-2 control-label" for="formCreatorName"> {{ 'poll.config.label.creatorName' | translate }} </label> - <div class="col-sm-6"> + <div class="col-sm-9"> <input-error error="restError['creator.name'][0]" data="data.poll.creatorName"> <input type="text" class="form-control" id="formCreatorName" ng-model="data.poll.creatorName" auto-save="autoSavePoll()" /> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError['creator.name'][0]" append-class="fa-2x"></info-error> </div> </div> <div class="form-group row"> - <label class="col-sm-4 control-label" for="formCreatorEmail"> + <label class="col-sm-2 control-label" for="formCreatorEmail"> {{ 'poll.config.label.creatorEmail' | translate }} </label> - <div class="col-sm-6"> + <div class="col-sm-9"> <input-error error="restError['creator.email'][0]" data="data.poll.creatorEmail"> <input type="text" class="form-control" id="formCreatorEmail" ng-model="data.poll.creatorEmail" auto-save="autoSavePoll()" /> <span class="text-help">{{ 'poll.config.label.creatorEmail.help' | translate }}</span> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError['creator.email'][0]" append-class="fa-2x"></info-error> </div> </div> </fieldset> - - <fieldset> - <h2>{{'poll.config.title.poll.validityDates' |translate}}</h2> - + + <fieldset ng-hide="!globalVariables.editMode" > + <h2> + <i class="fa fa-clock-o"></i> + <span>{{'poll.config.title.poll.validityDates' |translate}}</span> + </h2> + <div class="form-group row"> - <label class="col-sm-4 control-label" for="formBeginDate">{{ 'poll.config.label.beginDate' | translate }}</label> - <div class="col-sm-6"> + <label class="col-sm-2 control-label" for="formBeginDate">{{ 'poll.config.label.beginDate' | translate }}</label> + <div class="col-sm-9"> <input-error error="restError.beginDate[0]" data="data.poll.beginDate"> <datetimepicker min-date="globalVariables.toDay" max-date="data.poll.endDate" @@ -87,14 +96,14 @@ for-id="formBeginDate"></datetimepicker> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError.beginDate[0]" data="data.poll.beginDate" append-class="fa-2x"></info-error> </div> </div> <div class="form-group row"> - <label class="col-sm-4 control-label" for="formEndDate">{{ 'poll.config.label.endDate' | translate }}</label> - <div class="col-sm-6"> + <label class="col-sm-2 control-label" for="formEndDate">{{ 'poll.config.label.endDate' | translate }}</label> + <div class="col-sm-9"> <input-error error="restError.endDate[0]" data="data.poll.endDate"> <datetimepicker min-date="data.poll.beginDate" ng-model="data.poll.endDate" @@ -102,33 +111,34 @@ for-id="formEndDate"></datetimepicker> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError.endDate[0]" data="data.poll.endDate" append-class="fa-2x"></info-error> </div> </div> </fieldset> - <fieldset> - - <h2>{{'poll.config.title.poll.voteCountingType' |translate}}</h2> - - <div class="form-group row"> - <div> - <label class="label-block" ng-repeat="voteCountingType in data.allVoteCountingType"> - <input type="radio" + <fieldset ng-hide="!globalVariables.editMode" > + + <h2> + <i class="fa fa-cog"></i> + <span>{{'poll.config.title.poll.voteCountingType' |translate}}</span> + </h2> + + <div class="choices-list"> + <div ng-repeat="voteCountingType in data.allVoteCountingType" class="form-group row"> + <input type="radio" + class="col-sm-1" ng-model="data.poll.voteCountingType" value="{{voteCountingType.id}}" auto-save="autoSavePoll()" /> - {{voteCountingType.name}} - </label> - <hr/> - <p ng-bind-html="toHTML(data.voteCountingType.helper)"></p> - </div> - <div class="col-sm-2"> - <info-error error="restError.voteCountingType[0]" data="data.poll.voteCountingType" append-class="fa-2x"></info-error> + <span class="choice-title col-sm-2">{{voteCountingType.name}}</span> + <div class="choice-description col-sm-9" ng-bind-html="toHTML(data.voteCountingType.helper)"></div> </div> </div> - + <div class="col-sm-2"> + <info-error error="restError.voteCountingType[0]" data="data.poll.voteCountingType" append-class="fa-2x"></info-error> + </div> + </fieldset> -</form> \ No newline at end of file +</form> diff --git a/pollen-ui-angular/src/main/webapp/partials/poll-settings.html b/pollen-ui-angular/src/main/webapp/partials/poll-settings.html index e1b004c..44753a8 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll-settings.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-settings.html @@ -19,54 +19,60 @@ #L% --> <form class="form-horizontal" novalidate> - + <fieldset> - - <div id="poll"> - <div ng-include="templateURL"></div> + <h2> + <i class="fa fa-info-circle"></i> + <span>{{'poll.config.title.choice.availableChoices' |translate}}</span> + </h2> + <div id="poll"> + <div ng-include="templateURL"></div> </div> - + + </fieldset> - - - + + + <fieldset> - <h4>{{ 'poll.config.title.choice' | translate }}</h4> + <h2> + <i class="fa fa-info-circle"></i> + <span>{{'poll.config.title.choice' |translate}}</span> + </h2> <div class="form-group row"> - <label class="col-sm-4 control-label" for="formChoiceAddAllowed"> + <label class="col-sm-3 control-label" for="formChoiceAddAllowed"> {{ 'poll.config.label.choiceAddAllowed' | translate }} </label> - <div class="col-sm-6 btn-group"> + <div class="col-sm-8 btn-group"> <input type="checkbox" id="formChoiceAddAllowed" ng-model="data.poll.choiceAddAllowed" auto-save="autoSavePoll()" /> </div> - <div class="col-sm-2"></div> </div> <div class="form-group row" ng-show="data.poll.choiceAddAllowed"> - <label class="col-sm-4 control-label" for="beginChoiceDate"> + <label class="col-sm-3 control-label" for="beginChoiceDate"> {{ 'poll.config.label.beginChoiceDate' | translate }} </label> - <div class="col-sm-6"> + <div class="col-sm-8"> <input-error error="restError.beginChoiceDate[0]" data="data.poll.beginChoiceDate"> <datetimepicker max-date="data.poll.endChoiceDate" ng-model="data.poll.beginChoiceDate" auto-save="autoSavePoll()" for-id="beginChoiceDate"></datetimepicker> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError.beginChoiceDate[0]" data="data.poll.beginChoiceDate" append-class="fa-2x"></info-error> </div> </div> <div class="form-group row" ng-if="data.poll.choiceAddAllowed"> - <label class="col-sm-4 control-label" for="endChoiceDate"> + <label class="col-sm-3 control-label" for="endChoiceDate"> {{ 'poll.config.label.endChoiceDate' | translate }} </label> - <div class="col-sm-6"> + <div class="col-sm-8"> <input-error error="restError.endChoiceDate[0]" data="data.poll.endChoiceDate"> <datetimepicker min-date="data.poll.beginChoiceDate" max-date="data.poll.endDate" @@ -75,32 +81,30 @@ for-id="endChoiceDate"></datetimepicker> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError.endChoiceDate[0]" data="data.poll.endChoiceDate" append-class="fa-2x"></info-error> </div> </div> <div class="form-group row"> - <label class="col-sm-4 control-label" for="formLimitedVote"> + <label class="col-sm-3 control-label" for="formLimitedVote"> {{ 'poll.config.label.limitedVote' | translate }} </label> - <div class="col-sm-6"> + <div class="col-sm-8"> <input type="checkbox" id="formLimitedVote" ng-model="data.poll.limitedVote" auto-save="autoSavePoll()" /> </div> - <div class="col-sm-2"></div> </div> <div class="form-group row" ng-show="data.poll.limitedVote"> - <label class="col-sm-4 control-label" for="popMaxChoiceNumber">{{ 'poll.config.label.maxChoiceNumber' | translate }}</label> - <div class="col-sm-6"> + <label class="col-sm-3 control-label" for="popMaxChoiceNumber">{{ 'poll.config.label.maxChoiceNumber' | translate }}</label> + <div class="col-sm-8"> <input-error error="restError.maxChoiceNumber[0]" data="data.poll.maxChoiceNumber"> <input type="number" min="1" step="1" class="form-control" id="popMaxChoiceNumber" ng-model="data.poll.maxChoiceNumber" auto-save="autoSavePoll()" /> </input-error> </div> - <div class="col-sm-2"> + <div class="col-sm-1"> <info-error error="restError.maxChoiceNumber[0]" data="data.poll.maxChoiceNumber" append-class="fa-2x"></info-error> </div> </div> </fieldset> - -</form> +</form> diff --git a/pollen-ui-angular/src/main/webapp/partials/home.html b/pollen-ui-angular/src/main/webapp/partials/poll-vote.html similarity index 59% copy from pollen-ui-angular/src/main/webapp/partials/home.html copy to pollen-ui-angular/src/main/webapp/partials/poll-vote.html index addf9a2..e3a89c3 100644 --- a/pollen-ui-angular/src/main/webapp/partials/home.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll-vote.html @@ -8,29 +8,18 @@ it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. - + This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. - + You should have received a copy of the GNU Affero General Public License along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> +<div ng-include="'./partials/poll-info.html'" ng-controller="PollInfoCtrl" class="poll-info"></div> -<div class="jumbotron"> - <div class="container"> - <h1> - {{ 'home.title' | translate }} - </h1> - <p> - {{ 'home.description' | translate }} - </p> - <p class=""> - <a href="#/poll/create" class="btn btn-primary btn-lg"><span class="fa fa-plus-circle"></span> {{ 'home.newPoll' | translate }}</a> - <a href="#/user/register" class="btn btn-default btn-lg" ng-if="!isConnected"><span class="fa fa-users"></span> {{ 'home.register' | translate }} </a> - </p> - </div> +<div id="poll"> + <div ng-include="templateURL"></div> </div> - diff --git a/pollen-ui-angular/src/main/webapp/partials/poll.html b/pollen-ui-angular/src/main/webapp/partials/poll.html index 0512135..90eb409 100644 --- a/pollen-ui-angular/src/main/webapp/partials/poll.html +++ b/pollen-ui-angular/src/main/webapp/partials/poll.html @@ -18,112 +18,138 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> +<div id="side-menu"> + + <ul ng-show="data.poll.id"> + <li ng-class="{active: tab == 'vote'}"> + <a href="{{globalVariables.linkVote}}"> + <span class="fa fa-thumbs-o-up fa-flip-horizontal"></span> {{ 'poll.tab.vote' | translate }} + </a> + </li> + <li ng-class="{active: tab == 'comment'}" ng-show="data.poll.commentIsVisible"> + <a href="{{globalVariables.linkComment}}"> + <span class="fa fa-comments-o"></span> {{ 'poll.tab.comment' | translate }} ({{ data.poll.commentCount }}) + </a> + </li> + <li ng-class="{active: tab == 'result'}" ng-show="data.poll.resultIsVisible"> + <a href="{{globalVariables.linkResult}}"> + <span class="fa fa-bar-chart-o"></span> {{ 'poll.tab.result' | translate }} + </a> + </li> + <li> + <a href="{{globalVariables.linkEdit}}"> + <span class="fa fa-cog"></span> Configuration + </a> + </li> + </ul> + +</div> <div id="poll-content" ng-class="{'maxi-content': globalVariables.minify}" ng-if="data.poll"> - <ul class="nav nav-tabs"> - <li ng-class="{active: tab == 'vote'}" ng-show="data.poll.id"> - <a href="{{globalVariables.linkVote}}"> - <span class="fa fa-thumbs-o-up fa-flip-horizontal"></span> {{ 'poll.tab.vote' | translate }} - </a> - </li> - <li ng-class="{active: tab == 'comment'}" ng-show="data.poll.commentIsVisible"> - <a href="{{globalVariables.linkComment}}"> - <span class="fa fa-comments-o"></span> {{ 'poll.tab.comment' | translate }} ({{ data.poll.commentCount }}) - </a> - </li> - <li ng-class="{active: tab == 'result'}" ng-show="data.poll.resultIsVisible"> - <a href="{{globalVariables.linkResult}}"> - <span class="fa fa-bar-chart-o"></span> {{ 'poll.tab.result' | translate }} - </a> - </li> - <li ng-class="{active: tab == 'edit'}" ng-show="data.poll.permission"> - <a href="{{globalVariables.linkEdit}}"> - <span class="fa fa-pencil-square-o"></span> {{ 'poll.config.title.poll' | translate }} - <info-error error="globalVariables.pollError"></info-error> - </a> - </li> - <li ng-class="{active: tab == 'conf'}" ng-show="data.poll.permission"> - <a href="{{globalVariables.linkConf}}"> - <span class="fa fa-wrench"></span> {{ 'poll.config.title.choice' | translate }} - <info-error error="globalVariables.configError"></info-error> - </a> - </li> - <li ng-class="{active: tab == 'participant'}" ng-show="data.poll.permission"> - <a href="{{globalVariables.linkParticipant}}"> - <span class="fa fa-users"></span> {{ 'poll.config.title.visibility' | translate }} - <info-error error="globalVariables.participantError"></info-error> - </a> - </li> - - <li ng-class="{active: tab == 'create'}" ng-show="globalVariables.create"> - <a href="#/poll/create"> - <span class="fa fa-pencil-square-o"></span> {{ 'poll.config.title.poll' | translate }} - <info-error error="globalVariables.pollError"></info-error> - </a> - </li> - <li ng-class="{active: tab == 'conf'}" ng-show="globalVariables.create"> - <a href="#/poll/create/conf"> - <span class="fa fa-wrench"></span> {{ 'poll.config.title.choice' | translate }} - <info-error error="globalVariables.configError"></info-error> - </a> - </li> - <li ng-class="{active: tab == 'participant'}" ng-show="globalVariables.create"> - <a href="#/poll/create/participant"> - <span class="fa fa-users"></span> {{ 'poll.config.title.visibility' | translate }} - <info-error error="globalVariables.participantError"></info-error> - </a> - </li> - </ul> - - <!--<div ng-include="'./partials/poll-info.html'" ng-controller="PollInfoCtrl" class="poll-info"></div>--> - - <div ng-include="'./partials/poll-poll.html'" ng-if="tab == 'vote'" ng-controller="PollVoteCtrl" class="anim-fade"></div> - - <div ng-if="!globalVariables.create && (tab == 'edit' || tab == 'conf' || tab == 'participant')" ng-controller="PollEditCtrl"> - - <div ng-include="'./partials/poll-poll.html'" ng-if="tab == 'edit'" class="anim-fade"></div> - - <div ng-include="'./partials/poll-settings.html'" ng-if="tab == 'conf'" class="anim-fade poll-settings"></div> - - <div ng-include="'./partials/poll-listParticipant.html'" ng-if="tab == 'participant'" class="anim-fade"></div> - - <div> - <hr/> - <button class="btn btn-primary" ng-click="savePoll()"><span class="fa fa-save"></span> {{ 'action.save' | translate }}</button> + + <header> + <h1 ng-if="globalVariables.create">{{'poll.new' | translate}}</h1> + <h1 ng-if="data.poll.permission">{{data.poll.title}}</h1> + + <ul class="tabs" ng-show="data.poll.permission" ng-if="(tab == 'edit' || tab == 'conf' || tab == 'participant')"> + <li ng-class="{active: tab == 'edit'}"> + <a href="{{globalVariables.linkEdit}}"> + {{ 'poll.config.title.poll' | translate }} + <info-error error="globalVariables.pollError"></info-error> + </a> + </li> + <li ng-class="{active: tab == 'conf'}"> + <a href="{{globalVariables.linkConf}}"> + {{ 'poll.config.title.choice' | translate }} + <info-error error="globalVariables.configError"></info-error> + </a> + </li> + <li ng-class="{active: tab == 'participant'}"> + <a href="{{globalVariables.linkParticipant}}"> + {{ 'poll.config.title.visibility' | translate }} + <info-error error="globalVariables.participantError"></info-error> + </a> + </li> + </ul> + + <ul class="tabs" ng-show="globalVariables.create"> + <li ng-class="{active: tab == 'create'}"> + <a href="#/poll/create"> + {{ 'poll.config.title.poll' | translate }} + <info-error error="globalVariables.pollError"></info-error> + </a> + </li> + <li ng-class="{active: tab == 'conf'}"> + <a href="#/poll/create/conf"> + {{ 'poll.config.title.choice' | translate }} + <info-error error="globalVariables.configError"></info-error> + </a> + </li> + <li ng-class="{active: tab == 'participant'}"> + <a href="#/poll/create/participant"> + {{ 'poll.config.title.visibility' | translate }} + <info-error error="globalVariables.participantError"></info-error> + </a> + </li> + </ul> + </header> + + <main> + <div ng-include="'./partials/poll-vote.html'" ng-if="tab == 'vote'" ng-controller="PollVoteCtrl" class="anim-fade main-view"></div> + + <div ng-if="!globalVariables.create && (tab == 'edit' || tab == 'conf' || tab == 'participant')" ng-controller="PollEditCtrl"> + + <div ng-include="'./partials/poll-poll.html'" ng-if="tab == 'edit'" class="anim-fade main-view"></div> + + <div ng-include="'./partials/poll-settings.html'" ng-if="tab == 'conf'" class="anim-fade poll-settings main-view"></div> + + <div ng-include="'./partials/poll-listParticipant.html'" ng-if="tab == 'participant'" class="anim-fade main-view"></div> + + <div> + <hr/> + <button class="btn btn-primary" ng-click="savePoll()"><span class="fa fa-save"></span> {{ 'action.save' | translate }}</button> + </div> + </div> - </div> + <div ng-if="globalVariables.create && (tab == 'create' || tab == 'conf' || tab == 'participant')"> - <div ng-if="globalVariables.create && (tab == 'create' || tab == 'conf' || tab == 'participant')"> + <div ng-include="'./partials/poll-poll.html'" ng-if="tab == 'create'" class="anim-fade main-view"></div> - <div ng-include="'./partials/poll-poll.html'" ng-if="tab == 'create'" class="anim-fade"></div> + <div ng-include="'./partials/poll-settings.html'" ng-if="tab == 'conf'" class="anim-fade poll-settings main-view"></div> - <div ng-include="'./partials/poll-settings.html'" ng-if="tab == 'conf'" class="anim-fade poll-settings"></div> + <div ng-include="'./partials/poll-listParticipant.html'" ng-if="tab == 'participant'" class="anim-fade main-view"></div> - <div ng-include="'./partials/poll-listParticipant.html'" ng-if="tab == 'participant'" class="anim-fade"></div> + <div class="actions-buttons"> + <div class="action"> + <button class="action-btn confirm" ng-click="savePoll()" ng-if="(tab == 'conf' || tab == 'participant')">{{ 'action.createPoll' | translate }}</button> + </div> + + <div class="action float-right"> + <a href="#/poll/create/conf" ng-if="tab == 'create'" class="action-btn cancel"> + {{ 'poll.config.title.choice' | translate }} + <info-error error="globalVariables.configError"></info-error> + </a> + </div> + + <div class="action float-right"> + <a href="#/poll/create/participant" ng-if="tab == 'conf'" class="action-btn cancel"> + {{ 'poll.config.title.visibility' | translate }} + <info-error error="globalVariables.participantError"></info-error> + </a> + </div> + </div> - <div> - <hr/> - <button class="btn btn-primary" ng-click="savePoll()" ng-if="(tab == 'conf' || tab == 'participant')"><span class="fa fa-save"></span> {{ 'action.createPoll' | translate }}</button> - - <a href="#/poll/create/conf" ng-if="tab == 'create'"> - <span class="fa fa-wrench"></span> {{ 'poll.config.title.choice' | translate }} - <info-error error="globalVariables.configError"></info-error> - </a> - - <a href="#/poll/create/participant" ng-if="tab == 'conf'"> - <span class="fa fa-users"></span> {{ 'poll.config.title.visibility' | translate }} - <info-error error="globalVariables.participantError"></info-error> - </a> </div> - </div> + <div ng-include="'./partials/poll-comment.html'" ng-if="tab == 'comment'" ng-controller="PollCommentCtrl" class="anim-fade"></div> - <div ng-include="'./partials/poll-comment.html'" ng-if="tab == 'comment'" ng-controller="PollCommentCtrl" class="anim-fade"></div> + <div ng-include="'./partials/poll-result.html'" ng-if="tab == 'result'" ng-controller="PollResultCtrl" class="anim-fade"></div> - <div ng-include="'./partials/poll-result.html'" ng-if="tab == 'result'" ng-controller="PollResultCtrl" class="anim-fade"></div> + <div ng-include="'./partials/poll-link.html'" id="poll-link" ng-class="{'mini-link': globalVariables.minify}" ng-show="data.poll.id"></div> -</div> + <div ng-include="'partials/footer.html'"></div> -<div ng-include="'./partials/poll-link.html'" id="poll-link" ng-class="{'mini-link': globalVariables.minify}" ng-show="data.poll.id"></div> \ No newline at end of file + </main> +</div> diff --git a/pollen-ui-angular/src/main/webapp/partials/user-edit.html b/pollen-ui-angular/src/main/webapp/partials/user-edit.html index 31a2f82..f42c3c4 100644 --- a/pollen-ui-angular/src/main/webapp/partials/user-edit.html +++ b/pollen-ui-angular/src/main/webapp/partials/user-edit.html @@ -18,14 +18,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> +<header> + <ul class="tabs"> + <li ng-class="{active : tab == 'viewProfile'}"><a href="#/user/edit" ng-click="tab = 'viewProfile'">{{ 'user.tab.viewProfile' | translate }}</a></li> + <li ng-class="{active : tab == 'editProfile'}"><a href="#/user/edit" ng-click="tab = 'editProfile'">{{ 'user.tab.editProfile' | translate }}</a></li> + <li ng-class="{active : tab == 'editPassword'}"><a href="#/user/edit" ng-click="tab = 'editPassword'">{{ 'user.tab.editPassword' | translate }}</a></li> + </ul> +</header> -<ul class="nav nav-tabs"> - <li ng-class="{active : tab == 'viewProfile'}"><a href="#/user/edit" ng-click="tab = 'viewProfile'">{{ 'user.tab.viewProfile' | translate }}</a></li> - <li ng-class="{active : tab == 'editProfile'}"><a href="#/user/edit" ng-click="tab = 'editProfile'">{{ 'user.tab.editProfile' | translate }}</a></li> - <li ng-class="{active : tab == 'editPassword'}"><a href="#/user/edit" ng-click="tab = 'editPassword'">{{ 'user.tab.editPassword' | translate }}</a></li> -</ul> - -<div ng-include="'partials/user-edit-viewProfile.html'" ng-if="tab == 'viewProfile'" class="anim-fade"></div> -<div ng-include="'partials/user-edit-editProfile.html'" ng-if="tab == 'editProfile'" class="anim-fade"></div> -<div ng-include="'partials/user-edit-password.html'" ng-if="tab == 'editPassword'" class="anim-fade"></div> - +<main> + <div ng-include="'partials/user-edit-viewProfile.html'" ng-if="tab == 'viewProfile'" class="anim-fade main-view"></div> + <div ng-include="'partials/user-edit-editProfile.html'" ng-if="tab == 'editProfile'" class="anim-fade main-view"></div> + <div ng-include="'partials/user-edit-password.html'" ng-if="tab == 'editPassword'" class="anim-fade main-view"></div> +</main> -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.