Commit 9fd93932 authored by Arnaud Bour's avatar Arnaud Bour

Support multi fields in 1 form

parent 115c1e1a
......@@ -17,15 +17,19 @@ use Drupal\Core\Url;
function ephoto_dam_field_field_widget_form_alter(&$element, &$form_state, $context) {
$field_definition = $context['items']->getFieldDefinition();
$field_type = $field_definition->getType();
$field_name = $field_definition->getName();
if ($field_definition->getType() === 'ephoto_dam_field') {
if ($field_type === 'ephoto_dam_field' && $context['delta'] === 0) {
$common_settings = \Drupal::config('ephoto_dam.settings');
$settings = $field_definition->getSettings();
$settings['server_url'] = $common_settings->get('server_url');
$element['#attached']['library'][] = 'ephoto_dam_field/edit';
$element['#attached']['drupalSettings']['ephotoDamField'] = $settings;
$element['#attached']['drupalSettings']['ephotoDamField'][$field_name] = $settings;
}
}
......
......@@ -6,64 +6,76 @@
*/
(function ($) {
Drupal.ephotoDamField = {
Drupal.ephotoDamField = function(name, settings) {
/**
* EPHOTO ID of Drupal Addon
*/
CLIENT_ID: 'CaCvqS5H',
this.CLIENT_ID = 'CaCvqS5H';
/**
* Name of field
*/
this._name = name;
/**
* Settings
*/
settings: drupalSettings.ephotoDamField,
this._settings = settings;
/**
* Current authid
*/
authid: null,
this._authid = null;
/**
* Ephoto Dam instance
*/
ephoto: null,
this._ephoto = null;
/**
* Ephoto Dam Server connected
*/
connected: false,
this._connected = false;
/**
* Current selected field
*/
fieldSelected : null,
this._fieldSelected = null;
};
Drupal.ephotoDamField.prototype = {
/**
* Enable version support
* Enable version support (from default values form)
*/
enableVersionSupport: function(el) {
if (el.checked) {
$('.ephoto-dam-field-version-field').removeClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-version-prefix').removeClass('ephoto-dam-field-hidden');
if (el.checked) {
$('.ephoto-dam-field-version-field').removeClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-version-prefix').removeClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-versions-button').removeClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-file-button').addClass('ephoto-dam-field-hidden');
}
$('.ephoto-dam-field-versions-button').removeClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-file-button').addClass('ephoto-dam-field-hidden');
}
else {
$('.ephoto-dam-field-version-field').addClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-version-prefix').addClass('ephoto-dam-field-hidden');
else {
$('.ephoto-dam-field-version-field').addClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-version-prefix').addClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-versions-button').addClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-file-button').removeClass('ephoto-dam-field-hidden');
}
$('.ephoto-dam-field-versions-button').addClass('ephoto-dam-field-hidden');
$('.ephoto-dam-field-file-button').removeClass('ephoto-dam-field-hidden');
}
},
/**
* Load Ephoto Dam Api
*/
load: function() {
if (this.settings && this.settings.server_url) {
$.getScript(this.settings.server_url + '/api/apiJS.js', this.init.bind(this));
if (typeof ePhoto !== 'undefined') {
this.init();
}
else if (this._settings && this._settings.server_url) {
$.getScript(this._settings.server_url + '/api/apiJS.js', this.init.bind(this));
}
},
......@@ -78,20 +90,20 @@
return;
}
this.authid = $.cookie('drupal_ephoto_dam_authid');
this._authid = $.cookie('drupal_ephoto_dam_' + self._name + '_authid');
this.ephoto = new ePhoto({
'server': this.settings.server_url,
'authID': this.authid,
this._ephoto = new ePhoto({
'server': this._settings.server_url,
'authID': this._authid,
'client': this.CLIENT_ID
});
this.ephoto.connect();
this._ephoto.connect();
this.ephoto.File.enableDCore('json');
this._ephoto.File.enableDCore('json');
this.ephoto.callOnConnect(function() {
let version = self.ephoto.getVersion().split('.');
this._ephoto.callOnConnect(function() {
let version = self._ephoto.getVersion().split('.');
// Requires API version 6.0 (Ephoto Dam 4.0)
if (version.length !==3 || version[0] < 6) {
......@@ -99,11 +111,11 @@
return;
}
self.authid = self.ephoto.getAuthID();
self._authid = self._ephoto.getAuthID();
$.cookie('drupal_ephoto_dam_authid', self.authid, { path:'/' });
$.cookie('drupal_ephoto_dam_' + self._name + '_authid', self._authid, { path:'/' });
self.connected = true;
self._connected = true;
});
},
......@@ -116,13 +128,13 @@
return;
}
this.ephoto.File.callOnFileReceived(this.getVersionsUrls.bind(this));
this._ephoto.File.callOnFileReceived(this.getVersionsUrls.bind(this));
this.ephoto.File.setButtons( this.ephoto.IMAGE_FILES, [ {
this._ephoto.File.setButtons( this._ephoto.IMAGE_FILES, [ {
'mode': 'none'
} ] );
this.ephoto.File.get();
this._ephoto.File.get();
},
/**
......@@ -148,7 +160,7 @@
const caption = this._buildCaption(dcore);
this.ephoto.File.getVersions(id, function(versions) {
this._ephoto.File.getVersions(id, function(versions) {
const fields = this._getFields();
for (const inc in fields) {
......@@ -165,7 +177,7 @@
let version = fields[inc].name;
let file = version + '@' + id;
let button = this.ephoto.File.setButtons( this.ephoto.IMAGE_FILES, [ {
let button = this._ephoto.File.setButtons( this._ephoto.IMAGE_FILES, [ {
'mode': 'link',
'definition': 'custom',
'size': size
......@@ -190,26 +202,26 @@
* @param {number} Field index
*/
selectFile: function(delta) {
this.fieldSelected = this._getFields()[delta];
this._fieldSelected = this._getFields()[delta];
if (!this.fieldSelected) {
if (!this._fieldSelected) {
console.log('Error : field selection error');
return;
}
let size = this._checkSizeValue(this.fieldSelected.size);
let size = this._checkSizeValue(this._fieldSelected.size);
if (size === '' || size === 0) return;
this.ephoto.File.callOnFileReceived(this.getFileUrl.bind(this));
this._ephoto.File.callOnFileReceived(this.getFileUrl.bind(this));
this.ephoto.File.setButtons( this.ephoto.IMAGE_FILES, [ {
this._ephoto.File.setButtons( this._ephoto.IMAGE_FILES, [ {
'mode': 'link',
'definition': 'custom',
'size': size
} ] );
this.ephoto.File.get();
this._ephoto.File.get();
},
/**
......@@ -224,7 +236,7 @@
return;
}
if (!this.fieldSelected) {
if (!this._fieldSelected) {
console.log('Notice : field selected missing');
return;
}
......@@ -232,11 +244,11 @@
const thumbnail = dcore['dc:description.thumbnail'];
const caption = this._buildCaption(dcore);
this.fieldSelected.input.val(url);
this.fieldSelected.caption.val(caption);
this.fieldSelected.thumbnail.val(thumbnail);
this._fieldSelected.input.val(url);
this._fieldSelected.caption.val(caption);
this._fieldSelected.thumbnail.val(thumbnail);
this.fieldSelected.thumbnail.prev().attr('src', thumbnail);
this._fieldSelected.thumbnail.prev().attr('src', thumbnail);
},
/**
......@@ -256,13 +268,15 @@
* Get all fields
*/
_getFields: function() {
var bloc = $('#' + this._name.replace(/_/g, '-') + '-values');
var fields = [];
var sizes = $('.ephoto-dam-field-imagesize-field').toArray();
var inputs = $('.ephoto-dam-field-url-field').toArray();
var captions = $('.ephoto-dam-field-caption-field').toArray();
var thumbnails = $('.ephoto-dam-field-thumbnail').toArray();
var sizes = bloc.find('.ephoto-dam-field-imagesize-field').toArray();
var inputs = bloc.find('.ephoto-dam-field-url-field').toArray();
var captions = bloc.find('.ephoto-dam-field-caption-field').toArray();
var thumbnails = bloc.find('.ephoto-dam-field-thumbnail').toArray();
$('.ephoto-dam-field-version-field').map(function(index, el) {
bloc.find('.ephoto-dam-field-version-field').map(function(index, el) {
fields.push({
'name' : $(el).val(),
'size' : $(sizes[index]).val(),
......@@ -279,16 +293,21 @@
* Build the caption width a DublinCore
*/
_buildCaption: function(dcore) {
var result = this.settings.captions_format;
var result = this._settings.captions_format;
for (const property in dcore) {
result = result.replace('[' + property + ']', dcore[property]);
}
return result;
},
}
}
}
EphotoDamField = {};
})(jQuery);
for (const name in drupalSettings.ephotoDamField) {
EphotoDamField[name] = new Drupal.ephotoDamField(name, drupalSettings.ephotoDamField[name]);
EphotoDamField[name].load();
}
Drupal.ephotoDamField.load();
})(jQuery);
\ No newline at end of file
......@@ -114,8 +114,10 @@ class EphotoDamField extends FieldItemBase {
* {@inheritdoc}
*/
public function fieldSettingsForm(array $form, FormStateInterface $form_state) {
$form = [];
$field_name = $this->getParent()->getName();
$form = [];
$form['version_support'] = [
'#title' => t('Version support'),
'#description' => t('An url will be automatically associated with each version with the same label in Ephoto Dam') . '.',
......@@ -123,7 +125,7 @@ class EphotoDamField extends FieldItemBase {
'#default_value' => $this->getSetting('version_support'),
'#attributes' => [
'class' => ['ephoto-dam-field-settings-version-support'],
'onclick' => 'Drupal.ephotoDamField.enableVersionSupport(this)'
'onclick' => 'EphotoDamField[\'' . $field_name . '\'].enableVersionSupport(this)'
]
];
......
......@@ -19,7 +19,7 @@ use Drupal\Core\Form\FormStateInterface;
*/
class EphotoDamFieldWidget extends WidgetBase {
private static $_first = true;
private static $_first = [];
/**
* {@inheritdoc}
......@@ -27,8 +27,9 @@ class EphotoDamFieldWidget extends WidgetBase {
public function formElement(FieldItemListInterface $items, $delta, array $element, array &$form, FormStateInterface $form_state) {
$is_default_values_form = $this->isDefaultValueWidget($form_state);
$version_support = $this->getFieldSetting('version_support');
$field_name = $this->fieldDefinition->getName();
if (self::$_first) {
if (!isset(self::$_first[$field_name])) {
$classes = ['button', 'ephoto-dam-field-button', 'ephoto-dam-field-versions-button'];
if (!$version_support) $classes[] = 'ephoto-dam-field-hidden';
......@@ -38,7 +39,7 @@ class EphotoDamFieldWidget extends WidgetBase {
'#disabled' => $is_default_values_form,
'#attributes' => [
'class' => $classes,
'onclick' => 'Drupal.ephotoDamField.selectVersions();return false'
'onclick' => 'EphotoDamField[\'' . $field_name . '\'].selectVersions();return false'
],
];
......@@ -143,7 +144,7 @@ class EphotoDamFieldWidget extends WidgetBase {
'#disabled' => $is_default_values_form,
'#attributes' => [
'class' => $classes,
'onclick' => 'Drupal.ephotoDamField.selectFile(' . $delta . ');return false'
'onclick' => 'EphotoDamField[\'' . $field_name . '\'].selectFile(' . $delta . ');return false'
]
];
......@@ -182,7 +183,7 @@ class EphotoDamFieldWidget extends WidgetBase {
$element['version']['#attributes']['readonly'] = 'readonly';
}
self::$_first = false;
self::$_first[$field_name] = true;
return $element;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment