Historique de la page

...

• Une solution consiste à dimensionner dynamiquement l'iframe de la taille de la fenêtre du navigateur pour éviter l'ascenseur pour la page.
• Une autre solution consiste à dimensionner dynamiquement l'iframe de la taille du contenu de l'iframe pour éviter l'ascenceur de la iframe. Cette solution permet d'afficher les iframes de la même façon que les autres canaux, mais cette solution est plus complexe car elle nécessite de forcer le document.domain d'ajouter un js dans les pages de l'application ou d'utiliser un reverse proxy.

...

Au niveau du (ou des skins) dans le fichier skin.xml ajouter :

<js>javascript/iframe-resize-plugins.js</js>

Mettre le fichier iframe-resize-plugins.js dans le dossier "javascript" du skin (ex : custom/uPortal/uportal-war/src/main/webapp/media/skins/universality/common/javascript/)

/*********************************************

Resize d'iframe

*********************************************/
(function($){
    $(document).ready(function(){

        var resizeFrames = function() {
            $('iframe').each(function(){
                var height_window = $(window).height();

                // do not open other iframe
                // direct child of up-portlet-content-wrapper-inner
                if($(this).parent().get(0).className == 'up-portlet-content-wrapper-inner') {
                    newHeight = height_window-210;
                    this.height=newHeight+"px";

                    $('#portalPageFooter').hide();
                }
            });
        }

        $(window).resize(function() {
            resizeFrames();
        });

        resizeFrames();
    });
})(jQuery);

...

Installation

Dans le portail

• ajouter dans le fichier skin.xml :

  Bloc de code
  <js>javascript/use-iframe-autoheight-using-postMessage.js</js>

• mettre le fichier use-iframe-autoheight-using-postMessage.js dans le dossier "javascript" du skin (ex : custom/uPortal/uportal-war/src/main/webapp/media/skins/universality/common/javascript/)

...

Ajouter dans les pages (dans le header ou footer ou ...) :

<script src="http://xxx.univ.fr/zzz/postMessage-resize-iframe-in-parent.js" />

Une fonctionnalité supplémentaire pour l'intégration en iframe est la possibilité d'avoir du CSS spécifique quand l'application est intégrée en iframe. Pour cela, il faut mettre

<script type="text/javascript">
window.cssToLoadIfInsideIframe = "https://esup-data.univ-paris1.fr/esup/canal/css/XXXX.css";
</script>
<script src="https://esup-data.univ-paris1.fr/esup/outils/postMessage-resize-iframe-in-parent.js"></script>