1 Jakub Binkowski Visual C# MVP webEFS sp.j.

2

3 GET i POST

4 Jak przekazać do JavaScriptu listę filmów? Jak zwrócić do serwera posortowaną listę?

5 KLIENTSERWER GET /Default.aspx POST /Default.aspx

6 1. Klient prosi o stronę. 2. Serwer generuje stronę. Dane serializuje do formatu JSON i umieszcza w ukrytym polu formularza. 3. Klient otrzymuje stronę. 4. Skrypt po załadowaniu strony deserializuje dane do postaci obiektowej.

7 Tekst: "Ala ma kota" Tablica: [1,2,3,4] Obiekt złożony: {fullname: "Jan Kowalski", age: 15, pets: [ {species: "dog", name: "Klops"}, {species: "goldfish", name: "Ryba"} ]}

8 1. Klient przed wysłaniem formularza serializuje dane do formatu JSON. Umieszcza je w ukrytym polu. 2. Formularz wysyłany jest na serwer. 3. Serwer deserializuje dane z formatu JSON do postaci obiektowej.

9 Po stronie serwera (ASP.NET): JavaScriptSerializer (Sys.Serialization) Po stronie klienta (JavaScript): JavaScriptSerializer (System.Web.Script.Serialization)

10

11 Dane początkowe

12 Jak przekazać kontrolce Silverlight listę filmów do odtworzenia?

13 1. Serwer serializuje dane do formatu JSON i umieszcza w ukryty polu formularza. 2. Kontrolka Silverlight otrzymuje w parametrach nazwę pola z danymi. 3. Silverlight odczytuje dane i je deserializuje do postaci obiektowej.

14 Umieszczane wewnątrz tagu : Odczyt w Silverlight w App.xaml: private void Application_Startup( object sender, StartupEventArgs e) { var url = e.InitParams["url"]; }

15 Klasa DataContractJsonSerializer (namespace: System.Runtime.Serialization.Json assembly: System.ServiceModel.Web) Dostęp do elementu HTML: HtmlPage.Document.GetElementById("elementID")

16

17 AJAX Web Services

18 Jak dodać komentarz, nie przerywając oglądania filmu?

19 KLIENTSERWER GET /Default.aspx POST /Default.aspx AJAX: /Service.svc …

20 Działanie: 1. Z poziomu JavaScript wywołujemy metodę WebServiceu 2. Otrzymujemy dane 3. Wyświetlamy dane na stronie Posługujemy się obiektami (przesyłane jako XML lub JSON) Z kodu JavaScript sprowadza się do wywołania zwykłej metody

21 [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [ScriptService] public class CatalogService : System.Web.Services.WebService { [WebMethod] public IList FindProducts(string filter) { //logika... }

22

23 Demo.CatalogService.FindProducts( 'blue', FindProducts_success, FindProducts_error); function FindProducts_success(results) { //pokaż produkty } function FindProducts_error(error) { //poinformuj o błędzie }

24 Metoda WebServiceu zawarta w stronie: [WebMethod] public static string[] GetComments() { return DataRepository.GetComments(); } Konfiguracja ScriptManagera: EnablePageMethods="true" Odwołanie z JavaScript: PageMethods.GetComments( GetComments_Success, GetComments_Error)

25

26 Sterowanie aplikacji Silverlight z poziomu JavaScriptu

27 Jak z poziomu JavaScript sterować odtwarzaczem?

28 Silverlight może udostępnić następujące elementy klasy: właściwości metody Zdarzenia Udostępnianie obiektu: HtmlPage.RegisterScriptableObject( "mediaPlayer", this);

29 Właściwość: [ScriptableMember] public double Volume { get; set;} Dostęp z JavaScript: var volume = get('silverlightControlHost').Content.mediaPlayer.Volume; get('silverlightControlHost').Content.mediaPlayer.Volume = volume + 0.1;

30 Właściwość: [ScriptableMember] public void Play(string url) {...} Dostęp z JavaScript: get('silverlightControlHost').Content.mediaPlayer.Play("vid.wmv");

31 Zdarzenie: [ScriptableMember] public event EventHandler MediaChanged; (tylko EventHandler i EventHandler ) Podłączanie się: $get('silverlightControlHost').Content.mediaPlayer.MediaChanged = playerMediaChanged; $get('silverlightControlHost').Content.mediaPlayer.addEventListener('MediaChanged', playerMediaChanged);

32

33 Web Services

34 Chcę móc śledzić ilość odtworzeń filmów…

35 Po stronie serwera – usługa WCF Po stronie klienta – proxy do usługi Tylko wywołania asynchroniczne

36 Tylko basicHttpBinding Odwołania tylko do domeny, z której pobraliśmy aplikację Chyba że…

37

38 Odwoływanie się do JavaScriptu z poziomu Silverlight

39 Dostajemy aktualną ilość odtworzeń, ale jak ją wyświetlić na stronie?

40 HtmlPage.BrowserInformation Informacje o przeglądarce HtmlPage.Document Dostęp do dokumenty HTML (DOM) HtmlPage.Window Dostęp do okienka przeglądarki HtmlPage.Plugin Element, w którym osadzona jest kontrolka Silverlight.

41 GetProperty SetProperty Invoke InvokeSelf ConvertTo

42 GetElementById QueryString Submit …

43 Alert, Confirm, Prompt Navigate …

44

45 Powiadomienia on-line z serwera

46 KLIENTSERWER Czy ktoś coś napisał? Nie Czy ktoś coś napisał? Nie Czy ktoś coś napisał? JK: Nigdy nas nie przekonają, że białe jest białe, a czarne jest czarne!

47 KLIENTSERWER Informuj mnie o nowych wiadomościach Bill: 640K ought to be enough for anybody Steve: Developers! Developers!… Close

48 Przekazywanie stanu przy GET i POST Odwołania asynchroniczne Współpraca po stronie klienta JavaScript Silverlight

49