Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 04:15
Оценка:
Рождается новый browser и в связи с этим несколько вопросов.

Сначала о тех фичах которые есть:

1) HTML/XHTML и CSS — level 2.1 (не всё) + level 3 (не все, всякие полезные штуки оттуда)
см. здесь и здесь.

2) Градиетнтный background, expandable image (например закругленные бордюры и пр.), см.
здесь. Поддержка alpha канала.

3) %% units — позволяют делать vertical alignment и flex в стиле XUL. здесь

4) flow:horizontal — размещение блоков слева направо в контейнерах (flow:vertical — стандартное поведение DIV контейнера — сверху вниз)

5) Кроме поддержки position:relative/absolute/fixed добавлено также position:popup — создание не блокирующих popup окон типа menu и tooltip.

6) lightweight frames — например absolute div в контейнере может быть рамещен поверх дочернего frame.
<frameset> аналогичен <iframe> т.е. может быть включен в любое место HTML (а не как отдельная сущность)

7) display: inline-block из CSS2.1 имплементирован — кстати ни один броузер из большой тройки эту фичу так и не поддерживает (за искл. частично IE).

8) CSS атрибут behavior:name-of-js-object. Где name-of-js-object есть JS конструкция
<STYLE>
  behavior:my_button_class;
  ....
<SCRIPT>
  var my_button_class = 
  {
    onclick: function() {....},
    onblur: function() {....}    
    ....
  }


9) селекторы вида DIV:active работают для всех элементов а не только для A


Вопросы:

1) Какие еще фичи хотелось бы видеть?
2) Требутся ли расширение набора <input> типов? Например <input type="number" spin="true">.

И один принципиальный вопрос про JS:

Пользуется ли народ кострукциями prototype в быту?
Например:
String.prototype.mymethod = function() { something }
// invocation:
"one".mymethod();


Пока в моей версии JS я обошелся без prototype, т.е. то же самое описывается как:

String.mymethod = function() { something }
// invocation:
"one".mymethod();


Зачем было введено свойство prototype мне не ведомо. Идеи есть?

Кстати есть конструкция property (то же что и function только вызов ея устроен по другому. )

 MyClass.myproperty = 
   property(val) 
     { 
       if(isExists(val)) // 'set' invocation
         this.val = val;
       return this.val; // either 'get' or 'set' invocation
     }
 // invocation:
 myclassinst.myproperty = "one";// set
 var s = myclassinst.myproperty; // get


Сам броузер (main window layout) описан полностью в HTML/CSS/JS т.е. скины на него это просто HTML со товарищи.

Кстати все стандартные <input> widgets поэлементно описываемы в CSS. Например фрагмент описания scrollbar:

scrollbar[type="vertical"]>.thumb
{
    width:100%%;
    min-height: 15px;
    border-left: 1px solid #C5C7C7;
    background-color:transparent;
    background-image:url(res:thumb-v-normal.png);
    background-position:50% 50%; /* center middle */
    background-repeat:no-repeat;
}

scrollbar[type="vertical"]>.thumb:hover
{
    background-color: #B1C4D9;
    border-top: 1px solid #CCD9E9;
    border-left: 1px solid #CCD9E9;
    border-right: 1px solid #90A5C3;
    border-bottom: 1px solid #90A5C3;
    background-image:url(res:thumb-v-hover.png);
}


Вот реальный screenshot с такими scrollbars:


Если кто дочитал до этого места — большое человеческое спасибо. Комментарии очень нужны.
Re: Новый browser и JavaScript
От: Andir Россия
Дата: 08.12.04 04:37
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Рождается новый browser и в связи с этим несколько вопросов.


CS>И один принципиальный вопрос про JS:


CS>Пользуется ли народ кострукциями prototype в быту?


Да конечно, это вообще-то основа JavaScript ... Прототипированный язык

MyObject.prototype=
{
  field = 100,
  MyFunction = function(){"some";}
}


Получается что-то типа объекта в других языках. Далее прототипы используются для наследования, то есть один прототип служит основой для другого прототипа, а нужные свойства и функции добавляются.
Ох блин, когда-то давно я интересовался судьбой javascript 1.5 там очень много нехватающих лично мне вещей было реализовано, но боюсь так просто не вспомню Будет время — гляну, мож чего вспомню ...

Отступление: А дебаггер будет? Мне очень нравиться DomInspector из мозиллы ...

CS>Кстати есть конструкция property (то же что и function только вызов ея устроен по другому. )


Вот это обязательно!

[skip]

CS>Если кто дочитал до этого места — большое человеческое спасибо. Комментарии очень нужны.


С Уважением, Andir!
Re: Новый browser и JavaScript
От: Aquary Россия https://wmspanel.com/
Дата: 08.12.04 05:35
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Рождается новый browser и в связи с этим несколько вопросов.

"... Выключите свет, они на свет лезут!!!" (с) один анекдот
Личего личного
https://wmspanel.com/nimble — Nimble Streamer media server for live and VOD HLS, RTMP, HTTP streaming
https://wmspanel.com/ — Control and reporting panel for Wowza and Nimble Streamer
http://scm-notes.blogspot.com/ — Блог об управлении конфигурацией
Re[2]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 05:59
Оценка:
Здравствуйте, Andir, Вы писали:

A>Здравствуйте, c-smile, Вы писали:


CS>>Пользуется ли народ кострукциями prototype в быту?

A>Да конечно, это вообще-то основа JavaScript ... Прототипированный язык

Я не про то. Естественно JS прототипированный.
Я немного про другое: вот в этом примере:
MyObject.prototype=
{
  field = 100,
  MyFunction = function(){"some";}
}


Как создается объект класса MyObject что такое этот MyObject объект или функция?

В моем варианте функция/конструктор MyObject и является prototype
function MyObject()
{
  this.field = 100,
}
MyObject.MyFunction = function(){"some";} // прицепили метод
MyObject.MyCommonVar = "some"; // прицепили свойство общее для всех instance порожденных с пом MyObject

var myObject = new MyObject();
myObject.MyFunction();


Я не понимаю зачем нужно было вводить отдельное свойство prototype.

В моем варианте myObject.__proto__ === MyObject
В JS myObject.__proto__ === MyObject.prototype

Более того в JS myObject.constructor === Object-internal-ctor ,
я ожидал что это должно быть myObject.constructor === MyObject

Вообще это мрак как это сделано в JS....

Вот я и спрашиваю этим кто-то реально пользуется.
Кто-нибудь может привести фрагмент реального скрипта со словом prototype?


A>Отступление: А дебаггер будет? Мне очень нравиться DomInspector из мозиллы ...


Там не только дебаггер будет. Планируется CSS inspector:
При наведении мыши на элемент можно будет увидеть все его CSS атрибуты с конкретным указанием
из какого definition/css конкретное свойство каскадировалось. И еще много чего на эту тему.
Броузер позиционируется как инструментальный.


CS>>Кстати есть конструкция property (то же что и function только вызов ея устроен по другому. )

A>Вот это обязательно!

ОК. Я так и думал.
Re[2]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 06:05
Оценка:
Здравствуйте, Aquary, Вы писали:

A>Личего личного


Угу. Я уже сейчас по тестам бью Оперу в разы
Пока только по скорости рендеринга.
Побьем и по фичам.

А уж по уене подвано — бесплатный броузер будет.
Re[3]: Новый browser и JavaScript
От: Andir Россия
Дата: 08.12.04 06:24
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Я не понимаю зачем нужно было вводить отдельное свойство prototype.


function MyObjectBase(){}

MyObjectBase.prototype = {} // Some prototype;

function MyObject(){}

MyObject.prototype = new MyObjectBase(); // Наследование
MyObject.prototype.NewFunction = function() {} // Some new functionality


Прототипирование это, что каждый объект создаётся по некоторому прототипу, в том числе и наследование реализуется через прототипирование.

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

Плюс я понять не могу, о чём ты говоришь, когда про функции объекта говоришь:

function MyObject() {/* конструктор объекта */ }

