ASP .NET MVC - Usando os recursos da Microsoft Web Helpers

ASP .NET MVC - Usando os recursos da Microsoft Web Helpers II

Na primeira parte deste artigo eu mostrei como instalar e referenciar a library Microsoft Web Helpers em seu projeto ASP .NET.

Vamos começar a usar os recursos desse pacote em nossas aplicações.

Que tal poder incluir vídeos em suas páginas ASP .NET ?

Vamos lá...

Partindo da aplicação Helpers-MVC-Razor que foi criada na primeira parte do artigo e na qual já temos as referências a biblioteca Web Helpers vamos aproveitar as páginas e a estrutura já criada na aplicação para disponibilizar a exibição de vídeos no formato flash (vídeos do youtube) e windows media player (.wmv)

Na pasta Shared vamos alterar o código da página _Layout.vbhtml para exibir um link para chamar a página que mostrar os links para exibir os vídeos.

Selecione o arquivo _Layout.vbhtml e altere a linha de código do menu conforme mostra a figura abaixo:

A seguir vamos incluir uma pasta chamada Videos no projeto e incluir nesta página um vídeo no padrão .wmv. Vou usar o vídeo de exemplo que vem com o Windows: Wildlife.wmv

Clique com o botão direito sobre o nome da solução e selecione Add -> New Folder e informe o nome Videos;

A seguir inclua nesta pasta o vídeo que deseja exibir. No exemplo estou usando o vídeo Wildfile.wmv.

A seguir vamos definir dois arquivos na pasta Views sub pasta Home:

FlashPlayer.vbhtml - página que exibira um vídeo do youtube no formato flash;
MediaPlayer.vbhtm - página que irá exibir um vídeo no formato .wmv;

Para executar vídeos Flash usamos o web helper Video.Flash onde o único parâmetro obrigatório é o path que pode ser um arquivo local ou um arquivo do YouTube, os demais parâmetros são opcionais. Veja a relação dos parâmetros opcionais a seguir:

Vídeos Flash:

path – o caminho do arquivo de vídeo;
width – a largura do vídeo renderizado na página web;
height - a altura do vídeo renderizado na página web;
play – determina se o vídeo será executado imediatamente;
loop – determina se o vídeo reiniciará novamente após terminar de ser executado;
menu – Indica se um o menu de contexto estará visível;
bgColor – determina cor de fundo do helper;
quality – indica a qualidade do vídeo.Os valores incluem : low, autolow, autohigh, medium, high, e best;
scale – determina o tamanho do vídeo. Os valores possíveis são: exactfit, showall and noorder;

Vídeos Windows Media:

Para executar vídeo WMV usamos o web Helper Video.MediaPlayer. O único parâmetro obrigatório é o path. A seguir a lista de parâmetros opcionais:

path – o caminho do arquivo de vídeo;
width – a largura do vídeo renderizado na página web;
height - a altura do vídeo renderizado na página web;
autoStart – determina quantas vezes o vídeo será executado;
uiMode – indica qual controle será exibido na interface com o usuário. Valores :invisible, none, mini, ou full
stretchToFit – determina se o vídeo se ajustará a largura e altura definidas;
enableContextMenu – determina se o menu de contexto irá aparecer quando o botão direito for pressionado sobre o vídeo;
mute – Desliga o som;
volume – Controla o volume;

Vídeos Silverlight:

Para executar vídeos SilverLight usamos o web Helper Video.SilverLight. O único parâmetro obrigatório é o path. A seguir a lista de parâmetros opcionais:

path – o caminho do arquivo de vídeo;
width – a largura do vídeo renderizado na página web;
height - a altura do vídeo renderizado na página web;
bgColor – determina a cor de fundo do vídeo;
autoUpgrade – determina se o controla irá ou não ser atualizado para uma nova versão do SilverLight se esta estiver disponível;

O código do arquivo FlashPlayer.vbhtml é dado a seguir:

Usando a sintaxe Razor temos : @Video.Flash(path: url, width,height,play,loop,menu,bgcolor,quality,scale e windwMode)

A seguir temos o código do arquivo MediaPlayer.vbhtm :

A sintaxe usada é : @Video.MediaPlayer(path : caminho, width, height, autoStart, playcont, uiMode, stretchToFit, enableContextmenu, mute, volume)

Nota: para saber mais sobre a sintaxe Razor veja o meu artigo: ASP .NET - Apresentando a sintaxe Razor - Macoratti.net

A seguir vamos definir na página Index.vbhtml os links para as duas páginas criadas acima:

O último ajuste é definir o Controller para poder acessar as páginas na pasta Views.

Abra a pasta Controllers e em seguida o arquivo HomeController.vb e defina o código conforme abaixo:

No arquivo HomeController.vb criamos dois controller um para acionar a view MediaPlayer e outro para acionar a view FlashPlayer.

Agora sim temos tudo pronto bastando executar o projeto.

Executando o projeto iremos ter o formulário de apresentação:

Clicando no link para exibir o vídeo Flash iremos obter:

Clicando no botão para executar o vídeo teremos o vídeo do YouTube executando na sua página web;

O procedimento para o vídeo no formato media player é idêntico.

Pegue o projeto completo aqui: Helpers-MVC-Razor.zip (sem as referências ao web-helpers e o vídeo)

Obs: Se desejar obter o vídeo procure no Google por : Evangelho em 3 minutos.

Simples , simples assim...

Eu sei é apenas ASP .NET e Web Helpers, mas eu gosto...

Referências:

José Carlos Macoratti

ASP .NET - Apresentando o ASP .NET MVC 3 - Macoratti.net