Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[4.0] Fix the web components #19957

Merged
merged 3 commits into from
Mar 22, 2018
Merged

[4.0] Fix the web components #19957

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5788991
fix the wc
dgrammatiko Mar 21, 2018
68207df
minified
dgrammatiko Mar 21, 2018
0981706
fix the DOC block
dgrammatiko Mar 21, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
2 changes: 1 addition & 1 deletion administrator/components/com_config/tmpl/application/default_mail.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
defined('_JEXEC') or die;

HTMLHelper::_('form.csrf');
HTMLHelper::_('webcomponent', ['joomla-field-send-mail' => 'system/webcomponents/joomla-field-send-test-mail.min.js'], ['version' => 'auto', 'relative' => true]);
HTMLHelper::_('webcomponent', 'system/webcomponents/joomla-field-send-test-mail.min.js', ['version' => 'auto', 'relative' => true]);

// Load JavaScript message titles
Text::script('ERROR');
Expand Down
2 changes: 1 addition & 1 deletion administrator/templates/atum/component.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
$lang = Factory::getLanguage();

// Alerts
HTMLHelper::_('webcomponent', ['joomla-alert' => 'vendor/joomla-custom-elements/joomla-alert.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);
HTMLHelper::_('webcomponent', 'vendor/joomla-custom-elements/joomla-alert.min.js', ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);

// Add JavaScript Frameworks
HTMLHelper::_('bootstrap.framework');
Expand Down
2 changes: 1 addition & 1 deletion administrator/templates/atum/error.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
'base' => JUri::base(true),
],
"webcomponents" => [
"joomla-alert" => Uri::root() . 'media/vendor/joomla-custom-elements/js/joomla-alert.min.js',
Uri::root() . 'media/vendor/joomla-custom-elements/js/joomla-alert.min.js',
]
];
?>
Expand Down
2 changes: 1 addition & 1 deletion administrator/templates/atum/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
HTMLHelper::_('stylesheet', 'user.css', array('version' => 'auto', 'relative' => true));

// Alerts
HTMLHelper::_('webcomponent', ['joomla-alert' => 'vendor/joomla-custom-elements/joomla-alert.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);
HTMLHelper::_('webcomponent', 'vendor/joomla-custom-elements/joomla-alert.min.js', ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);

// Load specific language related CSS
HTMLHelper::_('stylesheet', 'administrator/language/' . $lang->getTag() . '/' . $lang->getTag() . '.css', array('version' => 'auto'));
Expand Down
2 changes: 1 addition & 1 deletion administrator/templates/atum/login.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
HTMLHelper::_('stylesheet', 'template' . ($this->direction === 'rtl' ? '-rtl' : '') . '.min.css', ['version' => 'auto', 'relative' => true]);

// Alerts
HTMLHelper::_('webcomponent', ['joomla-alert' => 'vendor/joomla-custom-elements/joomla-alert.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);
HTMLHelper::_('webcomponent', 'vendor/joomla-custom-elements/joomla-alert.min.js', ['relative' => true, 'version' => 'auto']);


// Load custom CSS file
Expand Down
2 changes: 1 addition & 1 deletion installation/template/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
JHtml::_('behavior.keepalive');
JHtml::_('behavior.formvalidator');
JHtml::_('script', 'installation/template/js/template.js', ['version' => 'auto']);
JHtml::_('webcomponent', ['joomla-alert' => 'system/joomla-alert.min.js'], ['version' => 'auto', 'relative' => true]);
JHtml::_('webcomponent', 'system/joomla-alert.min.js', ['version' => 'auto', 'relative' => true]);

// Add script options
$this->addScriptOptions('system.installation', ['url' => JRoute::_('index.php')]);
Expand Down
2 changes: 1 addition & 1 deletion layouts/joomla/form/field/media.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,7 @@
)
);

HTMLHelper::_('webcomponent', ['joomla-field-media' => 'system/webcomponents/joomla-field-media.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => true]);
HTMLHelper::_('webcomponent', 'system/webcomponents/joomla-field-media.min.js', ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => true]);
Text::script('JLIB_FORM_MEDIA_PREVIEW_EMPTY', true);
?>
<?php if ($showPreview) : ?>
Expand Down
2 changes: 1 addition & 1 deletion layouts/joomla/form/field/radio/switcher.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
$alt = preg_replace('/[^a-zA-Z0-9_\-]/', '_', $name);

HTMLHelper::_('webcomponent',
['joomla-switcher' => 'system/webcomponents/joomla-field-switcher.min.js'],
'system/webcomponents/joomla-field-switcher.min.js',
['relative' => true, 'version' => 'auto']
);

Expand Down
2 changes: 1 addition & 1 deletion layouts/joomla/form/field/user.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@
// @TODO remove jQuery dependency once modal moves to webcomponents
HTMLHelper::_('jquery.framework');

HTMLHelper::_('webcomponent', ['joomla-field-user' =>'system/webcomponents/joomla-field-user.min.js'], ['version' => 'auto', 'relative' => true]);}
HTMLHelper::_('webcomponent', 'system/webcomponents/joomla-field-user.min.js', ['version' => 'auto', 'relative' => true]);}

$uri = new Uri('index.php?option=com_users&view=users&layout=modal&tmpl=component&required=0');

Expand Down
88 changes: 49 additions & 39 deletions libraries/src/HTML/HTMLHelper.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -832,70 +832,80 @@ public static function script($file, $options = array(), $attribs = array())
}

