Postales

[caricatos]

Hola:

Que tal si hacemos una página para hacer postales digitales ¿ ?
La idea sería tener un recuadro en blanco y una serie de posibles fondos para la postal.
Seguidamente ir insertando objetos (seleccionando diversos temas).
En un principio podríamos ponerlos variando las posiciones y los tamaños, y por último generar la página. (en un textarea)

Creo que para estas navidades es tarde, pero se podría empezar para cualquier próximo evento.

Saludos

[tilu]

Me agrada la idea.

[caricatos]

Hola otra vez:

Puse una página muy sencilla en:http://pepemolina.com/postales/index.html
Tan solo tiene un recuadro amarillo (horroroso) y unos dibujitos que si se pinchan 2 veces se ponen en el recuadro amarillo.

Creo que estaría bien poner un select con temas y que según sea la selección se ponga una tira de dibujos abajo.
No sé si usar frames por los scroll's.
Con los objetos que no son parte del fondo tendría que haber una lista "ordenada" con la posición y el tamaño.

Bueno. Espero sugerencias y ayudas.

Saludos

[RootK]

Hola... una sugerencia.. porque no pones este post, en Proyectos e ideas... creo que ahí sería mucho mas conveniente para que todos aporten.

En mi caso, lo que puedes hacer es por ejemplo tener la pagina principal.. con todos los temas de tus postales... así como una imagen de presentacion... y al momento de pinchar. accesar a dicha categoría.. como ves...???

Bueno... ya lo demas depende de lo que queras utilizar..!!

sAludos y suerte...

[tunait]

Hola Caricatos :)

He estado mirando eso que has dejado colgado, me parece estupendo!

Se supone que el resto de elementos a añadir irán en capas superpuestas ¿no? Lo dificil será que los elementos que vayan sobre los fondos cuadren con todos los fondos.

Con qué lenguaje tienes pensado hacerlo? me refiero para mandarlo a la BD y luego para recuperar los datos y montarlos en la página.

Un saludo grande, Caricatos

[caricatos]

Hola tunait (y resto de foreros):

Perdona que haya tardado en responder, pero siempre pasa alguna cosa (bla, bla, bla... )

Lo de superponer cosas en capas, creo que no será muy difícil (aunque algo trabajoso).

Pensé usar estilos y javascript, aunque en este servidor puedo poner PHP y Perl.

Como me sugirió RootK, puse en "ideas" unas pocas letras sobre el proyecto, pero la única respuesta que hubo se trató de un "despiste" (supongo). La idea sería:
Poner dos paneles con los elementos insertados con algunos controles (de los estilos... posición, tamaño... ) que puedan modificarse con el teclado y el ratón (aunque suena difícil, poniéndose creo que podría hacerse). Y elementos para insertar.
Los elementos para insertar podrían ser gif's con transparencias (incluso de cualquier web)...

Bueno, sigo con el bla, bla...
Si te parece, mantenemos vivo el tema, y vamos poniendo cosas poco a poco. Tengo bastante espacio libre en la web (más de 100 megas)

Sigo esperando sugerencias...

[tunait]

Sip, seguimos en contacto con el tema.

A mi me han mandado algunas colaboraciones para lo mio, y algunas de las "postales" son más bién fondos. La típica imagen que esta en blanco pero con un marco ornamental, ya me entiendes. Sería para que el mensaje escrito quedase sobre la imagen, en vez de debajo de ésta, así que haré una versión que permita superponer el texto a la imagen, probablemente mediante capas. Es decir, parecido a tu idea. Cuando me ponga en ello se me encenderán lucecitas y te cuento!!

Un saludo, Caricatos :)

[caricatos]

Hola otra vez:

Este post lo puse antes del caos (no recuerdo si por el generador o por la charla entre KarlanKas y epa2), y no lo había borrado, pero tiene un script para acomodar capas moviéndolas con el ratón (que no se me olvide el link...) http://www.pepemolina.com/coordes/coordes.html

Seguro que debes tener algo similar entre tus cosas...
En vez de unos textos, podrían desplazarse arbolitos o iconos y con un click "fijarse" en algún sitio, y después buscar otro "dibujito". Supongo que si hay algunos script's y dibus, la página crecerá pronto.

En el div de los dibus, pensaba ponerle scroll.

