Dopo svariate ricerche, sono riuscito a trovare risposta: Sì è possibile.

Tramite alcuni piccoli cambiamenti, è possibile far coesistere i due framework. Il problema, principalmente è la variabile “$” che è dichiarata, per entrambi, come funzione di default.

Per ovviare al problema, è possibile utilizzare questa sintassi:

1. Nell’head della pagina, includere “prima” lo script di jQuery: 

<script type=”text/javascript” src=”js/jquery-1.2.6.pack.js”></script>

2. Prima dell’inclusione di prototype dichiarare una variabile a piacere (per es. JQ) come funzione jQuery tramite l’apposita funzione jQuery.noConflict();:

<script type=”text/javascript”>

JQ = jQuery.noConflict();

</script>

3. Successivamente, includere prototype:

<script src=”js/prototype.js” type=”text/javascript”></script>

Il testo completo:

<script type=”text/javascript” src=”js/jquery-1.2.6.pack.js”></script>

<script type=”text/javascript”>

JQ = jQuery.noConflict();

</script>

<script src=”js/prototype.js” type=”text/javascript”></script>

In pratica, utilizziamo la variabile JQ come funzione di jQuery, e prototype come sempre $.

Per utilizzare jQuery, per esempio, possiamo richiamarlo così: 

JQ(document).ready(function() { alert(“jQuery funziona correttamente!”); }

Mentre per prototype:

alert(“Anche prototype funziona correttamente! Ecco un esempio prendendo un valore da un campo input: “+$(‘id_form’).getValue());

Leggendo in rete, tutti sapranno che sono state introdotte molte migliorie e altrettante “restrizioni” per renderlo più sicuro: l’ultima, dovuta ad un bug del codice, è stata introdotta tramite una patch inserita nella seconda release della 10. Probabilmente avrete già capito di cosa parlo: l’exploit per il Clickjacking.

Ma non tutti sanno che, con l’introduzione di questa patch, è stata messa una ulteriore protezione: stiamo parlando della possibilità di utilizzare la clipboard di sistema (il copia e incolla per capirci ). Come si può leggere in questo articolo, la restrizione riguarda l’uso in ActionScript di Clipboard.generalClipboard.setData e Clipboard.generalClipboard.setDataHandler.

Certo, forse non è una grande perdita, ma per chi utilizza uno script tipo questo il problema si fa di gran lunga più grave.

Lo script citato sopra, è un escamotage per utilizzare in javascript la clipboard su firefox (altrimenti sarebbe da impostare ogni browser come da queste istruzioni). Con l’introduzione, quindi, di flash 10 cio’ non è più fattibile.

Chi ha una soluzione migliore, si faccia sentire

In pratica, come è capitato a me e ad altre persone, quando si clicca su Scrivi (post o articolo che sia) la cpu scatta immediatamente al 100% di utilizzo.

L’errore è nella cache del file di configurazione di TinyMCE che viene scritto sul server (al primo avvio di Scrivi dopo l’aggiornamento di WP) che non è perfettamente compatibile dalla versione 2.5.0 alla versione 2.5.1.

In alcuni post, tra cui questo, si dice che il problema risiede nella configurazione del server: più precisamente l’abilitazione di zlib.output_compression nel php.ini. Ciò non è affatto vero: vediamo qual’è il problema esatto e come risolverlo.

Il vero problema, a quanto ho potuto verificare, risiede nel fatto che alcuni client FTP non impostati correttamente o lasciati con le impostazioni di base, non sostituiscono alcuni files dell’aggiornamento di WP 2.5.1 (tra cui lo script php che genera la cache del file di configurazione di TinyMCE che viene effettivamente scaricato dal browser) e ciò comporta che tale configurazione non è compatibile al 100% con la pagina post-new.php o page-new.php. Lato client (cosa verificato per il momento solo su Firefox) TinyMCE fa andare al massimo la CPU rallentando, di fatto, tutto il sistema fino a freezarlo.

Per risolvere questo inconveniente, basta scaricare il pacchetto completo di WordPress da qui ed aggiornare di nuovo tramite FTP, questa volta sostituendo “tutti” i files presenti.

Il tutto lato-client (in javascript appunto) senza programmare particolari script php che trasformano le stringhe di testo puro nelle entità HTML equivalenti (per esempio i caratteri accentati come le lettere “ò”,”à”,”è”…).

L’installazione e la personalizzazione è estremamente semplice, corredato da un wiki molto completo e pagine di esempi con tutte le possibile personalizzazioni dello script.

Si sa, però, che javscript è lato-client e non può essere utilizzato per effettuare upload su server se non tramite ajax o popup che hanno dietro pagine php programmate per effettuare tali uploads. Ciò rappresenta un problema se abbiamo la necessità di effettuare l’upload e il ridimensionamento di immagini ed inserirle all’interno dell’editor tinymce.

In giro ci sono alcuni plugin per tinymce che fanno questa cosa ma, purtroppo, molti sono a pagamento.

Risolviamo il problema utilizzando uno script open source di nome Ajax File Manager.

Tale script è a se stante e, di base, non vengono fornite spiegazione per integrarlo a TinyMCE, ma viene fornito solamente un pacchetto con TinyMCE e Ajax File Manager incluso.

Il problema del pacchetto è che viene fornito con TinyMCE v. 2.1.2 e Ajax File Manager v. 0.9. Domanda: come facciamo ad avere l’ultima versione di TinyMCE (3.08) e Ajax File Manager (1.0 RC 1)?

Ecco qui come integrare AFM 1.0 Rc1 nella versione 3.08 di TinyMCE.

Scarichiamo l’ultima versione di TinyMCE dalla pagina http://tinymce.moxiecode.com/download.php, scompattiamolo nella root-dir della nostra applicazione (per es. public_html/). Avremo così la cartella public_html/tiny_mce/.

Scarichiamo l’ultima versione di Ajax File manager dalla pagina http://www.phpletter.com/DOWNLOAD/ e scompattiamo il file nella cartella public_html/tiny_mce/plugins/. Avremo così la cartella public_html/tiny_mce/plugins/ajaxfilemanager/.

Per prima cosa impostiamo correttamente il file public_html/tiny_mce/plugins/ajaxfilemanager/inc/config.base.php con i giusti parametri (login, formato file, percorsi).

In particolare, i percorsi ipotizzando che il nostro dominio si chiami www.miodominio.it e le immagini le uploadderemo nella cartella public_html/img con chmod a 777 (avremo anche una cartella session in public_html/session con chmod a 777 per la cache):

/* ……… */
define(‘CONFIG_SYS_DEFAULT_PATH’, ‘../../../img/’);
define(‘CONFIG_SYS_ROOT_PATH’, ‘../../../img/’);
define(‘CONFIG_SYS_FOLDER_SHOWN_ON_TOP’, true);
define(“CONFIG_SYS_DIR_SESSION_PATH”, ‘../../../session/’);
/* ……… */
define(‘CONFIG_WEBSITE_DOCUMENT_ROOT’, ‘/home/utente/public_html/’);
/* ……… */

“Tutti” i percorsi devono avere il percorso relativo alla posizione public_html/tiny_mce/plugins/ajaxfilemanager/ .

Fatto questo possiamo impostare il nostro TinyMCE con le chiamate di callback dovute.

L’esempio di configurazione, di seguito, è standard: leggendo il codice possiamo personalizzarlo come vogliamo.

Nella pagina del form con un input testuale multilinea con l’ipotetico nome id=”input_txt” inseriamo nei tags <script></script> il seguente codice:

<script>
tinyMCE.init({
mode : “textareas”,
theme : “advanced”,
plugins : “inlinepopups,advimage,media”,
theme_advanced_buttons1 : “bold,italic,underline,separator,strikethrough,justifyleft,justifycenter,justifyright,justifyfull,bullist,numlist,undo,redo,link,unlink,image,removeformat,anchor,blockquote,code”,
theme_advanced_buttons2 : “”,
theme_advanced_buttons3 : “”,
file_browser_callback : “ajaxfilemanager”,
theme_advanced_toolbar_location : “top”,
theme_advanced_toolbar_align : “left”,
theme_advanced_statusbar_location : “bottom”,
width : “676″,
height : “300″,
extended_valid_elements : “a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]“,
apply_source_formatting : true,
relative_urls : false,
remove_script_host : false,
document_base_url : “<?=SITE_URL?>”,
languages : “it”,
theme_advanced_resize_horizontal : false,
theme_advanced_resizing : true,
convert_newlines_to_brs : false,
force_br_newlines : false,
force_p_newlines : false
});
function ajaxfilemanager(field_name, url, type, win) {
var ajaxfilemanagerurl = “http://www.miodominio.it/tiny_mce/plugins/ajaxfilemanager/ajaxfilemanager.php”;
switch (type) {
case “image”:
ajaxfilemanagerurl += “?type=img”;
break;
case “media”:
ajaxfilemanagerurl += “?type=media”;
break;
case “flash”: //for older versions of tinymce
ajaxfilemanagerurl += “?type=media”;
break;
case “file”:
ajaxfilemanagerurl += “?type=files”;
break;
default:
return false;
}
var fileBrowserWindow = new Array();
fileBrowserWindow["file"] = ajaxfilemanagerurl;
fileBrowserWindow["title"] = “Ajax File Manager”;
fileBrowserWindow["width"] = “782″;
fileBrowserWindow["height"] = “440″;
fileBrowserWindow["resizable "] = “yes”;
fileBrowserWindow["inline"] = “yes”;
fileBrowserWindow["close_previous"] = “no”;
tinyMCE.activeEditor.windowManager.open(fileBrowserWindow, {
window : win,
input : field_name
});

return false;
}

</script>

Come potete vedere, abbiamo inserito nell’init di TinyMCE il richiamo alla funzione di callback file_browser_callback : “ajaxfilemanager” che fa riferimento alla funzione che abbiamo creato subito dopo.

Da notare che la variabile ajaxfilemanagerurl nella funzione ajaxfilemanager deve contenere l’url assoluto al file ajaxfilemanager.php.

Fatto questo possiamo caricare la pagina con il form via web e cliccare, quando abbiamo bisogno di inserire un’immagine, sull’icona IMMAGINE di tinymce e, successivamente quando ha caricato la popup del gestore immagini, clicchiamo sull’icona di fianco a Image Url e si aprirà la finestra di Ajax File Manager.