Mostrar apenas uma parte de uma webpage

[PedroWieira]

Viva,

Preciso de fazer uma aplicação que apenas mostra uma determinada parte de uma página, por exemplo imagem uma página com o header o corpo e o footer, e eu quero fazer uma aplicação desktop que apenas mostra o corpo da página ou seja o header e o footer não vão aparecer na aplicação.

O corpo da página esta devidamente assinalado: <div id="corpo_pag">...</div>

Obrigado pela vossa atenção e espero que me consigam ajudar.

[Lukas S.]

hmm isso que queres mostrar encontra-se no inicio da página ou a meio ? vais dar a possibilidade do utilizador alterar o tamanho do programa ?(redimensionar) ou ele pode aumentar o componente webbrowser?

Edited July 23, 2012 at 10:43 PM by Lukas S.

[PedroWieira]

hmm isso que queres mostrar encontra-se no inicio da página ou a meio ? vais dar a possibilidade do utilizador alterar o tamanho do programa ?(redimensionar) ou ele pode aumentar o componente webbrowser?

Viva,

Pois onde tu queres chegar eu já cheguei, basicamente o que queres indica é esconder a scrool bar ou abrir a x posição na scrool.

O conteudo está a meio da página (o header tem X px em qualquer página que seja ou seja o corpo começa sempre na mesma posição) mas o corpo tanto pode ter altura de 150px como de 750px no mesmo ficheiro web...

[Lukas S.]

hmmmm já tentaste por metodo regex?

[PedroWieira]

hmmmm já tentaste por metodo regex?

Viva,

Como assim pelo regex?

Eu achei outra forma, é possivel enviar comandos para editar o css? Tipo exemplo assim abri a página e mandava o css "visibility:hidden;" para o header e para o footer e assim já so ficava com o corpo. É possivel?

Obrigado pela tua coloboração Try-Catch User 😉

[Lukas S.]

Meu nome é Lukas S. essa é a minha categoria 😉 ....

Regex ele lê a página inteira e retorna aquilo que procuras .... A página encontra-se sempre em atualização? Caso afirmativo o método regex é a melhor solução ....

Há uns tempos atrás para estudar esta funcionalidade eu tive a "brincar" com regex ... Deixo-te uma pedaço de código que não sei ainda se funciona está comentado e pronto a ser usado 😉 foi á uns 2 anos atrás por isso ainda duvido que funcione ..

Deixo-te aqui o código todo .... para isto necessitas

-listbox

-2 botoes

Neste caso usei para encontrar texto mas podes usar para encontras as medidas ou onde se localiza o código onde te diz o que precisas de saber para determinar onde o componente webbrowser vai ficar ...

O exemplo embaixo retornava-me da MTV Portugal a programação 😉

