PDAclub.pl - Forum użytkowników technologii mobilnych
Windows Mobile (Classic, Professional, Standard), Windows Phone 6.x oraz 7/8.x/10 => Oprogramowanie PPC => Wątek zaczęty przez: Reynevan w Listopad 17, 2006, 20:56:38
-
Ok, no to postanowilem napisac maly tutorial, jak stworzyc wlasny szalbon dla SPB Insight :)
Bedzie to na przykladzie szablonu Sport | onet.pl. Newsy beda sciagane z tej strony (http://sport.onet.pl/0,0,wiadomosci.html).
Generalnie chodzi o analize kodu strony, takze znajomosc (nawet niewielka) HTMLa i CSSa bedzie bardzo pomocna.
<?xml version="1.0"?>
<template version="1.0">
<channel>
<name>Sport | onet.pl</name>
<url>http://sport.onet.pl/0,0,wiadomosci.html</url>
</channel>
Poczatek naszego szablonu - nie zmieniamy nic oprocz oczywiscie nazwy (pomiedzy tagami <name>) i adresu stronki na ktorej mieszcza sie interesujace nas newsy (pomiedzy tagami <url>).
<parse_channel> <![CDATA[
var d = new Document(channel.url, "iso-8859-2");
var tags = d.getElementsByAttr("a", "class","a2b");
for (i in tags) {
var href = tags[i].getAttribute("href");
var article = new Article();
article.id = href;
article.url = href;
article.header = tags[i].innerText;
channel.articles.push( article );
}
]]> </parse_channel>
Ta czesc odpowiada za "wyizolowanie" naszych newsow z calej strony. Dla kazdego takiego newsa bedziemy tworzyc obiekt klasy Article (czyli pojedynczy artykul).
Na poczatku tworzymy sobie dokument d:
var d = new Document(channel.url, "iso-8859-2");
W tym wierszu praktycznie nie zmieniamy nic oprocz kodowania (tutaj: iso-9959-2). Wiekszosc stron jest kodowana wlasnie w ten sposob, czasem moze byc kodowanie utf-8. Rodzaj kodowania odczytujemy oczywiscie z kodu zrodlowego strony.
var tags = d.getElementsByAttr("a", "class","a2b");
Tutaj tworzymy sobie tablice tags, w ktorej trzymamy wszystkie tagi <a>, klasy "a2b" czyli w kodzie strony musi byc cos takiego:
<a href="jakistamlink.pl" class="a2b">opislinku</a>
Teraz zajmiemy sie wybraniem atrybutow dla naszego artykulu, odpowiadac za to bedzie nastepujaca petla:
for (i in tags) {
var href = tags[i].getAttribute("href");
var article = new Article();
article.id = href;
article.url = href;
article.header = tags[i].innerText;
channel.articles.push( article );
}
Generalnie kazdemu, kto choc troche mial stycznosc z programowaniem bedzie bardzo latwo zrozumiec o co tu chodzi. Ale postaram sie wyjasnic dla tych, ktorzy nie sa zbyt mocni w tym temacie :)
Otoz tags jest to i-ty element naszej tablicy wszystkich linkow (tagow <a>). Zeby stworzyc artykul musimy koniecznie okreslic przynajmniej jego 3 parametry: id (numer identyfikacyjny artykulu - o tym wspomne pozniej), url (czyli adres(link) do danego aqrtykulu/newsa) oraz header (czyli opis artykulu/newsa jaki bedzie widoczny liscie artykulow po wybraniu kanalu). Linijka:
var href = tags[i].getAttribute("href"); sluzy do wyciagniecia adresu (pobrania do zmiennej o nazwie href wartosci parametru href tagu <a>). Potem juz tylko przypisujemy konkretnym parametrom artykulu wyciagnieta wartosc href - id artykulu takze bedzie mialo wartosc zmiennej href, a to dlatego iz program w czasie aktualizacji sprawdza czy artykul o danym id nie zostal juz pobrany wczesniej. Kazdy artykul musi miec unikatowe id, a kazdy link do osobnego artykulu jest wlasnie inny. Naglowek (header) artykulu ustalamy poprzez:
article.header = tags[i].innerText;Jest to oczywiscie wyciagniecie textu pomiedzy tagami <a> (opis linka).
Nastepnie zostaje nam juz tylko dopisac artykul do listy poprzez:
channel.articles.push( article );
Na tym konczy sie pierwsza czesc naszej pracy. Pozostala nam teraz analiza kodu pojedynczego artukulu/newsa.
<parse_article> <![CDATA[
var d = new Document(article.url, "iso-8859-2");
var date = d.getElementsByAttr("div", "class", "a09 sz")[0].innerText;
var wstep = d.getElementsByAttr("div", "class", "a2b")[0].innerText;
var tresc = d.getElementsByAttr("div", "class","a2")[0].innerHTML;
if (d.getElementsByAttr("img", "class", "mb2")[0]) {
var nodeImage = d.getElementsByAttr("img", "class", "mb2")[0];
var imageSrc = nodeImage.getAttribute("src");
var imageDescr = d.getElementsByAttr("td", "class", "a0")[0].innerText;
var imageTag = "<center><br><br><img src=" + imageSrc + "><br>" + imageDescr + "</center><br>";
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b>" + imageTag + tresc;
}
else {
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b><br><br>" + tresc;
}
]]> </parse_article>
</template>
Podobnie jak poprzednio tworzymy sobie zmienna d jako nowy dokument z odpowiednim kodowaniem. I teraz zaczyna sie juz wlasciwie dowolnosc. Otoz kazda strona jest inna i nie ma idealnego przepisu jak zbudowac ta czesc. Musimy ponownie zaglebic sie w kod strony. W tym przypadku mozna zauwazyc, ze niektore newsy maja zdjecia a niektore nie, za to kazdy ma jakby date i wstep (ktory na stronie jest pogrubiony) oraz oczywiscie sama tresc newsa. Mozna zauwazyc, ze text z data jest zawarty pomiedzy tagami <div class="a09 sz"></div>. Wyciagamy wiec text spomiedzy tych tagow do zmiennej date w ten oto sposob (podobnie jak wyciagalismy wartosc href z <a> w pierwszej czesci):
var date = d.getElementsByAttr("div", "class", "a09 sz")[0].innerText;W ten sam sposob radzimy sobie z wstepem, jak rowniez z sama juz trescia, jednak w tym przypadku nie pobieramy tylko czystego tekstu, ale caly kod HTML:
var tresc = d.getElementsByAttr("div", "class","a2")[0].innerHTML;a to dlatego aby widoczne byly np wytluszczenia druku, podkreslenia itp. (realizowane przez html wlasnie). Jak juz wspomnialem nie wszystkie newsy maja zdjecia, wiec musimy to sprawdzic:
if (d.getElementsByAttr("img", "class", "mb2")[0]) {
var nodeImage = d.getElementsByAttr("img", "class", "mb2")[0];
var imageSrc = nodeImage.getAttribute("src");
var imageDescr = d.getElementsByAttr("td", "class", "a0")[0].innerText;
var imageTag = "<center><br><br><img src=" + imageSrc + "><br>" + imageDescr + "</center><br>";
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b>" + imageTag + tresc;
}
Zastosowalismy instrukcje warunkowa if i jezeli istnieje obiekt <img class="mb2"> to wykonamy wszystkie instrukcje zawarte pomiedzy { i }. Natomiast jesli zdjecia nie ma to wykona sie:
else {
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b><br><br>" + tresc;
}
W powyzszych linijkach zajmujemy sie takze formatowaniem naszego artukulu, czyli jak ma on wygladac na ekranie naszego PDA. body jest to parametr naszego artykulu odpowiadajacy co bedzie wyswietlane. Do niego wrzucamy po kolei wszystkie nasze zmienne (date, wstep, tresc) odpowiednio wszystko formatujac (uzywajac standardowego formatowania html).
Nie zawsze jednak takie dzialania sa potrzebne (stosowanie warunkow if), poniewaz czesto mozna pobrac cala tresc newsa jako tresc i wtedy w pobranym kodzie html beda znajdowaly sie te obrazki (nie potrzebne moga byc rowniez zmienne date i wstep), to wszystko zalezy od strony i jak zostala ona stworzona. Jesli analizowaliscie inne szablony to pewnie zauwazyliscie ze niektore bardzo sie roznia od siebie, takze w gruncie rzeczy trzeba samemu kombinowac i probowac :)
Na koniec caly szablon:
<?xml version="1.0"?>
<template version="1.0">
<channel>
<name>Sport | onet.pl</name>
<url>http://sport.onet.pl/0,0,wiadomosci.html</url>
</channel>
<parse_channel> <![CDATA[
var d = new Document(channel.url, "iso-8859-2");
var tags = d.getElementsByAttr("a", "class","a2b");
for (i in tags) {
var href = tags[i].getAttribute("href");
var article = new Article();
article.id = href;
article.url = href;
article.header = tags[i].innerText;
channel.articles.push( article );
}
]]> </parse_channel>
<parse_article> <![CDATA[
var d = new Document(article.url, "iso-8859-2");
var date = d.getElementsByAttr("div", "class", "a09 sz")[0].innerText;
var wstep = d.getElementsByAttr("div", "class", "a2b")[0].innerText;
var tresc = d.getElementsByAttr("div", "class","a2")[0].innerHTML;
if (d.getElementsByAttr("img", "class", "mb2")[0]) {
var nodeImage = d.getElementsByAttr("img", "class", "mb2")[0];
var imageSrc = nodeImage.getAttribute("src");
var imageDescr = d.getElementsByAttr("td", "class", "a0")[0].innerText;
var imageTag = "<center><br><br><img src=" + imageSrc + "><br>" + imageDescr + "</center><br>";
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b>" + imageTag + tresc;
}
else {
article.body = "";
article.body += "<i><small>" + date + "</small></i><br><br><b>" + wstep + "</b><br><br>" + tresc;
}
]]> </parse_article>
</template>
Dosyc wkurzajaca rzecza jest to, ze jesli popelnimy jakis blad, to kanal nie bedzie nam nic wyswietlal, albo bedzie wyswietlal artykuly bez zadnej tresci. Nawet mala literowka moze byc tego przyczyna :) Z doswiadczenia wiem, ze czasami naprawde wiele razy trzeba testowac szablon zanim bedzie dzialac poprawnie :)
Mam nadzieje, ze choc troche ten tekst komus ulatwi robienie szablonow do SPB Insight, oczywiscie w miare mozliwosci bede robil nowe dla uzytkownikow tego forum. Przepraszam za ewentualne bledy i brak polskich znakow (tak juz mam) ;)
-
Super tutorial - dzieki :ok:
Moze wreszcie stworze swoj szablon ...
-
Dzieki za tutorial :) Teraz czekamy na tworcze prace naszych forumowiczow ;) Jak ktos zrobi jakies szablony to piszcie do mnie na priv, ja je wstawie do downloadu.
-
brawo!! dziękuję też, potestuję niebawem.
-
Fajny tutorial!
A tak nie z tematu - czyżby SPB Insight, ostatnio głośny czytacz RSS, nie potrafił czytać normalnych plików XML, jakie ofertuje także onet? Trzeba za każdym razem tworzyć szablon? Jeśli tak to porażka :terrified:
-
Fajny tutorial!
A tak nie z tematu - czyżby SPB Insight, ostatnio głośny czytacz RSS, nie potrafił czytać normalnych plików XML, jakie ofertuje także onet? Trzeba za każdym razem tworzyć szablon? Jeśli tak to porażka :terrified:
Oczywiscie ze potrafi, zamiast szablonu wybierasz po prostu RSS/Atom przy dodawaniu nowego kanalu i wpisujesz sciezke do konkretnego rssa (xmla). Tylko, ze wtedy bedzie wyswietlal to co autor serwisu chce, a najczesciej nie jest to pelny artykul :)
-
ok amm pytanie co do szablonów zawze wiadomo ze lepiej jest czytac co i odrazu to zobaczyc tylko cos nie za bardzo sie lapie w tym tutorialu czy ja mam wpisac tylko adres i nazwe a reszte zostawic w spokoju?? jesli spogladam na ten tutorial i na szablony które sa juz gotowe to wyglada identycznie wpisuje inna strone interenetowa nazwe i nie dziala wykrywa mi szablon w spb ale nie laduje sie nic??
-
ok amm pytanie co do szablonów zawze wiadomo ze lepiej jest czytac co i odrazu to zobaczyc tylko cos nie za bardzo sie lapie w tym tutorialu czy ja mam wpisac tylko adres i nazwe a reszte zostawic w spokoju?? jesli spogladam na ten tutorial i na szablony które sa juz gotowe to wyglada identycznie wpisuje inna strone interenetowa nazwe i nie dziala wykrywa mi szablon w spb ale nie laduje sie nic??
Niestety nie jest to takie latwe jak myslisz. Jesli bys sie przyjrzal uwazniej innym szablonom, to zobaczylbys, ze roznia sie od siebie (czasem nawet bardzo). Wszystko zalezy od tego jak zostala stworzona strona. Generalnie, jak pisalem, chodzi o przegladanie kodu HTML i na tej podstawie pisanie szablonu. Zmienic strone i nazwe mozna tylko wtedy kiedy jest to np. inny typ danego serwisu (tak jak jest to zrobione dla roznych miast na gazeta.pl)
-
ok przyjrze sie temu blizej ale po wekeendzie boteraz mam kupe pracy. co do szblonow to moje pytanie brzmi czy dalo bysie zrobic cos takeigo na allegro?? czyli ze ma pokazywac cala pierwsza strone raze ze zdjeciami a potem tak jak sie wchodzi do artykulu wchodzilo by sie do danej aukcji??
jesli by sie dalo to czy mógl by ktoś umiesci dla przykladu (nie wiem czy w gre wchodzi sortowanie w allegro czyli wg ceny, wg czasu) przykladowo pierwszych 20 laptopów??
-
Hmm, tak teraz przejrzalem sobie wstepnie allegro i wydaje mi sie, ze byloby to mozliwe. Mozliwe jest zrobienie szablonu dla prawie kazdej strony, do ktorej jest konkretny odnosnik. Jesli wyswietlisz sobie konkretna liste przedmiotow z allegro i sobie juz posortujesz, to wszystkie informacje sa zawarte jako parametry przekazywane w adresie konkretnej podstrony allegro. Innymi slowy po prostu tworzony jest link, ktory otworzony w przegladarce zawsze da nam strone z zadanymi parametrami. Oczywiscie sortwanie albo inne wyszukiwanie w samym SPB Insight jest niemozliwe, mozna co najwyzej zrobic kilka szablonow...
-
zaczalem cos rzezbic, nawet sie pokazuje w Insight, ale za cholere nie orientuje sie w programowaniu w javie.
Pytanie: jest niemiecka strona spiegel.de, witryna /auto
Newsy rss rozwiniete do postaci strony maja adres np. taki:
http://www.spiegel.de/auto/fahrberichte/0,1518,465424,00.html
natomiast wersja tej strony do druku ma adres:
http://www.spiegel.de/auto/fahrberichte/0,1518,druck-465424,00.html
czyli rozni sie tylko dopiskiem druck-
W jaki sposob mozna siegnac do wersji do druku, ktora jest prostsza?
-
zaczalem cos rzezbic, nawet sie pokazuje w Insight, ale za cholere nie orientuje sie w programowaniu w javie.
Pytanie: jest niemiecka strona spiegel.de, witryna /auto
Newsy rss rozwiniete do postaci strony maja adres np. taki:
http://www.spiegel.de/auto/fahrberichte/0,1518,465424,00.html
natomiast wersja tej strony do druku ma adres:
http://www.spiegel.de/auto/fahrberichte/0,1518,druck-465424,00.html
czyli rozni sie tylko dopiskiem druck-
W jaki sposob mozna siegnac do wersji do druku, ktora jest prostsza?
Na pierwszy rzut oka prostsza wersja będzie ta normalna (nie do druku), poniewaz, jest zbudowana na divach o konkretnych atrybutach id. Wiec latwiej jest wybrac odpowiednia tresc. W razie jakichs problemow pisz na PW.
-
@Reynevan możesz wrzucić jakieś zrzuty ekranu żeby można było zobaczyć te szablony wyglądają w praktyce?
-
tutaj (http://www.pdaclub.pl/forum/viewtopic.php?t=52883&start=0) jest troche screnow, poza tym na stronie SPB tez na pewno sa :) Jakby cos, to zrobie pozniej jeszcze kilka i wrzuce
-
Reynevan
kurcze no próbuje ale sie nie udaje :(
bo widziałem jak zrobiłeś inne szblony np gram.pl to tam inne było wyszukiwanie tematów po nazwie b2 :D
dobra nie znam sie na tym
pisałem kiedyś programy ale w delphi i stronki tez robiłem ale dawno i nic nie pamiętam :( fcuk
ale sie nie poddaje
a może byś zrobił szblonik do
http://www.grynx.com
i zamieścił szablonik to wtedy może zrozumiem :)
bo się tak łatwo nie poddam :)
-
Jak tylko znajde chwile czasu, to postaram sie zrobic szablon do tej stronki.
Nie poddawaj sie, mi tez od razu nie wychodzilo :)
-
tzn rss z niej działa jak podam adres ale chciałem zobaczyc jak ma wyglądać szablonik
dzięki
-
zrobilem szablon do GRYNX.com, do pobrania stad (http://www.chodak.com.pl/kamil/templates/grynx.rar)
-
no działa znakomicie dzięki.
Próbowałem go rozgryść - mmm ciężko idzie :)
Jest inaczej niz tutorial. inaczej są wyszukiwane elementy.
Ale jest to zależne od strony z której chcemy pobrac informacje :)
przejze całą paczke którą udostępniłeś i wkońcu to rozkminie :)
wielkie dzięki
-
No jest troszke inaczej, ale praktycznie zawsze beda jakies roznice. Akurat ten szablon byl dosyc latwy.
W skrocie musimy z glownej strony wyizolowac linki to poszczegolnych artykulow. Linki sa ta po prostu znaczniki <a> z roznymi parametrami a parametr href to wlasnie adres (to wlasciwie podstawy html'a). A wiec <a href="http://www.jakistamadres"> to link do artykulu. Patrzac na kod strony www.grynx.com mozna zauwazyc, ze linki te sa zawsze i tylko w znaczniku <h3> o parametrze class rownym storytitle np: <h3 class="storytitle" id="post-229"><a href="http://www.Grynx.com/2007/03/18/wine-in-laptop-is-that-really-a-good-idea/" rel="bookmark" title="Permanent Link to Wine in laptop - is that really a good idea?">Wine in laptop - is that really a good idea?</a></h3>.
Potem z kazdego takiego elementu h3 wyciagamy element a. Nastepnie wyciagamy wartosc parametru href znacznika a oraz tekst wewnatrz znacznikow <a></a>. Potem to juz tylko analiza kodu pojedynczego artykulu. Tresc artykulu znajduje sie w znaczniku <div> o klasie rownej storyContent (<div class="storyContent">). Mozna tez odseparowac date - znajduje sie w znaczniku <h2>. Potem tylko jako tresc tego co ma sie pokazac w SPB Insight laczymy date i tresc.
Mam nadzieje, ze choc troche to ulatwi, bo chyba raczej za dobrze nie tlumacze ;)
-
ja raczej nie nigdy używam SPB Insight. Tylko czasami gdy są jakieś dowcipy z basha :D a szablony to tego to dla mnie spam
-
ja raczej nie nigdy używam SPB Insight. Tylko czasami gdy są jakieś dowcipy z basha :D a szablony to tego to dla mnie spam
Chyba nie za bardzo rozumiem co napisałeś. Szablony do SPB Insight to dla Ciebie spam? Co masz na mysli?
-
Ja uważam że poprostu szablony do tego programu to zbędna rzecz (przynajmniej dla mnie )
-
Ja uważam że poprostu szablony do tego programu to zbędna rzecz (przynajmniej dla mnie )
A dlaczego? Wystarczają ci te "wbudowane"?
-
Ja uważam że poprostu szablony do tego programu to zbędna rzecz (przynajmniej dla mnie )
No to juz bardziej ma sens, niz twierdzenie, ze jest to spam, bo chyba mylisz pojecia. Poza tym, nie potrzebujesz szablonow - nie sciagasz ich. Nie potrzebujesz SPB Insight - nie kupujesz, nie instalujesz. Krotka pilka, nie ma sie co rozpisywac o kazdej aplikacji, ktorej nie potrzebujesz :)
Ale to juz jest OT, bo nie o tym jest ten temat. Na dyskusje na temat samego programu jest inny temat, nie zasmiecajmy juz tego.
-
Troche odgrzewanie ale mam pytanie i narazie nie moge się przez to przebić. Czy da się zrobić taki szablon aby SPB Insight pobierał cały artykuł od razu a nie dopiero jak nacisne "Kliknij aby pobrać cały artykuł"?? I jak to zrobić. Może być na przykładnie PDAClub:P
-
U mnie zawsze ściąga cały. "Kliknij aby pobrać cały artykuł" widziałem tylko parę razy jak w trakcie ściągania przypadkowo mnie odłączyło od neta i artykuł był pobrany częściowo.
-
Panowie ....tylko nie strzelajcie.... czy ktoś potrafił zrobić szablon do "Łowcy Polskiego" lub innej gazety dla naszych szanownych myśliwych... znajomy myśliwy szuka takiego szablonu i prosił mnie już kilkanaście razy o taki (mam w tym interes... bo obiecał mi wskazać miejsce upadku Fw-190 lub prawdopodobnie Me 109G)..a ja w tematach szablonów jestem niestety cienki....
-
Hmm, u mnie ściąga zawsze tylko nagłówki, niezależnie od czasu połączenia do neta. Dopiero po wejściu w artykuł i tapnięciu linka ściąga całość :/
Edit:
Jednak okazało się że jestem tępym strzałem i wystarczyło nad tym siąść po %. Wystarczy odptaszkować "Ręczna aktualizacja artykułów" i wszystko smiga :D
-
Witajcie
A czy jest możliwość napisania szablonu dla allegro.pl albo otomoto.pl żeby informowało o pojawieniu się ogłoszeń spełniających pewne kryteria wyboru auta (np.: renault, megane II, diesel, powyżej 2001r itd.).
Było by to bardzo przydatnie, myślę, że nie tylko dla mnie.
:worried:
-
Do tego chyba nie trzeba specjalnie robić szablonu. Wystarczy z poziomu Allegro utworzyć kanał rss (może to być kanał dla konkretnych parametrów wyszukiwania) - jest do tego na stronie zrobiony przycisk "RSS dla tych wyników wyszukiwania". Ten kanał potem wystarczy wrzucić do czytnika RSS na PDA.
Co do otomoto.pl to nie wiem, nie sprawdzałem czy jest podobna możliwość.
-
Wielkie dzięki, o to chodziło :ok:
-
A jeszcze jedno. Bardzo przydałyby mi się najnowsze wiadomości z http://www.gdansk.pl/
Ktoś da radę, stawiam browarka B)