[SOLUCIONADO] Problemas con Tinymce 4 y pestaña code (<>)

manyblue · #1 (**permalink**) 01/09/2014, 13:14

Ante todo un saludo a todos.

He usado tiny desde hace tiempo, la última versión que tenia era la 3, en esta página que estoy haciendo he usado la versión 4 y como el título dice estoy teniendo problema con la pestaña de code (<>).
Intento meter este código javascript:

Código HTML:

<script type="text/javascript">
 var redirectAndroid = function() {
 window.top.location.href = '<?php echo $row_ConsultaPlayerPortada['rtsp_player_portada']; ?>';
 } 
</script> 
<div id="myElement">Cargando Player ...........</div>
  <script type="text/javascript">
  if ((navigator.userAgent.match(/Android/i)) || (navigator.userAgent.match(/BlackBerry/i))) {
   document.write('<img src="DB_files/player_portada/imagen_2/<?php echo $row_ConsultaPlayerPortada['imagen_2_player_portada']; ?>" onclick="redirectAndroid();" />');
}else {
    jwplayer("myElement").setup({
    playlist: [{
        image: "DB_files/player_portada/imagen_1/<?php echo $row_ConsultaPlayerPortada['imagen_1_player_portada']; ?>",
        sources: [{ 
            file: "<?php echo $row_ConsultaPlayerPortada['rtmp_player_portada']; ?>"
        },{
            file: "<?php echo $row_ConsultaPlayerPortada['http_ios_player_portada']; ?>"
        }] 
    }], 
  sharing: {
        code: encodeURI("<iframe src='http:/www.midominio.com/jwplayerNacho/index_player_full_2.html' />"),
        link: "http:/www.midominio.com/jwplayerNacho/index_player_full_2.html"
        },
  fallback: "true", 
  primary: "flash",
  autostart: "false",
  wmode: 'opaque',
  allowscriptaccess: "always",
  aspectratio: "16:9",
  height: 285,
  width: 485
});
}
  </script>

Pero el hijo....... me introduce en la base de datos este otro código:

Código HTML:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>
<script>// <![CDATA[
 var redirectAndroid = function() {
 window.top.location.href = '<?php echo $row_ConsultaPlayerPortada['rtsp_player_portada']; ?>';
 } 
// ]]></script>
</p>
<div id="myElement">Cargando Player ...........</div>
<p>
<script>// <![CDATA[
  if ((navigator.userAgent.match(/Android/i)) || (navigator.userAgent.match(/BlackBerry/i))) {
   document.write('<img src="DB_files/player_portada/imagen_2/<?php echo $row_ConsultaPlayerPortada['imagen_2_player_portada']; ?>" onclick="redirectAndroid();" />');
   }
 else {
    jwplayer("myElement").setup({
    playlist: [{
        image: "DB_files/player_portada/imagen_1/<?php echo $row_ConsultaPlayerPortada['imagen_1_player_portada']; ?>",
        sources: [{ 
            file: "<?php echo $row_ConsultaPlayerPortada['rtmp_player_portada']; ?>"
        },{
            file: "<?php echo $row_ConsultaPlayerPortada['http_ios_player_portada']; ?>"
        }] 
    }], 
   sharing: {
         code: encodeURI("<iframe src='http:/www.midominio.com/jwplayerNacho/index_player_full_2.html' />"),
         link: "http:/www.midominio.com/jwplayerNacho/index_player_full_2.html"
        },
  fallback: "true", 
  primary: "flash",
  autostart: "false",
  wmode: 'opaque',
  allowscriptaccess: "always",
  aspectratio: "16:9",
  height: 285,
  width: 485
});
}
  
// ]]></script>
</p>
</body>
</html>

Los problemas vienen que me sustitulle esto "<script type="text/javascript">" por esto otro "<script>// <![CDATA[" y "</script>" por "// ]]></script>" comparad los dos códigos y lo vereis.

Por este motivo no se ve el player y ya no se como solucionarlo, he intentado mogollon de cosas.

La gracia es que con la versión 3 que usaba, lo único que hace tinymce es poner el códogo del script correctamente pero dentro de un párrafo <p></p>

Esto me está fastidiando mogollon pues es un campo de texto que a veces debo introducir el código de jwplayer en javascript y ótras el código de youtube que es un <iframe> dependiendo de la zona de la web.

Muchísimas gracias de antemano.
Un saludo: manyblue

manyblue · #2 (**permalink**) 02/09/2014, 02:54

Un saludo a todos.
Bueno pues parece ser que últimamente nadie responde a mis post y me lo tego que guisar y comer yo solo.
No pasa nada, como no me gusta dejar los post sin solución, ahí va la respuesta que es tan simple que se me paso.

Para eliminar los tags de html en el botón code, solo es necesario comentar esta línea:
//"save table contextmenu directionality emoticons template textcolor paste fullpage textcolor".

Código:

