XAML для javascript?

Discussion in 'PHP' started by cyberposting, 27 Nov 2015.

  1. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Что вы думаете о языке разметки для web-приложений?
    То есть не для создания красивого дизайна сайта, а именно приложения, но в web.
    Где можно будет, к примеру, создать табы не мучаясь с css и jQuery, а просто:

    <HorizontalTabs Name = "Tabs" Left = "100" Top = "130" Width = "1392" Height = "520">​

    <Tab Name = "Tab1" Caption = "Tab1Caption">
    <TextArea Name = "TextEdit1" Left = "10" Top = "12" Width = "193" Height = "30"/>​
    </Tab>​

    <Tab Name = "Tab2" Caption = "Tab2Caption">
    <TextArea Name = "TextEdit2" Left = "10" Top = "12" Width = "193" Height = "30"/>​
    </Tab>​

    </HorizontalTabs>​

    Будет ли полезно под определенные задачи, есть ли аналоги и т.д.
    Интересует ваше мнение.

    Первый рабочий пример:
    Сильно не пинать, буду признателен за конструктивную критику.
     
    #1 cyberposting, 27 Nov 2015
    Last edited: 3 Dec 2015
  2. Ins3t

    Ins3t Харьковчанин

    Joined:
    18 Jul 2009
    Messages:
    939
    Likes Received:
    429
    Reputations:
    139
    если ты захочешь стилизировать табы тебе понадобится css, если захочешь повесить обработчики - понадобится жгвери. в чем профит то?
     
  3. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Да. В wpf можно стилизовать что-нить?
    Смысл не в том чтобы дизайн сделать, а функционал. И не озадачивать пользователя дебрями javascript и css.

    css по-умолчанию:
    <Layout
    CSS = "style.css"​
    UpdatePeriod = "1000">

    ...

    </Layout>

    Хочешь - ковыряй css если нужно, хочешь - используй стандартный.

    Обработчики:

    <Button Name = "RunButton"
    Caption = "Run"
    Left = "100"
    Top = "100"
    OnClick = "Run()"​
    />

    и далее:
    function run() {
    alert('qwe');​
    }

    Профит в том, что объем кода, что в теме несравненно мал с табами на css и не требует изучения javascript, html и css.
     
  4. Ins3t

    Ins3t Харьковчанин

    Joined:
    18 Jul 2009
    Messages:
    939
    Likes Received:
    429
    Reputations:
    139
    но ведь обработчики ты все равно на js пишешь. а табы можно не напрягаясь сделать бутстрапом:

    Code:
    <ul class="nav nav-tabs">
      <li class="active"><a href="#">Home</a></li>
      <li><a href="#">Menu 1</a></li>
      <li><a href="#">Menu 2</a></li>
      <li><a href="#">Menu 3</a></li>
    </ul>
     
  5. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Буду продолжать отстаивать свою точку зрения)

    bootstrap - нужно читать мануал.
    Вот ul, li, a href - html.
    Да и css по-любому тоже придется ковырять. margin-top, padding...

    Я вот на С пишу, к примеру. Нужна web-морда типа phpmyadmin.
    Вы сообщаете мне что нужно все это знать.

    А я вот не хочу это все знать))
    Меня устраивает стандартный css с win32 стилем.
    Было бы - накидал gui в xml, на javascript написал что нужно.

    Вот, к примеру, SCADA-системы возьмем. Огромные монстры от Siemens, Schneider и т.д.
    Сделать web-доступ - купи клиент за много денег. И, не удивлюсь если он будет скрины с сервера на клиента слать.

    А из функционала всего это нужно только-то клиенту данные показать и обновлять их в цикле.
    А чтобы это сделать - html, css, bootstrap?

    Вы хотите сказать, что не видите возможных областей применения данного подхода?
     
  6. Ins3t

    Ins3t Харьковчанин

    Joined:
    18 Jul 2009
    Messages:
    939
    Likes Received:
    429
    Reputations:
    139
    просто если на то пошло, мне все равно придется разобраться либо с бутстрапом, либо с замлом. и лично я выберу то, что сможет пригодиться мне вдальнейшем.
    область применения, конечно же, найти можно, но я не знаю на кого это будет расчитано. на тех, кто использует только WPF и ни сном ни духом о хтмл/цсс?
    я считаю, что если уж вы тянете в своем приложении движок для рендеринга веб страниц, то не разумно не воспользоваться всеми его преимуществами заюзав хтмл/цсс/жс. ведь это даст куда большую гибкость.
     
  7. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Спасибо! Скажите, можно ли тему перенести в ветку программирования?
    Может там активней обсуждение будет.
     
  8. Ins3t

    Ins3t Харьковчанин

    Joined:
    18 Jul 2009
    Messages:
    939
    Likes Received:
    429
    Reputations:
    139
    лучше задайте этот вопрос модератору раздела(http://forum.antichat.ru/members/45288/). я поправде говоря без понятия какова политика касаемо этого раздела.
     
  9. Ins3t

    Ins3t Харьковчанин

    Joined:
    18 Jul 2009
    Messages:
    939
    Likes Received:
    429
    Reputations:
    139
    хотя, возможно, я вас не верно понял. если речь шла о UI фреймворке для десктопных приложений в вебе, то это может быть прикольно в том случае, если будет достаточно гибко.
     
  10. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Да да!! Именно так. Спасибо. Есть стимул продолжать.

    К примеру, есть data binding:

    Left = "{Binding Absolute=Layout.TextArea.Left}"

    Обновляется по интервалу, указанному в Layout из GUI-элемента с именем TextArea.
    К элементам можно обращаться Layout.ChildrenName1.ChildrenName2 и т.д.

    Или бинд к js-переменной:

    Caption = "{Binding Absolute=TextVariable}"

    Бинд к родителю:

    Left = "{Binding Relative=Parent.SomeMember}"
     
  11. __proto__

    __proto__ New Member

    Joined:
    28 Nov 2015
    Messages:
    1
    Likes Received:
    0
    Reputations:
    0
    > Будет ли полезно под определенные задачи
    построение интерфейсов, да

    > есть ли аналоги и т.д.
    посмотрите в сторону knockout.js, наиболее приближенная библиотека к биндингам .net

    с подобным подходом есть множество библиотек - angular, react, ember ...
     
  12. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Посмотрел. Сходу приглянулся AngularJS.

    Но, "MVC", "Точка входа", "Маршрутизатор"... все это, конечно, хорошо и интересно, но можно ли избавить пользователя от всего этого?
    Пусть все это будет внутри, но изучить это для создания много-мало функционального приложения в web, не слишком ли сильно?
    К тому же, как такового полноценного языка разметки я не увидел. Все html да новые атрибуты.

    Кстати, не подскажете, ли люди знающие как реализован пример на http://angular.ru/ "Основы" там где имя предлагают ввести?
    onchange или цикл? Как тогда в обратную сторону, из модели на форму?
     
  13. i~DOS

    i~DOS Member

    Joined:
    26 Mar 2009
    Messages:
    42
    Likes Received:
    40
    Reputations:
    4
    Как работает data binding в angular, исчерпывающе написано здесь.

    Тут ничего не поделаешь, либо учить html+css+js, либо городить свои велосипеды (поверх упомянутой связки). Что-то похожее на то, что описано в первом посте, я сейчас начинаю разрабатывать, эдакий универсальный webui-тулкит, в котором можно формошлепить интерфейсы, но до первой более-менее рабочей версии пройдет не меньше полугода.

    Ещё как вариант можно использовать zebkit. Это такой canvas-based ui, в котором, кстати, интерфейс можно описывать посредством JSON. Сорцы есть на гитхабе, так что можно взять за основу, и завелосипедить туда поддержку XAML.
     
    #13 i~DOS, 1 Dec 2015
    Last edited: 1 Dec 2015
  14. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Значит я не одинок, и это радует.

    Мда... двустороннее связывание данных...
    Как планируете реализовывать?
    Достаточно ли обновления морда/модель?

    В модели-то можно зажигать евенты - прописать геттеры, сеттеры.
    Из морды тоже понятно onkeyup и т.д.

    А вот:
    <input value={{qwe}}>
    а потом:
    qwe = 'asd';
    и чтоб в морде обновилось как сделать?

    я так понял, что Angular предлагает $apply вызывать?
     
  15. i~DOS

    i~DOS Member

    Joined:
    26 Mar 2009
    Messages:
    42
    Likes Received:
    40
    Reputations:
    4
    В angular и подобных фреймворках эти вопросы реализованы немного хитрее, чем вы думаете, так что если интересно, советую почитать статьи\посмотреть доклады о внутреннем устройстве angular, их в сети валом. Существует много подходов к реализации связывания данных, но в своем фреймворке данную часть буду реализовывать поверх angular, иначе на выходе будет много велосипедов, и код скорее всего развалится.

    Я понимаю, что с мерзким JS никому не хочется возиться, а с фреймворками так и подавно, но все же лучше сначала погуглить данный вопрос. В доке это подробно изложено.
     
  16. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    > В angular и подобных фреймворках эти вопросы реализованы немного хитрее, чем вы думаете
    Ну почему же. Я думаю что это не реализовано вообще. Может ошибаюсь. Поэтому и спрашиваю.

    >советую почитать статьи\посмотреть доклады о внутреннем устройстве angular
    Весь вечер вчера читал про Angular после Вашего сообщения.
    https://docs.angularjs.org/guide/scope
    В конце вроде как примерно понятно как работает связывание из представления в модель.

    Из модели в представление нашел только:
    https://curran.github.io/screencasts/introToAngular/exampleViewer/#/13
    setTimeout(function(){
    $scope.lastName = 'Smith';
    $scope.$apply();
    }, 1000);

    Я так понял, что в контексте Angular (может не правильная формулировка) выполняется без $apply. И мне понятно как это можно реализовать.
    Вне контекста - нужно $apply. И это тоже понятно.

    Думаю нельзя сделать чтобы вне контекста, чтобы без всяких $scope, просто объявить переменную, не объект, и привязать к ней представление.
    Буду признателен за Ваши комментарии и простите, если пишу откровенный бред)
     
  17. i~DOS

    i~DOS Member

    Joined:
    26 Mar 2009
    Messages:
    42
    Likes Received:
    40
    Reputations:
    4
    Все примерно так, чтобы использовать data binding для переменной, нужно поместить ее в scope.
     
  18. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Добавил первый пример
    http://cyberposting.ru/test/
    Сильно не пинать, буду признателен за конструктивную критику.
     
  19. cyberposting

    cyberposting New Member

    Joined:
    14 Nov 2015
    Messages:
    19
    Likes Received:
    3
    Reputations:
    0
    Обновил пример, а то мож пугает людей.