Bueno, seguimos en contacto. No pienso tener muchas prisas, pero tampoco muchas pausas.

Saludos

[.]

Hola amigos, si en algo puedo servir, cuenten conmigo ;)

[caricatos]

Hola:

Quise seguir haciendo algo, pero me trabé, porque quise poner la ventana en un mínimo de 800 x 600 y no encontré la forma de hacerlo en el explorer 6.
Puse los dibujitos en un div con unas separaciones en azul y un scroll lateral (eso sí que me ha funcionado).
Por ahora solo estoy usando el explorer, pero me gustaría que también funcionasen las cosas en el netscafé. Si algo se ve mal, me gustaría que me lo dijeran.
Los elementos para la selección, los pondré con innerHTML (aún no lo hice).

Bueno. los que quieran colaborar que me envíen dibujitos para colgar. Empecemos por los fondos.

Saludos

P.D.: para Los dibujitos que te hable son con el botoncito de imagen de arriba... ejemplo:

[caricatos]

Hola:

He vuelto a abrir el tema, porque subí una versión con unas modificaciones.

Por ahora solo sigue manteniendo los fondos, pero encima se pueden insertar distintos textos.

Para insertar otros elementos había pensado acomodarlos dentro de tag's div ¿?

A pesar de que seguiré trabajando en ello, sigo esperando más ideas.

Saludos

P.D: el link sigue siendo el mismo: http://pepemolina.com/postales/index.html

[epa2]

Hola a todos, bueno, reconozco que estoy comenzando a aprender javascript y muchos conceptos no los tengo claros, pero intentaré ayudar con sugerencias. mira, me he suscrito al tema porque lo veo muy interesante, luego, he recordado con el baul de los recuerdo tenía algún script que quizás pueda ayudar, por lo que lo he desenpolvado, si se puede utilizar, pues bien,

se trata de mover por la pantalla LO QUE SEA, con el ratón, yo nunca lo he probado pero el que lo hizo dice que funciona (en teoría).

He pensado que quizas en vez de hacer doble clic para las fotos las pulsamos y las arrastramos hacia el escenario(¿igual que flash?)

bueno, ya me dirás si puede ser util

Con este script puedes hacer que el usuario mueva alguna cosa de tu page a cualquier lugar

<script language="JavaScript1.2" type="text/javascript">
I4I5=document.all?1:0; N4=document.layers?1:0
N6=document.getElementById&&!document.all?1:0
function crea(cpa)
{
this.id=(N6&&!N4)?eval('document.getElementById('+ "cpa"+')'):
eval('document.all.'+cpa+'')
this.mover=mover2;
this.sacaLeft=sacaLeft2
this.sacaTop=sacaTop2
this.autor=false
return this
}
function mover2(x,y)
{
this.id.style.left=x
this.id.style.top =y
}
function sacaLeft2()
{
x=(N6)? this.id.style.left:this.id.style.pixelLeft
return parseInt(x)
}
function sacaTop2()
{
y=this.id.style.top
return parseInt(y)
}
var z_Index = 15
elemento=new crea
function moverDown(xevent,objeto)
{
elemento=new crea(objeto)
var xs=(N6)?xevent.pageX:event.x
var ys=(N6)?xevent.pageY:event.y
elemento.autor=true;
elemento.enX=xs-elemento.sacaLeft()
elemento.enY=ys-elemento.sacaTop()
elemento.id.style.zIndex=z_Index++

}
function persigue(xevent)
{
var xs=(N6)?xevent.pageX:event.x
var ys=(N6)?xevent.pageY:event.y
if(elemento.autor)
{
elemento.mover(xs-elemento.enX,ys-elemento.enY)
}
}
function outCapa()
{
elemento.autor=false
}
document.onmousemove=persigue;
/******************************************
* Script Hecho por Eleazar Prieto Aguilar *
* [email protected] *
* Todos los derechos reservados ;) *
* Se puede usar siempre y cuando esto se *
* mantega integramente (copypaste) free *
******************************************/
</script>

<div id="capaSup" onmousedown="moverDown(event,this.id)" onmouseup="outCapa()" style="position:absolute; left:10; top:10; width:200px; height:200px;background-color:#016dd7; cursor:default;border:solid windowtext .8pt; z-index:1">
<table style="color:#2bff05;font-size:50px;" width="100%" height="100%"><tr><td align="center" valign="middle">unKnown</td></tr></table></div>


