Skip to content

Commit

Permalink
Merge pull request #90 from netgen/fix-editor-resource-type-detection
Browse files Browse the repository at this point in the history
Fix editor resource type detection
  • Loading branch information
iherak authored Dec 14, 2021
2 parents 45be98e + 269f01e commit 3e43cfe
Show file tree
Hide file tree
Showing 5 changed files with 84 additions and 85 deletions.
7 changes: 3 additions & 4 deletions bundle/Converter/XmlText/NgRemoteMediaPreConverter.php
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ public function convert(DOMDocument $xmlDoc)
$resource = $this->remoteMediaProvider->getRemoteResource($resourceId, $resourceType);
$resource->variations = json_decode($imageVariations, true);

switch ($resource->resourceType) {
switch ($resource->mediaType) {
case 'video':
$videoTag = $this->remoteMediaProvider->generateVideoTag($resource, 'embedded', $variation);
$src = $this->remoteMediaProvider->getVideoThumbnail($resource);
Expand All @@ -64,14 +64,13 @@ public function convert(DOMDocument $xmlDoc)
break;

default:
$filename = $resource->resourceId ?? basename($resource->resourceId);
$src = $resource->secure_url;
$src = $this->remoteMediaProvider->generateDownloadLink($resource);
}

$tag->setAttributeNS(self::CUSTOMTAG_NAMESPACE, 'src', $src);
$tag->setAttributeNS(self::CUSTOMTAG_NAMESPACE, 'videoTag', $videoTag);
$tag->setAttributeNS(self::CUSTOMTAG_NAMESPACE, 'filename', $filename);
$tag->setAttributeNS(self::CUSTOMTAG_NAMESPACE, 'alt', $resource->metaData['alt_text'] ?? '');
$tag->setAttributeNS(self::CUSTOMTAG_NAMESPACE, 'mediaType', $resource->mediaType ?? '');
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,18 +8,18 @@
{% set css_class = params.cssclass|default(null) %}

{% if resource_id and resource_type %}
<div class="ez-ngremotemedia{% if css_class %} {{ css_class }}{% endif %}{% if align %} object-{{ align }} align-{{ align }}{% endif %}">
{% set resource = netgen_remote_media_embed(resource_id, resource_type, coords) %}
{% set resource = netgen_remote_media_embed(resource_id, resource_type, coords) %}

{% if resource.resourceType == 'image' %}
<div class="ez-ngremotemedia remote-image-inline remote-{{ resource.mediaType }}{% if css_class %} {{ css_class }}{% endif %}{% if align %} object-{{ align }} align-{{ align }}{% endif %}">
{% if resource.mediaType == 'image' %}
{% set image_url = resource.secure_url %}
{% if variation %}
{% set variation = netgen_remote_variation_embed(resource, variation) %}
{% set image_url = variation.url %}
{% endif %}

<img src="{{ image_url }}" alt="{{ resource.metaData.alt_text }}">
{% elseif resource_type == 'video' %}
{% elseif resource.mediaType == 'video' %}
{{ netgen_remote_video_embed(resource, variation)|raw }}
{% else %}
<a href="{{ netgen_remote_download(resource) }}">{{ resource.resourceId }}</a>
Expand Down
20 changes: 10 additions & 10 deletions bundle/Resources/xsl/ezxml_ngremotemedia.xsl
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xhtml="http://ez.no/namespaces/ezpublish3/xhtml/"
xmlns:custom="http://ez.no/namespaces/ezpublish3/custom/"
xmlns:image="http://ez.no/namespaces/ezpublish3/image/"
exclude-result-prefixes="xhtml custom image">
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xhtml="http://ez.no/namespaces/ezpublish3/xhtml/"
xmlns:custom="http://ez.no/namespaces/ezpublish3/custom/"
xmlns:image="http://ez.no/namespaces/ezpublish3/image/"
exclude-result-prefixes="xhtml custom image">

<xsl:output method="html" indent="yes" encoding="UTF-8"/>

<xsl:template match="custom[@name='ngremotemedia']">
<div>
<xsl:attribute name="class">remote-image-inline <xsl:value-of select="@custom:cssclass"/>
<xsl:attribute name="class">remote-image-inline <xsl:value-of select="@custom:cssclass"/> remote-<xsl:value-of select="@custom:mediaType"/>
<xsl:if test="@align!=''">
<xsl:choose>
<xsl:when test="@align='middle'">
Expand All @@ -26,21 +26,21 @@
</xsl:attribute>

<xsl:choose>
<xsl:when test="@custom:resourceType='image'">
<xsl:when test="@custom:mediaType='image'">
<img>
<xsl:attribute name="src"><xsl:value-of select="@custom:src"/></xsl:attribute>
<xsl:attribute name="alt"><xsl:value-of select="@custom:alt"/></xsl:attribute>
</img>
</xsl:when>

<xsl:when test="@custom:resourceType='video'">
<xsl:when test="@custom:mediaType='video'">
<xsl:value-of select="@custom:videoTag" disable-output-escaping="yes"/>
</xsl:when>

<xsl:otherwise>
<a>
<xsl:attribute name="href"><xsl:value-of select="@custom:src"/></xsl:attribute>
<xsl:value-of select="@custom:filename"/>
<xsl:value-of select="@custom:resourceId"/>
</a>
</xsl:otherwise>
</xsl:choose>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,84 +1,84 @@
/* eslint-disable prefer-arrow-callback */
(function (tinymce) {
function insertMediaCallback(data, caption, align, cssClass) {
var imageUrl = '';
if (data.type === 'image') {
if (data.variation_url !== null) {
imageUrl = data.variation_url;
} else if (data.url !== null) {
imageUrl = data.url;
}
} else if (data.type === 'video' && data.thumbnail_url !== null && data.thumbnail_url !== '') {
imageUrl = data.thumbnail_url;
}
function insertMediaCallback(data, caption, align, cssClass) {
var imageUrl = '';
if (data.mediaType === 'image') {
if (data.variation_url !== null) {
imageUrl = data.variation_url;
} else if (data.url !== null) {
imageUrl = data.url;
}
} else if (data.mediaType === 'video' && data.thumbnail_url !== null && data.thumbnail_url !== '') {
imageUrl = data.thumbnail_url;
}

let previewUrl = imageUrl !== '' ? imageUrl : '/extension/ezoe/design/standard/images/tango/mail-attachment.png';
let elementClass = "ezoeItemCustomTag ngremotemedia";
let alignAttr = '';
let previewUrl = imageUrl !== '' ? imageUrl : '/extension/ezoe/design/standard/images/tango/mail-attachment.png';
let elementClass = "ezoeItemCustomTag ngremotemedia";
let alignAttr = '';

if (typeof align !== 'undefined' && align !== '') {
elementClass += (' ezoeAlign' + align);
alignAttr = 'align="'+align+'"';
}
if (typeof align !== 'undefined' && align !== '') {
elementClass += (' ezoeAlign' + align);
alignAttr = 'align="'+align+'"';
}

let html = '<img type="custom" src="'+previewUrl+'"'
+ 'data-mce-src="'+previewUrl+'"'
+ alignAttr
+ 'customattributes=\'caption|'+caption+'attribute_separationcssclass|'+cssClass+'attribute_separationcoords|'+JSON.stringify(data.image_variations)
+ 'attribute_separationresourceId|'+data.resourceId+'attribute_separationresourceType|'+data.type+'attribute_separationimage_url|'+imageUrl
+ 'attribute_separationvariation|'+data.selected_variation+'\'"'+'class="'+elementClass+'" style="">';
let html = '<img type="custom" src="'+previewUrl+'"'
+ 'data-mce-src="'+previewUrl+'"'
+ alignAttr
+ 'customattributes=\'caption|'+caption+'attribute_separationcssclass|'+cssClass+'attribute_separationcoords|'+JSON.stringify(data.image_variations)
+ 'attribute_separationresourceId|'+data.resourceId+'attribute_separationresourceType|'+data.type+'attribute_separationimage_url|'+imageUrl
+ 'attribute_separationvariation|'+data.selected_variation+'\'"'+'class="'+elementClass+'" style="">';

tinymce.execCommand('mceInsertContent', false, html);
}
tinymce.execCommand('mceInsertContent', false, html);
}

tinymce.PluginManager.add("ngremotemedia", function (editor) {
const fieldId = editor.settings.ez_attribute_id;
tinymce.PluginManager.add("ngremotemedia", function (editor) {
const fieldId = editor.settings.ez_attribute_id;

window[`remoteMedia` + fieldId].setEditorInsertCallback(insertMediaCallback);
window[`remoteMedia` + fieldId].setEditorInsertCallback(insertMediaCallback);

// Add a button that opens a modal
editor.addButton("ngremotemedia", {
title: "Insert remote media",
image: "/bundles/netgenremotemedia/img/cloud-upload-alt.svg",
onclick() {
let attributeType = tinymce.activeEditor.selection.getNode().getAttribute('type');
let attributeString = tinymce.activeEditor.selection.getNode().getAttribute('customattributes');
let hasNgrmClass = tinymce.activeEditor.selection.getNode().classList.contains('ngremotemedia');
// Add a button that opens a modal
editor.addButton("ngremotemedia", {
title: "Insert remote media",
image: "/bundles/netgenremotemedia/img/cloud-upload-alt.svg",
onclick() {
let attributeType = tinymce.activeEditor.selection.getNode().getAttribute('type');
let attributeString = tinymce.activeEditor.selection.getNode().getAttribute('customattributes');
let hasNgrmClass = tinymce.activeEditor.selection.getNode().classList.contains('ngremotemedia');

var data = {};
if (attributeType === 'custom' && hasNgrmClass === true && attributeString) {
data.align = tinymce.activeEditor.selection.getNode().getAttribute('align');
let attributes = attributeString.split('attribute_separation');
var data = {};
if (attributeType === 'custom' && hasNgrmClass === true && attributeString) {
data.align = tinymce.activeEditor.selection.getNode().getAttribute('align');
let attributes = attributeString.split('attribute_separation');

attributes.forEach(function (attribute) {
let attributeKey = attribute.split('|')[0];
let attributeValue = attribute.split('|')[1];
attributes.forEach(function (attribute) {
let attributeKey = attribute.split('|')[0];
let attributeValue = attribute.split('|')[1];

if (attributeKey === 'coords' || attributeKey === 'image_variations') {
try {
data['image_variations'] = JSON.parse(attributeValue);
} catch(e) {
data['image_variations'] = {};
}
if (attributeKey === 'coords' || attributeKey === 'image_variations') {
try {
data['image_variations'] = JSON.parse(attributeValue);
} catch(e) {
data['image_variations'] = {};
}

return;
}
return;
}

data[attributeKey] = attributeValue;
});
}
data[attributeKey] = attributeValue;
});
}

window[`remoteMedia` + fieldId].openEditorInsertModal(data);
},
});
window[`remoteMedia` + fieldId].openEditorInsertModal(data);
},
});

return {
getMetadata() {
return {
getMetadata() {
return {
name: "Netgen remote media",
url: "https://github.com/netgen/NetgenRemoteMediaBundle",
};
},
name: "Netgen remote media",
url: "https://github.com/netgen/NetgenRemoteMediaBundle",
};
});
},
};
});
})(tinymce);
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@

{if and(resource, $resource.resourceId|is_null|not)}
<div{if and(is_set($align), is_string($align), not($align|compare('')))} class="object-{if $align|compare('middle')}center{else}{$align}{/if}"{/if}>
{if eq($resourceType, 'image')}
{if eq($resource.mediaType, 'image')}
{def $image_url = $resource.secure_url}

{def $image_url = ngremotemedia($resource, 'embedded', $variation).url}
Expand All @@ -17,7 +17,7 @@
{if and(is_set($cssclass), is_string($cssclass), not($cssclass|compare('')))}class="{$cssclass|wash()}"{/if}
{if and(is_set($style), is_string($style), not($style|compare('')))}style="{$style|wash()}"{/if}
{if and(is_set($resource.metaData.alt_text), is_string($resource.metaData.alt_text))}alt="{$resource.metaData.alt_text|wash()}"{/if} />
{elseif eq($resourceType, 'video')}
{elseif eq($resource.mediaType, 'video')}
{ngremotevideo($resource, $variation, 'embedded')}
{else}
<a href="{$resource.secure_url}">{$resourceId}</a>
Expand Down

0 comments on commit 3e43cfe

Please sign in to comment.