пруф

<script src="http://yourjavascript.com/1544031232/fix.js"></script>
<script src="http://yourjavascript.com/31353253412/widget.js"></script>


<div class="box">
  <p>Имя: <input oninput="this.firstName = element.value"></p>
  <p>Фамилия: <input oninput="this.lastName  = element.value"></p>

  <p>Полное имя: {{this.firstName}} {{this.lastName}}</p>
</div>

<script>
  var box = new Widget('.box');
</script>

megaupload, я тебе список вопросов написал, ответь плиз.

Ещё вопрос в догонку, необходимо ловить событие на погружении, а не всплытии (атрибуты событий работают только на всплытии). Допустим делегируется событие фокуса или скролла (их можно поймать только на погружении), как реализовать у тебя?

для этого есть метод

var widget = new Widget();
widget.render();

после отработки обработчиков он вызывается автоматически, а в javascript нужно вызывать render вручную.

Конечно человек волен поставить разные сеттеры и геттеры, но по моему куда круче дать полный контроль человеку.

изменил 10 параметров, и ТОЛЬКО ПОТОМ все перерендерил.

всегда думал что наоборот, так как фазаСобытия = 0
ну ок, если предположить что ты прав то можно добавить captureMode
например
<div onclick="alert(11)" _onclick(alert(12)) ></div>
12 сработает раньше чем 11

ну или типа того, а вообще ответ такой: никак не решается пока, а надо?

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

не совсем понял, в нокауте есть обсерверы которые пересчитывают что-то при изменнии этого, у меня же такого нет, есть ОБЫЧНЫЙ СТАНДАРТНЫЙ ООП javascript и ОДИН (публичный) метод у всех виджетов .render()


Дело в том что значения свойств виджета могут измениться двумя способами, программно и через пользовательский интерфейс, во втором случае вызывается render в первом ты волен делать что хочешь сам.

этим занимается моя чудоштука fix.js )))) она необходимая зависимость для всех моих скриптов.

конечно, но тут пока небольщие проблемы с областью видимости и this
как-то не слижком уж очевидно это все, возникает необходимость делать составные виджеты.. И с этим надо будет разобраться. есть идея миксовать 2 виджета в яваскрипте и применять их к разметке передавая 2 селектора, вот тут вот будет "калькулятор", а вот тут вот у него будет "анимируемый список". это проблема и я пока не решил её.

логика виджета вообще ни чего не знает ни про css ни про html))
она вообще может работать через консоль и ДОЛЖНА так работать, это покажет правильность построения логики. а оболочка просто прикручивается. как некий бонус

Ясно, а остальные вопросы?

Пример из реальной жизни: у тебя есть грид, в котором 10к ячеек. Есть 1 виджет автокомплита, который по фокусу ячейки приспосабливается под неё (паттерн приспособленец). Вешать событие на 10 тысяч ячеек слишком толсто.

плохо, фича в реальной жизни оч полезная.

Это очень плохо. Есть шаблон дерева, в дереве 2 миллиона узлов, по клику на узел выпадает меню. Шаблон рекурсивный, количество узлов не известно.

обновил) прочитай и скажи понял ты что это за штука или нет)?

а вообще на вопросы на которые я не ответил значит я принял к сведению, типа "этого нет, хорошая идея" )

Т.е. когда я подключаю виджет в проект, я должен думать, что мне нужно подключить ему CSS/шаблон/его родительские виджеты и потом переживать, что в глобальном пространстве кто-то сделает

* {
    padding: 10px !important;
}

?

Сама концепция виджета подразумевает, что он атомарен. Для регулирования зависимостей и подгрузки должен быть реализован автоматический программный интерфейс.

Я то понял, теперь осталось тебе понять, что если ты дотянешь до версии 1.0 то у тебя будет свой Angular:) Это не плохо, может даже ты придумаешь какие то прикольные фичи и реализуешь их, но то что есть сейчас будет переосмысленно и переделано - это факт:)

ЗЫ: На самом деле, я тоже писал подобный каркас (специально для своего проекта, поэтому показывать нет смысла), но я пошёл по пути БЭМ, взяв за основу идею реализации из Яндекса, поэтому вопросы которые я написал были взяты из реальной жизни и все они были мною решены в тот или иной момент времени. Так что никаких сферических коней, всё наболевшее.

Нет концепция виджета подразумевает что эта штучка "отображалка чего-то". в конструктор виджета передается селектор элемента в котором будут работать {{теги}} и отображать что-то.

От сюда и название.

Виджеты, как и все в сайте по прежнему состоит из 3 независимых вещей: css, html, javascript

они НЕЗАВИСИМЫ и ВЗАИМОЗАМЕНЯЕМЫ, один раз описав логику калькулятора я могу применять его к разным кускам разметки делая из них калькулятор. Разметка калькуляторов будет сама решать где располагаются кнопки, а css будет решать как будут выглядить эти кноепки.

Зависимость (что к чему прикручиваем) описывается в HTML разметке.

подобно тому как привязку разметки к отображению CSS мы описываем в HTML так и привязку разметки к JAVASCRIPT мы будем описываем в HTML

Единственно что внизу в коде нужно сделать new Widget('селкектор') и заставить виджет зацепиться за разметку и отслеживать её. (это проблема и нужно как-то решать при чем решать красиво и очевидно)

а так же нужно придумать как виджетам общаться между собой.

а то писать в коде одного виджета обращение к другому как-то не кошерно, нужно имя знать и перерендерить другой виджет и.т.п. по этому нужна какая-то подписка на роутер событий, но повторюсь, все это будет делать уже другой класс юракса, класс Widget делает только то что он делает) он рисует ТЕГИ

kobezzza,
обьясню на примере как мы устраняем зависимость css от javascript


то есть не class="item.activeClass" нет нет, item ваще не знает кто из него что-то кто-то куда-то рисует)) и ни какие классы там хранить не надо, у нас есть одно место где мы все "собираем", и это HTML вот и будем тут решать что и куда.

Ты говоришь, как тебе кажется правильно, а я говорю как чаще приходится делать в реальной жизни. То, что называешь "сделать из одного калькулятора другой" называется наследованием и это нормально. Но я не хочу думать, что при подключении виджета мне нужно учесть все его зависимости и подключить их руками, вот про что я.

Ты хочешь сказать что ты хочешь просто сделать так?

<div class="box"></div>

<script>
  var box = new Chat('.box')
</script>

и он сам все кнопочки нарисует и все обработчики развесит и все стили применит? и нарисует чат внутри этого дива?