2010-12-13 12 views
10

Nuestra empresa desea poner algo de contenido de marketing/capacitación en memorias USB para distribuir a nuestros clientes.Sin conexión (CD, unidad Thumb, etc.) ¿Instalar HTML + Video sin instalación?

El contenido es HTML + algunos videos incrustados. Los videos (actualmente .flv) no son interactivos ni nada de eso, aunque son importantes para el contenido. El truco es que el HTML contiene Javascript que debe ejecutarse cuando finaliza el video.

Nuestra primera idea fue utilizar una solución de contenedor de video Flash como Jwplayer. Esto funciona bien cuando los archivos están alojados en un servidor web. Sin embargo, debido a las políticas de seguridad de Flash, local (e.g. "file://foo.js") Javascript code cannot receive callbacks from Flash objects. Además, los usuarios de Internet Explorer reciben advertencias de seguridad desagradables (¡como deberían!) Cuando los archivos web locales contienen objetos ActiveX como Flash.

Ideas?

Idealmente, nos gustaría ser lo más diversos posibles entre navegadores y plataformas multiples sin que los usuarios necesiten instalar nada. Pero no podemos garantizar que sean capaces o quieran confundirse con la configuración de seguridad y tampoco podemos garantizar que tengan un navegador compatible con HTML5 video.

Parece que la forma predeterminada de la industria para hacer esto es simplemente empacar cosas en un ejecutable de Flash Player independiente. Me preguntaba si podría hacerse de otra manera, preferiblemente con estándares web.

Titanium Appcelerator Desktop sería casi perfecto, ¡aunque la versión de escritorio no es compatible con el video!

+0

embalaje cosas para arriba en un servidor web independiente podría ser una alternativa. –

Respuesta

5

OK. Aquí está la solución con la que vamos.

Pero primero, esto es lo que estamos no usando. Busqué en Appcelerator Titanium, que promete permitir aplicaciones de escritorio multiplataforma construidas con HTML5 + CSS, utilizando el motor de renderizado WebKit. Tienen una edición de escritorio, pero está bastante descuidada a favor de su edición móvil. Fundamentalmente, la versión de Windows de su edición de escritorio no admite video, lo que necesitamos.Es una especie de limitación extraña, pero no los voy a dejar por centrarme en el mercado móvil en rápida expansión.

Por lo tanto, esto es lo que vamos con: Mozilla Firefox, Portable Edition. Funciona muy bien para este propósito con algunos ajustes.

En este ejemplo pretendemos que estamos haciendo una presentación de marketing para Acme Awesome Products.

  1. Cambiar el nombre de los archivos. En la instalación de Firefox Portable, cambiar el nombre de Mozilla Firefox-Edición Portable/app/Firefox/firefox.exe a Mozilla Firefox-Edición Portable/app/Firefox/ACME.EXE, cambiar el nombre del Mozilla Firefox-Edición Portable/app/Firefox directorio para Mozilla Firefox-Edición Portable/app/Acme y, finalmente, cambiar el nombre FirefoxPortable/PortableFirefox.exe a FirefoxPortable/Acme.exe. (vea Explorer en el recuadro de pantalla a continuación)
  2. INI Tweak. Copia FirefoxPortable/App/DefaultData/Settings/FirefoxPortableSettings.ini a FirefoxPortable/FirefoxPortableSettings.ini, y realice los ajustes que se muestran en la captura de pantalla a continuación. Esto hará que la aplicación se inicie con el tamaño de ventana deseado, sin la pantalla de bienvenida de Firefox Portable y con la página de inicio que elijamos. También necesitará cambiar algunas de las rutas aquí para indicarle dónde encontrar los archivos cuyas ubicaciones cambiamos en el paso # 1. (Consulte la ventana del editor en el recuadro de la pantalla a continuación)
  3. Ocultar la estructura del archivo de la aplicación Firefox. Por razones estéticas, es posible que desee hacer clic con el botón derecho en todos los archivos y carpetas en FirefoxPortable/ y ocultarlos, excepto Acme.exe.
  4. Cambiar barra de título. Ejecutar Acme.exe. Instale el "Customize Titlebar" extension o algo similar. Úselo para cambiar el texto de Portable Firefox a lo que quiera. (Alternativamente, puede editar /FirefoxPortable/App/Acme/chrome/en-US.jar. Abra el .jar y verá locale/branding/brand.dtd) Reinicie Acme.exe para ver su barra de título cambios.
  5. Apagar la ventana Chrome. Vaya al menú Vista de Portable Firefox y apague todo el cromo: la barra de navegación, la barra de marcadores, la barra de estado, etc. Tenga en cuenta que puede presionar la tecla "alt" en su teclado para recuperar la barra de menú y finalizar los usuarios también pueden (Alternativamente, hay varias extensiones de estilo "kiosco" para Firefox que bloquearán la aplicación más abajo. Pero para mis propósitos realmente no me importó)
  6. Cambiar el ícono de la aplicación. Utilice un programa como IcoFx (excelente y gratis) para cambiar el icono de FirefoxPortable/App/Acme/Acme.exe. Nota: IANAL, pero creo que realmente debe eliminar la marca oficial de Mozilla, como el logotipo de Firefox, de Firefox antes de redistribuirla.

