Commit 1db93f6f authored by ZeMKI's avatar ZeMKI
Browse files

Translations

* now the translations are fully programmed, a documentation file on office will explain how to add them.
parent 43ec1583
......@@ -39,7 +39,7 @@ Vue.config.debug = true;
Vue.config.silent = false;
Vue.prototype.trans = (key) => {
return _.findKey(window.trans,key)? window.trans[_.findKey(window.trans,key)][key] : key;
return _.isUndefined(window.trans[key])? key : window.trans[key];
};
/**
......
<template>
<section style="margin-left:auto;margin-right:auto;position: fixed;">
<button class="button is-danger" v-if="!loadingprogress > 0" id="downloadbutton" style="display: flex;z-index: 1000;margin: 5px;position: fixed;" @click="download" > export PDF</button>
<button class="button is-danger" v-if="!loadingprogress > 0" id="downloadbutton" style="display: flex;z-index: 1000;margin: 5px;position: fixed;" @click="download" >{{ trans('export PDF') }}</button>
<img v-show="!loading" :src="screenshot" id="sorting" style="max-width: 100%;max-height: 100%;position:fixed;left:10%">
<div class="columns" style="top:50%;left: 50%;position: fixed;" :class="loading? 'columns loading' : 'columns'"></div>
<div id="bottom" v-show="!loading" style="display: flex;z-index: 1000;margin: 5px;position: fixed;bottom:0px;width:100%;background-color:#e9e7e3;display: inline;">
......
......@@ -17,20 +17,20 @@
{{ props.row.id }}
</b-table-column>
<b-table-column field="email" label="Author" sortable>
<b-table-column field="email" :label="trans('Author')" sortable>
{{ props.row.author }}
</b-table-column>
<b-table-column field="name" label="Interviewee" sortable>
<b-table-column field="name" :label="trans('Interviewee')" sortable>
{{ props.row.interviewed }}
</b-table-column>
<b-table-column field="date" label="Start" centered sortable>
<b-table-column field="date" :label="trans('Start')" centered sortable>
<span class="tag is-success">
{{ formatdate(props.row.start) }}
</span>
</b-table-column>
<b-table-column field="date" label="End" centered sortable>
<b-table-column field="date" :label="trans('End')" centered sortable>
<span class="tag is-success">
{{ formatdate(props.row.end) }}
</span>
......@@ -64,7 +64,7 @@
<template slot="empty">
<section class="section">
<div class="content has-text-grey has-text-centered">
<p>No interviews.</p>
<p>{{ trans('No interviews.') }}</p>
</div>
</section>
</template>
......
......@@ -3,18 +3,21 @@
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title" v-html="'Add/edit User for study '+study"></p>
<p class="modal-card-title">{{ trans('Add/edit User for study') }} {{study}}</p>
</header>
<section class="modal-card-body">
<div class="columns">
<div class="level">
<div class="column is-four-fifths">
<div class="field">
<label class="label">Email </label>
<label class="label">{{ trans('Email') }} </label>
<div class="control">
<input class="input has-background-dark has-text-light" type="email" placeholder="User email" id="studyname" v-model="email" />
<input class="input has-background-dark has-text-light" type="email"
placeholder="User email" id="studyname" v-model="email"/>
</div>
<span v-if="emailexistmessage.length > 0" :class="this.emailexist ? 'tag is-warning' : 'tag is-danger'" v-html="emailexistmessage"></span>
<span v-if="emailexistmessage.length > 0"
:class="this.emailexist ? 'tag is-warning' : 'tag is-danger'"
v-html="emailexistmessage"></span>
</div>
</div>
<div class="column is-one-fourth">
......@@ -33,95 +36,34 @@
</div>
<div class="column is-one-fourth" v-if="this.update">
<div class="field">
<label class="label"> Reset </label>
<a class="button is-danger" @click="sendresetpassworddialog">Send reset email</a>
<label class="label"> {{ trans('Reset') }} </label>
<a class="button is-danger" @click="sendresetpassworddialog">{{ trans('Send reset email') }}</a>
</div>
</div>
</div>
</div>
<!-- <div class="columns">
<div class="level">
<div class="column">
<div class="field">
<label class="label">Assign to study</label>
<div class="control" >
<label class="radio" v-for="study in inputs.studies" @click="loadpermissions(study.id)" style="display: block">
<input type="radio" name="foobar" v-model="studyradio" :value="study.id">
{{study.name.substring(0,30)}}
</label>
</div>
</div>
</div>
<div class="column is-three-quarters">
<div class="field">
<label class="label">Specific permissions</label>
<label class="checkbox" :disabled="studyradio ==0">
<input type="checkbox" :disabled="studyradio ==0" v-model="permissions.onlyconsult">
Only consult
</label><br>
<label class="checkbox" :disabled="permissions.onlyconsult || studyradio ==0 || globalpermissions.cancreatestudy">
<input type="checkbox" :disabled="permissions.onlyconsult || studyradio ==0 || globalpermissions.cancreatestudy" v-model="permissions.caneditstudy">
Can edit information of this study
</label><br>
<label class="checkbox" :disabled="permissions.onlyconsult || studyradio ==0 || globalpermissions.cancreateusers">
<input type="checkbox" :disabled="permissions.onlyconsult || studyradio ==0 || globalpermissions.cancreateusers" v-model="permissions.canassignusers">
Can assign users to this study
</label><br>
<hr>
<label class="label">Global</label>
<label class="checkbox">
<input type="checkbox" v-model="globalpermissions.cancreateusers">
Can create users
</label><br>
<label class="checkbox">
<input type="checkbox" v-model="globalpermissions.cancreatestudy">
Can create studies
</label>
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column" v-if="inputs.supervisors.length > 0">
<div class="field">
<b-field label="Supervised by">
<b-select placeholder="Select a supervisor" v-model="supervisorselected">
<option
v-for="s in inputs.supervisors"
:value="s.user_id"
:key="s.user_id">
{{ s.email }}
</option>
</b-select>
</b-field>
</div>
</div>
</div>-->
<div v-if="errors.length > 0" class="notification is-danger" role="alert">
<div v-if="errors.length > 0" class="notification is-danger" role="alert">
<p v-if="errors" v-for="(error,index) in errors"> {{error}}</p>
</div>
</div>
<div v-if="message" class="notification is-success " role="alert">
<div v-if="message" class="notification is-success " role="alert">
{{message}}
</div>
</section>
</div>
</section>
<footer class="modal-card-foot">
<button v-if="!update" class="button is-success" @click="saveuser">Save changes</button>
<footer class="modal-card-foot">
<button v-if="!update" class="button is-success" @click="saveuser">{{ trans('Save changes') }}</button>
<button v-if="update" class="button is-success" @click="updateuser">Update User</button>
<button class="button" @click="showmodalparent">Cancel</button>
</footer>
</div>
</div>
<button class="button" @click="showmodalparent">{{ trans('Cancel') }}</button>
</footer>
</div>
</div>
</template>
<script>
export default {
props: ['showmodal','assignstudy','edituser','study'],
props: ['showmodal', 'assignstudy', 'edituser', 'study'],
mounted() {
},
data() {
......@@ -135,11 +77,11 @@
studiesselected: [],
supervisorselected: [],
allpermissions: [],
globalpermissions:{
globalpermissions: {
cancreateusers: false,
cancreatestudy: false
},
inputs:{
inputs: {
userroles: [],
studies: [],
supervisors: []
......@@ -150,29 +92,29 @@
}
},
computed: {
update: function(){
return (this.edituser > 0 );
update: function () {
return (this.edituser > 0);
}
},
watch: {
showmodal: function(newVal,oldVal){
showmodal: function (newVal, oldVal) {
let self = this;
self.message = "";
self.errors = [];
// from edit to add new
if(!this.update){
if (!this.update) {
this.usertoedit = {};
this.emptyform();
}
if(newVal){
if (newVal) {
// for some reasons it can't find the modal background
// but after 1 millisecond it does
setTimeout(function() {
document.querySelector('.modal-background').addEventListener('click', function(e) {
setTimeout(function () {
document.querySelector('.modal-background').addEventListener('click', function (e) {
document.querySelector('html').classList.remove('is-clipped');
self.$emit('showmodalparent');
......@@ -184,16 +126,16 @@
}
},
'permissions.onlyconsult': function(newVal,oldVal){
'permissions.onlyconsult': function (newVal, oldVal) {
let self = this;
if(newVal){
if (newVal) {
self.permissions.caneditstudy = false;
self.permissions.canassignusers = false;
}
},
permissions: {
deep: true,
handler(val){
handler(val) {
let self = this;
console.log(val)
let permissionsVariables = {
......@@ -205,43 +147,43 @@
6: "creator"
};
for (var permission in val){
for (var permission in val) {
self.studiesselected[self.studyradio][permission] = val[permission];
}
}
},
userroleselected: function(newVal,oldVal){
userroleselected: function (newVal, oldVal) {
let self = this;
if(newVal == 2){
if (newVal == 2) {
self.globalpermissions.cancreatestudy = true;
self.globalpermissions.cancreateusers = true;
}else if(newVal == 3){
} else if (newVal == 3) {
self.resetallpermissions();
}
},
email: function(newVal,oldVal){
email: function (newVal, oldVal) {
if(newVal.length > 4 && newVal.indexOf('@') > -1 && !this.update){
if (newVal.length > 4 && newVal.indexOf('@') > -1 && !this.update) {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if(re.test(String(newVal).toLowerCase())){
window.axios.post('checkemail',{email: newVal}).then(response =>{
if (re.test(String(newVal).toLowerCase())) {
window.axios.post('checkemail', {email: newVal}).then(response => {
this.emailexist = response.data;
if(response.data){
if (response.data) {
this.emailexistmessage = "This user will be invited.";
}else{
} else {
this.emailexistmessage = "This user is not registered, an invitation email will be sent.";
}
}).catch(error =>{
}).catch(error => {
});
}else{
} else {
}
......@@ -251,7 +193,7 @@
}
},
methods: {
createStudyPermissionArray: function(id){
createStudyPermissionArray: function (id) {
let permissionsVariables = [
"onlyconsult",
"caneditstudy",
......@@ -260,15 +202,15 @@
/// if the study doesn't exist, initialize with all false values
/// otherwise assign the values to the 3 permissions checkboxes
if(_.isUndefined(this.studiesselected[id])){
if (_.isUndefined(this.studiesselected[id])) {
this.studiesselected[id] = {}
for (var i = 0; i < permissionsVariables.length; i++) {
this.studiesselected[id][permissionsVariables[i]] = false;
}
this.resetspecificpermissions();
}else{
} else {
console.log("study exist")
for(let p in this.permissions){
for (let p in this.permissions) {
this.permissions[p] = this.studiesselected[id][p];
}
......@@ -276,88 +218,88 @@
},
getinputdata: function(){
getinputdata: function () {
this.inputs.supervisors = [];
window.axios.post('getinputdata').then(response =>{
window.axios.post('getinputdata').then(response => {
this.inputs.userroles = response.data.allroles;
this.userroleselected = 3;
}).catch(error =>{
console.log("error "+error);
}).catch(error => {
console.log("error " + error);
});
},
showmodalparent: function(){
showmodalparent: function () {
this.$emit('showmodalparent');
},
saveuser: function(){
},
saveuser: function () {
let activeStudies = this.study;
let activeStudies = this.study;
if(this.validate()){
if (this.validate()) {
let user = {};
_.merge(user,{email: this.email},{emailexist: this.emailexist},{role: this.userroleselected},{study: activeStudies});
_.merge(user, {email: this.email}, {emailexist: this.emailexist}, {role: this.userroleselected}, {study: activeStudies});
window.axios.post('users',user).then(response =>{
window.axios.post('users', user).then(response => {
this.message = "";
this.message = response.data;
window.axios.get('studies/users/'+this.study).then(response =>{
window.axios.get('studies/users/' + this.study).then(response => {
// this.$emit('reloadusers',{'response':response,'study': this.study});
Vue.set(this.$parent.users,this.study,response.data)
Vue.set(this.$parent.users, this.study, response.data)
// this.$parent.$forceUpdate();
}).catch(error =>{
}).catch(error => {
console.log(error);
});
}).catch(error =>{
}).catch(error => {
this.errors = error.message;
});
}
});
}
},
updateuser: function(){
},
updateuser: function () {
let user = {};
_.merge(user,{id: this.usertoedit},{email: this.email},{emailexist: this.emailexist},{roles: this.userroleselected},{studies: this.studiesselected},{permissions: this.permissions});
_.merge(user, {id: this.usertoedit}, {email: this.email}, {emailexist: this.emailexist}, {roles: this.userroleselected}, {studies: this.studiesselected}, {permissions: this.permissions});
window.axios.post('updateuser',user).then(response =>{
window.axios.post('updateuser', user).then(response => {
this.message = "";
this.message = response.data;
}).catch(error =>{
}).catch(error => {
this.errors = error.data;
});
},
validate: function(){
},
validate: function () {
this.errors = [];
if(this.email == "" || !this.validEmail) this.errors.push("please enter a valid email");
if(!this.userroleselected) this.errors.push("please select a role");
if(this.errors.length > 0) return false;
if (this.email == "" || !this.validEmail) this.errors.push("please enter a valid email");
if (!this.userroleselected) this.errors.push("please select a role");
if (this.errors.length > 0) return false;
else return true;
},
validEmail: function () {
},
validEmail: function () {
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(this.email);
},
emptyform: function() {
},
emptyform: function () {
this.email = "";
this.emailexistmessage ="";
this.emailexistmessage = "";
this.userroleselected = [];
this.studiesselected = [];
},
sendresetpassworddialog() {
},
sendresetpassworddialog() {
this.$dialog.confirm({
title: 'Send reset password email',
message: 'Are you sure you want to <b>reset</b> password and wait for the user to set it? This action cannot be undone.',
......@@ -366,22 +308,22 @@ sendresetpassworddialog() {
hasIcon: true,
onConfirm: () => this.sendresetopassword()
})
},
sendresetopassword() {
window.axios.post('resetpassword',this.usertoedit).then(response =>{
},
sendresetopassword() {
window.axios.post('resetpassword', this.usertoedit).then(response => {
this.message = "";
this.message = response.data;
}).catch(error =>{
}).catch(error => {
this.errors = error.data.errors;
});
},
resetallpermissions: function(){
},
resetallpermissions: function () {
this.globalpermissions.cancreateusers = false;
this.globalpermissions.cancreatestudy = false;
}
}
}
}
}
</script>
......@@ -19,11 +19,10 @@
<a class="button navigation-question-next"
@click="interview.presortindex++"
:disabled="questions.presort.length == interview.presortindex-1"
v-show="interview.presortindex < questions.presort.length-1"> Next Question
> </a>
v-show="interview.presortindex < questions.presort.length-1"> {{ trans('Next Question') }} > </a>
<a class="button navigation-question-previous"
@click="interview.presortindex--" :disabled="interview.presortindex == 0"
v-show="interview.presortindex > 0"> < Previous Question </a>
v-show="interview.presortindex > 0"> < {{ trans('Previous Question') }} </a>
<div class="control" v-if="a.type =='open'">
<textarea class="textarea is-large" type="text" placeholder="OPEN ANSWER"
v-model="results[x.answer.ids[answerindex]]">
......@@ -116,10 +115,10 @@
<a class="button navigation-question-next"
@click="interview.postsortindex++"
:disabled="questions.postsort.length == interview.postsortindex-1"
v-show="interview.postsortindex < questions.postsort.length-1"> Next Question > </a>
v-show="interview.postsortindex < questions.postsort.length-1"> {{ trans('Next Question') }} ></a>
<a class="button navigation-question-previous "
@click="interview.postsortindex--" :disabled="interview.postsortindex == 0"
v-show="interview.postsortindex > 0"> < Previous Question </a>
v-show="interview.postsortindex > 0"> < {{ trans('Previous Question') }} </a>
<div class="control" v-if="a.type =='open'">
<textarea class="textarea is-large" type="text" placeholder="OPEN ANSWER"
......
......@@ -39,7 +39,7 @@
<div class="modal-card" style="width: auto">
<header class="modal-card-head">
<p class="modal-card-title">Create new token</p>
<p class="modal-card-title">{{ trans('Create new token') }}</p>
</header>
<section class="modal-card-body modal-newtoken">
<div :class="Object.keys(newinterview.newtoken).length !== 0 ? 'token-img-newtokenInterview m-auto w-auto h-auto' : 'token-img-newtokenInterview m-auto'" >
......@@ -47,11 +47,11 @@
style="vertical-align: bottom; ">
</div>
<div class="card-content">
<label class="label">Token name</label>
<label class="label">{{ trans('Token name') }}</label>
<input
class="input bg-gray-200 focus:bg-white border-transparent focus:border-blue-400"
type="text" v-model="newinterview.newtoken.name"/>
<label class="label mt-5">Preset tokens</label>
<label class="label mt-5">{{ trans('Preset tokens') }}</label>
<v-select class="":options="newinterview.imagepreset" label="basename" v-model="newinterview.newtoken.file"
>
<template slot="label" slot-scope="label">
......@@ -71,7 +71,7 @@
<b-upload v-model="newinterview.newtoken.file"
accept="image/*">
<a class="button is-danger">
<div class="md:text-sm">Click to upload</div>
<div class="md:text-sm">{{ trans('Click to upload') }}</div>
</a>
<br>
</b-upload>
......@@ -80,7 +80,7 @@
<a :disabled="newinterview.newtoken.name == null || newinterview.newtoken.name == ''"
:class="newinterview.newtoken.name != null || newinterview.newtoken.name == ''? 'button is-primary text-2xl m-auto w-auto': 'button is-primary text-2xl opacity-50 cursor-not-allowed m-auto w-auto'"
@click.prevent="saveToken">
Save
{{ trans('Save') }}
</a>
</div>
</section>
......
......@@ -2,7 +2,7 @@
<section>
<div :class="'sorting-container'+currentsorting" :id="'sortingc'+currentsorting"
style="scroll-behavior: unset;">
<h2 style="left:5%;position:absolute;top:15%;touch-action: none" class="remove-from-screenshot">Choose from prepared tokens.</h2>
<h2 style="left:5%;position:absolute;top:15%;touch-action: none" class="remove-from-screenshot">{{ trans('Choose from prepared tokens.') }}</h2>
<div class="token-container has-to-move flex flex-row" id="token-container" style="top:20%;left:5%;height: 50%;width:25%;flex-wrap: wrap;">
......@@ -53,7 +53,7 @@
</new-token>
<div class="token-container-created z-20 max-h-screen has-to-move"
style="max-width: 20%;top:20%;">
<h3 style="min-width:20%;" class="remove-from-screenshot relative">Your Created Tokens.</h3>
<h3 style="min-width:20%;" class="remove-from-screenshot relative">{{ trans('Your Created Tokens.') }} </h3>
<div class="sortingstart inline-block createdtokens" :class="'token'+currentsorting"
v-for="(t,index) in tokens"
......
{
"E-Mail Address": "E-Mail Address",
"New Study": "New Study",
"New Study": "New Studyyyy",
"Language": "Language",
"Create Study": "DaI!",
"To create a new study, you should provide some general information, choose a sorting scheme you wish to use and can add additional questions for your interviewees. To navigate between these options please use the three tabs provided below.": "To create a new study, you should provide some general information, choose a sorting scheme you wish to use and can add additional questions for your interviewees. To navigate between these options please use the three tabs provided below."