<div id="capaSup2" onmousedown="moverDown(event,this.id)" onmouseup="outCapa()" style="border:solid windowtext .8pt;position:absolute; left:40; top:40; width:200px; height:200px;background-color:#87fa4e; cursor:default; z-index:2">
<table style="color:#1e05ff;font-size:50px;" width="100%" height="100%"><tr><td align="center" valign="middle">unKnown</td></tr></table></div>


<div id="capaSup3" onmousedown="moverDown(event,this.id)" onmouseup="outCapa()" style="border:solid windowtext .8pt;position:absolute; left:70; top:70; width:200px; height:200px;background-color:#ffffff; cursor:default; z-index:4">
<table style="color:#000000;font-size:50px;" width="100%" height="100%"><tr><td align="center" valign="middle">unKnown</td></tr></table></div>

[caricatos]

Hola otra vez:

epa2: ayer estaba contestándote y se fue la luz en mi casa y tuve que dejar el ordenador todo el día (había frecuentes pequeños apagones)
Lo que me mandas me lo había bajado de "miscodigos", y me parece muy bueno, desde luego que felicito a unKnown por esa página.
La idea es buena, pero es mejor adaptarla a la página de otra manera.
Que te parece que haciéndo doble click en las imágenes, se crea el div centrado y con bordes sólidos para resaltarlo, del tamaño de la imagen y que tenga los eventos mouseup y mousedown de los div del ejemplo para moverlos por la postal.
Otra cosa que tendríamos que controlar son los límites; creo que el atributo estilo overflow, permite ocultar parte de los elementos que están dentro de los contenedores "divs".

Bueno, queda mucho por hacer, y llevo retraso.

Hasta otra.

Saludos

[epa2]

Hola de nuevo, he estado viendo tu página con la que has estado trabajando

http://pepemolina.com/postales/index2.html

Me gusta mucho la idea, escucha Caricatos, ¿sería posible hacer un montaje SOBRE otro montaje?

al hacer doble clic he visto que se inserta la postal, pero luego con el código de UNKNOW puedes mover otras postales ENCIMA DE LA QUE HAS INSERTADO,corrigueme si me equivoco

, ¿se podría dentro de ESA MISMA postal mover sus objetos???

quiero decir, que si una postal tiene un arbol, vas insertas esa postal y luego con el código de mover lo que sea ¿puedes poner ese arbol en el otro lado de la postal?

Dime si estoy apuntando a las nubes, muy alto, (bueno, algo se me ha pegado de nuestro amigo abducido Karlankas))

PD;un consejillo caricatos, cuando siempre me poner una direccion de este estilo
http://pepemolina.com/postales/index.html

¿Por que no te ahorras el escribir la última parte?. Al tratarse de una página index. dentro del directorio postales el servidor automaticamente la busca, no hace falta que la escribas.
quedaría así...

http://pepemolina.com/postales


PD2: yo llevo toda la mañana liado con el FLAHS, no doy pie con bola con el tema de las animaciones....
Un abrazo...

[caricatos]

Hola otra vez:

epa2:
Te has adelantado a poner el nuevo post, y resulta que justamente se llama index2, o sea que si bien tienes razón en lo que dices que no es necesario poner la ruta completa, en este último caso se trata de algo "obligatorio".
Y la verdad es que pongo toda la ruta porque suelo tener la página abierta y copiar la dirección de la barra de direcciones del explorador.

Lo de volar alto, si te he entendido bien, no es más que la idea original. En esta nueva versión (en pañales) los elementos activos, tienen el borde sólido, y tengo la "pretensión" de ponerle unos "manejadores" para poder modificar el tamaño de los elementos.

El problema es que hay que hacer muchas pruebas y lleva bastante tiempo cada pequeño avance.

Sobre mover los elementos de forma independiente, si bien es buena idea, lo que he pensado es intentar trabajar en un sistema de capas (similar a photoshop), por eso los botones laterales con una miniatura del dibujo, ordenados.

Por último pensaba poner unos creditos, que como el resto de la página falta desarrollar. En la cabecera (por ahora "pink") hay un enlace al "equipo de trabajo", si alguien quiere hacer un pop-up bonito, con los créditos... ¡lo dejo en el aire!...

Saludos