// Прототип объекта
MyObject.prototype = 
{
  field = 100, // default value
  MyFunction: function() { print(this.field); } 
}

var myObj1 = new MyObject(); // Cоздаём новый экземпляр объекта
myObj1.field = 1;

var myObj2 = new MyObject(); // Cоздаём новый экземпляр объекта
myObj2.field = 2;

myObj1.MyFunction(); // Печатает 1
myObj2.MyFunction(); // Печатает 2

myObj2.MyFunction = function() { print("Hello World!");} /* Переопределяем функцию экземпляра */

myObj2.MyFunction(); // Печатает Hello, World!


Как такое реализовать без прототипов я даже не представляю. Приведи пример, может я неправильно понимаю ?

CS>Вот я и спрашиваю этим кто-то реально пользуется.

CS>Кто-нибудь может привести фрагмент реального скрипта со словом prototype?

Я в исходники выкладывал EventFramework ...

A>>Отступление: А дебаггер будет? Мне очень нравиться DomInspector из мозиллы ...


CS>Там не только дебаггер будет. Планируется CSS inspector:

CS>При наведении мыши на элемент можно будет увидеть все его CSS атрибуты с конкретным указанием
CS>из какого definition/css конкретное свойство каскадировалось. И еще много чего на эту тему.
CS>Броузер позиционируется как инструментальный.

Бороться с мозиллой боюсь на этом фронте будет тяжеловато

С Уважением, Andir!
Re[4]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 06:39
Оценка:
Здравствуйте, Andir, Вы писали:

A>
A>function MyObject() {/* конструктор объекта */ }

A>// Прототип объекта
A>MyObject.prototype = 
A>{
A>  field = 100, // default value
A>  MyFunction: function() { print(this.field); } 
A>}

A>var myObj1 = new MyObject(); // Cоздаём новый экземпляр объекта
A>myObj1.field = 1;

A>var myObj2 = new MyObject(); // Cоздаём новый экземпляр объекта
A>myObj2.field = 2;

A>myObj1.MyFunction(); // Печатает 1
A>myObj2.MyFunction(); // Печатает 2

A>myObj2.MyFunction = function() { print("Hello World!");} /* Переопределяем функцию экземпляра */

A>myObj2.MyFunction(); // Печатает Hello, World!
A>


A>Как такое реализовать без прототипов я даже не представляю. Приведи пример, может я неправильно понимаю ?


А если так?

function MyObject() { this.somefield = 10; }/* конструктор объекта он же и прототип!*/ }

MyObject.field = 100, // default value
MyObject.MyFunction = function() { print(this.field); } 


var myObj1 = new MyObject(); // Cоздаём новый экземпляр объекта
myObj1.field = 1;

var myObj2 = new MyObject(); // Cоздаём новый экземпляр объекта
myObj2.field = 2;

myObj1.MyFunction(); // Печатает 1
myObj2.MyFunction(); // Печатает 2

myObj2.MyFunction = function() { print("Hello World!");} /* Переопределяем функцию экземпляра */

myObj2.MyFunction(); // Печатает Hello, World!

MyObject.MyFunction = function() { print("Hello Universe!");} /* Переопределяем функцию для всех остальных экземпляров класса */


A>Я в исходники выкладывал EventFramework ...


О! вот спасибо!
Это где-то реально используется?
Кто-нить видел живые активные библиотеки где это используется?

A>Бороться с мозиллой боюсь на этом фронте будет тяжеловато


Зачем бороться? Надо жить рядом.

Мой броузер это моно exe файл размером примерно 900к несжатых.
Инсталятора не требует. Ткнул — поехали.
Re[5]: Новый browser и JavaScript
От: Andir Россия
Дата: 08.12.04 07:18
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>А если так?


А это работать вообще будет? Ведь таким образом определяемые функции это как статические функции в C++, то есть ни о каком this и речь идти не может.

CS>
CS>function MyObject() { this.somefield = 10; }/* конструктор объекта он же и прототип!*/ }

CS>MyObject.field = 100, // default value
CS>MyObject.MyFunction = function() { print(this.field); } 


