Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
svg_image
Manage
Activity
Members
Labels
Plan
Wiki
Custom issue tracker
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Locked files
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Model registry
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Code review analytics
Insights
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
GitLab community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
project
svg_image
Commits
2fe16c7a
Commit
2fe16c7a
authored
10 months ago
by
Frank Mably
Committed by
Joshua Sedler
10 months ago
Browse files
Options
Downloads
Patches
Plain Diff
Issue
#3420037
: SvgImageWidget should inherit from ImageWidget instead of FileWidget
parent
5f65b817
No related branches found
No related tags found
1 merge request
!35
Issue #3420037: SvgImageWidget should inherit from ImageWidget instead of FileWidget
Pipeline
#293220
failed
10 months ago
Stage: build
Stage: validate
Changes
1
Pipelines
2
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
src/Plugin/Field/FieldWidget/SvgImageWidget.php
+40
-337
40 additions, 337 deletions
src/Plugin/Field/FieldWidget/SvgImageWidget.php
with
40 additions
and
337 deletions
src/Plugin/Field/FieldWidget/SvgImageWidget.php
+
40
−
337
View file @
2fe16c7a
...
...
@@ -2,12 +2,11 @@
namespace
Drupal\svg_image\Plugin\Field\FieldWidget
;
use
Drupal\Core\Field\FieldDefinitionInterface
;
use
Drupal\Core\Field\FieldItemListInterface
;
use
Drupal\Core\Form\FormStateInterface
;
use
Drupal\file\Entity\File
;
use
Drupal\file\
Plugin\Field\FieldWidget\FileWidget
;
use
Symfony\Component\DependencyInjection\ContainerInterface
;
use
Drupal\file\
FileInterface
;
use
Drupal\image\Plugin\Field\FieldWidget\ImageWidget
;
/**
* Override plugin of the 'image_image' widget.
...
...
@@ -23,202 +22,28 @@ use Symfony\Component\DependencyInjection\ContainerInterface;
* }
* )
*/
class
SvgImageWidget
extends
FileWidget
{
/**
* Container.
*
* @var \Symfony\Component\DependencyInjection\ContainerInterface
*/
private
$container
;
/**
* Entity repository service instance.
*
* @var \Drupal\Core\Entity\EntityRepository
*/
protected
$entityRepository
;
/**
* Renderer instance.
*
* @var \Drupal\Core\Render\Renderer
*/
protected
$renderer
;
/**
* EntityType manager.
*
* @var \Drupal\Core\Entity\EntityTypeManagerInterface
*/
protected
$entityTypeManager
;
/**
* Image style storage.
*
* @var \Drupal\Core\Entity\EntityStorageInterface
*/
protected
$imageStyleStorage
;
/**
* The image factory service.
*
* @var \Drupal\Core\Image\ImageFactory
*/
protected
$imageFactory
;
/**
* {@inheritdoc}
*/
public
function
__construct
(
$pluginId
,
$pluginDefinition
,
FieldDefinitionInterface
$fieldDefinition
,
array
$settings
,
array
$thirdPartySettings
,
ContainerInterface
$container
)
{
parent
::
__construct
(
$pluginId
,
$pluginDefinition
,
$fieldDefinition
,
$settings
,
$thirdPartySettings
,
$container
->
get
(
'element_info'
));
$this
->
container
=
$container
;
$this
->
entityRepository
=
$container
->
get
(
'entity.repository'
);
$this
->
renderer
=
$container
->
get
(
'renderer'
);
$this
->
entityTypeManager
=
$container
->
get
(
'entity_type.manager'
);
$this
->
imageStyleStorage
=
$this
->
entityTypeManager
->
getStorage
(
'image_style'
);
$this
->
imageFactory
=
$container
->
get
(
'image.factory'
);
}
/**
* {@inheritdoc}
*/
public
static
function
create
(
ContainerInterface
$container
,
array
$configuration
,
$pluginId
,
$pluginDefinition
)
{
return
new
static
(
$pluginId
,
$pluginDefinition
,
$configuration
[
'field_definition'
],
$configuration
[
'settings'
],
$configuration
[
'third_party_settings'
],
$container
);
}
/**
* {@inheritdoc}
*/
public
static
function
defaultSettings
()
{
return
[
'progress_indicator'
=>
'throbber'
,
'preview_image_style'
=>
'thumbnail'
,
]
+
parent
::
defaultSettings
();
}
/**
* {@inheritdoc}
*/
public
function
settingsForm
(
array
$form
,
FormStateInterface
$formState
)
{
$element
=
parent
::
settingsForm
(
$form
,
$formState
);
$element
[
'preview_image_style'
]
=
[
'#title'
=>
$this
->
t
(
'Preview image style'
),
'#type'
=>
'select'
,
'#options'
=>
image_style_options
(
FALSE
),
'#empty_option'
=>
'<'
.
$this
->
t
(
'no preview'
)
.
'>'
,
'#default_value'
=>
$this
->
getSetting
(
'preview_image_style'
),
'#description'
=>
$this
->
t
(
'The preview image will be shown while editing the content.'
),
'#weight'
=>
15
,
];
return
$element
;
}
/**
* {@inheritdoc}
*/
public
function
settingsSummary
()
{
$summary
=
parent
::
settingsSummary
();
$imageStyles
=
image_style_options
(
FALSE
);
// Unset possible 'No defined styles' option.
unset
(
$imageStyles
[
''
]);
// Styles could be lost because of enabled/disabled modules that defines
// their styles in code.
$imageStyleSetting
=
$this
->
getSetting
(
'preview_image_style'
);
if
(
isset
(
$imageStyles
[
$imageStyleSetting
]))
{
$previewImageStyle
=
$this
->
t
(
'Preview image style: @style'
,
[
'@style'
=>
$imageStyles
[
$imageStyleSetting
]]);
}
else
{
$previewImageStyle
=
$this
->
t
(
'No preview'
);
}
array_unshift
(
$summary
,
$previewImageStyle
);
return
$summary
;
}
/**
* {@inheritdoc}
*/
protected
function
formMultipleElements
(
FieldItemListInterface
$items
,
array
&
$form
,
FormStateInterface
$formState
)
{
$elements
=
parent
::
formMultipleElements
(
$items
,
$form
,
$formState
);
$cardinality
=
$this
->
fieldDefinition
->
getFieldStorageDefinition
()
->
getCardinality
();
$fileUploadHelp
=
[
'#theme'
=>
'file_upload_help'
,
'#description'
=>
''
,
'#upload_validators'
=>
$elements
[
0
][
'#upload_validators'
],
'#cardinality'
=>
$cardinality
,
];
if
(
$cardinality
==
1
)
{
// If there's only one field, return it as delta 0.
if
(
empty
(
$elements
[
0
][
'#default_value'
][
'fids'
]))
{
$fileUploadHelp
[
'#description'
]
=
$this
->
getFilteredDescription
();
$elements
[
0
][
'#description'
]
=
$this
->
renderer
->
renderInIsolation
(
$fileUploadHelp
);
}
}
else
{
$elements
[
'#file_upload_description'
]
=
$fileUploadHelp
;
}
return
$elements
;
}
class
SvgImageWidget
extends
ImageWidget
{
/**
* {@inheritdoc}
*/
public
function
formElement
(
FieldItemListInterface
$items
,
$delta
,
array
$element
,
array
&
$form
,
FormStateInterface
$formState
)
{
$element
=
parent
::
formElement
(
$items
,
$delta
,
$element
,
$form
,
$formState
);
$fieldSettings
=
$this
->
getFieldSettings
();
public
function
formElement
(
FieldItemListInterface
$items
,
$delta
,
array
$element
,
array
&
$form
,
FormStateInterface
$form_state
)
{
$element
=
parent
::
formElement
(
$items
,
$delta
,
$element
,
$form
,
$form_state
);
// Add upload resolution validation.
if
(
$fieldSettings
[
'max_resolution'
]
||
$fieldSettings
[
'min_resolution'
])
{
$element
[
'#upload_validators'
][
'file_validate_image_resolution'
]
=
[
$fieldSettings
[
'max_resolution'
],
$fieldSettings
[
'min_resolution'
],
];
}
$field_settings
=
$this
->
getFieldSettings
();
// If not using custom extension validation, ensure this is an image.
$supportedExtensions
=
$this
->
imageFactory
->
getSupportedExtensions
();
$supportedExtensions
[]
=
'svg'
;
$extensions
=
$element
[
'#upload_validators'
][
'file_validate_extensions'
][
0
]
??
implode
(
' '
,
$supportedExtensions
);
$allowedExtensions
=
$field_settings
[
'file_extensions'
];
$supported_extensions
=
$this
->
imageFactory
->
getSupportedExtensions
();
$supported_extensions
[]
=
'svg'
;
$extensions
=
array_intersect
(
explode
(
' '
,
$extensions
),
$supportedExtensions
);
$element
[
'#upload_validators'
][
'file_validate_extensions'
][
0
]
=
implode
(
' '
,
$extensions
);
// If using custom extension validation, ensure that the extensions are
// supported by the current image toolkit. Otherwise, validate against all
// toolkit supported extensions.
$extensions
=
!
empty
(
$allowedExtensions
)
?
array_intersect
(
explode
(
' '
,
$allowedExtensions
),
$supported_extensions
)
:
$supported_extensions
;
// Remove default image validation. Otherwise, we get an error on upload:
unset
(
$element
[
'#upload_validators'
][
'FileIsImage'
]);
// Add mobile device image capture acceptance.
$element
[
'#accept'
]
=
'image/*'
;
// Add properties needed by process() method.
$element
[
'#preview_image_style'
]
=
$this
->
getSetting
(
'preview_image_style'
);
$element
[
'#title_field'
]
=
$fieldSettings
[
'title_field'
];
$element
[
'#title_field_required'
]
=
$fieldSettings
[
'title_field_required'
];
$element
[
'#alt_field'
]
=
$fieldSettings
[
'alt_field'
];
$element
[
'#alt_field_required'
]
=
$fieldSettings
[
'alt_field_required'
];
// Default image.
$defaultImage
=
$fieldSettings
[
'default_image'
];
if
(
empty
(
$defaultImage
[
'uuid'
]))
{
$defaultImage
=
$this
->
fieldDefinition
->
getFieldStorageDefinition
()
->
getSetting
(
'default_image'
);
}
// Convert the stored UUID into a file ID.
if
(
!
empty
(
$defaultImage
[
'uuid'
])
&&
$entity
=
$this
->
entityRepository
->
loadEntityByUuid
(
'file'
,
$defaultImage
[
'uuid'
]))
{
$defaultImage
[
'fid'
]
=
$entity
->
id
();
}
$element
[
'#default_image'
]
=
!
empty
(
$defaultImage
[
'fid'
])
?
$defaultImage
:
[];
$element
[
'#upload_validators'
][
'FileExtension'
][
'extensions'
]
=
implode
(
' '
,
$extensions
);
return
$element
;
}
...
...
@@ -226,168 +51,46 @@ class SvgImageWidget extends FileWidget {
/**
* {@inheritdoc}
*/
public
static
function
process
(
$element
,
FormStateInterface
$formState
,
$form
)
{
$item
=
$element
[
'#value'
];
$item
[
'fids'
]
=
$element
[
'fids'
][
'#value'
];
$element
[
'#theme'
]
=
'image_widget'
;
public
static
function
process
(
$element
,
FormStateInterface
$form_state
,
$form
)
{
$element
=
parent
::
process
(
$element
,
$form_state
,
$form
);
// Add the image preview.
if
(
!
empty
(
$element
[
'#files'
])
&&
$element
[
'#preview_image_style'
])
{
// Override image preview if SVG file.
$file
=
reset
(
$element
[
'#files'
]);
$variables
=
svg_image_get_image_file_dimensions
(
$file
);
$variables
[
'style_name'
]
=
$element
[
'#preview_image_style'
];
$variables
[
'uri'
]
=
$file
->
getFileUri
();
// Add a custom preview for SVG file.
if
(
svg_image_is_file_svg
(
$file
))
{
$element
[
'preview'
]
=
[
'#weight'
=>
-
10
,
'#theme'
=>
'image'
,
'#width'
=>
$variables
[
'width'
],
'#height'
=>
$variables
[
'height'
],
'#uri'
=>
$variables
[
'uri'
],
];
}
else
{
$element
[
'preview'
]
=
[
'#weight'
=>
-
10
,
'#theme'
=>
'image_style'
,
'#width'
=>
$variables
[
'width'
],
'#height'
=>
$variables
[
'height'
],
'#style_name'
=>
$variables
[
'style_name'
],
'#uri'
=>
$variables
[
'uri'
],
];
$element
[
'preview'
]
=
static
::
buildSvgPreview
(
$file
);
}
// Store the dimensions in the form so the file doesn't have to be
// accessed again. This is important for remote files.
$element
[
'width'
]
=
[
'#type'
=>
'hidden'
,
'#value'
=>
$variables
[
'width'
],
];
$element
[
'height'
]
=
[
'#type'
=>
'hidden'
,
'#value'
=>
$variables
[
'height'
],
];
}
elseif
(
!
empty
(
$element
[
'#default_image'
]))
{
$defaultImage
=
$element
[
'#default_image'
];
$file
=
File
::
load
(
$defaultImage
[
'fid'
]);
if
(
!
empty
(
$file
))
{
$element
[
'preview'
]
=
[
'#weight'
=>
-
10
,
'#theme'
=>
'image_style'
,
'#width'
=>
$defaultImage
[
'width'
],
'#height'
=>
$defaultImage
[
'height'
],
'#style_name'
=>
$element
[
'#preview_image_style'
],
'#uri'
=>
$file
->
getFileUri
(),
];
// Override default image preview if SVG file.
$file
=
File
::
load
(
$element
[
'#default_image'
][
'fid'
]);
if
(
$file
&&
svg_image_is_file_svg
(
$file
))
{
$element
[
'preview'
]
=
static
::
buildSvgPreview
(
$file
);
}
}
// Add the additional alt and title fields.
$element
[
'alt'
]
=
[
'#title'
=>
t
(
'Alternative text'
),
'#type'
=>
'textfield'
,
'#default_value'
=>
$item
[
'alt'
]
??
''
,
'#description'
=>
t
(
'This text will be used by screen readers, search engines, or when the image cannot be loaded.'
),
// @see https://www.drupal.org/node/465106#alt-text
'#maxlength'
=>
512
,
'#weight'
=>
-
12
,
'#access'
=>
(
bool
)
$item
[
'fids'
]
&&
$element
[
'#alt_field'
],
'#required'
=>
$element
[
'#alt_field_required'
],
'#element_validate'
=>
$element
[
'#alt_field_required'
]
==
1
?
[[
get_called_class
(),
'validateRequiredFields'
]]
:
[],
];
$element
[
'title'
]
=
[
'#type'
=>
'textfield'
,
'#title'
=>
t
(
'Title'
),
'#default_value'
=>
$item
[
'title'
]
??
''
,
'#description'
=>
t
(
'The title is used as a tool tip when the user hovers the mouse over the image.'
),
'#maxlength'
=>
1024
,
'#weight'
=>
-
11
,
'#access'
=>
(
bool
)
$item
[
'fids'
]
&&
$element
[
'#title_field'
],
'#required'
=>
$element
[
'#title_field_required'
],
'#element_validate'
=>
$element
[
'#title_field_required'
]
==
1
?
[[
get_called_class
(),
'validateRequiredFields'
]]
:
[],
];
return
parent
::
process
(
$element
,
$formState
,
$form
);
return
$element
;
}
/**
*
Validate callback for alt and title field, if the user wants them required
.
*
Builds the SVG file preview
.
*
* This is separated in a validate function instead of a #required flag to
* avoid being validated on the process callback.
*/
public
static
function
validateRequiredFields
(
$element
,
FormStateInterface
$formState
)
{
// Only do validation if the function is triggered from other places than
// the image process form.
$triggering_element
=
$formState
->
getTriggeringElement
();
if
(
!
empty
(
$triggering_element
[
'#submit'
])
&&
in_array
(
'file_managed_file_submit'
,
$triggering_element
[
'#submit'
],
TRUE
))
{
$formState
->
setLimitValidationErrors
([]);
}
}
/**
* {@inheritdoc}
*/
public
function
calculateDependencies
()
{
$dependencies
=
parent
::
calculateDependencies
();
$styleId
=
$this
->
getSetting
(
'preview_image_style'
);
if
(
$styleId
)
{
/** @var \Drupal\image\ImageStyleStorage $imageStyleStorage */
$style
=
$this
->
imageStyleStorage
->
load
(
$styleId
);
if
(
$style
)
{
// If this widget uses a valid image style to display the preview of
// the uploaded image, add that image style configuration entity
// as dependency of this widget.
$dependencies
[
$style
->
getConfigDependencyKey
()][]
=
$style
->
getConfigDependencyName
();
}
}
return
$dependencies
;
}
/**
* {@inheritdoc}
* @param \Drupal\file\FileInterface $file
* The SVG file.
*
* @return array
* The render array.
*/
public
function
onDependencyRemoval
(
array
$dependencies
)
{
$changed
=
parent
::
onDependencyRemoval
(
$dependencies
);
$styleId
=
$this
->
getSetting
(
'preview_image_style'
);
/** @var \Drupal\image\ImageStyleInterface $style */
if
(
$styleId
)
{
$style
=
$this
->
imageStyleStorage
->
load
(
$styleId
);
if
(
$style
)
{
if
(
!
empty
(
$dependencies
[
$style
->
getConfigDependencyKey
()][
$style
->
getConfigDependencyName
()]))
{
/** @var \Drupal\image\ImageStyleStorageInterface $storage */
$storage
=
$this
->
entityTypeManager
->
getStorage
(
$style
->
getEntityTypeId
());
$replacementId
=
$storage
->
getReplacementId
(
$styleId
);
// If a valid replacement has been provided in the storage, replace
// the preview image style with the replacement.
if
(
$replacementId
&&
$this
->
imageStyleStorage
->
load
(
$replacementId
))
{
$this
->
setSetting
(
'preview_image_style'
,
$replacementId
);
}
// If there's no replacement or the replacement is invalid, disable
// the image preview.
else
{
$this
->
setSetting
(
'preview_image_style'
,
''
);
}
// Signal that the formatter plugin settings were updated.
$changed
=
TRUE
;
}
}
}
return
$changed
;
protected
static
function
buildSvgPreview
(
FileInterface
$file
):
array
{
$dimensions
=
svg_image_get_image_file_dimensions
(
$file
);
return
[
'#weight'
=>
-
10
,
'#theme'
=>
'image'
,
'#width'
=>
$dimensions
[
'width'
],
'#height'
=>
$dimensions
[
'height'
],
'#uri'
=>
$file
->
getFileUri
(),
];
}
}
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment