Browse Source

feat: Added localization to editor-codeblock

pull/119/head
NGPixel 7 years ago
parent
commit
2aaebb3ce0
4 changed files with 31 additions and 29 deletions
  1. 28
      client/js/components/editor-codeblock.vue
  2. 7
      server/locales/en/browser.json
  3. 23
      server/views/modals/editor-codeblock.pug
  4. 2
      server/views/pages/view.pug

28
client/js/components/editor-codeblock.vue

@ -7,11 +7,14 @@
transition(name='modal-content')
.modal-content.is-expanded(v-show='isShown')
header.is-green
span Insert Code Block
span {{ $t('editor.codeblocktitle') }}
p.modal-notify(v-bind:class='{ "is-active": isLoading }')
span {{ $t('editor.codeblockloading', { name: modeSelected }) }}
i
section.is-gapless
.columns.is-stretched
.column.is-one-quarter.modal-sidebar.is-green(style={'max-width':'350px'})
.model-sidebar-header Language
.model-sidebar-header {{ $t('editor.codeblocklanguage') }}
.model-sidebar-content
p.control.is-fullwidth
select(v-model='modeSelected')
@ -19,8 +22,8 @@
.column.ace-container
#codeblock-editor
footer
a.button.is-grey.is-outlined(v-on:click='cancel') Discard
a.button.is-green(v-on:click='insertCode') Insert Code Block
a.button.is-grey.is-outlined(v-on:click='cancel') {{ $t('editor.discard') }}
a.button.is-green(v-on:click='insertCode') {{ $t('editor.codeblockinsert') }}
</template>
<script>
@ -33,7 +36,8 @@
return {
modes: [],
modeSelected: 'text',
modelistLoaded: []
modelistLoaded: [],
isLoading: false
}
},
computed: {
@ -72,13 +76,27 @@
if (self._.includes(self.modelistLoaded, m)) {
codeEditor.getSession().setMode('ace/mode/' + m)
} else {
self.isLoading = true
self.$http.get('/js/ace/mode-' + m + '.js').then(resp => {
if(resp.ok) {
eval(resp.bodyText)
self.modelistLoaded.push(m)
ace.acequire('ace/mode/' + m)
codeEditor.getSession().setMode('ace/mode/' + m)
self._.delay(() => { self.isLoading = false }, 500)
} else {
this.$store.dispatch('alert', {
style: 'red',
icon: 'square-cross',
msg: 'Error: Unable to load language syntax.'
})
}
}).catch(err => {
his.$store.dispatch('alert', {
style: 'red',
icon: 'square-cross',
msg: 'Error: ' + err.body.msg
})
})
}
},

7
server/locales/en/browser.json

@ -1,4 +1,11 @@
{
"editor": {
"discard": "Discard",
"codeblocktitle": "Insert Code Block",
"codeblockinsert": "Insert Code Block",
"codeblocklanguage": "Language",
"codeblockloading": "Loading code syntax for {{name}}"
},
"nav": {
"home": "Home"
},

23
server/views/modals/editor-codeblock.pug

@ -1,23 +0,0 @@
.modal#modal-editor-codeblock
.modal-background
.modal-container
.modal-content.is-expanded
header.is-green
span Insert Code Block
section.is-gapless
.columns.is-stretched
.column.is-one-quarter.modal-sidebar.is-green(style={'max-width':'350px'})
.model-sidebar-header Language
.model-sidebar-content
p.control.is-fullwidth
select(v-model='modeSelected')
option(v-for='mode in modes', v-bind:value='mode.name') {{ mode.caption }}
.column.ace-container
#codeblock-editor
footer
a.button.is-grey.is-outlined(v-on:click='cancel') Discard
a.button.is-green(v-on:click='insertCode') Insert Code Block

2
server/views/pages/view.pug

@ -18,7 +18,7 @@ block rootNavRight
a.button.is-outlined(href='/source/' + pageData.meta.path)
i.icon-loader
span= t('nav.source')
a.button.is-outlined(href='/hist/' + pageData.meta.path)
//- a.button.is-outlined(href='/hist/' + pageData.meta.path)
i.icon-clock
span= t('nav.history')
if rights.write

Loading…
Cancel
Save