Skip to content

Commit

Permalink
Add support for combobox and tokens to the Spreadsheet Interface
Browse files Browse the repository at this point in the history 
The combobox and tokens input types also support autocompletion

Change-Id: I53296f68f8c7d215ae4569cccf6f1b94c0600a29
  • Loading branch information
@yashdeep97
yashdeep97 committed Aug 2, 2018
1 parent 8ef14c6 commit 78e6299
Show file tree
Hide file tree
Showing 2 changed files with 149 additions and 4 deletions.
116 changes: 114 additions & 2 deletions libs/PF_jsGrid.js
View file
Expand Up @@ -133,9 +133,101 @@
});

jsGrid.fields.date = PFDateField;

/**
* The following code handles the 'combobox' input type within the grid.
* insertTemplate preprocesses the value and returns it to the grid cell to display;
* editTemplate/insertTemplate generate the edition/insertion forms;
* editValue/insertValue is in charge of putting the final values into the grid.
*/

var PFComboBoxField = function(config) {
jsGrid.Field.call(this, config);
};

PFComboBoxField.prototype = new jsGrid.Field({

itemTemplate: function(value) {
return value;
},

insertTemplate: function(value) {
var autocompletedatatype = "";
if ( this.autocompletedatatype !== undefined ) {
autocompletedatatype = 'autocompletedatatype="' + this.autocompletedatatype + '"';
}
var inputHTML = '<input id="insertjsGridComboBox" class="pfCombobox" autocompletesettings="' + this.autocompletesettings + '" size="35" ' + autocompletedatatype + '>';
return inputHTML;
},

editTemplate: function(value) {
var autocompletedatatype = "";
if ( this.autocompletedatatype !== undefined ) {
autocompletedatatype = 'autocompletedatatype="' + this.autocompletedatatype + '"';
}
var inputHTML = '<input id="jsGridComboBox" class="pfCombobox" value="' + value + '" autocompletesettings="' + this.autocompletesettings + '" size="35" ' + autocompletedatatype + '>';
return inputHTML;
},

insertValue: function() {
return $('#insertjsGridComboBox').val();
},

editValue: function(value) {
return $('#jsGridComboBox').val();
}
});

jsGrid.fields.combobox = PFComboBoxField;

/**
* The following code handles the 'tokens' input type within the grid.
* insertTemplate preprocesses the value and returns it to the grid cell to display;
* editTemplate/insertTemplate generate the edition/insertion forms;
* editValue/insertValue is in charge of putting the final values into the grid.
*/

var PFTokensField = function(config) {
jsGrid.Field.call(this, config);
};

PFTokensField.prototype = new jsGrid.Field({

itemTemplate: function(value) {
return value;
},

insertTemplate: function(value) {
var autocompletedatatype = "";
if ( this.autocompletedatatype !== undefined ) {
autocompletedatatype = 'autocompletedatatype="' + this.autocompletedatatype + '"';
}
var inputHTML = '<input id="insertjsGridTokens" class="pfTokens createboxInput" autocompletesettings="' + this.autocompletesettings + '" size="50" ' + autocompletedatatype + '>';
return inputHTML;
},

editTemplate: function(value) {
var autocompletedatatype = "";
if ( this.autocompletedatatype !== undefined ) {
autocompletedatatype = 'autocompletedatatype="' + this.autocompletedatatype + '"';
}
var inputHTML = '<input id="jsGridTokens" class="pfTokens createboxInput" value="' + value + '" autocompletesettings="' + this.autocompletesettings + '" size="50" ' + autocompletedatatype + '>';
return inputHTML;
},

insertValue: function() {
return $('#insertjsGridTokens').val();
},

editValue: function(value) {
return $('#jsGridTokens').val();
}
});

jsGrid.fields.tokens = PFTokensField;
}(jsGrid, jQuery));

