1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
|
/* global OC, $ */
import Vue from 'vue'
import AdminSettings from './components/AdminSettings'
import '../css/admin.scss'
// CSP config for webpack dynamic chunk loading
// eslint-disable-next-line
__webpack_nonce__ = btoa(OC.requestToken)
// Correct the root of the app for chunk loading
// OC.linkTo matches the apps folders
// eslint-disable-next-line
__webpack_public_path__ = OC.linkTo('richdocuments', 'js/')
Vue.prototype.t = t
Vue.prototype.n = n
Vue.prototype.OC = OC
Vue.prototype.OCA = OCA
const element = document.getElementById('admin-vue')
/* eslint-disable-next-line no-new */
new Vue({
render: h => h(AdminSettings, { props: { initial: JSON.parse(element.dataset.initial) } })
}).$mount('#admin-vue')
/**
* Append a new template to the dom
*
* @param {Object} data the template data from the template controller response
*/
function appendTemplateFromData(data) {
var template = document.querySelector('.template-model').cloneNode(true)
template.className = ''
template.querySelector('img').src = data.preview
template.querySelector('figcaption').textContent = data.name
template.querySelector('.delete-template').href = data.delete
document.querySelector('#richdocuments-templates > ul').appendChild(template)
template.querySelector('.delete-template').addEventListener('click', deleteTemplate)
}
/**
* Delete template event handler
*
* @param {Event} event
*/
function deleteTemplate(event) {
event.preventDefault()
var emptyElmt = document.querySelector('#richdocuments-templates #emptycontent')
var tplListElmt = document.querySelector('#richdocuments-templates > ul')
var elmt = event.target
// ensure no request is in progress
if (elmt.className.indexOf('loading') === -1 && elmt.textContent === '') {
var remote = event.target.href
elmt.classList.add('icon-loading')
elmt.classList.remove('icon-delete')
// send request
$.ajax({
url: remote,
type: 'DELETE'
})
.done(function() {
// remove template
elmt.parentElement.remove()
// is list empty? Only the default template is left
if (tplListElmt.querySelectorAll('li').length === 1) {
tplListElmt.classList.add('hidden')
emptyElmt.classList.remove('hidden')
}
})
.fail(function(e) {
// failure, show warning
elmt.textContent = t('richdocuments', 'Error')
elmt.classList.remove('icon-loading')
setTimeout(function() {
elmt.classList.add('icon-delete')
elmt.textContent = ''
}, 2000)
})
}
}
/**
* Init the upload manager and the delete template handler
*/
function initTemplateManager() {
var inputElmt = document.querySelector('#add-template')
var buttonElmt = document.querySelector('.icon-add')
var deleteElmts = document.querySelectorAll('.delete-template')
var emptyElmt = document.querySelector('#richdocuments-templates #emptycontent')
var tplListElmt = document.querySelector('#richdocuments-templates > ul')
deleteElmts.forEach(function(elmt) {
elmt.addEventListener('click', deleteTemplate)
})
// fileupload plugin
$('#richdocuments-templates').fileupload({
dataType: 'json',
url: OC.generateUrl('apps/richdocuments/template'),
type: 'POST',
add: function(e, data) {
// submit on file selection
data.submit()
inputElmt.disabled = true
buttonElmt.className = 'icon-loading-small'
},
submit: function(e, data) {
data.formData = _.extend(data.formData || {}, {
requesttoken: OC.requestToken
})
},
success: function(e) {
inputElmt.disabled = false
buttonElmt.className = 'icon-add'
// add template to dom
appendTemplateFromData(e.data)
tplListElmt.classList.remove('hidden')
emptyElmt.classList.add('hidden')
},
fail: function(e, data) {
// failure, show warning
buttonElmt.className = 'icon-add'
buttonElmt.textContent = t('richdocuments', 'An error occurred') + ': ' + data.jqXHR.responseJSON.data.message
setTimeout(function() {
inputElmt.disabled = false
buttonElmt.textContent = ''
}, 2000)
}
})
}
$(document).ready(function() {
initTemplateManager()
})
|