CS>var myObj1 = new MyObject(); // Cоздаём новый экземпляр объекта
CS>myObj1.field = 1;

CS>var myObj2 = new MyObject(); // Cоздаём новый экземпляр объекта
CS>myObj2.field = 2;

CS>myObj1.MyFunction(); // Печатает 1  У объекта myObj1 нету функции MyFunction ... она есть только у MyObject
CS>myObj2.MyFunction(); // Печатает 2

CS>myObj2.MyFunction = function() { print("Hello World!");} /* Переопределяем функцию экземпляра */

CS>myObj2.MyFunction(); // Печатает Hello, World!

CS>MyObject.MyFunction = function() { print("Hello Universe!");} /* Переопределяем функцию для всех остальных экземпляров класса */

CS>


A>>Я в исходники выкладывал EventFramework ...


CS>О! вот спасибо!

CS>Это где-то реально используется?
CS>Кто-нить видел живые активные библиотеки где это используется?

Ну на rsdn есть поиск, кто-то да использовал ... А я постоянно его пользую в корпоративных системах на web-интерфейсе.

Ещё примеров валом в мозилле, там же все механизмы расширения JavaScript используют.

CS>Мой броузер это моно exe файл размером примерно 900к несжатых.

CS>Инсталятора не требует. Ткнул — поехали.

Вот это круто А системы расширения какие-то подразумеваются?

С Уважением, Andir!
using(RSDN@Home 1.1.4 beta 3){/* Работаем! */}
Re[3]: Новый browser и JavaScript
От: korzhik Россия  
Дата: 08.12.04 08:45
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Здравствуйте, Aquary, Вы писали:


A>>Личего личного


CS>Угу. Я уже сейчас по тестам бью Оперу в разы

В разы!?!?! Это круто!

CS>А уж по цене подвано — бесплатный броузер будет.

Это вы один делаете?
Re[3]: Новый browser и JavaScript
От: anonymous Россия http://denis.ibaev.name/
Дата: 08.12.04 09:02
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Вот я и спрашиваю этим кто-то реально пользуется.

CS>Кто-нибудь может привести фрагмент реального скрипта со словом prototype?

подробно про прототипы:
http://www.dklab.ru/chicken/nablas/39.html
http://www.dklab.ru/chicken/40.html
Re[5]: Новый browser и JavaScript
От: Mamut Швеция http://dmitriid.com
Дата: 08.12.04 11:53
Оценка:
CS>О! вот спасибо!
CS>Это где-то реально используется?
CS>Кто-нить видел живые активные библиотеки где это используется?

prototype-то?

http://dmitriid.free.fr/projects/rpg/index.html

а именно файл body.js

/* skip*/
function nsBody(ele)
{
    this.type = BODY_NORMAL;    
    this._ele = xGetElementById(ele);
    this._sections = new Array();
    this._menus = new Array();
    this._specialMenus = new Array();
    this.selectedMenu = '';
}

nsBody.prototype.addBodySection = function()
{
    this._sections.push(new nsBodySection());
    return this._sections[this._sections.length - 1];
}

/*skip*/

nsBody.prototype.generate = function()
{
    var n;
    var i = 0;
    
    
    while(true)
    {
        if(this.type == BODY_NORMAL) n = this._sections[i];
        if(this.type == BODY_NEWS)   n = this._sections.pop();

        n.generate(this._ele, i);
        
        if(this.type == BODY_NORMAL && ++i == this._sections.length) break;
        if(this._sections.length == 0) break;
    }
}


генерация контента в page.html + news.js

<!--skip-->
pageBody = new nsBody(ele);

section = pageBody.addBodySection();
section.contents = 'Hello, world!';

section = pageBody.addBodySection();
section.contents = 'Hello, world, yet again!';

pageBody.generate();


ну и результаты видим там же

A>>Бороться с мозиллой боюсь на этом фронте будет тяжеловато


на ура работает в файрфокс и ие

ЗЫ. Без прототайпа в Яваскрипте нет ООП
... << RSDN@Home 1.1.4 beta 3 rev. 185>>