( function ( $, mw ) {
( function ( $, mw, pf ) {

$( '.pfJSGrid' ).each( function() {
var gridParams = mw.config.get( 'wgPageFormsGridParams' ),
Expand Down Expand Up @@ -424,7 +516,27 @@
return Math.ceil( pages.length / pageSize );
},

onOptionChanging: function( args ){
if ( $('#insertjsGridComboBox').length ) {
var insertcombobox = new pf.select2.combobox();
insertcombobox.apply( $('#insertjsGridComboBox') );
}
if ( $('#insertjsGridTokens').length ) {
var inserttokens = new pf.select2.tokens();
inserttokens.apply( $('#insertjsGridTokens') );
}
},

onEditRowCreated: function( args ) {
if ( $('#jsGridComboBox').length ) {
var combobox = new pf.select2.combobox();
combobox.apply( $('#jsGridComboBox') );
}
if ( $('#jsGridTokens').length ) {
var tokens = new pf.select2.tokens();
tokens.apply( $('#jsGridTokens') );
}

args.editRow.keypress( function( e ) {
// Make the "Enter" key approve an update.
if ( e.which === 13 ) {
Expand Down Expand Up @@ -669,4 +781,4 @@
return this;
};

}( jQuery, mediaWiki ) );
}( jQuery, mediaWiki, pf ) );
37 changes: 35 additions & 2 deletions specials/PF_EditUsingSpreadsheet.php
View file
Expand Up @@ -49,11 +49,12 @@ function execute( $query ) {
* @param string $template_name
*/
private function createSpreadsheet( $template_name, $form_name ) {
global $wgPageFormsGridParams;
global $wgPageFormsScriptPath;
global $wgPageFormsGridParams, $wgPageFormsScriptPath;
global $wgPageFormsAutocompleteValues, $wgPageFormsMaxLocalAutocompleteValues;
$out = $this->getOutput();
$req = $this->getRequest();

$out->addModules( 'ext.pageforms.select2' );
$out->addModules( 'ext.pageforms.jsgrid' );
$text = '';
$pageTitle = "Edit pages using spreadsheet for template: $this->mTemplate";
Expand All @@ -79,6 +80,22 @@ private function createSpreadsheet( $template_name, $form_name ) {
$gridParamValues['type'] = 'checkbox';
} elseif ( $fieldType == 'Text' ) {
$gridParamValues['type'] = 'textarea';
} elseif ( $fieldType == 'Page' ) {
$gridParamValues['type'] = 'select';
if ( $templateField->isList() ) {
$gridParamValues['type'] = 'tokens';
$gridParamValues['delimiter'] = $templateField->getDelimiter();
} else {
$gridParamValues['type'] = 'combobox';
}
$fullCargoField = $templateField->getFullCargoField();
$autocompleteValues = PFValuesUtils::getAutocompleteValues( $fullCargoField, 'cargo field' );
$gridParamValues['autocompletesettings'] = $fullCargoField;
if ( count( $autocompleteValues ) > $wgPageFormsMaxLocalAutocompleteValues ) {
$gridParamValues['autocompletedatatype'] = 'cargo field';
} else {
$wgPageFormsAutocompleteValues[$fullCargoField] = $autocompleteValues;
}
}
} elseif ( !empty( $propertyType = $templateField->getPropertyType() ) ) {
if ( $propertyType == '_dat' ) {
Expand All @@ -87,6 +104,22 @@ private function createSpreadsheet( $template_name, $form_name ) {
$gridParamValues['type'] = 'checkbox';
} elseif ( $propertyType == '_txt' || $propertyType == '_cod' ) {
$gridParamValues['type'] = 'textarea';
} elseif ( $propertyType == '_wpg' ) {
if ( $templateField->isList() ) {
$gridParamValues['type'] = 'tokens';
$gridParamValues['delimiter'] = $templateField->getDelimiter();
} else {
$gridParamValues['type'] = 'combobox';
}
$property = $templateField->getSemanticProperty();
$autocompleteValues = PFValuesUtils::getAutocompleteValues( $property, 'property' );
$gridParamValues['autocompletesettings'] = $property;
if ( count( $autocompleteValues ) > $wgPageFormsMaxLocalAutocompleteValues ) {
$gridParamValues['autocompletedatatype'] = 'property';
} else {
$wgPageFormsAutocompleteValues[$property] = $autocompleteValues;
}

}
}
$gridParams[] = $gridParamValues;
Expand Down

0 comments on commit 78e6299

Please sign in to comment.