Hola y bienvenidos a una nueva clase.
Miren en qué página o en qué sección estoy.
Estoy en descubrir por qué me he venido aquí porque llegó el momento de empezar a mostrar los videos
que suben los usuarios tenemos que hacer bastante tenemos que hacer el menú desde donde se van a subir
el famoso cargar archivos tenemos que también empezar a mostrarlos pero ya de entrada veo algo que no
funciona del todo bien.
Si yo me vuelvo a configuración si veo la foto del usuario correctamente pero si me voy a descubrir
no.
Bueno esto se debe a que tengo que repetir parte del código a donde buscamos la imagen en la vamos a
tener que repetir en esta página.
En este archivo que es principal punto PHP entonces vamos a hacer eso tengo los dos archivos abierto
y lo que empiezo a ver son las diferencias.
Miren que es simple que es principal en cuanto a su en cuanto a su PHP.
Sin embargo aquí tengo algunas líneas más y oh coincidencia son éstas las que necesito.
Miren requerir o incluir o traer las funciones y obtener la imagen del usuario entonces.
Pues bien Agreguemos a eso.
Eso por un lado y las imágenes nunca se van a mostrar si no reemplazo busca rápido las etiquetas y M.G.
Es el logo y esto es lo que yo quería
voy a copiar toda la línea y me vengo aquí otra vez busco y M.G. acá está la etiqueta M.G. que tengo
que reemplazar para mostrar la foto.
Vamos a la otra es esta otra justo me quedó a tiro se grabo me vuelvo para comprobar que funciona lo
que hice y si a que cometí un error es debo haber borrado de más.
Entonces bueno no hay problema lo solucionamos.
Bueno evidentemente no son iguales.
Entonces para para no equivocarme lo que voy a copiar es solo esto vuelvo aquí y aquí lo vamos a para
no pasa nada.
A ver ahí está perfecto.
Bueno lluvia.
Borrar las dos columnas o en realidad borrar el contenido de las columnas.
En definitiva quiero borrar estos dos rectángulos pero voy a aprovechar de que cada rectángulo está
dentro de una columna.
No voy a borrar la columna eso sí esta columna la vamos a dejar de todo el ancho de 12
y me voy a quedar con la caja que contiene este rectángulo en la caja.
También me la dejaría ver no lo voy a borrar y dejar solo la columna reciclar la columna y lo que hago
es donde empieza la caja aquí y termina aquí bueno la borro.
Adiós caja esta es la fila.
Veamos esa columna sería la primera columna de la izquierda y acá empieza y termina la columna de la
derecha.
La columna de la derecha la borró entera debe quedar con una sola gran columna central.
Voy a grabar vamos a actualizar y se tendría que haber limpiado todo muy bien.
Voy a repetir este robo con todo lo que tiene adentro.
Ahí lo voy a pegar también de todo el ancho.
Por el momento cuál es la idea que en la página me aparezca.
Una fila fina arriba como una especie de Franja ya vamos a ir armando.
Yo quiero ser.
Yo quiero que en este sector.
Así en este rectángulo tengamos un menú fijo en el que nos permita subir el archivo o incluso me lo
podría ahorrar y lo puedo poner en la barra.
Así que espero no voy a borrar esto.
Disculpen que hayamos trabajado además suele pasar.
Me doy cuenta que va a ser más práctico tener por aquí un botón que me permita subir un archivo.
Ese archivo adivinen qué va a ser el video.
Claro está.
Vamos a subir el video y acá abajo esta gran columna que vamos a tener de 12.
O sea que va a ocupar todo el ancho de este espacio y lo vamos a llenar con los videos uno debajo del
otro así que empecemos a trabajar me voy a ir como primera medida a ese cuele y por fin llegó el momento
he dicho mal.
No hay secuela vamos a venir a PHP y admin para trabajar con SQL y vamos a crear una nueva tabla.
Para eso hago click aquí en PHP tube y ya me aparece el menú Crear tabla y adivinen cómo se llaman en
esta tabla se va a llamar vídeos yo creo con cuatro columnas vamos a andar bien pero en todo caso de
no ser así agregamos.
Bueno como ustedes saben chicos acá vamos a empezar con los obligados vídeos y bajo ahí va a ser un
entero le pondremos seis dígitos alcanza y sobra sin ningún predeterminado pero sí que sea auto incremental
le damos continuar y pasamos al segundo que va a ser fecha le vamos a poner un Stamp y predeterminado
en la hora actual.
Bueno acá me estoy olvidando de algo.
Video y bajo fecha después le vamos a poner video y un bajo y le vamos a poner un R L O sea la ruta.
También podría ser video o ruta aquí voy a cambiar y le vamos a poner un parchar y por las dudas 200
caracteres de Máximo.
Por si nos toca alguna dirección larga o algún nombre de archivo largo y esto es súper importante es.
Yo necesito saber quién fue el usuario que subió este video.
Entonces le vamos a poner videos marcas videos videos videos y un bajo usuario.
Ahí va a ser un entero también.
6 máximo pero no se olviden de que acá no podemos poner auto incremental porque acá yo voy a poner el
Heydi del usuario que posteó este video.
Bueno le damos en guardar.
No hubo ningún error ya tenemos la tabla creada Volvamos entonces al código
vamos a preparar a ver ahora alguna especie de menú que me permita subir el video.
Vamos a hacerlo.
Me vengo a funciones función graba imagen.
Bueno me viene de diez esto porque con modificar la muy poco puedo crear graba video la voy a minimizar
así me es mucho más fácil copiarla la copio y la voy a repetir más arriba al principio de todo porque
como es con lo que voy a trabajar ahora quiero que me quede al principio.
Después le doy el orden no total no importaban del todo igual graba video le voy a poner.
Vamos a cambiar y casi que sería todo igual.
Lo que sí voy a aumentar es el tamaño máximo que acá sería.
Puede que sea poco bueno.
Otra cosa es el tipo de archivo porque acá estoy filtrando y diciendo Ay si no es una foto no quiero.
Bueno yo acá de momento de momento ustedes elijan los archivos que quieran pero como a mi servidor lo
quiero mucho y no lo quiero destruir que me suban a donde me vayan a subir videos pesados o increíblemente
grande.
El primer filtro que puedo poner además de esto sino que también para optimizar lo que me están subiendo
que sean MP4 se dan cuenta si no es extensión MP4 no te lo va a dejar subir por ejemplo yo no quiero
que sea un AVI los Avi suelen ser pesadísimos no no.
Entonces a ver acá para que tenga coherencia lo siento la imagen no lo siento el video lo siento solo
mp4 y seguro que me va a faltar algo.
La imagen no es el video vamos corrigiendo.
El video ha sido subido otro para corregir y lo siento un error grabar el disco en el disco.
Acá el video.
Miren cómo estamos reciclando una función inmensa con muy poquito esfuerzo y creo que es el último que
me queda.
El video ya existe.
Listo ya está todo más coherente devuelvo un mensaje creo que estaría todo bien.
No sé si les gustaría que cambiemos la ruta.
Para mí es innecesario.
Bueno yo lo voy a hacer todo en el mismo en la misma carpeta.
Ustedes si tienen ganas podrían hacer archivos para lo que son imágenes o archivos del usuario que vayamos
a usar y podríamos hacer otra carpeta que se llame videos.
Obviamente habría que cambiar aquí esta carpeta y poner videos debe tener todo en el mismo lugar no
me molesta no sé que no se van a mezclar.
Ojo cuando minimizará una función y después se les olvidan minimizaba y no encuentran cosas.
Si me habrá pasado bueno lo voy a abrir por las dudas de nuevo ya tenemos una función que graba el video
entonces yo puedo venir a Configuración y vamos a reciclar de aquí el momento en el cual recibimos los
archivos aquí.
En el caso de que se esté recibiendo un video entonces voy a reciclar esto.
Vengo aquí a principal y vamos a ponerlo aquí perfecto en vez de graba imagen.
Vamos a hacer graba video nos estaría faltando lo que sí nos estaría faltando el menú o el formulario
para poder enviar esto vamos a buscarlo.
Tengo que ir a Configuración ya lo tengo hecho por qué lo voy a hacer dos veces.
Es tonto o sea no hay que trabajar de más tampoco si lo tenemos voy a buscarlo así Fáil a ver si acá
está.
A ver yo puedo Koper nada más que el formulario
de forma afford.
No quiero copiar nada más me vengo principal y yo lo quería en el Jer.
Entonces vamos a buscar el Geer vamos a tener que trabajar un poco quizás en esto busquemos dónde está
la bandera esa banderita o campanitas no era más escabel
me gustaría ponerlo a ver antes la derecha Veamos veamos a dónde podemos poner.
Aquí está el usuario acá le vamos a poner ahí.
Entonces estaba bien lo de la campana busco de nuevo la campana entonces veamos que cada uno de los
elementos que aparecen en la barra superior son Elai o sea son ítems de una lista y está bien hacer
la lista los huele recuerdan.
Encierran elementos de una lista.
Los cuales son una lista y estos son cada uno de esos elementos.
Acá hay un elegi esté Lehi grande tiene la campana por qué es tan largo.
Porque también tiene los elementos que hay cuando se despliega la campana.
Ya veremos eso si lo usamos para algo de momento lo dejamos así.
Después tenemos este otro Lehi que es el menú o acá está la foto si no me equivoco si este es desplegable
también o puede ser desplegable.
Y aquí está la foto del usuario bueno vamos a poner un menú más.
Entonces yo lo que podría hacer este que está mucho más reducido a cierto que copié el formulario miren
lo que voy a hacer no me quiero perder el formulario porque voy a copiar esto y copiar esta idea acá
lo copio con la descripción y todo donde ahí voy a pegar.
Leí que contiene la foto del usuario.
Voy a borrar el contenido voy a dejar nada más que leí que abre y leí que cierra y ahora mire minimizo
el formulario para copiar lo más fácil lo Kort.
Así desaparece y lo pongo acá adentro.
Bueno esto puede salir bastante acomodado pero lo vamos a ir puliendo.
Qué les dijo.
Tenía otro formato así que vamos a empezar a darle forma para que la pobre barra vuelva a su posición
normal.
Lo que sucede es que el formulario estaba metido dentro de una caja.
Entonces todo esto yo lo voy a sacar todo esto quiero dejar el imput pobre y pelado esto no lo quiero
caja tampoco.
Este es el botón el botón si el botón lo vamos a dejar pero capaz que le cambiamos la forma el mensaje
el mensaje el mensaje el mensaje puede que lo deje pero vamos a ver cómo sale.
Nos vamos a desesperar tampoco por el momento
bueno se va acomodando algo o queriendo moverse
y después de borrar un poco me queda de esta manera no me termina de convencer porque está haciendo
que se ponga muy ancho el Jer amén de que en realidad lo estoy viendo con una vista muy agrandada para
que se vea bien el video pero no me termina de cerrar esto hay mucho más.
Hay maneras mucho más elegantes de hacerlo pero si son complejas la idea es hacer algo súper simple.
Entonces bueno cuál es el problema que tengo y que sale uno arriba del otro.
Empecemos a ver a mí me gustaría que actualizar salgan bien a la derecha y a la misma altura que esto.
Entonces voy a empezar llevando este actualizar todo a la derecha que pueda entonces eso lo puedo hacer.
Acá está la clase del botón por ejemplo al ser botón Primary es azul por ejemplo si yo le pusiera Danger.
Miren cómo sale.
Es otra clase de botón.
Lo único que hace es cambiarle el color.
Bueno cómo sé yo porque soy un genio superdotado que me sé de memoria todas las cosas no fui yendo al
original de El panel voy al original del panel empiezo a ver los diferentes botones que hay y me en
pie y empiezo a fijarme qué clase tiene cada botón.
Estas son clases que están desarrolladas dentro del panel.
Bueno de momento lo voy a dejar rojo
pero si hay una clase que yo le puedo agregar aquí que se llama Pul o empujar RIT empujar todo hacia
la derecha este botón.
Vamos a ver qué efecto tiene si es que me ayuda esto.
Bien por lo menos logré que el botón se fuera más hacia la derecha y lo que podría hacer es al input
del input.
En este caso viene siendo esto de acá selecciona el archivo y la leyenda no se elige de archivo.
A esto no tiene clase entonces yo le voy a poner una clase y le voy a poner la opuesta que es Pul empujar
left empujar para la izquierda.
A ver si lo acomoda bien bastante bastante quizás quizás podríamos haber aquí agregarle al formulario
completo Staël y lo que haría es margin top
10 pixeles.
Estoy generando un margen hacia arriba de 10 pixeles a esta mano incluso el botón se le podría poner
un pequeño margen hacia la izquierda para que se separe esto.
Qué puedo hacer es cambiar el orden.
No estoy obligado a ponerlo en orden.
Si esto me ayuda en el aspecto más
no haber les tendría que poner el capulí raíz esto sería así y esto lo ponemos left espero que tenga
algún efecto bueno.
Puede ser puede ser.
Por último al imput le podría poner un mail
margin Leff pequeño 5p X.
Miren yo lo que quiero hacer es generar una separación aquí.
Recuerden que los Statoil como estoy haciendo se les dice inline.
O sea no estoy generando una clase.
No es misión de este curso dar clases de estilos pero para que sepan no son del todo bien vistos estos
estilos en línea.
De todos modos cuando estamos haciendo un panel no es nada nocivo no pasa nada sobre todo porque no
es una página pública una vez que tengamos todo listo.
Bueno nadie nos priva de que podamos desarrollar la clase correspondiente para ya no usar más estos
estilos y hacer algo un poco más estandarizado.
Bueno mi idea con este margin Leff era generar una pequeña separación aquí y lo he logrado.
Bueno ya tenemos medianamente el menú para poder subir los videos
veamos muy importante a modificar en este formulario es que al copiar y pegar lo hemos dejado la acción
anterior.
Esto tiene que apuntar a principal a nosotros mismos.
Punto.
PHP recuerda llegado el caso.
Nadie nos priva de enviar un post de un archivo a otro archivo o de una web a otra web incluso a otro
servidor.
Pero en este caso como estamos haciendo el PHP en el mismo archivo nos enviamos la información a nosotros
mismos.
Bueno mientras había pasado el video para probar yo subí un video y noto que se grabó aparentemente
pero se rompió la imagen no la muestra más y ahí me di cuenta mi error.
Miren qué sucedió.
Vengamos a funciones graba vídeo.
Bueno todo esto parece que anduvo bien se subió el archivo todo bien pero cuando actualizó la dirección
del video qué es lo que hizo.
No actualizó la imagen porque nos olvidamos de cambiar esta parte.
No nos olvidamos.
No me olvidé.
Vamos a cambiar esto porque acá lo que va a tener que hacer es insertar un nuevo video y no actualizar
absolutamente nada.
Entonces vamos a preparar correctamente esta consulta me acuerdo para inspirarme puedo venir acá es
tan fácil como venir a insertar e insertar y voy a poner una dirección cualquiera.
A veces no quiero no quiero nada en específico y una idea de usuario a ver como funciona esto.
Perfecto se insertó una fila después me tengo que acordar de borrarla acá tengo toda la consulta me
vuelvo a aquí vamos a decomisa a Comillas de cierre a pegarla ya la tengo pegada entonces video ahí
no lo pongo porque se pone automáticamente la fecha la borro porque se pone automáticamente.
Lo único que tengo que insertar yo son el video.
O mejor dicho la web R.L del video.
La dirección que en este caso va a ser
a ver target Fail Me parece que era lo que me fijo en el LaVey de abajo.
Target FFII entonces vuelvo el video la web el video va a ser Target Field.
Estos dos luego los borro porque no ya se ponen solos habíamos dicho y aquí va a ir Target Field.
Yo se lo copie y el otro valor que yo tendría que guardar al mismo tiempo es el Heydi de usuario.
Entonces acá voy a repetir target Phil y lo voy a reemplazar yo lo tengo escrito con esto aca esta sesión
usuario Saidi copio esto y vamos que lo copiamos acá.
Que a ver selecciono eso a esta entonces en definitiva inserta una nueva fila a donde grabo la direccion
a donde terminó guardándose el video y en la columna video videos.
Perdon usuario Heydi.
Voy a grabar el Heydi del usuario que publicó este video muy importante.
Bueno eso estaría ya correcto.
Esto de subir nuestro primer video y lo que voy hacer es seleccionar video aprovechando que tengo por
acá vieron el inicio de cada uno de estos capítulos.
Bueno no voy a subir le vamos a dar a actualizar no estoy imprimiendo el mensaje en ningún lado ahora
no sería de mi interés.
Bueno en teoría se subio lo que primero puedo hacer es verificar en archivos.
A ver aquí está.
Copete puntualmente.
4 tiene el simbolito de la cámara de un video.
Miren que bueno y lo que me resta ver es si esto llegó aquí.
Entonces vamos a actualizar.
Y miren lo que apareció acá tenemos video y ni sale con el Heydi número 3.
Puesto correctamente la fecha ha puesto acá la R.L y ha puesto mi Heydi de usuario que es el 5.
Todo funcionó bien.
Lo que yo puedo hacer es borrar este arriba porque es el que yo inserté a mano pero bueno es para celebrar.
Ya estamos subiendo videos ya estamos registrando su dirección en la base de datos así que no es poca
cosa.
Mis amigos.
Bueno nos queda la tarea no menor de empezar a mostrar estos videos creo que ya casi la cumbre de nuestro
proyecto.
Así que en la próxima clase empezaremos con esa tarea.
Muchísimas gracias por la compañía.
Nos vemos.