dmitriid.comGitHubLinkedIn
Re[4]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 16:33
Оценка:
Здравствуйте, korzhik, Вы писали:

CS>>А уж по цене подвано — бесплатный броузер будет.

K>Это вы один делаете?

На этой фазе, да, один.
"Лужу, паяю, ЭВМ починяю".

Где-то через недели две потребуются например дизайнеры "морды лица"
т.е. нужно соорудить — базовый скин + раскладку основного окна.

Нужна также имплементация всяких диалогов settings и пр. HTML/CSS/JS
В моем JS (c-smile downgraded into ECMAScript) есть persistence — т.е. в принципе все можно сделать на голом JS.

Все у кого есть желание / возможности — welcome — e-mail: news@terrainformatica.com.
Re[6]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 17:05
Оценка:
Здравствуйте, Andir, Вы писали:


CS>>А если так?

A>А это работать вообще будет? Ведь таким образом определяемые функции это как статические функции в C++, то есть ни о каком this и речь идти не может.

Уже работает.

Мужики, я четко знаю как устроено наследование в JS потому как заимплементировал его перерыв соотв. стандарты и пр. Т.е. я не спрашиваю "как?" а наоборот "почему?".

Почему в качестве прототипа используется специальный подобъект
MyObject.prototype а не сам MyObject ? Ведь и Function (MyObject) и Object (MyObject.prototype) есть
"вешалки для свойств" совершенно идентичные и даже более того:

class Function: public Object {} в терминах C++.

Т.е. мой вопрос архитектурно-философский.


CS>>Мой броузер это моно exe файл размером примерно 900к несжатых.

CS>>Инсталятора не требует. Ткнул — поехали.

A>Вот это круто А системы расширения какие-то подразумеваются?


Да. Но только т.н. windowless extensions в виде "native behaviors"
назначаемых объекту через CSS. В движке h-smile на котором строится browser есть понятие
view master css — css который грузится для всех документов.

OBJECT[classid="..."]
{
  border: 1px solid red;
  behavior: my-cpp-implemented-behavior-name
};



Т.к. имеет место быть поддержка нескольких платформ то
я использую вот такую дефиницию:

/** hsmile DOM element behavior interface
 *  
 *  allows to redefine behavior of any standard dom element
 **/

struct HSMILE_BEHAVIOR 
{
    virtual xool::word HSMILE_CB will_handle  ( ) = 0;

/**Callback function for mouse events. 
 * \param he \b HELEMENT, 
 * \param target \b HELEMENT, 
 * \param event_type \b xool::dword, 
 * \param pt \b xool::point, 
 * \param mouseButtons \b xool::dword, 
 * \param keyboardStates \b xool::dword,
 * \return TRUE if application handled event, false otherwise.
 **/
    virtual bool HSMILE_CB on_mouse  (HELEMENT he, HELEMENT target, xool::dword event_type, xool::point pt, xool::dword mouseButtons, xool::dword keyboardStates ) = 0;
    virtual bool HSMILE_CB on_key    (HELEMENT he, HELEMENT target, xool::dword event_type, xool::dword code, xool::dword keyboardStates ) = 0;
    virtual bool HSMILE_CB on_focus  (HELEMENT he, HELEMENT target, xool::dword event_type ) = 0;
    virtual bool HSMILE_CB on_paint  (HELEMENT he, HDC hdc, xool::rect rc ) = 0;
    virtual bool HSMILE_CB on_measure(HELEMENT he, xool::size* min_size, xool::size* max_size ) = 0;
    virtual bool HSMILE_CB on_timer  (HELEMENT he, xool::dword timer_id ) = 0;
    virtual void HSMILE_CB detach    (HELEMENT he ) = 0;
};
Re[6]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 17:24
Оценка:
Здравствуйте, Mamut, Вы писали:

CS>>Кто-нить видел живые активные библиотеки где это используется?


M>http://dmitriid.free.fr/projects/rpg/index.html


Cool! Кто рисовал, кстати?

