[Jetpack] Desarrollo de add-on

Hola,

Estoy desarrollando un add-on haciendo uso de jetpack.
Actualmente tengo un widget que abre un panel y carga en él un HTML, desde exte HTML abro un nueva pestaña en la cual cargo un HTML que tengo como recurso en local (en la carpeta data), este último HTML tiene dos cajas de texto y boton, al presionar el boton quisiera poder guardar los values de las cajas de texto haciendo uso del módulo “simple-storage”, pero desde el javascript que cargo en el HTML me es imposible incluso hacer postmessage al main.js, en el cual si tengo acceso al módulo simple-storage.

Alguien tiene experiencia en el desarrollo de add-on con jetpack?

Muchas gracias de antemo.

Dejame preguntarte como cargaste el script desde donde estas intentado el postmessage directamente en el html de la nueva pestaña que abriste o cuando creaste la pestaña en el main.js mediante el contentScript?

Perdon es la costumbre que todo tenga contentScript lo que tienes que hacer es asociarle un page-mod a esa pagina y cuando contruyes ese page mod le defines un contentScript y es el que va a poder enviar por postmessage al main.js de todas formas revisa la documentacion del modulo tab jetpack.mozillalabs.com/sdk/1.0 … /tabs.html ahi hay un ejemplo de como se construye ese page mod asociado

Saludos

Gracias por la respuesta.

Finalmente lo solucioné usando un tab.open() y en el evento onReady realizo un tab.attach() para cargar mis contentScripts desde los cuales realizo un postMessage() para guardar los datos usando el modulo “simple-storage”.

Ahora tengo otro problema que quizás me puedas ayudar:

En el panel cargo un HTML que modifico de forma dinámica con JQuery, mi problema es que cuando cambio de tab y vuelvo a hacer click sobre el widget que abre el panel me abre el mismo HTML, no me recarga el contenido.
Es posible recargar el contenido del panel en la asignación de la propiedad contentURL del pnael?

Muchas gracias de antemano.

Un saludo,
Álvaro.

Es muy probable que si cambias el contentURL aunque sea con la misma direccion eso recargue el html pero tambien podrias hacer que al terminar lo que estas haciendo se ejecute en tu js una funcion de reset que lleve todo a cero

Hola,

La idea era cambiar de forma dinámica la asignación del valor del contentURL del panel…para ello en el evento onShow() del panel intento cargar el HTML en el contentURL pero no funciona, alguien ha conseguido algo parecido?

Gracias.

hiciste el cambio del contentURL usando self.contentURL dentro del onShow() o usaste contentURL normal? intenta la primera forma

Hola,
Te adjunto parte del código para que veas lo que hago:

const widgets = require(“widget”);
const data = require(“self”).data;
const tabs = require(“tabs”);
const pageMod = require(“page-mod”);
const ss = require(“simple-storage”);

var opt_url = data.url(“options.html”);
var opt_js = data.url(“js/options.js”);
var jq_js = data.url(‘js/jquery-1.4.4.min.js’);
var kcy_js = data.url(‘js/kcy.js’);
var pop_url = data.url(“popup.html”);

exports.main = function(options, callbacks) {
var view = require(“panel”).Panel({
width: 370,
height: 540,
contentURL: pop_url,
contentScriptFile: [data.url(‘js/jquery-1.4.4.min.js’),
data.url(‘js/karma.js’),
data.url(‘js/kcy.js’)],
contentScriptWhen: ‘ready’,
onShow: function(event){
console.log("La url ------------>>>>>>> " + view.contentURL);
self.contentURL = opt_url;
console.log("La url ------------>>>>>>> " + view.contentURL);
},
});

He probado lo que me comentas del self.contentURL pero me da el siguiente error:

self.contentURL = opt_url;
ReferenceError: self is not defined

Muchas gracias por tu tiempo.

Un saludo,
Álvaro.

creo que ya respoindieron a tu pregunta aqui si haces el cambio del contenido del panel ya no puedes usar el contentScript para enviar un mensaje a main.js tienes que usar el contenido original del panel y devolverlo al estado original en todo caso
aqui esta la respuesta que le dieron a otro groups.google.com/group/mozilla- … 6dbb033bc#

tal vez tu mejor opcion seria utilizar un iframe dentro del panel para evitar cambiar el contenido del panel pero usar un iframe que ocupe todo el tamaño del panel asi puedes cambiar el contenido en el onshow

una cosa extra veo que estas cambiando el contenido del panel por tu pagina de opciones para el complemento pero no te serviria para mostrar esa pagina abrir una nueva pestaña y mostrar ahi las opciones?

Hola,

Si realmente así lo hago, esto era una prueba para ver si podía cambiar de forma dinámica el contentURL.
Realmente lo que tengo es un widget que abre un panel donde cargo un HTML que muestra contenido que cambia en función del “tab” activo en el momento de abrirle, por eso necesito hacer un reload del contentURL cada vez que hago “click” en el widget.
Intentaré realizar lo que comentas del Iframe.

Muchas gracias.

Un saludo.

Bueno parece que por fin veo la luz :wink:

He probado como comentaste el uso del Iframe para recargar el contenido del mismo cada vez que muestro el panel y funcion perfectamente.
Lo único es que al usar JQuery , ahora estoy obligado A cambiar el acceso a los componentes, ya que esta todo dentro del Iframe.
Pero hasta que desde Jetpack,no nos den otra solución para cargar dinámicamente contenido en el panel si perder el acceso a los contentScripts, esta es una opción más que válida.

Muchas gracias por todo.

Un saludo,