Pausar Ejecucion de JS

[ClubIce]

Hola,

tengo una duda, nesesito que la ejecucion del script se pause durate un tiempo, en este tiempo nose pueda ejecutar ningun otra funcion.

[zerokilled]

¿algo como sleep en php? pues jamas he visto alguna instruccion en javascript para detener la ejecucion salvo las ventanas modales: alert, confirm, prompt. pero en javascript tampoco se puede autoreponsder una ventana modal. de momento, lo unico que se me ocurre es dividir el codigo en partes para ser invocado por setTimeout pero a mi jucio el codigo no quedara "elegante".

[zerokilled]

un tema que encontre haciendo busqueda en google con terminos javascript sleep. no lo he leido detenidamente pro quizas te ayude. http://www.daniweb.com/forums/thread47199.html

[ClubIce]

ya revise la pagina y el metodo que usan no es lo que yo esperaba. por lo que veo es que la unica forma es usando setTimeot, pero ahora el problem es como hago para aplicar eso en el siguiente script

Código Javascript:

//El script es demaciado largo, por eso solo mostrare la funcion que hace que el script funcion
//la funcion showText muestra un texto convertido en imagen dentro de un div. Como el espacio
//del div es limitado tengo que hacer varios showText para mostrar todo el texto:
function z1_s1() {
  showText("blablablablablabla",Red) //Red es el nombre del estilo de la imagten a utilizar
  showText("blablablablablabla",Red)
  showText("blablablablablabla",Red)
  showText("blablablablablabla",Red)
  //el problema es que el showText sobrescribe el anterior de tal forma que se ba a mostrar el 
  //ultimo showText, ahora como hago para que JS espere que el usuario haya precionada un
 //tecla para que pase el siguiente showText???
}
 

[zerokilled]

en este caso no creo que setTimout sea la solucion ya que requieres que pase a la proxima instruccion por accion del usuario. asi de momento, lo que se me ocurre es una funcion que se encarga de invocar tus funciones, pero una a una. estas funciones estan almacenada en un array. en cada llamada de esta funcion se invoca una sola funcion del array y se elimina del array. no es la mejor forma de escribirlo pero si de ilustrarlo, por ejemplo:

Código:

var funciones = [function(){
// si tu funcion requiere parametros, creas funciones anonimas como en este ejemplo;
// y dentro de esa funcion haces la invocacion con los argumentos necesarios;
alert('primera funcion');
},
function(){
alert('segunda funcion');
},
function(){
alert('tercera y ultima funcion');
}
];

function caller(){
try{
funciones.shift()();
}catch(e){}
}

caller vendria siendo la funcion que debe invocarse cuando el usuario requiera pasar al proximo.

[ClubIce]

no entendi muy bien la funcion caller(), me podrias esplicar mejor?

[zerokilled]

ademas del codigo que mostre, agrega lo siguiente. lo cargas en el navegador y luego vas haciendo click. veras que cada vez que caller se invoca, en este caso por medio del evento onclick, dentro de caller se invoca las funciones que antes defini en el array. en cada invocacion de caller se invoca una funcion distinta.

Código:

self.onclick = caller;

lo mismo puede aplicarse el boton que tendra el usuario. o al control que vayas a proveerle al usuario.

[ClubIce]

bueno, creo que ya entendi y como puedo modificarlo, ahora para evitar hacer mas post quiero que me ayudes en el siguiente script

Código Javascript:

Sprite=function(image,width,height,hmargin,vmargin,hspace,vspace,rows,cols) {
 this.numItems=rows*cols;
 image=new Image().src=image;
 this.frames=new Array();
 for (i=0; i<cols; i++) {
  for (j=0; j<rows; i++) {
   x=hmargin+(width*j)+(hspace*j)
   y=vmargin+(height*i)+(vspace*i)
   this.frames[i*cols+j]={image:image,width:width,height:height,x:x,y:y}
  }
 }
}
 
