Un bouton pour toggler le fullscreen puisque le plugin CodeMirror est deja actif

formulaires/editer_squelette.html

@@ -61,7 +61,10 @@
 						<:skeleditor:label_code:><em class="infos">[(#ENV{date}|affdate)[ (#ENV{date}|heures)h][(#ENV{date}|minutes)][- (#ENV{size}|taille_en_octets) ]]</em>
 					</label>[
 					<span class='erreur_message'>(#ENV**{erreurs}|table_valeur{code})</span>]
-					<div class="codewrap[ (#ENV{editable}|non)readonly] h-100"><textarea[ (#ENV{editable}|non)readonly='readonly'] name='code' class='no_barre[ (#ENV{editable}|non)readonly] h-100' id='code' cols='80' rows='25'>[(#ENV**{code})]</textarea></div>
+					<div class="codewrap[ (#ENV{editable}|non)readonly] h-100">
+						<textarea[ (#ENV{editable}|non)readonly='readonly'] name='code' class='no_barre[ (#ENV{editable}|non)readonly] h-100' id='code' cols='80' rows='25'>[(#ENV**{code})]</textarea>
+						<button type="button" onclick="skeleditor.toggleFullScreen(); return false;" class="btn btn_secondaire btn_fullscreen">FS</button>
+					</div>
 		    </div>
 		  </div>
 			]

javascript/codemirror_init.js

@@ -72,6 +72,18 @@ var skeleditor = {
 
 		skeleditor.editor.replaceSelection(replace);
 		skeleditor.search(text);
+	},
+
+	toggleFullScreen: function() {
+		if (skeleditor.editor.getOption('fullScreen')) {
+			skeleditor.editor.setOption('fullScreen', false);
+			jQuery('body').removeClass('skeleditor_fullscreen');
+		}
+		else {
+			skeleditor.editor.setOption('fullScreen', true);
+			jQuery('body').addClass('skeleditor_fullscreen');
+		}
+
 	}
 
 }

prive/style_prive_plugin_skeleditor.html

@@ -72,7 +72,6 @@
 	overflow:hidden;
 }
 
-
 .formulaire_squelette .actions {overflow:hidden;position: absolute;right: 0;top:0;margin-top: -4.5em;}
 .formulaire_squelette .actions .add {float:#GET{left};}
 .formulaire_squelette .actions .context {float:#GET{right};}
@@ -109,6 +108,14 @@
 .formulaire_editer_squelette textarea.readonly {background:#eee;color:#666;}
 .formulaire_editer_squelette .CodeMirror {height: 100% !important;}
 
+.formulaire_editer_squelette .btn_fullscreen {display: none;position: absolute;top:0;right:0;z-index: 1201;overflow:hidden;border:0;text-indent: -10em;background: url(#CHEMIN_IMAGE{se-arrow_out.svg}) no-repeat center;background-size: 100% 100%;}
+.formulaire_editer_squelette .CodeMirror + .btn_fullscreen {display: block}
+
+.skeleditor.skeleditor_fullscreen #bando_haut {visibility: hidden;}
+.skeleditor.skeleditor_fullscreen .formulaire_editer_squelette .btn_fullscreen {position: fixed;background-image: url(#CHEMIN_IMAGE{se-arrow_in.svg});}
+
+
+
 .formulaire_editer_squelette .image-viewer {margin-top: 2rem;}
 .formulaire_editer_squelette .image-viewer .infos {margin-bottom: 1em; text-align: right;}
 .formulaire_editer_squelette .image-viewer .grid {display: flex;width: 100%;justify-content: center;align-items: center;background: url(#CHEMIN_IMAGE{fond-imgs.png}) center repeat;min-height:50vh;margin-bottom: 2rem;}

prive/themes/spip/images/se-arrow_in.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 16 16">
+	<path
+		d="M14.863 0l-4.256 4.256V1.574H9V7h5.426V5.393h-2.682L16 1.137 14.863 0zM1.574 9v1.607h2.682L0 14.863 1.137 16l4.256-4.256v2.682H7V9H1.574z"
+		fill="#ccc"/>
+</svg>

prive/themes/spip/images/se-arrow_out.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" viewBox="0 0 16 16">
+	<path
+		d="M10.574 0v1.607h2.682L9 5.863 10.137 7l4.256-4.256v2.682H16V0h-5.426zm-4.71 9l-4.257 4.256v-2.682H0V16h5.426v-1.607H2.744L7 10.137 5.863 9z"
+		fill="#ccc"/>
+</svg>