Hola a todos
En ocasiones tenemos una serie de videos de youtube embebidos mediante iframes en una misma página, que bien pueden estar ocultos o en tabs. Pero cuando le damos play a uno y después pasamos a otro tab o boton, este no se detiene.
Para lograr pausar un video al dar clic en un boton usaremos javascript y un truco que encontre hace días en stackoverflow (el cual está desactualizado, 2012).
Librerías que necesitamos:
<script src="js/jquery.js"></script>
Insertamos el siguiente código en el <head>
<script>
<!--
$(function() {
//NOTE: in url is necessary add ?enablejsapi=1
function playVideoAndPauseOthers(frame) {
$('iframe[src*="https://www.youtube.com/embed/"]').each(function(i) {
var func = this === frame ? 'playVideo' : 'pauseVideo';
this.contentWindow.postMessage('{"event":"command","func":"' + func + '","args":""}', '*');
});
}
$('div a[title^="video"]').click(function() {
var frameId = /video(\d+)/.exec($(this).attr('title'));
//alert(frameId);
if (frameId !== null) {
frameId = frameId[1]; // Get frameId
playVideoAndPauseOthers($('#video' + frameId + ' iframe')[0]);
}
});
});
-->
</script>
y nuestros html debe esta de la siguiente manera:
<div id="video1">
<iframe name="video1" width="600" height="315" src="https://www.youtube.com/watch?v=uYbsSj6t0V4?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
</div>
<div id="video2">
<iframe name="video2" width="600" height="315" src="https://www.youtube.com/watch?v=sEe1ZGhYSWs?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
</div>
<div><a href="#" title="video1">Opción A</a></div>
<div><a href="#" title="video2">Opción B</a></div>
Tomen en nota y es muy importante, después de la url de cada video hay que agregar
?enablejsapi=1 lo cual indica que se utilizará la API de Youtube
Es todo, cuando le de clic al botón A se iniciará el video1, al dar clic al boton b, se dentendrá el video1 y se iniciará el video2, y viceversa.
El código se puede cambiar y dejar de hacer referencia al atributo title del div y usar un data- , pero eso lo dejo de tarea.
Saludos
miércoles, 27 de julio de 2016
jueves, 21 de enero de 2016
Windows 10 + apache 2.4 y php 5.5
Actualmente Apache httpd se tiene que descargar de páginas alternativas donde lo han compilado.
Instalando apache
Descargue desde: http://www.apachehaus.com/cgi-bin/download.plx
Descomprima en su pc, en mi caso renombro la carpeta para que sea mas fácil:
E:/servidor/Apache24
Edite el archivo Apache24/conf/httpd.conf con los valores de la ruta de la carpeta donde se localiza apache
Define SRVROOT "E:/server/Apache24"
DocumentRoot "E:/server/www"
<Directory "E:/server/www">
guarde e inicie desde una consola y ejecute el archivo
Apache24/bin/httpd
Inicie su explorador y escriba en la barra de dirección
localhost
El empaquetado viene con una guía para mayor información.
(httpd-2.4.18-x64-vc11/readme_first.html)
Instalando PHP5
Intente descargar varias versiones de php pero la única que tiene la librería php5papache2_4.dll es la
php-5.5.5-Win32-VC11-x64.zip
Descargue php 5 desde http://windows.php.net/downloads/releases/archives/
Descomprima y coloque en una ubicación adecuada
E:/servidor/php
Duplique el archivo php.ini-production como php.ini
Edite el archivo httpd.conf de apache para configurar su uso con php
Agrege y edite las siguientes líneas
LoadModule php5_module "E:/server/php/php5apache2_4.dll"
DirectoryIndex index.php index.html
AddType application/x-httpd-php .php
Guarde y reinicie apache
verifique en httpd://localhost con un archivo que tenga código php
Ejecutando Apache como servicio
Para agregar apache como un servicio de windows y se ejecute desde el inicio, ejecute el siguiente comando desde la consola:
httpd.exe -k install -n "Apache24"
Ahora puede verificar en el administrador de servicios que Apache24 ha sido agregado.
Es todo, espero agregar el uso de mysql próximamente.
Saludos =)
viernes, 8 de mayo de 2015
EZPDF especificar color en RGB
EZPDF es una gran librería para crear proyectos sencillos, sin embargo, conforme se avanza, deseamos tener más personalizada la salida de datos.
Con ese objetivo me encontré con un problema, darle un color específico a las tablas, celdas, líneas, etc.
Al ver las especificaciones de las funciones leí en el manual que se usa RGB para dar color a los elementos, entonces lo primero que hice fue poner los colores en el formato 255,255,255. Desafortunadamente no funciono, me daba un color azul turquesa o un blanco. Cosa fatal cuando tiene uno prisa. El manual en uno de los apartados menciona que los colores deben estar en un rango de -0,1. Así que comencé a experimentar con poner (0, 0.7, 0.8) y tenía los mismos resultados: color turquesa o blanco.
La solución
Resulta ser que tenemos que dividir el 1 entre 255 y multiplicar por el color deseado en rgb
Color deseado RGB : 0,157,255
Color deseado EZPDF: = (1/255) * 157 = 0.61
setStrokeColor(0, 0.61,1)
o para las celdas de las tablas
'shadeCol2' => array(0.81,0.84,0.9)
Nota: en algunos sitios encontre valores mayores a uno en sus ejemplos. No se la razón por que tambien funciona con esos numeros :/
EZPDF Centrar datos en columnas de las tablas de documentos PDF
Hace poco estaba realizando un reporte en pdf, para lo cual necesitaba listar datos en una tabla. Sin embargo, todas las columnas tenian el mismo ancho. El manual PHP Pdf Creation de R&OS esta algo incompleto, así que buscando en internet por horas, encontré por casualidad como resolverlo.
La solución
El manejo de datos en EZPDF se hace mediante array
Para ello hay que pasarle los parametros al objeto que construye la tabla en la variable de opciones poniendo como clave de referencia cols que refiere a las columnas, y después describir el comportamiento de cada una de ellas a través de otro array. Es decir, es un array de arrays de opciones.
Ejemplo
$options['showHeadings'] =1;
$opcions['showlines'] = 1;
$options['shaded'] =1;
$options['shadeCol'] =array(0.81,0.84,0.9);
$opcions['shadeCol2'] = array(0.91,0.93,0.95);
$options['xPos'] ='left';
$options['xOrientation'] ='right';
$options['textCol'] = array(0,0,0);
$options['width'] =500;
$options['cols'] = array('col_num'=>array('justification'=>'center', 'width'=>30),'col_datos'=>array('justification'=>'left'),'col_total'=>array('justification'=>'center', 'width'=>100) );
$pdf->ezTable($data, $titles, '', $options);
Salida (Claro será en su documento pdf, esto es solo ilustrativo)
Saludos
La solución
El manejo de datos en EZPDF se hace mediante array
Para ello hay que pasarle los parametros al objeto que construye la tabla en la variable de opciones poniendo como clave de referencia cols que refiere a las columnas, y después describir el comportamiento de cada una de ellas a través de otro array. Es decir, es un array de arrays de opciones.
Ejemplo
$options['showHeadings'] =1;
$opcions['showlines'] = 1;
$options['shaded'] =1;
$options['shadeCol'] =array(0.81,0.84,0.9);
$opcions['shadeCol2'] = array(0.91,0.93,0.95);
$options['xPos'] ='left';
$options['xOrientation'] ='right';
$options['textCol'] = array(0,0,0);
$options['width'] =500;
$options['cols'] = array('col_num'=>array('justification'=>'center', 'width'=>30),'col_datos'=>array('justification'=>'left'),'col_total'=>array('justification'=>'center', 'width'=>100) );
$pdf->ezTable($data, $titles, '', $options);
Salida (Claro será en su documento pdf, esto es solo ilustrativo)
| num | datos | total |
Saludos
PHP Evaluar una expresión matemática (fórmula) almacenada en un string
En ocasiones hay datos almacenados en algún string con fórmulas que deseamos ejecutar en php, por ejemplo 2+4*6. Una solución es recorrer el string caracter por caracter para comparar operadores, variables y elementos, pero eso nos llevaría un buen rato de programar.
La solución
Usar la función eval()
<?php
//php 4.3
$formula = "2+4*6";
eval(" $var = $formula; ");
echo $var;
?>
<?php
// php 5,6 y 7
$formula = "2+4*6";
$var = eval("return ".$formula.";");
print $var;
?>
Nuestra salida es 26
Así de fácil
La solución
Usar la función eval()
<?php
//php 4.3
$formula = "2+4*6";
eval(" $var = $formula; ");
echo $var;
?>
<?php
// php 5,6 y 7
$formula = "2+4*6";
$var = eval("return ".$formula.";");
print $var;
?>
Nuestra salida es 26
Así de fácil
jueves, 4 de septiembre de 2014
Solución Dspace Jspui Internal System Error
Si usted instalo Dspace posiblemente encontró este error:
Después de leer muchos foros encontré que esto es provocado por una configuración inadecuada para solr en [dspace src]/build.properties.
Antecedentes
Instalación de Dspace
- Debian 7
- Uso de tomcat7
- Compilación con Openjdk7-jdk
- Instalación de dspace-4.2 mediante src
- Copia de la carpeta dspace/webapps/solr a tomcat7/webapps/
Problema
Una vez instalado Dspace al entrar a jspui se encuentra el mensaje Internal System Error, el cual es desconcertante.
Lo primero que hay que hacer es verificar los logs que se encuentran en [dspace]/log,
Ahi encontramos que:
No hay permisos en los directorios para que pueda funcionar solr.
Lo cual lo solucionamos con mi anterior post: dspace-y-solr-problemas-al-ejecutar
Después de solucionar esa parte, y ver que solr funcionaba perfectamente al ingresar de manera local al servidor http://localhost:8080/solr
resulto que jspui seguía con el mensaje de Internal system error.
Entonces volvimos a los logs y encontramos ahora este nuevo error:
org.apache.catalina.core.StandardWrapperValve invoke GRAVE: El Servlet.service() para el servlet [jsp] en el contexto con ruta [/jspui] lanzo la excepcion [org.apache.jasper.JasperException: javax.servlet.ServletException: org.dspace.plugin.PluginException: org.dspace.app.webui.components.RecentSubmissionsException: org.dspace.browse.BrowseException: org.dspace.discovery.SearchServiceException: Server at http://192.168.1.1:8080/solr/search returned non ok status:403, message:Prohibido]
Como Resolverlo
El problema en realidad es que al configurar los detalles de Dspace debemos especificar el uso de solr de manera local, tomando en cuenta que solr solo responde a peticiones locales (No encontré como darle salida a una petición externa, ya que por default prohíbe el monitoreo externo)
Lo que hice fue recompilar Dspace ya que no encontré donde cambiar la ruta en Dspace que apunta a Solr.
Primero borramos las carpetas de las aplicaciones de Dspace en tomcat7
# cd /var/lib/tomcat7/
# cd webapps/
# rm -R jspui/
# rm -r oai/
# rm -r xmlui/
# rm -r solr/
y desde http://tuservidor:8080/manager/ paramos y desplegamos las tres aplicaciones.
Entonces entramos a [dspace-src]/dspace y editamos el archivo build.properties
# cd /home/cated/src/dspace-4.2-src-release/
# nano build.properties
solr.server=http://localhost:8080/solr
Guardamos con Ctrl + o
y seguimos los pasos para recompilar Dspace: Rebuild Dspace
en resumen,
# su dspace
# cd /home/cated/src/dspace-4.2-src-release/dspace/
# mvn package
# cd [dspace-source]/dspace/target/dspace-[version]-build.dir/
# ant update
vaya a su directorio dspace
# cd /ruta/dspace/webapps
# cp jspui /var/lib/tomcat7/webapps/
# cp -R jspui /var/lib/tomcat7/webapps/
# cp -R oai/ /var/lib/tomcat7/webapps/
# cp -R xmlui/ /var/lib/tomcat7/webapps/
# cp -R solr/ /var/lib/tomcat7/webapps/
# /etc/init.d/./tomcat7 restart
Verificamos que todo funcione bien
http://tuservidor:8080/manager/
y verificamos nuestro jspui de Dspace
http://tuservidor:8080/jspui
¡¡Felicidades, ya está funcionando al 100!!
Notas finales
Como pueden observar son detalles que se nos llegan a pasar. Pronto, en un nuevo post: Como crear un tema personalizado para Dspace.
miércoles, 3 de septiembre de 2014
Dspace y solr: Problemas al ejecutar solr # Cannot create directory
Al instalar Dspace 4.2 encontré que había un error al utilizar solr
Antecedentes
- Debian 7
- Uso de tomcat7
- Compilación con Openjdk7-jdk
- Instalación de dspace-4.2 mediante src
- Copia de la carpeta dspace/webapps/solr a tomcat7/webapps/
Problema
Como lo hacia desde una maquina cliente, no veía que solr tenia problemas de funcionamiento.
Para ver la salida desde la consola basta con un
root@magma#wget http://localhost:8080/solr > salida.html
Lo cual devuelve lo siguiente:
search: org.apache.solr.common.SolrException:org.apache.solr.common.SolrException: Cannot create directory: /usr/local/dspace/solr/search/data/index
statistics: org.apache.solr.common.SolrException:org.apache.solr.common.SolrException: Cannot create directory: /usr/local/dspace/solr/statistics/data/index
oai: org.apache.solr.common.SolrException:org.apache.solr.common.SolrException: Cannot create directory: /usr/local/dspace/solr/oai/data/index
Como Resolverlo
Vaya a su Directorio Dspace
root@magma# cd /dspace/
cambie la asignación de propiedad de la carpeta solr/ (solo a la carpeta sin recursividad)
root@magma# chown tomcat7:dspace solr/
cambie los permisos de las carpetas statistics/ search/ oai/
root@magma# chmod 775 statistics/
root@magma# chmod 775 search/
root@magma# chmod 775 oai/
reinicie tomcat
root@magma#/etc/init.d/./tomcat7 restart
Vuelva a general el archivo de salida.
root@magma#wget http://localhost:8080/solr > salida2.html
Notas finales
Como ven, esto lo soluciona sin problema, la salida muestra datos donde funciona.
(Recomendable verificar en un navegador de manera local en el servidor http://localhost:8080/solr/ y puedan ver las estadísticas y el funcionamiento)
Suscribirse a:
Entradas (Atom)