понедельник, 4 июля 2011 г.

Как работать с javascript из silverlight приложения? Или void Silverlight from js!

Доброе время суток!
Сегодня я расскажу как работать с языком java script из приложения написаного на Silverlight, а так же как осуществить обратную связь, как из java script вызвать метод приложения silverlight или получить доступ к свойству silverlight программы.
Приступим!
Технология Silverlight позволяет очень просто работать с js скриптами, а также регистрировать функции js прям из программы Silverlight! Для доступа к DOM модели используется класс  HtmlPage. Пример вывода "HelloWorld" из программы Silverlight:
HtmlWindow htmlWindow = HtmlPage.Window;
htmlWindow.Eval("alert(\"HelloWorld!\");");
Что бы зарегистрировать свою функцию js из программы Silverlight:
string js = "function Hello()"+
               "{ alert(\"HelloWorld!\");}";
             var script = HtmlPage.Document.CreateElement("script");
            script.SetAttribute("type", "text/javascript");
            script.SetProperty("text", js);
            HtmlPage.Document.Body.AppendChild(script);

И теперь вы его можете вызвать через 
HtmlWindow htmlWindow = HtmlPage.Window;
htmlWindow.Eval("Hello();");

Теперь я расскажу как работать с методами Silverlight приложения из js.
Для этого Вам нужно зарегистрировать в вашем Silverlight приложении объект самого приложения:
 HtmlPage.RegisterScriptableObject("Page", this);
Теперь что бы обратится к этому объекту из js функции нужно найти на странице html контейнер с объектом Silverlight:
function Get_Silverlight()
{
   var silverlightObj_id;
  var reg = new RegExp("(SilverlightObjectTag)");                 
 var objects = document.getElementsByTagName("object");
                    for(i=0;i<objects.length;i++)
                   {                    if(objects[i].getAttribute("id")!=null)
                    {     var match=objects[i].getAttribute("id").match(re);
                    if(match!=null && match.length !=null && match.length > 0)
                   {      silverlightObj_id = objects[i].getAttribute("id");     }}}  return silverlightObj_id;}
Пример кода как можно найти объект Silverlight на странице Sharepoint если вы воспользовались вебпартом для вставки Silverlight. Используя jquery этот код станет в разы проще :)

Теперь что бы вызвать метод в Silverlight приложении нужно указать самому Silverlight приложению что этот метод доступен из вне программы:
[ScriptableMember()]
      public void HelloFromJs(string helloMessage)
      {
HtmlWindow htmlWindow = HtmlPage.Window;
htmlWindow.Eval("alert('"+helloMessage+"');");
       }
И что бы вызвать из js этот метод надо следующее:
function HelloToSilverlight()
                    {
                    var id = Get_Silverlight();//ее мы создали ранее
                   var control = document.getElementById(id);
                   control.content.Page.HelloFromJs("I am js"); //Page мы регистрировали как объект в //Silverlight приложении
                    }
Что бы получить доступ к переменной Silverlight приложении нужно ее обьявить в приложении
 [ScriptableMemberAttribute]
        public string SomeProperty { get; set; }

И доступ к ней будет осуществляться через control.content.Page.SomeProperty
Этот инструмент помогает сделать прочную связь между js и Silverlight а так же обойти ошибку компилятора при передачи кода html в js функцию в Silverlight приложении.
Спасибо!



Комментариев нет:

Отправить комментарий