joomla/Component-Builder
39
25
Fork 11
Code Issues 76 Pull Requests Projects 4 Wiki Activity

Update the field area to be more user friendly, phase A of gh-258

Browse Source
This commit is contained in:
Llewellyn van der Merwe
2018-04-11 22:05:47 +02:00
parent 6d4c823ea6
commit e6b2b48ac7
27 changed files with 943 additions and 412 deletions
Download Patch File Download Diff File Expand all files Collapse all files

166
admin/models/forms/field.js
View File

@ -512,6 +512,9 @@ function isSet(val)
jQuery(document).ready(function()
{
// get type value
var fieldtype = jQuery("#jform_fieldtype option:selected").val();
getFieldOptions(fieldtype);
// get the linked details
getLinked();
// get the validation rules
@ -569,10 +572,13 @@ function addButton(type, where, size){
})
}
function getFieldOptions_server(fieldId){
var getUrl = "index.php?option=com_componentbuilder&task=ajax.fieldOptions&format=json";
if(token.length > 0 && fieldId > 0){
var request = 'token='+token+'&id='+fieldId;
// the options row id key
var rowIdKey = 'properties';
function getFieldOptions_server(fieldtype){
var getUrl = "index.php?option=com_componentbuilder&task=ajax.fieldOptions&format=json&vdm="+vastDevMod;
if(token.length > 0 && fieldtype > 0){
var request = 'token='+token+'&id='+fieldtype;
}
return jQuery.ajax({
type: 'GET',
@ -583,20 +589,156 @@ function getFieldOptions_server(fieldId){
});
}
function getFieldOptions(id,setValue){
getFieldOptions_server(id).done(function(result) {
if(result.values){
if(setValue){
jQuery('textarea#jform_xml').val(result.values);
}
function getFieldOptions(fieldtype){
getFieldOptions_server(fieldtype).done(function(result) {
if(result.subform){
// load the list of properties
propertiesArray = result.nameListOptions;
// remove previous forms of exist
jQuery('.prop_removal').remove();
// remove the hidden jform_properties
jQuery('#jform_xml').closest('.control-group').remove();
// append to the closed to xml (hidden field)
jQuery('.note_filter_information').closest('.control-group').prepend(result.subform);
// add the watcher
rowWatcher();
// initialize the new form
jQuery('div.subform-repeatable').subformRepeatable();
// update all the list fields to only show items not selected already
propertyDynamicSet();
// set the field type info
jQuery('#help').remove();
jQuery('.helpNote').append('<div id="help" class="uk-scrollable-box">'+result.description+'<br />'+result.values_description+'</div>');
jQuery('.helpNote').append('<div id="help">'+result.description+'<br />'+result.values_description+'</div>');
}
})
}
function getFieldPropertyDesc(field){
// get the ID
var id = jQuery(field).attr('id');
// build the target array
var target = id.split('__');
// get property value
var property = jQuery(field).val();
// first check that there isn't any of this property type already set
if (propertyIsSet(property, id)) {
// reset the selection
jQuery('#'+id).val('');
jQuery('#'+id).trigger("liszt:updated");
// give out a notice
jQuery.UIkit.notify({message: Joomla.JText._('COM_COMPONENTBUILDER_PROPERTY_ALREADY_SELECTED_TRY_ANOTHER'), timeout: 5000, status: 'warning', pos: 'top-center'});
// update the values
jQuery('#'+target[0]+'__desc').val('');
jQuery('#'+target[0]+'__value').val('');
} else {
// do a dynamic update
propertyDynamicSet();
// get type value
var fieldtype = jQuery("#jform_fieldtype option:selected").val();
getFieldPropertyDesc_server(fieldtype, property).done(function(result) {
if(result.desc && result.value){
// update the values
jQuery('#'+target[0]+'__desc').val(result.desc);
jQuery('#'+target[0]+'__value').val(result.value);
} else {
// update the values
jQuery('#'+target[0]+'__desc').val(Joomla.JText._('COM_COMPONENTBUILDER_NO_DESCRIPTION_FOUND'));
jQuery('#'+target[0]+'__value').val('');
}
});
}
}
// set properties the options
propertiesArray = {};
var propertyIdRemoved;
function propertyDynamicSet() {
propertiesAvailable = {};
propertiesSelectedArray = {};
propertiesTrackerArray = {};
var i;
for (i = 0; i < 70; i++) { // for now this is the number of field we should check
// build ID
var id_check = rowIdKey+'_'+rowIdKey+i+'__name';
// first check if Id is on page as that not the same as the one currently calling
if (jQuery("#"+id_check).length && propertyIdRemoved !== id_check) {
// build the selected array
var key = jQuery("#"+id_check+" option:selected").val();
var text = jQuery("#"+id_check+" option:selected").text();
propertiesSelectedArray[key] = text;
// keep track of the value set
propertiesTrackerArray[id_check] = key;
// clear the options out
jQuery("#"+id_check).find('option').remove().end();
}
}
// trigger chosen on the list fields
jQuery('.field_list_name_options').chosen({"disable_search_threshold":10,"search_contains":true,"allow_single_deselect":true,"placeholder_text_multiple":Joomla.JText._("COM_COMPONENTBUILDER_TYPE_OR_SELECT_SOME_OPTIONS"),"placeholder_text_single":Joomla.JText._("COM_COMPONENTBUILDER_SELECT_A_PROPERTY"),"no_results_text":Joomla.JText._("COM_COMPONENTBUILDER_NO_RESULTS_MATCH")});
// now build the list to keep
jQuery.each( propertiesArray, function( prop, name ) {
if (!propertiesSelectedArray.hasOwnProperty(prop)) {
propertiesAvailable[prop] = name;
}
});
// now add the lists back
jQuery.each( propertiesTrackerArray, function( tId, tKey ) {
if (jQuery('#'+tId).length) {
jQuery('#'+tId).append('<option value="'+tKey+'">'+propertiesSelectedArray[tKey]+'</option>');
jQuery.each( propertiesAvailable, function( aKey, aValue ) {
jQuery('#'+tId).append('<option value="'+aKey+'">'+aValue+'</option>');
});
jQuery('#'+tId).val(tKey);
jQuery('#'+tId).trigger('liszt:updated');
}
});
}
function rowWatcher() {
jQuery(document).on('subform-row-remove', function(event, row){
propertyIdRemoved = jQuery(row.innerHTML).find('.field_list_name_options').attr('id');
propertyDynamicSet();
});
jQuery(document).on('subform-row-add', function(event, row){
propertyDynamicSet();
});
}
function propertyIsSet(prop, id) {
var i;
for (i = 0; i < 70; i++) { // for now this is the number of field we should check
// build ID
var id_check = rowIdKey+'_'+rowIdKey+i+'__name';
// first check if Id is on page as that not the same as the one currently calling
if (jQuery("#"+id_check).length && id_check != id) {
// get the property value
var tmp = jQuery("#"+id_check+" option:selected").val();
// now validate
if (tmp === prop) {
return true;
}
}
}
return false;
}
function getFieldPropertyDesc_server(fieldtype, property){
var getUrl = "index.php?option=com_componentbuilder&task=ajax.getFieldPropertyDesc&format=json&vdm="+vastDevMod;
if(token.length > 0 && fieldtype > 0 && property.length > 0){
var request = 'token='+token+'&fieldtype='+fieldtype+'&property='+property;
}
return jQuery.ajax({
type: 'GET',
url: getUrl,
dataType: 'jsonp',
data: request,
jsonp: 'callback'
});
}
function getValidationRulesTable_server(){
var getUrl = "index.php?option=com_componentbuilder&task=ajax.getValidationRulesTable&format=json";
var getUrl = "index.php?option=com_componentbuilder&task=ajax.getValidationRulesTable&format=json&vdm="+vastDevMod;
if(token.length > 0){
var request = 'token='+token+'&id=1';
}

310
admin/models/forms/field.xml
View File

@ -183,105 +183,65 @@
<option value="NOT NULL">
COM_COMPONENTBUILDER_FIELD_NOT_NULL</option>
</field>
<!-- Add_css_view Field. Type: Radio. (joomla) -->
<!-- Datadefault_other Field. Type: Text. (joomla) -->
<field
type="radio"
name="add_css_view"
label="COM_COMPONENTBUILDER_FIELD_ADD_CSS_VIEW_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Css_view Field. Type: Textarea. (joomla) -->
type="text"
name="datadefault_other"
label="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_LABEL"
size="10"
maxlength="50"
description="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_DESCRIPTION"
class="text_area"
readonly="false"
disabled="false"
required="true"
filter="STRING"
message="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_MESSAGE"
hint="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_HINT"
/>
<!-- Css_views Field. Type: Textarea. (joomla) -->
<field
type="textarea"
name="css_view"
label="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_LABEL"
name="css_views"
label="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_DESCRIPTION"
description="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_HINT"
hint="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_HINT"
required="true"
/>
<!-- Note_filter_information Field. Type: Note. A None Database Field. (joomla) -->
<field type="note" name="note_filter_information" description="COM_COMPONENTBUILDER_FIELD_NOTE_FILTER_INFORMATION_DESCRIPTION" class="note_filter_information" />
<!-- Not_required Field. Type: Hidden. (joomla) -->
<field
type="hidden"
name="not_required"
default="[]"
/>
<!-- Catid Field. Type: Category. (joomla) -->
<field
type="category"
name="catid"
label="COM_COMPONENTBUILDER_FIELD_CATID_LABEL"
extension="com_componentbuilder.fields"
description="COM_COMPONENTBUILDER_FIELD_CATID_DESCRIPTION"
class="inputbox"
/>
<!-- Xml Field. Type: Textarea. (joomla) -->
<!-- Javascript_views_footer Field. Type: Textarea. (joomla) -->
<field
type="textarea"
name="xml"
label="COM_COMPONENTBUILDER_FIELD_XML_LABEL"
rows="17"
cols="720"
description="COM_COMPONENTBUILDER_FIELD_XML_DESCRIPTION"
name="javascript_views_footer"
label="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_XML_HINT"
hint="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_HINT"
required="true"
/>
<!-- Add_javascript_view_footer Field. Type: Radio. (joomla) -->
<!-- Javascript_view_footer Field. Type: Textarea. (joomla) -->
<field
type="radio"
name="add_javascript_view_footer"
label="COM_COMPONENTBUILDER_FIELD_ADD_JAVASCRIPT_VIEW_FOOTER_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Add_javascript_views_footer Field. Type: Radio. (joomla) -->
<field
type="radio"
name="add_javascript_views_footer"
label="COM_COMPONENTBUILDER_FIELD_ADD_JAVASCRIPT_VIEWS_FOOTER_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Add_css_views Field. Type: Radio. (joomla) -->
<field
type="radio"
name="add_css_views"
label="COM_COMPONENTBUILDER_FIELD_ADD_CSS_VIEWS_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
type="textarea"
name="javascript_view_footer"
label="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_HINT"
required="true"
/>
<!-- Note_whmcs_encryption Field. Type: Note. A None Database Field. (joomla) -->
<field type="note" name="note_whmcs_encryption" label="COM_COMPONENTBUILDER_FIELD_NOTE_WHMCS_ENCRYPTION_LABEL" description="COM_COMPONENTBUILDER_FIELD_NOTE_WHMCS_ENCRYPTION_DESCRIPTION" heading="h4" class="alert alert-success note_whmcs_encryption" />
<!-- Datalenght Field. Type: List. (joomla) -->
<field
type="list"
@ -316,71 +276,46 @@
<option value="Other">
COM_COMPONENTBUILDER_FIELD_OTHER</option>
</field>
<!-- Datadefault_other Field. Type: Text. (joomla) -->
<!-- Add_css_view Field. Type: Radio. (joomla) -->
<field
type="text"
name="datadefault_other"
label="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_LABEL"
size="10"
maxlength="50"
description="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_DESCRIPTION"
class="text_area"
readonly="false"
disabled="false"
required="true"
filter="STRING"
message="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_MESSAGE"
hint="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_OTHER_HINT"
/>
<!-- Datadefault Field. Type: List. (joomla) -->
<field
type="list"
name="datadefault"
label="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_LABEL"
description="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_DESCRIPTION"
class="btn-group"
multiple="false">
type="radio"
name="add_css_view"
label="COM_COMPONENTBUILDER_FIELD_ADD_CSS_VIEW_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="">
COM_COMPONENTBUILDER_FIELD_NONE</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_ZERO</option>
<option value="1">
COM_COMPONENTBUILDER_FIELD_ONE</option>
<option value="CURRENT_TIMESTAMP">
COM_COMPONENTBUILDER_FIELD_CURRENT_TIMESTAMP</option>
<option value="DATETIME">
COM_COMPONENTBUILDER_FIELD_DATETIME</option>
<option value="Other">
COM_COMPONENTBUILDER_FIELD_OTHER</option>
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Datalenght_other Field. Type: Text. (joomla) -->
<!-- Not_required Field. Type: Hidden. (joomla) -->
<field
type="text"
name="datalenght_other"
label="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_LABEL"
size="10"
maxlength="50"
description="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_DESCRIPTION"
class="text_area"
readonly="false"
disabled="false"
required="true"
filter="STRING"
message="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_MESSAGE"
hint="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_HINT"
type="hidden"
name="not_required"
default="[]"
/>
<!-- Css_views Field. Type: Textarea. (joomla) -->
<!-- Catid Field. Type: Category. (joomla) -->
<field
type="category"
name="catid"
label="COM_COMPONENTBUILDER_FIELD_CATID_LABEL"
extension="com_componentbuilder.fields"
description="COM_COMPONENTBUILDER_FIELD_CATID_DESCRIPTION"
class="inputbox"
/>
<!-- Css_view Field. Type: Textarea. (joomla) -->
<field
type="textarea"
name="css_views"
label="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_LABEL"
name="css_view"
label="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_DESCRIPTION"
description="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_CSS_VIEWS_HINT"
hint="COM_COMPONENTBUILDER_FIELD_CSS_VIEW_HINT"
required="true"
/>
<!-- Store Field. Type: List. (joomla) -->
@ -408,36 +343,95 @@
<option value="4">
COM_COMPONENTBUILDER_FIELD_WHMCSKEY_ENCRYPTION</option>
</field>
<!-- Javascript_view_footer Field. Type: Textarea. (joomla) -->
<!-- Datalenght_other Field. Type: Text. (joomla) -->
<field
type="textarea"
name="javascript_view_footer"
label="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEW_FOOTER_HINT"
type="text"
name="datalenght_other"
label="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_LABEL"
size="10"
maxlength="50"
description="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_DESCRIPTION"
class="text_area"
readonly="false"
disabled="false"
required="true"
filter="STRING"
message="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_MESSAGE"
hint="COM_COMPONENTBUILDER_FIELD_DATALENGHT_OTHER_HINT"
/>
<!-- Note_whmcs_encryption Field. Type: Note. A None Database Field. (joomla) -->
<field type="note" name="note_whmcs_encryption" label="COM_COMPONENTBUILDER_FIELD_NOTE_WHMCS_ENCRYPTION_LABEL" description="COM_COMPONENTBUILDER_FIELD_NOTE_WHMCS_ENCRYPTION_DESCRIPTION" heading="h4" class="alert alert-success note_whmcs_encryption" />
<!-- Javascript_views_footer Field. Type: Textarea. (joomla) -->
<!-- Add_javascript_view_footer Field. Type: Radio. (joomla) -->
<field
type="textarea"
name="javascript_views_footer"
label="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_LABEL"
rows="30"
cols="15"
description="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_DESCRIPTION"
class="text_area span12"
filter="raw"
hint="COM_COMPONENTBUILDER_FIELD_JAVASCRIPT_VIEWS_FOOTER_HINT"
required="true"
/>
type="radio"
name="add_javascript_view_footer"
label="COM_COMPONENTBUILDER_FIELD_ADD_JAVASCRIPT_VIEW_FOOTER_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Add_css_views Field. Type: Radio. (joomla) -->
<field
type="radio"
name="add_css_views"
label="COM_COMPONENTBUILDER_FIELD_ADD_CSS_VIEWS_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Add_javascript_views_footer Field. Type: Radio. (joomla) -->
<field
type="radio"
name="add_javascript_views_footer"
label="COM_COMPONENTBUILDER_FIELD_ADD_JAVASCRIPT_VIEWS_FOOTER_LABEL"
class="btn-group btn-group-yesno"
default="0"
required="true">
<!-- Option Set. -->
<option value="1">
COM_COMPONENTBUILDER_FIELD_YES</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_NO</option>
</field>
<!-- Datadefault Field. Type: List. (joomla) -->
<field
type="list"
name="datadefault"
label="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_LABEL"
description="COM_COMPONENTBUILDER_FIELD_DATADEFAULT_DESCRIPTION"
class="btn-group"
multiple="false">
<!-- Option Set. -->
<option value="">
COM_COMPONENTBUILDER_FIELD_NONE</option>
<option value="0">
COM_COMPONENTBUILDER_FIELD_ZERO</option>
<option value="1">
COM_COMPONENTBUILDER_FIELD_ONE</option>
<option value="CURRENT_TIMESTAMP">
COM_COMPONENTBUILDER_FIELD_CURRENT_TIMESTAMP</option>
<option value="DATETIME">
COM_COMPONENTBUILDER_FIELD_DATETIME</option>
<option value="Other">
COM_COMPONENTBUILDER_FIELD_OTHER</option>
</field>
<!-- Helpnote Field. Type: Note. A None Database Field. (joomla) -->
<field type="note" name="helpnote" label="COM_COMPONENTBUILDER_FIELD_HELPNOTE_LABEL" class="helpNote helpnote" />
<!-- Xml Field. Type: Hidden. (joomla) -->
<field
type="hidden"
name="xml"
default="1"
filter="raw"
/>
</fieldset>
<!-- Access Control Fields. -->