xmpp.chapril.org-conversejs/src/utils/form.js

173 lines
6.7 KiB
JavaScript
Raw Normal View History

2017-08-16 15:19:41 +02:00
// Converse.js (A browser based XMPP chat client)
// http://conversejs.org
//
// This is the utilities module.
//
// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
// Licensed under the Mozilla Public License (MPLv2)
//
/*global define, escape, Jed */
2017-08-16 15:19:41 +02:00
(function (root, factory) {
define([
"sizzle",
"lodash.noconflict",
"utils/core",
2018-05-24 21:09:33 +02:00
"templates/field.html",
"templates/select_option.html",
"templates/form_select.html",
"templates/form_textarea.html",
"templates/form_checkbox.html",
"templates/form_username.html",
"templates/form_input.html",
"templates/form_captcha.html",
"templates/form_url.html",
2017-08-16 15:19:41 +02:00
], factory);
}(this, function (
sizzle,
_,
u,
tpl_field,
tpl_select_option,
tpl_form_select,
tpl_form_textarea,
tpl_form_checkbox,
tpl_form_username,
tpl_form_input,
tpl_form_captcha,
tpl_form_url
2017-08-16 15:19:41 +02:00
) {
"use strict";
var XFORM_TYPE_MAP = {
'text-private': 'password',
'text-single': 'text',
'fixed': 'label',
'boolean': 'checkbox',
'hidden': 'hidden',
'jid-multi': 'textarea',
'list-single': 'dropdown',
'list-multi': 'dropdown'
};
u.webForm2xForm = function (field) {
/* Takes an HTML DOM and turns it into an XForm field.
*
* Parameters:
* (DOMElement) field - the field to convert
*/
let value;
if (field.getAttribute('type') === 'checkbox') {
value = field.checked && 1 || 0;
} else if (field.tagName == "TEXTAREA") {
2017-08-16 15:19:41 +02:00
value = _.filter(field.value.split('\n'), _.trim);
} else if (field.tagName == "SELECT") {
value = u.getSelectValues(field);
2017-08-16 15:19:41 +02:00
} else {
value = field.value;
}
2018-01-02 21:44:46 +01:00
return u.stringToNode(
2017-08-16 15:19:41 +02:00
tpl_field({
'name': field.getAttribute('name'),
'value': value
2017-08-16 15:19:41 +02:00
})
2018-01-02 21:44:46 +01:00
);
2017-08-16 15:19:41 +02:00
};
u.xForm2webForm = function (field, stanza, domain) {
2017-08-16 15:19:41 +02:00
/* Takes a field in XMPP XForm (XEP-004: Data Forms) format
* and turns it into an HTML field.
*
* Returns either text or a DOM element (which is not ideal, but fine
* for now).
*
* Parameters:
* (XMLElement) field - the field to convert
*/
if (field.getAttribute('type')) {
if (field.getAttribute('type') === 'list-single' ||
field.getAttribute('type') === 'list-multi') {
2017-08-16 15:19:41 +02:00
const values = _.map(
u.queryChildren(field, 'value'),
_.partial(_.get, _, 'textContent')
);
const options = _.map(
u.queryChildren(field, 'option'),
function (option) {
const value = _.get(option.querySelector('value'), 'textContent');
return tpl_select_option({
'value': value,
'label': option.getAttribute('label'),
2018-05-13 12:39:16 +02:00
'selected': _.includes(values, value),
'required': !_.isNil(field.querySelector('required'))
})
}
);
return tpl_form_select({
'id': u.getUniqueId(),
'name': field.getAttribute('var'),
'label': field.getAttribute('label'),
'options': options.join(''),
'multiple': (field.getAttribute('type') === 'list-multi'),
'required': !_.isNil(field.querySelector('required'))
});
} else if (field.getAttribute('type') === 'fixed') {
const text = _.get(field.querySelector('value'), 'textContent');
return '<p class="form-help">'+text+'</p>';
} else if (field.getAttribute('type') === 'jid-multi') {
return tpl_form_textarea({
'name': field.getAttribute('var'),
'label': field.getAttribute('label') || '',
'value': _.get(field.querySelector('value'), 'textContent'),
'required': !_.isNil(field.querySelector('required'))
});
} else if (field.getAttribute('type') === 'boolean') {
return tpl_form_checkbox({
'id': u.getUniqueId(),
'name': field.getAttribute('var'),
'label': field.getAttribute('label') || '',
'checked': _.get(field.querySelector('value'), 'textContent') === "1" && 'checked="1"' || '',
'required': !_.isNil(field.querySelector('required'))
});
} else if (field.getAttribute('var') === 'url') {
return tpl_form_url({
'label': field.getAttribute('label') || '',
'value': _.get(field.querySelector('value'), 'textContent')
});
} else if (field.getAttribute('var') === 'username') {
return tpl_form_username({
'domain': ' @'+domain,
'name': field.getAttribute('var'),
'type': XFORM_TYPE_MAP[field.getAttribute('type')],
'label': field.getAttribute('label') || '',
'value': _.get(field.querySelector('value'), 'textContent'),
'required': !_.isNil(field.querySelector('required'))
});
} else {
return tpl_form_input({
'id': u.getUniqueId(),
'label': field.getAttribute('label') || '',
'name': field.getAttribute('var'),
'placeholder': null,
'required': !_.isNil(field.querySelector('required')),
'type': XFORM_TYPE_MAP[field.getAttribute('type')],
'value': _.get(field.querySelector('value'), 'textContent')
});
}
2017-08-16 15:19:41 +02:00
} else {
if (field.getAttribute('var') === 'ocr') { // Captcha
const uri = field.querySelector('uri');
const el = sizzle('data[cid="'+uri.textContent.replace(/^cid:/, '')+'"]', stanza)[0];
return tpl_form_captcha({
'label': field.getAttribute('label'),
'name': field.getAttribute('var'),
'data': _.get(el, 'textContent'),
'type': uri.getAttribute('type'),
'required': !_.isNil(field.querySelector('required'))
});
2017-08-16 15:19:41 +02:00
}
}
}
return u;
}));