/**
* Loads the name and path of a custom element or webcomponent into the scriptOptions object
* Loads the path of a custom element or webcomponent into the scriptOptions object
*
* @param array $component The name and path of the web component.
* Also passing a key = fullPolyfill and value= true we force the whole polyfill instead
* of just the custom element. (Polyfills loaded as needed, no force load)
* @param array $options The relative, version, detect browser and detect debug options for the custom element
* or web component. Files need to have a -es5(.min).js for the non ES6
* Browsers.
* @param string $file The path of the web component (expects the ES6 version). File need to have also an
* -es5(.min).js version in the same folder for the non ES6 Browsers.
* @param array $options The extra options for the script
*
* @since 4.0.0
*
* @see HTMLHelper::stylesheet()
* @see HTMLHelper::script()
*
* @return void
*/
public static function webcomponent(array $component = [], array $options = [])
public static function webcomponent(string $file, array $options = [])
{
if (empty($component))
if (empty($file))
{
return;
}

// Script core.js is responsible for the polyfills and the async loading of the web components
static::_('behavior.core');

foreach ($component as $key => $value)
$version = '';
$mediaVersion = Factory::getDocument()->getMediaVersion();

// Add the css if exists
self::_('stylesheet', str_replace('.js', '.css', $file), $options);

$includes = static::includeRelativeFiles(
'js',
$file,
$options['relative'] ?? true,
$options['detectBrowser'] ?? false,
$options['detectDebug'] ?? false
);

if (count($includes) === 0)
{
$version = '';
$mediaVersion = Factory::getDocument()->getMediaVersion();

// Add the css if exists
self::_('stylesheet', str_replace('.js', '.css', $value), $options);

$includes = static::includeRelativeFiles(
'js',
$value,
$options['relative'] ?? true,
$options['detectBrowser'] ?? false,
$options['detectDebug'] ?? false
);
return;
}

if (count($includes) === 0)
if (isset($options['version']))
{
if ($options['version'] === 'auto')
{
continue;
$version = '?' . $mediaVersion;
}

if (isset($options['version']))
else
{
if ($options['version'] === 'auto')
{
$version = '?' . $mediaVersion;
}
else
{
$version = '?' . $options['version'];
}
$version = '?' . $options['version'];
}
}

if (count($includes) === 1)
if (count($includes) === 1)
{
$potential = $includes[0] . ((strpos($includes[0], '?') === false) ? $version : '');

if (!in_array($potential, Factory::getDocument()->getScriptOptions('webcomponents')))
{
Factory::getDocument()->addScriptOptions('webcomponents', [$key => $includes[0] . ((strpos($includes[0], '?') === false) ? $version : '')]);
continue;
Factory::getDocument()->addScriptOptions('webcomponents', [$potential]);
return;
}

Factory::getDocument()->addScriptOptions('webcomponents', [$key => $includes . ((strpos($includes, '?') === false) ? $version : '')]);
return;
}

$potential = $includes . ((strpos($includes, '?') === false) ? $version : '');

if (!in_array($potential, Factory::getDocument()->getScriptOptions('webcomponents')))
{
Factory::getDocument()->addScriptOptions('webcomponents', [$potential]);
}

}

/**
Expand Down
26 changes: 14 additions & 12 deletions media/system/js/core.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -939,28 +939,30 @@ Joomla.editors.instances = Joomla.editors.instances || {
};

/* Load web components async */
var loadWC = function (wc) {
var el, p, es5;
for (p in wc) {
if (wc.hasOwnProperty(p)) {
if (wc[p].match(/\.js/g)) {
el = document.createElement('script');
var loadWC = function () {
var wc = Joomla.getOptions('webcomponents');

if (wc.length) {
wc.forEach(function(component) {
if (component.match(/\.js/g)) {
var el = document.createElement('script');
if (!checkES6()) {
var es5;
// Browser is not ES6!
if (wc[p].match(/\.min\.js/g)) {
es5 = wc[p].replace(/\.min\.js/g, '-es5.min.js')
} else if (wc[p].match(/\.js/g)) {
es5 = wc[p].replace(/\.js/g, '-es5.js')
if (component.match(/\.min\.js/g)) {
es5 = component.replace(/\.min\.js/g, '-es5.min.js')
} else if (component.match(/\.js/g)) {
es5 = component.replace(/\.js/g, '-es5.js')
}
el.src = es5;
} else {
el.src = wc[p];
el.src = component;
}
}
if (el) {
document.head.appendChild(el);
}
}
});
}
};

Expand Down
2 changes: 1 addition & 1 deletion media/system/js/core.min.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion templates/cassiopeia/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
HTMLHelper::_('stylesheet', 'user.css', array('version' => 'auto', 'relative' => true));

// Alerts progressive enhancement
HTMLHelper::_('webcomponent', ['joomla-alert' => 'vendor/joomla-custom-elements/joomla-alert.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);
HTMLHelper::_('webcomponent', 'vendor/joomla-custom-elements/joomla-alert.min.js', ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);

// Load specific language related CSS
HTMLHelper::_('stylesheet', 'language/' . $lang->getTag() . '/' . $lang->getTag() . '.css', array('version' => 'auto'));
Expand Down
2 changes: 1 addition & 1 deletion templates/cassiopeia/offline.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
HTMLHelper::_('stylesheet', 'offline.css', ['version' => 'auto', 'relative' => true]);

// Alerts progressive enhancement
HTMLHelper::_('webcomponent', ['joomla-alert' => 'vendor/joomla-custom-elements/joomla-alert.min.js'], ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);
HTMLHelper::_('webcomponent', 'vendor/joomla-custom-elements/joomla-alert.min.js', ['relative' => true, 'version' => 'auto', 'detectBrowser' => false, 'detectDebug' => false]);

// Template color
if ($this->params->get('templateColor'))
Expand Down