Animation=function(spr,spd) {
 this={
  sprite:spr,
  speed:spd,
  frames:[]
 };
}
Animation.prototype={
 addFrame: function (id) {
  spr=this;
  this.frames[frames.length]={
   id:id,
   sprite:"url('"+spr.sprite.image.src+"') "+spr.sprite.frames[id].x+"px "+spr.sprite.frames[id].y+"px;"
  }
 },
 drawAnimation:function (container, id) {
  image=createElement('img')
  image.setAtributte('src','empy.gif')
  image.setAtributte('style',"background:"+this.frames[0].sprite)
  image.setAtributte('class','animation')
  image.setAttribute('id',id)
  container.appendChild(image)
  this.id=id
  this.Play();
 }
}
 

la consola de erroes me dice:

Error: invalid assignment left-hand side
Línea: 19, columna: 5
Código fuente:
this={

no se que es lo que causa el error ya he intentado muchas cosas

PS: perdon por los errores del script, es que es hecho a mano

[zerokilled]

el problema esta en la funcion Animation. hay varias razones para que suceda dicho error pero en este caso es porque estas intentando asignar un valor directamente al objeto this. a mi entender, tu quieres inicializar this con un objeto que ya tiene las propiedades declaradas. no estoy muy claro porque nunca lo he realizado de esa manera, pero creo que no puedes hacerlo asi porque this es un objeto reservado para ese constructor.

tienes dos opciones: al estilo vieja escuela, o creas una funcion que inicialice this pasandole un objeto. quizas la segunda opcion parece estupida, pero veremos. la vieja escuela es la forma comun y corriente.

Código:

function(){
this.nombre = valor;
// se repite tantas veces sea necesario inicializar el objeto;
...
}

la otra opcion, es una funcion que itera por las propiedades de un objeto y se van asignando al objeto this. quizas algo como sigue:

Código:

Object.prototype.initialize = function(init){
for(var prop in init)if(init.hasOwnProperty(prop)) this[prop] = init[prop];
}

// se usa de la siguiente manera;
Animation = function(sprite, speed){
this.initialize({spr: sprite, spd: speed, frame:[]});
}

[ClubIce]

Gracias por tu ayuda t etendre n cuentra

[ClubIce]

Hola, aqui estoy de nuevo, ya estoy arreglando el anterior script y se me presenta un error:

Código Javascript:

Animation=function(spr,spd) {
 this.initialize({
  sprite:spr,
  speed:spd,
  frames:[]
 });
}
Animation.prototype={
 addFrame: function (id) {
  spr=this
  this.frames[frames.length]={
   id:id,
   sprite:"url('"+spr.sprite.image.src+"') "+spr.sprite.frames[id].x+"px "+spr.sprite.frames[id].y+"px;"
  }
 },
 drawAnimation:function (container, id) {
  image=document.createElement('img')
  image.setAttribute('src','empy.gif')
  image.setAttribute('style',"background:"+this.frames[0].sprite)
  image.setAttribute('class','animation')
  image.setAttribute('width',this.sprite.width)
  image.setAttribute('height,this.sprite.height')
  image.setAttribute('id',id)
  container.appendChild(image)
  this.id=id
  this.Play();
 }
}
avatar=new Sprite('sprites/avatars/ash_walking.gif',28,38,0,0,0,2,3,4);
aniAvatar=new Animation(avatar,5);
aniAvatar.addFrame(0);
 

al ejecutarlo me muestra el siguiente error:
Error: spr.sprite.image is undefined
Archivo de origen: http://localhost/icepokemon/index.htm
Línea: 35

en realidad es que no se como acceder a this.sprite.image.src dentro de otra la inicializacion de otro???

[zerokilled]

¿que tipo de dato es spr..sprite.image? aparentemente no estas pasando el valor correcto cuando creas una instancia de Animation.

[ClubIce]

con la funcion Sprite() recibo el dato como url y luego lo combierto en Image(), depues lo paso como Sprite a Animation, luego en animation nesesito obtener la url del image()

[zerokilled]

si bien entiendo, tu creas una instancia de Sprite. luego esa instancia se la pasas como argumento a Animation. bien, si vuelve al mensaje #8 en la linea #3 de tu codigo estas creando una variable llamada image en lugar de crear una propiedad image para la clase Sprite.

[ClubIce]

hay, por todos los cielos, simpre se me olvidan estos detalles.
de nuevo gracias por tu ayuda