2015-08-10 00:10:41 +00:00
|
|
|
(function ($) {
|
|
|
|
|
|
|
|
|
|
/*
|
2015-08-30 18:17:23 +00:00
|
|
|
*
|
|
|
|
|
* provides feedback form for zammad
|
|
|
|
|
*
|
|
|
|
|
|
|
|
|
|
<button id="feedback-form">Feedback</button>
|
|
|
|
|
|
|
|
|
|
<script id="zammad_form_script" src="http://localhost:3000/assets/form/form.js"></script>
|
|
|
|
|
<script>
|
2015-09-02 07:15:19 +00:00
|
|
|
$(function() {
|
2016-02-01 09:23:55 +00:00
|
|
|
$('#feedback-form').ZammadForm({
|
2016-10-06 16:56:10 +00:00
|
|
|
messageTitle: 'Feedback Form', // optional
|
|
|
|
|
messageSubmit: 'Submit', // optional
|
2017-01-09 14:47:27 +00:00
|
|
|
messageThankYou: 'Thank you for your inquiry (#%s)! We\'ll contact you as soon as possible.', // optional
|
|
|
|
|
messageNoConfig: 'Unable to load form config from server. Maybe feature is disabled.', // optional
|
2015-09-02 07:15:19 +00:00
|
|
|
showTitle: true,
|
2016-11-09 22:04:49 +00:00
|
|
|
lang: 'de', // optional, <html lang="xx"> will be used per default
|
2016-02-01 09:23:55 +00:00
|
|
|
modal: true,
|
2017-01-09 14:47:27 +00:00
|
|
|
attachmentSupport: false,
|
2016-02-01 09:23:55 +00:00
|
|
|
attributes: [
|
|
|
|
|
{
|
|
|
|
|
display: 'Name',
|
|
|
|
|
name: 'name',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'text',
|
|
|
|
|
placeholder: 'Your Name',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: '',
|
2016-02-01 09:23:55 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
display: 'Email',
|
|
|
|
|
name: 'email',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'email',
|
2021-08-16 08:37:14 +00:00
|
|
|
required: true,
|
2016-02-01 09:23:55 +00:00
|
|
|
placeholder: 'Your Email',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: function () {return User.email;},
|
2016-02-01 09:23:55 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
display: 'Message',
|
|
|
|
|
name: 'body',
|
|
|
|
|
tag: 'textarea',
|
2021-08-16 08:37:14 +00:00
|
|
|
required: true,
|
2016-02-01 09:23:55 +00:00
|
|
|
placeholder: 'Your Message...',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: '',
|
2016-02-01 09:23:55 +00:00
|
|
|
rows: 7,
|
|
|
|
|
},
|
2017-01-09 14:16:29 +00:00
|
|
|
{
|
|
|
|
|
display: 'Attachments',
|
|
|
|
|
name: 'file[]',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'file',
|
|
|
|
|
repeat: 3,
|
|
|
|
|
},
|
2016-02-01 09:23:55 +00:00
|
|
|
]
|
2015-09-02 07:15:19 +00:00
|
|
|
});
|
2015-08-30 18:17:23 +00:00
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
*/
|
|
|
|
|
|
2016-02-01 09:23:55 +00:00
|
|
|
var pluginName = 'ZammadForm',
|
2015-08-10 00:10:41 +00:00
|
|
|
defaults = {
|
2016-11-09 22:04:49 +00:00
|
|
|
lang: undefined,
|
2015-08-10 00:10:41 +00:00
|
|
|
debug: false,
|
2015-08-10 08:56:55 +00:00
|
|
|
noCSS: false,
|
2016-10-10 21:51:40 +00:00
|
|
|
prefixCSS: 'zammad-form-',
|
2015-08-10 12:08:06 +00:00
|
|
|
showTitle: false,
|
|
|
|
|
messageTitle: 'Zammad Form',
|
2015-08-10 09:11:27 +00:00
|
|
|
messageSubmit: 'Submit',
|
2017-01-09 14:16:29 +00:00
|
|
|
messageThankYou: 'Thank you for your inquiry! We\'ll contact you as soon as possible.',
|
|
|
|
|
messageNoConfig: 'Unable to load form config from server. Maybe feature is disabled.',
|
2017-01-09 14:47:27 +00:00
|
|
|
attachmentSupport: false,
|
2016-02-01 09:23:55 +00:00
|
|
|
attributes: [
|
2015-08-10 00:10:41 +00:00
|
|
|
{
|
|
|
|
|
display: 'Name',
|
|
|
|
|
name: 'name',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'text',
|
2021-08-16 08:37:14 +00:00
|
|
|
id: 'zammad-form-name',
|
|
|
|
|
required: true,
|
2015-08-10 00:10:41 +00:00
|
|
|
placeholder: 'Your Name',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: '',
|
2015-08-10 00:10:41 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
display: 'Email',
|
|
|
|
|
name: 'email',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'email',
|
2021-08-16 08:37:14 +00:00
|
|
|
id: 'zammad-form-email',
|
|
|
|
|
required: true,
|
2015-08-10 00:10:41 +00:00
|
|
|
placeholder: 'Your Email',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: '',
|
2015-08-10 00:10:41 +00:00
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
display: 'Message',
|
|
|
|
|
name: 'body',
|
|
|
|
|
tag: 'textarea',
|
2021-08-16 08:37:14 +00:00
|
|
|
id: 'zammad-form-body',
|
|
|
|
|
required: true,
|
2015-08-10 00:10:41 +00:00
|
|
|
placeholder: 'Your Message...',
|
2017-09-07 12:24:58 +00:00
|
|
|
defaultValue: '',
|
2015-08-10 09:42:53 +00:00
|
|
|
rows: 7,
|
2015-08-10 00:10:41 +00:00
|
|
|
},
|
2016-11-09 22:04:49 +00:00
|
|
|
],
|
|
|
|
|
translations: {
|
2017-03-22 02:33:33 +00:00
|
|
|
'de': {
|
2016-11-09 22:04:49 +00:00
|
|
|
'Name': 'Name',
|
|
|
|
|
'Your Name': 'Ihr Name',
|
|
|
|
|
'Email': 'E-Mail',
|
|
|
|
|
'Your Email': 'Ihre E-Mail',
|
|
|
|
|
'Message': 'Nachricht',
|
2017-01-09 14:47:27 +00:00
|
|
|
'Attachments': 'Anhänge',
|
2016-11-09 22:04:49 +00:00
|
|
|
'Your Message...': 'Ihre Nachricht...',
|
|
|
|
|
},
|
2017-03-22 02:33:33 +00:00
|
|
|
'es': {
|
2016-11-09 22:04:49 +00:00
|
|
|
'Name': 'Nombre',
|
|
|
|
|
'Your Name': 'tu Nombre',
|
|
|
|
|
'Email': 'correo electrónico',
|
|
|
|
|
'Your Email': 'Tu correo electrónico',
|
|
|
|
|
'Message': 'Mensaje',
|
2017-01-09 14:47:27 +00:00
|
|
|
'Attachments': 'archivos adjuntos',
|
2016-11-09 22:04:49 +00:00
|
|
|
'Your Message...': 'tu Mensaje...',
|
|
|
|
|
},
|
2017-03-22 02:33:33 +00:00
|
|
|
'fr': {
|
2016-11-09 22:04:49 +00:00
|
|
|
'Name': 'Prénom',
|
|
|
|
|
'Your Name': 'Votre nom',
|
|
|
|
|
'Email': 'Email',
|
|
|
|
|
'Your Email': 'Votre Email',
|
|
|
|
|
'Message': 'Message',
|
2017-01-09 14:47:27 +00:00
|
|
|
'Attachments': 'Pièces jointes',
|
2016-11-09 22:04:49 +00:00
|
|
|
'Your Message...': 'Votre message...',
|
|
|
|
|
},
|
2017-11-15 11:07:37 +00:00
|
|
|
'nl': {
|
|
|
|
|
'Name': 'Naam',
|
|
|
|
|
'Your Name': 'Uw naam',
|
|
|
|
|
'Email': 'Email adres',
|
|
|
|
|
'Your Email': 'Uw Email adres',
|
|
|
|
|
'Message': 'Bericht',
|
|
|
|
|
'Attachments': 'Bijlage',
|
2017-11-23 21:13:02 +00:00
|
|
|
'Your Message...': 'Uw bericht...',
|
|
|
|
|
},
|
|
|
|
|
'it': {
|
|
|
|
|
'Name': 'Nome',
|
|
|
|
|
'Your Name': 'Il tuo nome',
|
|
|
|
|
'Email': 'E-mail',
|
|
|
|
|
'Your Email': 'Il tuo indirizzo e-mail',
|
|
|
|
|
'Message': 'Messaggio',
|
|
|
|
|
'Attachments': 'Allegati',
|
|
|
|
|
'Your Message...': 'Il tuo messaggio...',
|
|
|
|
|
},
|
|
|
|
|
'pl': {
|
|
|
|
|
'Name': 'Nazwa',
|
|
|
|
|
'Your Name': 'Imię i nazwisko',
|
|
|
|
|
'Email': 'Email adres',
|
|
|
|
|
'Your Email': 'Adres e-mail',
|
|
|
|
|
'Message': 'Wiadomość',
|
|
|
|
|
'Attachments': 'Załączniki',
|
|
|
|
|
'Your Message...': 'Twoja wiadomość...',
|
2017-11-15 11:07:37 +00:00
|
|
|
},
|
2017-03-22 02:33:33 +00:00
|
|
|
'zh-cn': {
|
|
|
|
|
'Name': '联系人',
|
|
|
|
|
'Your Name': '您的尊姓大名',
|
|
|
|
|
'Email': '电子邮件',
|
|
|
|
|
'Your Email': '您的邮件地址',
|
|
|
|
|
'Message': '留言',
|
|
|
|
|
'Attachments': '附件',
|
|
|
|
|
'Your Message...': '您的留言...',
|
|
|
|
|
},
|
|
|
|
|
'zh-tw': {
|
|
|
|
|
'Name': '聯絡人',
|
|
|
|
|
'Your Name': '您的尊姓大名',
|
|
|
|
|
'Email': 'E-Mail',
|
|
|
|
|
'Your Email': '請留下您的電子郵件地址',
|
|
|
|
|
'Message': '留言',
|
|
|
|
|
'Attachments': '附檔',
|
|
|
|
|
'Your Message...': '請寫下您的留言...'
|
|
|
|
|
},
|
2016-11-09 22:04:49 +00:00
|
|
|
}
|
2016-02-01 09:23:55 +00:00
|
|
|
};
|
|
|
|
|
|
2016-10-06 16:56:10 +00:00
|
|
|
function Plugin(element, options) {
|
2016-11-09 22:04:49 +00:00
|
|
|
this.element = element
|
2016-02-01 09:23:55 +00:00
|
|
|
this.$element = $(element)
|
|
|
|
|
|
|
|
|
|
this._defaults = defaults;
|
|
|
|
|
this._name = pluginName;
|
|
|
|
|
|
|
|
|
|
this._endpoint_config = '/api/v1/form_config'
|
|
|
|
|
this._endpoint_submit = '/api/v1/form_submit'
|
|
|
|
|
this._script_location = '/assets/form/form.js'
|
|
|
|
|
this._css_location = '/assets/form/form.css'
|
|
|
|
|
|
2016-02-02 06:59:13 +00:00
|
|
|
this._src = document.getElementById('zammad_form_script').src
|
|
|
|
|
this.css_location = this._src.replace(this._script_location, this._css_location)
|
|
|
|
|
this.endpoint_config = this._src.replace(this._script_location, this._endpoint_config)
|
|
|
|
|
this.endpoint_submit = this._src.replace(this._script_location, this._endpoint_submit)
|
2016-02-01 09:23:55 +00:00
|
|
|
|
2016-11-09 22:04:49 +00:00
|
|
|
this.options = $.extend({}, defaults, options)
|
|
|
|
|
if (!this.options.lang) {
|
|
|
|
|
this.options.lang = $('html').attr('lang')
|
|
|
|
|
}
|
|
|
|
|
if (this.options.lang) {
|
|
|
|
|
this.options.lang = this.options.lang.replace(/-.+?$/, '')
|
|
|
|
|
this.log('debug', "lang: " + this.options.lang)
|
|
|
|
|
}
|
|
|
|
|
|
2016-10-06 16:56:10 +00:00
|
|
|
this._config = {}
|
2017-03-22 02:37:19 +00:00
|
|
|
this._token = ''
|
2015-08-10 00:10:41 +00:00
|
|
|
|
2016-11-09 22:04:49 +00:00
|
|
|
this.init()
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Plugin.prototype.init = function () {
|
2016-10-06 19:01:48 +00:00
|
|
|
var _this = this,
|
|
|
|
|
params = {}
|
2015-08-10 00:10:41 +00:00
|
|
|
|
2016-02-02 06:59:13 +00:00
|
|
|
_this.log('debug', 'init', this._src)
|
2015-08-10 00:10:41 +00:00
|
|
|
|
2015-08-10 08:56:55 +00:00
|
|
|
if (!_this.options.noCSS) {
|
|
|
|
|
_this.loadCss(_this.css_location)
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
2017-03-14 16:30:47 +00:00
|
|
|
$.each(_this.options.attributes, function(index, item) {
|
|
|
|
|
if (item.name == 'file[]') {
|
|
|
|
|
_this.options.attributes.splice(index, 1);
|
|
|
|
|
}
|
|
|
|
|
})
|
2017-01-09 14:47:27 +00:00
|
|
|
if (_this.options.attachmentSupport === true || _this.options.attachmentSupport === 'true') {
|
|
|
|
|
var attachment = {
|
|
|
|
|
display: 'Attachments',
|
|
|
|
|
name: 'file[]',
|
|
|
|
|
tag: 'input',
|
|
|
|
|
type: 'file',
|
|
|
|
|
repeat: 1,
|
|
|
|
|
}
|
|
|
|
|
_this.options.attributes.push(attachment)
|
|
|
|
|
}
|
|
|
|
|
|
2016-02-01 09:23:55 +00:00
|
|
|
_this.log('debug', 'endpoint_config: ' + _this.endpoint_config)
|
|
|
|
|
_this.log('debug', 'endpoint_submit: ' + _this.endpoint_submit)
|
2015-08-10 00:10:41 +00:00
|
|
|
|
|
|
|
|
// load config
|
2016-10-06 19:01:48 +00:00
|
|
|
if (this.options.test) {
|
|
|
|
|
params.test = true
|
|
|
|
|
}
|
2017-06-28 17:13:52 +00:00
|
|
|
|
|
|
|
|
params.fingerprint = this.fingerprint()
|
|
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
$.ajax({
|
2017-06-28 17:13:52 +00:00
|
|
|
method: 'post',
|
2015-08-10 08:56:55 +00:00
|
|
|
url: _this.endpoint_config,
|
2017-06-28 17:13:52 +00:00
|
|
|
cache: false,
|
|
|
|
|
processData: true,
|
2016-10-06 19:01:48 +00:00
|
|
|
data: params
|
2015-08-10 00:10:41 +00:00
|
|
|
}).done(function(data) {
|
2016-02-01 09:23:55 +00:00
|
|
|
_this.log('debug', 'config:', data)
|
2015-08-10 00:10:41 +00:00
|
|
|
_this._config = data
|
2016-02-01 09:23:55 +00:00
|
|
|
}).fail(function(jqXHR, textStatus, errorThrown) {
|
|
|
|
|
if (jqXHR.status == 401) {
|
2021-02-04 08:28:41 +00:00
|
|
|
_this.log('error', 'Faild to load form config, wrong authentication data!')
|
|
|
|
|
}
|
|
|
|
|
else if (jqXHR.status == 403) {
|
|
|
|
|
_this.log('error', 'Faild to load form config, feature is disabled or request is wrong!')
|
2016-02-01 09:23:55 +00:00
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
_this.log('error', 'Faild to load form config!')
|
|
|
|
|
}
|
|
|
|
|
_this.noConfig()
|
2015-08-10 00:10:41 +00:00
|
|
|
});
|
|
|
|
|
|
2015-08-10 08:56:55 +00:00
|
|
|
// show form
|
|
|
|
|
if (!this.options.modal) {
|
|
|
|
|
_this.render()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// bind form on call
|
|
|
|
|
else {
|
2016-10-06 16:56:10 +00:00
|
|
|
this.$element.off('click.zammad-form').on('click.zammad-form', function (e) {
|
2015-08-10 08:56:55 +00:00
|
|
|
e.preventDefault()
|
|
|
|
|
_this.render()
|
|
|
|
|
return true
|
|
|
|
|
})
|
|
|
|
|
}
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// load css
|
|
|
|
|
Plugin.prototype.loadCss = function(filename) {
|
|
|
|
|
if (document.createStyleSheet) {
|
|
|
|
|
document.createStyleSheet(filename)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
$('<link rel="stylesheet" type="text/css" href="' + filename + '" />').appendTo('head')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// send
|
|
|
|
|
Plugin.prototype.submit = function() {
|
|
|
|
|
var _this = this
|
|
|
|
|
|
2016-02-01 09:23:55 +00:00
|
|
|
// check min modal open time
|
|
|
|
|
if (_this.modalOpenTime) {
|
|
|
|
|
var currentTime = new Date().getTime()
|
|
|
|
|
var diff = currentTime - _this.modalOpenTime.getTime()
|
|
|
|
|
_this.log('debug', 'currentTime', currentTime)
|
|
|
|
|
_this.log('debug', 'modalOpenTime', _this.modalOpenTime.getTime())
|
|
|
|
|
_this.log('debug', 'diffTime', diff)
|
2017-06-28 17:13:52 +00:00
|
|
|
if (diff < 1000*10) {
|
2016-02-01 09:23:55 +00:00
|
|
|
alert('Sorry, you look like an robot!')
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2016-10-06 16:56:10 +00:00
|
|
|
// disable form
|
|
|
|
|
_this.$form.find('button').prop('disabled', true)
|
|
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
$.ajax({
|
|
|
|
|
method: 'post',
|
2015-08-10 08:56:55 +00:00
|
|
|
url: _this.endpoint_submit,
|
2015-08-10 00:10:41 +00:00
|
|
|
data: _this.getParams(),
|
2017-01-09 14:16:29 +00:00
|
|
|
cache: false,
|
|
|
|
|
contentType: false,
|
|
|
|
|
processData: false,
|
2015-08-10 00:10:41 +00:00
|
|
|
}).done(function(data) {
|
|
|
|
|
|
|
|
|
|
// removed errors
|
2015-08-10 08:56:55 +00:00
|
|
|
_this.$form.find('.has-error').removeClass('has-error')
|
2015-08-10 00:10:41 +00:00
|
|
|
|
|
|
|
|
// set errors
|
|
|
|
|
if (data.errors) {
|
|
|
|
|
$.each(data.errors, function( key, value ) {
|
2015-08-10 08:56:55 +00:00
|
|
|
_this.$form.find('[name=' + key + ']').closest('.form-group').addClass('has-error')
|
2015-08-10 00:10:41 +00:00
|
|
|
})
|
2017-03-22 02:37:19 +00:00
|
|
|
if (data.errors.token) {
|
|
|
|
|
alert(data.errors.token)
|
|
|
|
|
}
|
2016-10-06 16:56:10 +00:00
|
|
|
_this.$form.find('button').prop('disabled', false)
|
2015-08-10 00:10:41 +00:00
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// ticket has been created
|
2017-01-09 13:33:09 +00:00
|
|
|
_this.thanks(data)
|
2015-08-10 08:56:55 +00:00
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
}).fail(function() {
|
2016-10-06 16:56:10 +00:00
|
|
|
_this.$form.find('button').prop('disabled', false)
|
2015-08-10 00:10:41 +00:00
|
|
|
alert('Faild to submit form!')
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// get params
|
|
|
|
|
Plugin.prototype.getParams = function() {
|
2017-01-09 14:16:29 +00:00
|
|
|
var _this = this
|
2015-08-10 00:10:41 +00:00
|
|
|
|
2017-01-09 14:16:29 +00:00
|
|
|
var formData = new FormData(_this.$form[0])
|
2015-08-10 08:56:55 +00:00
|
|
|
|
2017-01-30 13:48:33 +00:00
|
|
|
/* unfortunaly not working in safari and some IEs - https://developer.mozilla.org/en-US/docs/Web/API/FormData
|
2017-01-09 14:16:29 +00:00
|
|
|
if (!formData.has('title')) {
|
|
|
|
|
formData.append('title', this.options.messageTitle)
|
2015-08-10 08:56:55 +00:00
|
|
|
}
|
2017-01-30 13:48:33 +00:00
|
|
|
*/
|
|
|
|
|
if (!_this.$form.find('[name=title]').val()) {
|
|
|
|
|
formData.append('title', this.options.messageTitle)
|
|
|
|
|
}
|
2016-10-06 19:01:48 +00:00
|
|
|
|
|
|
|
|
if (this.options.test) {
|
2017-01-09 14:16:29 +00:00
|
|
|
formData.append('test', true)
|
2016-10-06 19:01:48 +00:00
|
|
|
}
|
2017-03-22 02:37:19 +00:00
|
|
|
formData.append('token', this._config.token)
|
2017-06-28 17:13:52 +00:00
|
|
|
|
|
|
|
|
formData.append('fingerprint', this.fingerprint())
|
2017-01-09 14:16:29 +00:00
|
|
|
_this.log('debug', 'formData', formData)
|
2017-06-28 17:13:52 +00:00
|
|
|
|
2017-01-09 14:16:29 +00:00
|
|
|
return formData
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
2015-08-10 08:56:55 +00:00
|
|
|
Plugin.prototype.closeModal = function() {
|
|
|
|
|
if (this.$modal) {
|
|
|
|
|
this.$modal.remove()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
// render form
|
|
|
|
|
Plugin.prototype.render = function(e) {
|
2015-08-10 08:56:55 +00:00
|
|
|
var _this = this
|
|
|
|
|
_this.closeModal()
|
2016-02-01 09:23:55 +00:00
|
|
|
_this.modalOpenTime = new Date()
|
|
|
|
|
_this.log('debug', 'modalOpenTime:', _this.modalOpenTime)
|
2015-08-10 08:56:55 +00:00
|
|
|
|
2016-10-10 21:51:40 +00:00
|
|
|
var element = "<div class=\"" + _this.options.prefixCSS + "modal\">\
|
2018-12-03 13:18:24 +00:00
|
|
|
<div class=\"" + _this.options.prefixCSS + "modal-backdrop js-zammad-form-modal-backdrop\"></div>\
|
|
|
|
|
<div class=\"" + _this.options.prefixCSS + "modal-body js-zammad-form-modal-body\">\
|
2016-10-10 21:51:40 +00:00
|
|
|
<form class=\"zammad-form\"></form>\
|
2015-08-10 08:56:55 +00:00
|
|
|
</div>\
|
2016-10-10 21:51:40 +00:00
|
|
|
</div>"
|
2015-08-10 08:56:55 +00:00
|
|
|
|
|
|
|
|
if (!this.options.modal) {
|
|
|
|
|
element = '<div><form class="zammad-form"></form></div>'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var $element = $(element)
|
|
|
|
|
var $form = $element.find('form')
|
2015-08-10 12:08:06 +00:00
|
|
|
if (this.options.showTitle && this.options.messageTitle != '') {
|
|
|
|
|
$form.append('<h2>' + this.options.messageTitle + '</h2>')
|
2015-08-10 09:11:27 +00:00
|
|
|
}
|
2016-10-06 16:56:10 +00:00
|
|
|
$.each(this.options.attributes, function(index, value) {
|
2021-08-16 08:37:14 +00:00
|
|
|
var valueId = _this.options.modal ? value.id + '-modal' : value.id + '-inline'
|
|
|
|
|
var item = $('<div class="form-group"><label for="' + valueId +'"> ' + _this.T(value.display) + '</label></div>');
|
2017-09-07 12:24:58 +00:00
|
|
|
var defaultValue = (typeof value.defaultValue === 'function') ? value.defaultValue() : value.defaultValue;
|
2017-01-09 14:16:29 +00:00
|
|
|
for (var i=0; i < (value.repeat ? value.repeat : 1); i++) {
|
|
|
|
|
if (value.tag == 'input') {
|
2021-08-16 08:37:14 +00:00
|
|
|
item.append('<input class="form-control" id="' + valueId + '" name="' + value.name + '" type="' + value.type + '" placeholder="' + _this.T(value.placeholder) + '" value="' + (defaultValue || '') + '"' + (value.required === true ? ' required' : '') + '>')
|
2017-01-09 14:16:29 +00:00
|
|
|
}
|
|
|
|
|
else if (value.tag == 'textarea') {
|
2021-08-16 08:37:14 +00:00
|
|
|
item.append('<textarea class="form-control" id="' + valueId + '" name="' + value.name + '" placeholder="' + _this.T(value.placeholder) + '" rows="' + value.rows + '"' + (value.required === true ? ' required' : '') + '>' + (defaultValue || '') + '</textarea>')
|
2017-01-09 14:16:29 +00:00
|
|
|
}
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
2015-08-10 08:56:55 +00:00
|
|
|
$form.append(item)
|
2015-08-10 00:10:41 +00:00
|
|
|
})
|
2015-08-10 09:11:27 +00:00
|
|
|
$form.append('<button type="submit" class="btn">' + this.options.messageSubmit + '</button')
|
2015-08-10 08:56:55 +00:00
|
|
|
|
|
|
|
|
this.$modal = $element
|
|
|
|
|
this.$form = $form
|
|
|
|
|
|
|
|
|
|
// bind on close
|
2018-12-03 13:18:24 +00:00
|
|
|
$element.find('.js-zammad-form-modal-backdrop').off('click.zammad-form').on('click.zammad-form', function (e) {
|
2015-08-10 08:56:55 +00:00
|
|
|
e.preventDefault()
|
|
|
|
|
_this.closeModal()
|
|
|
|
|
return true
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// bind form submit
|
2016-10-06 16:56:10 +00:00
|
|
|
$element.off('submit.zammad-form').on('submit.zammad-form', function (e) {
|
2015-08-10 08:56:55 +00:00
|
|
|
e.preventDefault()
|
|
|
|
|
_this.submit()
|
|
|
|
|
return true
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// show form
|
|
|
|
|
if (!this.options.modal) {
|
|
|
|
|
_this.$element.html($element)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// append modal to body
|
|
|
|
|
else {
|
|
|
|
|
$('body').append($element)
|
|
|
|
|
}
|
|
|
|
|
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// thanks
|
2017-01-09 13:33:09 +00:00
|
|
|
Plugin.prototype.thanks = function(data) {
|
|
|
|
|
var thankYou = this.options.messageThankYou
|
|
|
|
|
if (data.ticket && data.ticket.number) {
|
|
|
|
|
thankYou = thankYou.replace('%s', data.ticket.number)
|
|
|
|
|
}
|
|
|
|
|
var message = $('<div class="js-thankyou">' + thankYou + '</div>')
|
2016-02-01 09:23:55 +00:00
|
|
|
this.$form.html(message)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// unable to load config
|
|
|
|
|
Plugin.prototype.noConfig = function(e) {
|
|
|
|
|
var message = $('<div class="js-noConfig">' + this.options.messageNoConfig + '</div>')
|
|
|
|
|
if (this.$form) {
|
|
|
|
|
this.$form.html(message)
|
|
|
|
|
}
|
|
|
|
|
this.$element.html(message)
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// log method
|
|
|
|
|
Plugin.prototype.log = function() {
|
2016-02-01 09:23:55 +00:00
|
|
|
var args = Array.prototype.slice.call(arguments)
|
|
|
|
|
var level = args.shift()
|
|
|
|
|
if (!this.options.debug && level == 'debug') {
|
|
|
|
|
return
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
2016-02-01 09:23:55 +00:00
|
|
|
args.unshift(this._name + '||' + level)
|
|
|
|
|
console.log.apply(console, args)
|
|
|
|
|
|
|
|
|
|
var logString = ''
|
|
|
|
|
$.each( args, function(index, item) {
|
|
|
|
|
logString = logString + ' '
|
|
|
|
|
if (typeof item == 'object') {
|
|
|
|
|
logString = logString + JSON.stringify(item)
|
|
|
|
|
}
|
|
|
|
|
else if (item && item.toString) {
|
|
|
|
|
logString = logString + item.toString()
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
logString = logString + item
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
$('.js-logDisplay').prepend('<div>' + logString + '</div>')
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
|
|
|
|
|
2016-11-09 22:04:49 +00:00
|
|
|
// translation method
|
|
|
|
|
Plugin.prototype.T = function() {
|
|
|
|
|
var string = arguments[0]
|
|
|
|
|
var items = 2 <= arguments.length ? slice.call(arguments, 1) : []
|
|
|
|
|
if (this.options.lang && this.options.lang !== 'en') {
|
|
|
|
|
if (!this.options.translations[this.options.lang]) {
|
|
|
|
|
this.log('debug', "Translation '" + this.options.lang + "' needed!")
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
translations = this.options.translations[this.options.lang]
|
|
|
|
|
if (!translations[string]) {
|
|
|
|
|
this.log('debug', "Translation needed for '" + this.options.lang + "' " + string + "'")
|
|
|
|
|
}
|
|
|
|
|
string = translations[string] || string
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (items) {
|
|
|
|
|
for (i = 0, len = items.length; i < len; i++) {
|
|
|
|
|
item = items[i]
|
|
|
|
|
string = string.replace(/%s/, item)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return string
|
|
|
|
|
}
|
|
|
|
|
|
2017-06-28 17:13:52 +00:00
|
|
|
Plugin.prototype.fingerprint = function () {
|
|
|
|
|
var canvas = document.createElement('canvas')
|
|
|
|
|
var ctx = canvas.getContext('2d')
|
|
|
|
|
var txt = 'https://zammad.com'
|
|
|
|
|
ctx.textBaseline = 'top'
|
|
|
|
|
ctx.font = '12px \'Arial\''
|
|
|
|
|
ctx.textBaseline = 'alphabetic'
|
|
|
|
|
ctx.fillStyle = '#f60'
|
|
|
|
|
ctx.fillRect(125,1,62,20)
|
|
|
|
|
ctx.fillStyle = '#069'
|
|
|
|
|
ctx.fillText(txt, 2, 15)
|
|
|
|
|
ctx.fillStyle = 'rgba(100, 200, 0, 0.7)'
|
|
|
|
|
ctx.fillText(txt, 4, 17)
|
|
|
|
|
return canvas.toDataURL()
|
|
|
|
|
}
|
|
|
|
|
|
2016-10-06 16:56:10 +00:00
|
|
|
$.fn[pluginName] = function (options) {
|
2015-08-10 00:10:41 +00:00
|
|
|
return this.each(function () {
|
2016-10-06 16:56:10 +00:00
|
|
|
var instance = $.data(this, 'plugin_' + pluginName)
|
|
|
|
|
if (instance) {
|
|
|
|
|
instance.$element.empty()
|
|
|
|
|
$.data(this, 'plugin_' + pluginName, undefined)
|
2015-08-10 00:10:41 +00:00
|
|
|
}
|
2016-10-06 16:56:10 +00:00
|
|
|
$.data(
|
|
|
|
|
this, 'plugin_' + pluginName,
|
|
|
|
|
new Plugin(this, options)
|
|
|
|
|
);
|
2015-08-10 00:10:41 +00:00
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
2017-01-09 14:16:29 +00:00
|
|
|
}(jQuery));
|
