translate app + add french translation

This commit is contained in:
Sam 2016-05-05 16:00:58 +03:00
parent df10d8e3fe
commit 0266dd119b
19 changed files with 179 additions and 72 deletions

View file

@ -1,8 +1,8 @@
'use strict';
// Configuring the Forms drop-down menus
angular.module('forms').filter('formValidity',
function(){
angular.module('forms')
.filter('formValidity', function(){
return function(formObj){
if(formObj && formObj.form_fields && formObj.visible_form_fields){

View file

@ -0,0 +1,32 @@
'use strict';
angular.module('forms').config(['$translateProvider', function ($translateProvider) {
$translateProvider.translations('english', {
FORM_SUCCESS: 'Form entry successfully submitted!',
BACK_TO_FORM: 'Go back to Form',
EDIT_FORM: 'Edit this TellForm',
CREATE_FORM: 'Create this TellForm',
ADVANCEMENT: '{{done}} out of {{total}} answered',
CONTINUE_FORM: 'Continue to Form',
REQUIRED: 'required',
OPTIONAL: 'optional',
ERROR_EMAIL_INVALID: 'Please enter a valid email address',
ERROR_NOT_A_NUMBER: 'Please enter valid numbers only',
ERROR_URL_INVALID: 'Please a valid url',
OK: 'OK',
ENTER: 'press ENTER',
CONTINUE: 'Continue',
LEGAL_ACCEPT: 'I accept',
LEGAL_NO_ACCEPT: 'I dont accept',
DELETE: 'Delete',
CANCEL: 'Cancel',
UPLOAD_FILE: 'Upload your File'
});
$translateProvider.preferredLanguage('english')
.fallbackLanguage('english')
.useSanitizeValueStrategy('escape');
}]);

View file

@ -0,0 +1,27 @@
'use strict';
angular.module('forms').config(['$translateProvider', function ($translateProvider) {
$translateProvider.translations('french', {
FORM_SUCCESS: 'Votre formulaire a été enregistré!',
BACK_TO_FORM: 'Retourner au formulaire',
EDIT_FORM: 'Éditer le Tellform',
CREATE_FORM: 'Créer un TellForm',
ADVANCEMENT: '{{done}} complétés sur {{total}}',
CONTINUE_FORM: 'Aller au formulaire',
REQUIRED: 'obligatoire',
OPTIONAL: 'facultatif',
ERROR_EMAIL_INVALID: 'Merci de rentrer une adresse mail valide',
ERROR_NOT_A_NUMBER: 'Merce de ne rentrer que des nombres',
ERROR_URL_INVALID: 'Merci de rentrer une url valide',
OK: 'OK',
ENTER: 'presser ENTRÉE',
CONTINUE: 'Continuer',
LEGAL_ACCEPT: 'Jaccepte',
LEGAL_NO_ACCEPT: 'Jen naccepte pas',
DELETE: 'Supprimer',
CANCEL: 'Réinitialiser',
UPLOAD_FILE: 'Envoyer des fichier'
});
}]);

View file

@ -1,10 +1,13 @@
'use strict';
// SubmitForm controller
angular.module('forms').controller('SubmitFormController', ['$scope', '$rootScope', '$state', 'myForm', 'Auth',
function($scope, $rootScope, $state, myForm, Auth) {
angular.module('forms').controller('SubmitFormController', [
'$scope', '$rootScope', '$state', '$translate', 'myForm', 'Auth',
function($scope, $rootScope, $state, $translate, myForm, Auth) {
$scope.authentication = Auth;
$scope.myform = myForm;
console.log(myForm);
$translate.use(myForm.language);
if(!$scope.myform.isLive){
// Show navbar if form is not public AND user IS loggedin
@ -19,6 +22,5 @@ angular.module('forms').controller('SubmitFormController', ['$scope', '$rootScop
}else{
$scope.hideNav = $rootScope.hideNav = true;
}
}
]);

View file

@ -1,5 +1,5 @@
angular.module('forms', ['duScroll', 'ngResource', 'NodeForm.templates']);
angular.module('forms', ['duScroll', 'ngResource', 'NodeForm.templates', 'pascalprecht.translate']);
angular.module('NodeForm', [
'ui.select', 'cgBusy', 'ngSanitize', 'vButton', 'ngResource',

File diff suppressed because one or more lines are too long

View file

@ -18,7 +18,7 @@ angular.module('forms').directive('fieldDirective', ['$http', '$compile', '$root
if (__indexOf.call(supportedFields, type) >= 0) {
templateUrl = templateUrl+type+'.html';
}
return $templateCache.get('../public/'+templateUrl);
return $templateCache.get(templateUrl);
};
return {

View file

@ -11,12 +11,17 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
$scope.authentication = $rootScope.authentication;
$scope.noscroll = false;
$scope.forms = {};
$scope.form_fields_count = $scope.myform.visible_form_fields.filter(function(field){
var form_fields_count = $scope.myform.visible_form_fields.filter(function(field){
if(field.fieldType === 'statement' || field.fieldType === 'rating'){
return false;
}
return true;
}).length;
$scope.translateAdvancementData = {
done: $filter('formValidity')($scope.myform),
total: form_fields_count
};
$scope.reloadForm = function(){
//Reset Form
@ -109,6 +114,11 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
$scope.selected._id = field_id;
$scope.selected.index = field_index;
$scope.translateAdvancementData = {
done: $filter('formValidity')($scope.myform),
total: form_fields_count
};
if(animateScroll){
$scope.noscroll=true;
setTimeout(function() {

View file

@ -9,7 +9,7 @@
<div class="row form-actions" style="padding-bottom:3em; padding-left: 1em; padding-right: 1em;">
<p ng-repeat="button in pageData.buttons" class="text-center" style="display:inline;">
<button class="btn btn-info" type="button" ng-style="{'background-color':button.bgColor, 'color':button.color}">
<a href="{{button.url}}" style="font-size: 1.6em; text-decoration: none; color: inherit;" >
<a href="{{button.url}}" style="font-size: 1.6em; text-decoration: none; color: inherit;" >
{{button.text}}
</a>
</button>
@ -18,7 +18,7 @@
<div class="row form-actions">
<p class="col-xs-3 col-xs-offset-3 text-center">
<button class="btn btn-info" type="button">
<a ng-click="exitpageData()" style="color:white; font-size: 1.6em; text-decoration: none;">Continue to Form</a>
<a ng-click="exitpageData()" style="color:white; font-size: 1.6em; text-decoration: none;">{{ 'CONTINUE_FORM' | translate }}</a>
</button>
</p>
</div>
</div>

View file

@ -6,8 +6,8 @@
{{index+1}}
<i class="fa fa-angle-double-right" aria-hidden="true"></i>
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required && !field.fieldValue">optional</span>
{{field.title}}
<span class="required-error" ng-show="!field.required && !field.fieldValue">{{ 'OPTIONAL' | translate }}</span>
</h3>
<p class="col-xs-12">
<small>{{field.description}}</small>

View file

@ -6,8 +6,8 @@
{{index+1}}
<i class="fa fa-angle-double-right" aria-hidden="true"></i>
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required">optional</span>
{{field.title}}
<span class="required-error" ng-show="!field.required">{{ 'OPTIONAL' | translate }}</span>
</h3>
<p class="col-xs-12">
<small>{{field.description}}</small>
@ -30,7 +30,7 @@
ng-class="{'active': option.option_value === field.fieldValue }">
<span ng-bind-html="option.option_value | highlight: $select.search"></span>
</ui-select-choices>
</ui-select>
</ui-select>
</div>
</div>
<br>

View file

@ -1,14 +1,14 @@
<div class="field row radio legal"
on-enter-or-tab-key="nextField()"
key-to-truthy key-char-truthy="y" key-char-falsey="n" field="field">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<h3>
<small class="field-number">
{{index+1}}
<i class="fa fa-angle-double-right" aria-hidden="true"></i>
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required">optional</span>
<span class="required-error" ng-show="!field.required">{{ 'OPTIONAL' | translate }}</span>
</h3>
<br>
<p class="col-xs-12">{{field.description}}</p>
@ -21,24 +21,24 @@
ng-class="{activeBtn: field.fieldValue == 'true'}">
<input class="focusOn"
ng-focus="setActiveField(field._id, index, true)"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
type="radio" value="true"
ng-model="field.fieldValue"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-required="field.required"
ng-disabled="field.disabled"
ng-change="$root.nextField()"/>
<div class="letter" style="float:left">
Y
</div>
<span> I accept </span>
<span> {{ 'LEGAL_ACCEPT' | translate }} </span>
</label>
<label class="btn col-md-5 col-md-offset-1 col-xs-12"
ng-class="{activeBtn: field.fieldValue == 'false'}">
<input class="focusOn"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
type="radio" value="false"
ng-model="field.fieldValue"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-disabled="field.disabled"
@ -46,10 +46,10 @@
<div class="letter" style="float:left">
N
</div>
<span>I don't accept </span>
<span>{{ 'LEGAL_NO_ACCEPT' | translate }} </span>
</label>
</div>
</div>
</div>
<br>

View file

@ -9,7 +9,7 @@
<i class="fa fa-angle-double-right" aria-hidden="true"></i>
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required">optional</span>
<span class="required-error" ng-show="!field.required">{{ 'OPTIONAL' | translate }}</span>
</h3>
<p class="col-xs-12">
<small>{{field.description}}</small>
@ -28,12 +28,12 @@
type="radio" class="focusOn"
ng-focus="setActiveField(field._id, index, true)"
value="{{option.option_value}}"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-disabled="field.disabled"
ng-change="$root.nextField()"/>
<span ng-bind="option.option_value"></span>
</label>
</div>

View file

@ -7,7 +7,7 @@
<i class="fa fa-angle-double-right" aria-hidden="true"></i>
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required">optional</span>
<span class="required-error" ng-show="!field.required">{{ 'OPTIONAL' | translate }}</span>
</h3>
<p class="col-xs-12">
<small>{{field.description}}</small>

View file

@ -13,11 +13,11 @@
<p class="col-xs-12" ng-if="field.description.length">{{field.description}} </p>
<br>
<div class="col-xs-offset-1 col-xs-11">
<button class="btn focusOn"
<button class="btn focusOn"
ng-style="{'font-size': '1.3em', 'background-color':design.colors.buttonColor, 'color':design.colors.buttonTextColor}"
ng-focused="setActiveField(field._id, index, true)"
ng-click="$root.nextField()">
Continue
{{ 'CONTINUE' | translate }}
</button>
</div>
</div>

View file

@ -37,11 +37,11 @@
ng-click="$root.nextField()"
class="btn col-sm-5 col-xs-5">
OK <i class="fa fa-check"></i>
{{ 'OK' | translate }} <i class="fa fa-check"></i>
</button>
<div class="col-sm-3 col-xs-6" style="margin-top:0.2em">
<small style="color:#ddd; font-size:70%">
press ENTER
{{ 'ENTER' | translate }}
</small>
</div>
</div>

View file

@ -10,7 +10,7 @@
{{field.title}}
<span class="required-error" ng-show="!field.required">
(optional)
({{ 'OPTIONAL' | translate }})
</span>
</h3>
@ -19,15 +19,15 @@
</p>
</div>
<div class="col-xs-12 field-input">
<input ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
<input ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
name="{{field.fieldType}}{{index}}"
type="{{field.input_type}}"
ng-pattern="field.validateRegex"
placeholder="{{field.placeholder}}"
ng-class="{ 'no-border': !!field.fieldValue }"
class="focusOn text-field-input"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
value="field.fieldValue"
ng-focus="setActiveField(field._id, index, true)"
on-enter-or-tab-key="nextField()"
@ -36,29 +36,29 @@
ng-disabled="field.disabled"
aria-describedby="inputError2Status">
</div>
<div class="col-xs-12">
<div class="col-xs-12">
<div ng-show="forms.myForm.{{field.fieldType}}{{index}}.$invalid && !!forms.myForm.{{field.fieldType}}{{index}}.$viewValue " class="alert alert-danger" role="alert">
<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
<span class="sr-only">Error:</span>
<span ng-if="field.fieldType == 'email'"> Please enter a valid email address </span>
<span ng-if="field.validateRegex"> Please enter valid numbers only </span>
<span ng-if="field.fieldType == 'link'"> Please a valid url </span>
<span ng-if="field.fieldType == 'email'"> {{ 'ERROR_EMAIL_INVALID' | translate }} </span>
<span ng-if="field.validateRegex"> {{ 'ERROR_NOT_A_NUMBER' | translate }} </span>
<span ng-if="field.fieldType == 'link'"> {{ 'ERROR_URL_INVALID' | translate }} </span>
</div>
</div>
</div>
<div>
<div class="btn btn-lg btn-default col-xs-12 col-sm-4 hidden-xs"
style="padding: 4px; margin-top:8px; background: rgba(255,255,255,0.5)">
<button ng-disabled="!field.fieldValue || forms.myForm.{{field.fieldType}}{{$index}}.$invalid"
<button ng-disabled="!field.fieldValue || forms.myForm.{{field.fieldType}}{{$index}}.$invalid"
ng-style="{'background-color':design.colors.buttonColor, 'color':design.colors.buttonTextColor}"
ng-click="$root.nextField()"
ng-click="$root.nextField()"
class="btn col-sm-5 col-xs-5">
OK <i class="fa fa-check"></i>
{{ 'OK' | translate }} <i class="fa fa-check"></i>
</button>
<div class="col-xs-6 col-sm-3" style="margin-top:0.2em">
<small style="color:#ddd; font-size:70%">
press ENTER
{{ 'ENTER' | translate }}
</small>
</div>
</div>

View file

@ -10,7 +10,7 @@
</small>
{{field.title}}
<span class="required-error" ng-show="!field.required">
optional
{{ 'OPTIONAL' | translate }}
</span>
</h3>
<p class="row">
@ -22,35 +22,42 @@
<div class="row">
<label class="btn btn-default col-md-2 col-sm-3 col-xs-7"
style="background: rgba(0,0,0,0.1); text-align:left;">
<input type="radio" value="true"
<input type="radio" value="true"
class="focusOn"
style="opacity: 0; margin-left: 0px;"
ng-model="field.fieldValue"
ng-focus="setActiveField(field._id, index, true)"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-change="$root.nextField()"
ng-disabled="field.disabled" />
<div class="letter">
Y
</div>
</div>
<span>Yes</span>
<i ng-show="field.fieldValue === 'true'" class="fa fa-check" aria-hidden="true"></i>
</label>
</div>
<div class="row" style="margin-top: 10px;">
<label class="btn btn-default col-md-2 col-sm-3 col-xs-7"
style="background: rgba(0,0,0,0.1); text-align:left;">
<input type="radio" value="false"
<input type="radio" value="false"
style="opacity:0; margin-left:0px;"
<<<<<<< df10d8e3fe9b17eb9b620a4261a8efd1126d780e
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
=======
ng-focus="setActiveField(field._id, index, true)"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
>>>>>>> translate app + add french translation
ng-change="$root.nextField()"
ng-disabled="field.disabled"/>
<div class="letter">
N
</div>

View file

@ -1,7 +1,7 @@
<section class="overlay submitform" ng-if="loading || (!myform.submitted && !myform.startPage.showStart)"></section>
<!-- Start Page View -->
<div ng-show="!myform.submitted && myform.startPage.showStart"
<div ng-show="!myform.submitted && myform.startPage.showStart"
class="form-submitted"
style="padding-top: 35vh;">
<div class="row">
@ -28,8 +28,8 @@ ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.d
<div class="row form-actions" style="padding-bottom:3em; padding-left: 1em; padding-right: 1em;">
<p ng-repeat="button in myform.startPage.buttons" class="text-center" style="display:inline;">
<button class="btn" style="background-color:rgb(156, 226, 235)" type="button" ng-style="{'background-color':button.bgColor, 'color':button.color}">
<a href="{{button.url}}"
style="font-size: 1.6em; text-decoration: none;"
<a href="{{button.url}}"
style="font-size: 1.6em; text-decoration: none;"
ng-style="{'color':button.color}">
{{button.text}}
</a>
@ -58,6 +58,7 @@ ng-style="{'color':button.color}">
</field-directive>
</div>
</form>
</div>
@ -97,42 +98,42 @@ ng-style="{'color':button.color}">
<div class="col-sm-2 hidden-xs" style="font-size: 75%; margin-top:3.25em">
<small>
press ENTER
{{ 'ENTER' | translate }}
</small>
</div>
</div>
<section ng-if="!myform.hideFooter" class="navbar navbar-fixed-bottom"
<section ng-if="!myform.hideFooter" class="navbar navbar-fixed-bottom"
ng-style="{ 'background-color':myform.design.colors.buttonColor, 'padding-top': '15px', 'border-top': '2px '+ myform.design.colors.buttonTextColor +' solid', 'color':myform.design.colors.buttonTextColor}">
<div class="container-fluid">
<div class="row">
<div class="col-sm-5 col-md-6 col-xs-5" ng-show="!myform.submitted">
<p class="lead">{{myform | formValidity}} out of {{form_fields_count}} answered</p>
<p class="lead">{{ 'ADVANCEMENT' | translate:translateAdvancementData }}</p>
</div>
<div class="col-md-6 col-md-offset-0 col-sm-offset-2 col-sm-3 col-xs-offset-1 col-xs-6 row">
<div class="col-md-4 col-md-offset-2 hidden-sm hidden-xs" ng-if="!authentication.isAuthenticated()">
<a href="/#!/forms" class="btn"
ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.design.colors.buttonTextColor}">
Create a TellForm
{{ 'CREATE_FORM' | translate }}
</a>
</div>
<div class="col-md-4 col-md-offset-2 hidden-sm hidden-xs" ng-if="authentication.isAuthenticated()">
<a href="/#!/forms/{{myform._id}}/admin/create"
<a href="/#!/forms/{{myform._id}}/admin/create"
ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.design.colors.buttonTextColor}"
class="btn">
Edit this TellForm
{{ 'EDIT_FORM' | translate }}
</a>
</div>
<div class="col-md-4 col-sm-10 col-md-offset-0 col-sm-offset-2 col-xs-12 row">
<button class="btn btn-lg col-xs-6" id="focusDownButton"
ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.design.colors.buttonTextColor}"
ng-click="nextField()"
ng-click="nextField()"
ng-disabled="selected.index > myform.form_fields.length-1">
<i class="fa fa-chevron-down"></i>
</button>
<button class="btn btn-lg col-xs-6" id="focusUpButton"
ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.design.colors.buttonTextColor}"
ng-click="prevField()"
ng-click="prevField()"
ng-disabled="selected.index == 0">
<i class="fa fa-chevron-up"></i>
</button>
@ -149,13 +150,13 @@ ng-style="{'color':button.color}">
style="padding-top: 5vh;">
<div class="field row text-center">
<div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 text-center">Form entry successfully submitted!</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-md-offset-3 text-center">{{ 'FROM_SUCCESS' | translate }}</div>
</div>
<div class="row form-actions">
<p class="text-center">
<button ng-click="reloadForm()" class="btn" type="button"
ng-style="{'background-color':myform.design.colors.buttonColor, 'color':myform.design.colors.buttonTextColor}">
<span style="font-size: 1.6em;"> Go back to Form</span>
<span style="font-size: 1.6em;"> {{ 'BACK_TO_FORM' | translate }}</span>
</button>
</p>
</div>