Afficher une zone fictive en JavaScript

**gtraxx** · 19/12/2010, 23h09

Bonsoir,
j'ai développez un plugin pour l'insertion de vidéos YouTube valide w3c avec les paramètres des vidéos.
Ce plugin fonctionne plutôt bien mais il me reste une toute petite partie sur lequel je ne trouve aucune information.
Je vous explique le principe, on place l'url de la vidéo dans un champ de la popup du plugin ensuite on clique sur "insérer".
Jusque la tout est nickel, cependant dans l'éditeur on aperçoit un gros carrer blanc puisque le code de la vidéo est placer dans une div.
seulement sa donne un gros carrer blanc et je souhaite au moins visuellement afficher quelque chose, une phrase, une image que sais je mais ma question est sans aucune doute comment faire ?
Je ne sais par ou commencer, le plugin fonctionne mais au niveau visuel dans l'éditeur après insertion c'est plutôt bancal.

Mon plugin se présente comme ceci :

**gtraxx** · 24/03/2011, 09h50

Bonjour à tous, je ne comprend toujours pas comment faire une simple ligne dans l’éditeur mais uniquement à titre visuel.
Une idée pour me mettre sur la piste, un petit exemple pour faire une simple ligne visible uniquement dans l'éditeur.
merci

**gtraxx** · 24/03/2011, 23h50

J'ai tenter ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
init : function(ed, url) {
			var t = this;
 
			t.editor = ed;
			// Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceExample');
			ed.addCommand('mceCodeHighLight', function() {
				ed.windowManager.open({
					file : url + '/dialog.htm',
					width : 450 + parseInt(ed.getLang('codehighlight.delta_width', 0)),
					height : 400 + parseInt(ed.getLang('codehighlight.delta_height', 0)),
					inline : 1
				}, {
					plugin_url : url, // Plugin absolute URL
					some_custom_arg : 'custom arg' // Custom argument
				});
			});
 
			// Register example button
			ed.addButton('codehighlight', {
				title : 'codehighlight.desc',
				cmd : 'mceCodeHighLight',
				image : url + '/img/codehighlight.png'
			});
 
			// Add a node change handler, selects the button in the UI when a image is selected
			ed.onNodeChange.add(function(ed, cm, n) {
				cm.setActive('codehighlight', n.nodeName == 'IMG');
			});
			ed.onVisualAid.add(t._visualAid, t);
		},
		// Private methods
		_visualAid : function(ed, e, s) {
			var dom = ed.dom;
			tinymce.each(dom.select('pre', e), function(e) {
				if (s)
					dom.addClass(e, 'mceItemMedia mceItem');
				else
					dom.removeClass(e, 'mceItemMedia mceItem');	
			});
		},

Le problème c'est qu'il génère bien ce que je souhaite (plus ou moins) mais il insert réellement la classe mceItem et donc si j'enregistre il garde cette classe.
Hors ce n'est que pour un visuel à l'intérieur de l'éditeur, je m'y perd un peu avec l'API de tinyMCE