Screenshot of the final app

En este punto usted tiene algo bastante indistinguible de una aplicación nativa. Obviamente, un usuario inventivo puede alcanzar el máximo en la estructura de directorios de su aplicación y ver que está usando Firefox, y todos los atajos de teclado de Firefox aún estarían activos.Si esto es un problema para usted, existen extensiones de estilo "kiosco" para Firefox, algunas de las cuales son bastante antibalas, aunque no las he probado, así que no las vincularé aquí. Nuevamente, para mí esto no fue un problema.

Este enfoque tiene mucho que mejorar. futuro las cosas que me gustaría explorar son

  1. Varios ajustes de configuración en tiempo de carga de velocidad
  2. Un autorun.inf para poner en marcha de forma automática ACME.EXE
  3. Por supuesto versiones OSX y Linux.
  4. Forma de deshabilitar los atajos de teclado de Portable Firefox. (¿Cuál es la mejor manera? .ini/about: config tweaks? Extension? .ini/about: los ajustes de configuración deben ser más rápidos)
  5. Descubre cómo cambiar el icono de /FirefoxPortable/Acme.exe. De acuerdo con this puede ser necesaria una recompilación, a diferencia de la mayoría de los archivos .exe.
1

Busque en Microsoft HTA - Aplicaciones HTML. Fueron diseñados específicamente para su propósito en mente e incluso pueden configurarse como el objetivo de ejecución automática en la inserción de medios. No necesita cambiar su marcado o estructura html: simplemente agregue la etiqueta < HTA: Application > a cualquier archivo html, cambie el nombre a .hta y luego puede hacer referencia a la ruta del archivo como lo tiene file: /// xxx y utilizará los permisos del usuario conectado para acceder al sistema de archivos sin previo aviso.

Si necesita compatibilidad multiplataforma, le recomiendo consultar Adobe AIR, un concepto similar pero un poco más de marcado para que funcione.

Referencias:

de HTA

http://msdn.microsoft.com/en-us/library/ms536496(v=vs.85).aspx http://en.wikipedia.org/wiki/HTML_Application

Adobe AIR

http://www.adobe.com/products/air/

+0

¡Gracias por la respuesta! AIR funcionaría, pero quisiéramos evitarlo porque los usuarios necesitarían instalar el tiempo de ejecución de AIR si no lo tenían instalado. –

0

Si esto es sólo la comercialización/contenido de capacitación, ¿por qué no lo incrusta en un archivo de PowerPoint donde todavía puede tener vid eo?

+0

Veo lo que dices. Pero ser independiente y multiplataforma es uno de los grandes objetivos. –

0

Estoy trabajando en un proyecto similar. Fui portátil con FF también, pero no estaba contento con la velocidad. Encontré este otro pequeño navegador compatible con Mac y Linux. Primero debe copiar el .exe único en un disco de escritura para editar las configuraciones y hacer que cree las carpetas necesarias de caché y configuraciones (desactive cualquier configuración de escritura en el navegador para evitar errores), luego puede grabarlo en cd.

¡Funciona muy bien hasta ahora!

QT Web Browser