M>ЗЫ. Без прототайпа в Яваскрипте нет ООП


Прототипирование как сущность это одно.
Имплементация же прототипирования через конкретное свойство "prototype" это другое.

Прототипированных языков — море
Re[4]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 08.12.04 18:51
Оценка:
Здравствуйте, anonymous, Вы писали:

A>Здравствуйте, c-smile, Вы писали:


CS>>Вот я и спрашиваю этим кто-то реально пользуется.

CS>>Кто-нибудь может привести фрагмент реального скрипта со словом prototype?

A>подробно про прототипы:

A>http://www.dklab.ru/chicken/nablas/39.html
A>http://www.dklab.ru/chicken/40.html

Некоторые посылки в этих статьях вызывают сомнения.
Например:

Итак, вывод: прототипы объектов доступны по цепочке obj.constructor.prototype.constructor.prototype..., а не obj.prototype.prototype, как можно понять из многих руководств по JavaScript в Интернете. Конструктором объекта может быть только объект встроенного класса (обычно это Function).


Кроме того что статьи имхо окончательно запутывают проблему.

Я же пытаюсь упростить проблему выкинув промежуточные "prototype".
Re: Новый browser и JavaScript
От: yxiie Украина www.enkord.com
Дата: 09.12.04 10:03
Оценка:
Здравствуйте, c-smile, Вы писали:

...

если охота понять зачем нужен prototype или еще что-то по ДжаваСкрипту, скачай стандарт ECMA-262 (ECMAScript) где-то с www.ecma.ch по-моему.
и все вопросы отпадут. детальнее чем там нигде нету
... << RSDN@Home 1.1.3 stable >>
Re[2]: Новый browser и JavaScript
От: c-smile Канада http://terrainformatica.com
Дата: 09.12.04 17:31
Оценка:
Здравствуйте, yxiie, Вы писали:

Y>если охота понять зачем нужен prototype или еще что-то по ДжаваСкрипту, скачай стандарт ECMA-262 (ECMAScript) где-то с www.ecma.ch по-моему.

Y>и все вопросы отпадут. детальнее чем там нигде нету

спасибо.но это было первое с чего я начал.

еще раз повторю вопрос:

Почему

myObjectInstance.__proto__ указывает на MyObject.prototype
а не на MyObject просто?


Зачем для каждой функции (класса) MyObject создается специальный подобъект MyObject.prototype

Почему для этого не используется сам MyObject.


В Java (не script) и в других OOP языках есть тольуо две сущности: instance и class

Зачем был введен этот prototype?

Я пытаюсь понять может я чего теряю без него?
Re[3]: Новый browser и JavaScript
От: yxiie Украина www.enkord.com
Дата: 09.12.04 17:44
Оценка:
Здравствуйте, c-smile, Вы писали:

ты заметь, что в JavaScript нет явных определений class.
именно через prototype это эмулируется
... << RSDN@Home 1.1.3 stable >>
Re: Новый browser и JavaScript
От: Рома Мик Россия http://romamik.com
Дата: 09.12.04 17:55
Оценка:
Здравствуйте, c-smile, Вы писали:

Не морочь себе голову ИМХО. Есть уже интерпритатор готовый? Прикурчивай по минимуму и начинай тестировать. Если важно это дело с прототипами, то оно всплывет. Попроси народ накидать нетривиальных примеров использования javascript и пробуй.

Я правда не очень понимаю, как ты собираешься его прикручивать. ДОМ-то твой не настоящий, а что за javascript без ДОМа?

ОФФ: I'll be back. В смысле проект мой, занимающий почти все мое свободное время, близиться к концу.
Re: Новый browser и JavaScript
От: B.F.AngelLab Россия http://www.angel-jobs.com
Дата: 09.12.04 18:40
Оценка:
Здравствуйте, c-smile, Вы писали:

CS>Рождается новый browser и в связи с этим несколько вопросов.


Одним из наших проектов тоже браузер.
Было бы интересно пообщаться.
АСЯ: 103577986
www.angel-jobs.com требуются программисты зарплата от $1500
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.