<script src="../includes/tinymce/js/tinymce/tinymce.dev.js"></script>
<script src="../includes/tinymce/js/tinymce/plugins/table/plugin.dev.js"></script>
<script src="../includes/tinymce/js/tinymce/plugins/paste/plugin.dev.js"></script>
<script src="../includes/tinymce/js/tinymce/plugins/spellchecker/plugin.dev.js"></script>
<script>
	tinymce.init({
	    language : 'es',
		selector: "textarea",
		convert_urls : false,
		theme: "modern",
		plugins: [
			"advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker",
			"searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
			//Este plugin es para poner en el code <html><head></head><body></body></html>
			//"save table contextmenu directionality emoticons template textcolor paste fullpage textcolor"
		],
		external_plugins: {
			//"moxiemanager": "/moxiemanager-php/plugin.js"
		},
		content_css: "css/development.css",
		add_unload_trigger: false,
		autosave_ask_before_unload: false,

		toolbar1: "save newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect",
		toolbar2: "cut copy paste pastetext | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor image media help code | inserttime preview | forecolor backcolor",
		toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft | insertfile insertimage",
		menubar: false,
		toolbar_items_size: 'small',

		style_formats: [
			{title: 'Bold text', inline: 'b'},
			{title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
			{title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
			{title: 'Example 1', inline: 'span', classes: 'example1'},
			{title: 'Example 2', inline: 'span', classes: 'example2'},
			{title: 'Table styles'},
			{title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
		],

		templates: [
			{title: 'My template 1', description: 'Some fancy template 1', content: 'My html'},
			{title: 'My template 2', description: 'Some fancy template 2', url: 'development.html'}
		]
	});
</script>

Ahora cuando uso el boton code, tiny solo me pone el código entre párrafo <p></p>
Muchas gracias a todos y doy por cerrado el post.
Un saludo: Manyblue

Bier · #3 (**permalink**) 03/09/2014, 19:15

Muy intersante,

Creo el detalle es la poca gente que utiliza esta herramienta.
Yo tengo 2 días que inicié a probar y he batallado en detalles.

No encuentro como cambiar el color de la fuente.

¿Podrías compartirme algo de tu avance?.. me interesa en particular como agregar los plugins que veo en tu código.

Saludos

Bier · #4 (**permalink**) 03/09/2014, 19:30

Ya encontré como cambiar el color del texto.

textcolor -- en Plugins

Bier · #5 (**permalink**) 03/09/2014, 19:31

Ahora lo que deseo es tener mi propio CSS e incluir mis propias reglas...
He leido e intentado algunas opciones que se comentan sin éxito.

Bier · #6 (**permalink**) 03/09/2014, 20:12

Ya logré mis estilos con:

style_formats: [
{title: 'Bold text', inline: 'b'},
{title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
{title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
{title: 'Example 1', inline: 'span', classes: 'example1'},
{title: 'Example 2', inline: 'span', classes: 'example2'},
{title: 'Table styles'},
{title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
],

manyblue · #7 (**permalink**) 11/09/2014, 02:28

Bier, es cuestión de ir viendo el código de los diferentes archivos de Tinymce e ir puliendolo a tu gusto. Yo he eliminado algún plugin que no me interesaba y cambiando algo el css, pero te repito es cuestion de verlo
Perdona por no contestarte antes pero he estado fuera de mi casa.
Si necesitas algo más ya sabes.
Un saludo: Manyblue

Bier · #8 (**permalink**) 11/09/2014, 06:28

Cita:

Iniciado por manyblue

Bier, es cuestión de ir viendo el código de los diferentes archivos de Tinymce e ir puliendolo a tu gusto. Yo he eliminado algún plugin que no me interesaba y cambiando algo el css, pero te repito es cuestion de verlo
Perdona por no contestarte antes pero he estado fuera de mi casa.
Si necesitas algo más ya sabes.
Un saludo: Manyblue

Muchas gracias Manyblue...

¿recuerdas como has cambiado el CSS?

Saludos

manyblue · #9 (**permalink**) 11/09/2014, 13:19

Estoy usando la última versión estable de timymce que si mal no recuerdo es la 4.1.1
Cuando me lo descargo, dentro vienen tres carpetas o directorios y cinco archivos:

js
tests
tools
changelog.txt
Jakefile.js
LICENSE.TXT
package.json
readme.md

En "js/tinymce/skins/lightgray/" hay cuatro css:
content.inline.min.css
content.min.css
skin.ie7.min.css
skin.min.css

En "tests/coverage/js/" hay un archivo css:
reporter.css

En "tests/js/qunit/" hay dos archivos css;
qunit.css
testrunner.css

En "tests/manual/css/" hay cuatro archivos css:
custom_theme_content.css
development.css
gecko_caret.css
noneditable_manual.css

En "tests/tinymce/ui/css/" hay un archivo css:
ui-overrides.css

Estos son los archivos css que existe y hay que entrar en el o los que quieras cambiar por lo que tienes que decidir que vas a cambiar para poderte dirigir al css correcto.

Un saludo: manyblue

Bier · #10 (**permalink**) 12/09/2014, 03:05

Cita:

Iniciado por manyblue

Bier, es cuestión de ir viendo el código de los diferentes archivos de Tinymce e ir puliendolo a tu gusto. Yo he eliminado algún plugin que no me interesaba y cambiando algo el css, pero te repito es cuestion de verlo
Perdona por no contestarte antes pero he estado fuera de mi casa.
Si necesitas algo más ya sabes.
Un saludo: Manyblue

Muchas gracias Manyblue...

¿recuerdas como has cambiado el CSS?

Saludos

Muchas gracias