Multi-stage Docker image that: - Builds lagaufre.js v2 widget from suitenumerique/integration source (context must be sunbeam/ root; see sunbeam build integration) - Serves the widget, official La Suite SVG logos, custom logos for drive/mail/people, and a v1-compat gaufre.js wrapper via nginx gaufre.js reveals the ui-kit GaufreButton (adds lasuite--gaufre-loaded to <html>), loads the v2 widget, and wires button clicks via event delegation to survive React hydration replacing the initial DOM element. services.json is the only runtime-variable file; it is mounted from the integration-config ConfigMap which contains the deployed service list with DOMAIN_SUFFIX substituted at apply time.
55 lines
2.2 KiB
JavaScript
55 lines
2.2 KiB
JavaScript
/**
|
|
* O Estúdio — La Gaufre v1 compatibility wrapper.
|
|
*
|
|
* Loaded by people-frontend via the URL rewritten by nginx sub_filter.
|
|
* Responsibilities:
|
|
* 1. Add "lasuite--gaufre-loaded" to <html> so the GaufreButton becomes visible.
|
|
* 2. Dynamically load the lagaufre.js v2 widget from the same origin.
|
|
* 3. Wire button clicks via event delegation — survives React hydration
|
|
* replacing the initial SSR'd DOM element.
|
|
*
|
|
* No DOMAIN_SUFFIX baked in — the integration origin is derived from this
|
|
* script's own src URL at runtime, so the same image works in every environment.
|
|
*/
|
|
(function () {
|
|
'use strict';
|
|
|
|
// Reveal the GaufreButton immediately (synchronously, before anything else).
|
|
// @gouvfr-lasuite/ui-kit hides .lasuite-gaufre-btn until this class is present.
|
|
document.documentElement.classList.add('lasuite--gaufre-loaded');
|
|
|
|
// Derive the integration service origin from this script's URL.
|
|
var origin = (function () {
|
|
var s = document.querySelector('#lasuite-gaufre-script');
|
|
return (s && s.src) ? new URL(s.src).origin : window.location.origin;
|
|
})();
|
|
|
|
var widgetReady = false;
|
|
|
|
// Load the lagaufre v2 widget. We do NOT pass buttonElement to avoid
|
|
// holding a stale reference after React hydration replaces DOM nodes.
|
|
// Button clicks are handled via event delegation below instead.
|
|
var script = document.createElement('script');
|
|
script.src = origin + '/api/v2/lagaufre.js';
|
|
script.onload = function () {
|
|
window._lasuite_widget = window._lasuite_widget || [];
|
|
window._lasuite_widget.push(['lagaufre', 'init', {
|
|
api: origin + '/api/v2/services.json',
|
|
label: 'O Estúdio',
|
|
closeLabel: 'Fechar',
|
|
newWindowLabelSuffix: ' · nova janela',
|
|
}]);
|
|
widgetReady = true;
|
|
};
|
|
document.head.appendChild(script);
|
|
|
|
// Event delegation — listens on document (bubbling) so it works regardless
|
|
// of which element React hydration puts in the DOM after page load.
|
|
document.addEventListener('click', function (e) {
|
|
if (!widgetReady) return;
|
|
if (!e.target.closest('.js-lasuite-gaufre-btn')) return;
|
|
window._lasuite_widget = window._lasuite_widget || [];
|
|
window._lasuite_widget.push(['lagaufre', 'toggle']);
|
|
});
|
|
})();
|