Imports System.Text.RegularExpressions
Public Class Form1
Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
	Dim request As System.Net.HttpWebRequest = System.Net.HttpWebRequest.Create("http://www.mtv.pt/programas/programacao/mtv/") ' Faz download da página
	Dim response As System.Net.HttpWebResponse = request.GetResponse ' dá a resposta do site guardando na variável
	Dim sr As System.IO.StreamReader = New System.IO.StreamReader(response.GetResponseStream()) ' passa de bytes pra texto e obtem a resposta guardando em Sr
	Dim rssourcecode = sr.ReadToEnd ' le até ao fim do ficheiro
	'<a href="/programas/Pure-Morning-MTV/" title="Pure Morning" class="titlelink " >Pure Morning</a></div> </td> <td class="show_episode"> Pure Morning
	Dim r As New System.Text.RegularExpressions.Regex("<a href=""/programas/.*/"" title="".*"" class=""titlelink "" >.*</a></div> </td> <td class=""show_episode""> .* </td> </tr>") ' o ponto significa para copiar e o asteristico as vezes a repetir
	Dim Matches As MatchCollection = r.Matches(rssourcecode) ' respostas encontradas
	For Each itemcode As Match In Matches ' por cada item encontrado
		ListBox1.Items.Add(itemcode.Value.Split("""").GetValue(3)) ' mostra o que separa dai os """" as strings do regex e diz para obter o valor da terceira string
	Next
	Button1.Enabled = False
End Sub
Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
	ListBox1.Items.Clear()
	Button1.Enabled = True
End Sub
End Class

Edited July 24, 2012 at 04:45 PM by Lukas S.

[PedroWieira]

Desculpa o erro Lukas 😉

Pois mas eu quero trabalhar mesmo no proprio browser, porque a página tem inputs e um botão e o utilizador tem de preencher dois inputs (onde a medidade que o utilizador vá escrevendo a palavra chave vai aparecendo o resultado pedido e ao clicar vai passar o id desse resultado para o input (devem estar a usar Ajax para isto acontecer)) e clicar no botão e tenho de apresentar o resultado.

Vou dar um exemplo (não é o pretendido mas é do genero):

No vosso facebook imagem que querem publicar um video do youtube.

Vão ao facebook e tem a seguinte caixa:

Colocam a URL do Video e irá ficar assim:

E depois clicam no botão publicar e ficará na base de dados do Facebook.

Bem eu quero fazer um Sofware que (neste exemplo) só me mostre a caixa de publicação do Facebook e que me funcione no Browser, ou seja se eu no meu Software tiver a caixa de publicação do Facebook e colocar lá um Link (ele vai alterar porque o facebook tem Ajax para tal acontecer) e ao clicar no botão "Publicar" ele fica no mural do Facebook. Isto tudo no Software (sem recursos a API's) mas sem mostrar o Header do Facebook por exemplo.

[Rui Carlos]

Provavelmente a forma mais simples de fazer isso é usando uma custom stylesheet (uma funcionalidade que vários browsers disponibilizam), em que escondes os elementos que não queres ver.

Em MacOSX, algo do género penso que seria simples de fazer usando widgets (não sei se os gadgets do windows são semelhantes).

Caso contrário, penso que a tua aplicação terá que conter um motor de um browser, o que deve aumentar um pouco a complexidade da mesma.

Para extraíres a div que queres, aconselho-te a usar uma biblioteca de XML, pois deve ser um método mais fiável que expressões regulares.

[PedroWieira]

Provavelmente a forma mais simples de fazer isso é usando uma custom stylesheet (uma funcionalidade que vários browsers disponibilizam), em que escondes os elementos que não queres ver.

Em MacOSX, algo do género penso que seria simples de fazer usando widgets (não sei se os gadgets do windows são semelhantes).

Caso contrário, penso que a tua aplicação terá que conter um motor de um browser, o que deve aumentar um pouco a complexidade da mesma.

Para extraíres a div que queres, aconselho-te a usar uma biblioteca de XML, pois deve ser um método mais fiável que expressões regulares.

Viva,

O controlo WebBrowser em VB.Net trabalha com o IE. Como faço para usar o "custom stylesheet" via código?

A aplicação tem de ser feita para Windows, que a partida irá rodar num sistema operativo XP ou Win7, desde que tenha a framework é o que interessa neste caso, secalhar o que pode influenciar é a versão do IE mas nada como meter num dos requisitos a versão do IE.

Pois, não sei como vou conseguir arranjar um motor de um Browser e mesmo que tenha o motor vai dar um trabalhão a fazê-lo.

Não tens nenhum código exemplo do "custom stylesheet". Eu meti em VB.net mas pode ser em outra linguagem, porque basicamente a aplicação é o site.

Obrigado pela colaboração 😉

Edited July 25, 2012 at 12:54 PM by PedroWieira

[Lukas S.]

Opá vou tentar fazer algo assim ... não prometo nada pois nunca fiz isso mas se conseguir posto aqui o resultado ... queres um form com submit certo ? que só apareca o form ? e o submit ?

[PedroWieira]

Opá vou tentar fazer algo assim ... não prometo nada pois nunca fiz isso mas se conseguir posto aqui o resultado ... queres um form com submit certo ? que só apareca o form ? e o submit ?

Obrigado pela tua colaboração e esforço Lukas.

O Form e o Submite estão na página Web, esta página é feita em ASP.net e no Input do Form tem o evento OnTextChanged que à medidade que vais escrevendo vai aparecendo o que queres (tipo o pesquisa do Google) e depois tens de clicar o que queres e aquilo passa o ID para algum sitio (provavelmente para a Tag desse Input) e depois clicas no botão e ele traz o resultado.

Ou seja tu não tens de programar nada, apenas tens de conseguir ter a página a trabalhar em tempo real (porque se tiveres sacado a página aquilo vai perder o Evento OnTextChanged uma vez que estás em HTML e já não aparecem resultados à medida que vais escrevendo).

Por isso a melhor solução é conseguir enviar para Browser (o controlo WebBrowser do Visual Studio) qualquer coisa que diz para modificar o CSS. Se usas o Firefox clica no botão direito e selecciona a opção "Inspecionar elemento (Q)" e podes estar a alterar a página (só no PC claro) e podes continuar a usar as funcionalidades da página (porque continuas ligada a ela).

O melhor exemplo mesmo é a caixa de publicar no Facebook, vê o meu post anterior que explico como quero que funcione.

Eu já tive a procurar e até mesmo em outras linguagens e não encontrei nada. Alguem sabe de algum controlo para aplicar ao Visual Studio que seja um Browser? Para ver se esse controlo tem alguma opção que me permita tal.

Mais uma vez obrigado.

[Lukas S.]

Ja tentaste usar o gecko ?

[Rui Carlos]

Penso que o que precisas para .Net será mesmo a classe WebBrowser. Usando essa classe, deves poder simplesmente editar o código HTML da página, removendo o que estiver fora da div que tu queres (já sugeri anteriormente a utilização de uma biblioteca de XML para esse fim).

A ideia de usar uma custom stylesheet era não teres que implementar aplicações nenhuma. Usavas directamente o browser, personalizando a página com CSS. Não sei se o IE suporta custom stylesheets, mas o Chrome e o Safari suportam.

Para algo mais avançado do que custom stylesheets, tens também as extensões. Mais uma vez a ideia seria usares directamente o browser, e teres apenas algum código Javascript e CSS para personalizar a página.

[PedroWieira]

Ja tentaste usar o gecko ?

Isso nao é um Plugin para o Firefox? É que se for não vai dar, porque o controlo WebBrowser usa o IE.

[Lukas S.]

procuraste no google ? é uma biblioteca externa pro vb.net

http://en.wikipedia.org/wiki/Gecko_%28layout_engine%29

[Rui Carlos]

O Gecko é o motor do Firefox. Aparentemente existem formas de usar o Gecko a partir de aplicações .Net, mas mesmo assim não lhe chamaria uma bibliotecas externa para o vb.net.

[Lukas S.]

Eu diria que sim porque consigo usar componentes como inves de usar webbrowser aparecce GeckoBrowser ou algo assim .. cheguei a usar e é muito bom pra quem não gosta do IE

http://www.vbforums.com/showthread.php?t=616767

Imports Skybound.Gecko

faz import logo é biblioteca externa

Edited July 25, 2012 at 09:31 PM by Lukas S.

[Rui Carlos]

O meu ponto é que o Gecko é primariamente o motor do Firefox, i.e., foi para este propósito que foi desenvolvido. O facto de poder ser usado como biblioteca no .Net é secundário, na medida em que não foi com esse propósito que foi desenvolvido.

[PedroWieira]

Penso que o que precisas para .Net será mesmo a classe WebBrowser. Usando essa classe, deves poder simplesmente editar o código HTML da página, removendo o que estiver fora da div que tu queres (já sugeri anteriormente a utilização de uma biblioteca de XML para esse fim).

A ideia de usar uma custom stylesheet era não teres que implementar aplicações nenhuma. Usavas directamente o browser, personalizando a página com CSS. Não sei se o IE suporta custom stylesheets, mas o Chrome e o Safari suportam.

Para algo mais avançado do que custom stylesheets, tens também as extensões. Mais uma vez a ideia seria usares directamente o browser, e teres apenas algum código Javascript e CSS para personalizar a página.

Como assim utilizar uma biblioteca XML para tirar as divs? Irá manter-me a página em tempo real?

Eu diria que sim porque consigo usar componentes como inves de usar webbrowser aparecce GeckoBrowser ou algo assim .. cheguei a usar e é muito bom pra quem não gosta do IE

http://www.vbforums.com/showthread.php?t=616767

faz import logo é biblioteca externa

Já arranjei para o VB.net mas as funções que ele tem são pouco mais do que as do WebBrowser, já procurei no Google como editar código pelo GeckoBrowser e não aparece nada do que procuro -.-

|----|

Eu continuo a querer que seja em software desktop, mas estava a pensar se não é possivel eu meter a página numa iFrame e atraves da minha página enviar o CSS para lá, ou seja eu defino o CSS no meu ficheiro (ex. index.php) e ele ao apresentar a iFrame a página vai ficar alterada conforme o CSS.

Desconfio que dê dessa maneira, mas tambem já tentei com Ajax e jQuery e não consigo, porque assim ao imprimir a página na minha página talvez o meu CSS fizê-se efeito. Mas ele nunca me chega a carregar a página (tem outro dominio), mas ficheiro da minha página já carrega. Penso que se chame a isto cross-domain.

[PedroWieira]

Já fiz uma solução.

Criei um ficheiro html que continha uma Div e dentro dessa Div uma iFrame. Desta forma consigo mostrar uma determinada parte da página da iFrame.

Por exemplo quero mostrar só a parte dos destaques da página do www.sapo.pt

O código para resolver esta solução é o seguinte:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 0; }
#espaco { margin: 0; position: relative; width: 762px; height: 456px; overflow: hidden; }
#pag_frame { position: absolute; width: 1280px; height: 768px; top: -260px; left: -71px; overflow: hidden; }
</style>
</head>
<body>
<div id="espaco"><iframe id="pag_frame" src="http://www.sapo.pt/" frameborder="0"></iframe></div>
</body>
</html>

Como eu queria imbutir esta página numa aplicação Desktop tem duas formas:

Ou usar o comando WebBrowser.DocumentText="CÓDIGO AQUI!"

Ou então como eu trabalhava com Cookies na página guarde o ficheiro html no servidor apaccha localhost ou então num alojamento de um website seu e chama na URL do WebBrowser.

Problemas resolvido.

Porem o que eu queria mesmo era tambem conseguir editar essa página em tempo real, mas não é possivel na página que eu pretendia.