Oberon space
General Category => Общий раздел => Тема начата: valexey_u от Сентябрь 05, 2013, 12:21:58 am
-
Поскольку теперь у нас компилятор уже вполне сносно воспринимает семантику Оберона, я пробую сделать что-то более-менее приближенное к действительности. Так что сюда буду складывать то что получилось.
Итак, пробный шар - графика. Черновой набросок биндинга к processing.js. Код скопипастить в наш онлайн-компилер (http://oberspace.dyndns.org/oberonjs.html), ткнуть Compule&Run и наслаждаться :-)
MODULE PageInit;
IMPORT JS;
PROCEDURE CreateCanvas*;
BEGIN
JS.do("var canvas = document.createElement('canvas');
canvas.id = 'processingCanvas'
document.body.insertBefore(canvas,document.body.childNodes[0]);
");
END CreateCanvas;
END PageInit.
MODULE Processing;
IMPORT JS;
TYPE
ProcessingType* = POINTER TO RECORD END; (* dummy type *)
CallbackType* = PROCEDURE;
VAR
MouseX* : REAL;
MouseY* : REAL;
Width* : INTEGER;
Height* : INTEGER;
DrawProc : CallbackType;
SetupProc : CallbackType;
Instance : ProcessingType;
Started : BOOLEAN;
(* callbacks *)
PROCEDURE SetSetupProc*(s : CallbackType);
BEGIN
SetupProc := s
END SetSetupProc;
PROCEDURE SetDrawProc*(d : CallbackType);
BEGIN
DrawProc := d
END SetDrawProc;
(* global *)
PROCEDURE SetFrameRate* (fps : INTEGER);
BEGIN
JS.do("Instance.frameRate(fps);")
END SetFrameRate;
PROCEDURE SetBackground*(argb : INTEGER);
BEGIN
JS.do("Instance.background(argb)")
END SetBackground;
PROCEDURE SetSize*(w, h : INTEGER);
BEGIN
JS.do("Instance.size(w,h);")
END SetSize;
PROCEDURE Stroke*(argb : INTEGER);
BEGIN
JS.do("Instance.stroke(argb)")
END Stroke;
(* drawing *)
PROCEDURE Line*(x0,y0,x1,y1 : REAL);
BEGIN
JS.do("Instance.line(x0,y0,x1,y1);");
END Line;
(* math *)
PROCEDURE Radians*(angle : REAL) : REAL;
VAR
ret : REAL;
BEGIN
JS.do("ret = Instance.radians(angle)");
RETURN ret
END Radians;
(* transform *)
PROCEDURE Translate*(x,y : REAL);
BEGIN
JS.do("Instance.translate(x,y);")
END Translate;
PROCEDURE PushMatrix*;
BEGIN
JS.do("Instance.pushMatrix();")
END PushMatrix;
PROCEDURE PopMatrix*;
BEGIN
JS.do("Instance.popMatrix();")
END PopMatrix;
PROCEDURE Rotate*(angle : REAL);
BEGIN
JS.do("Instance.rotate(angle);")
END Rotate;
(* internal engine *)
PROCEDURE InnerDraw;
BEGIN
IF DrawProc # NIL THEN
JS.do("MouseX = Instance.mouseX; MouseY = Instance.mouseY;");
JS.do("Width = Instance.width; Height = Instance.height;");
DrawProc
END
END InnerDraw;
PROCEDURE InnerSetup;
BEGIN
IF SetupProc # NIL THEN
SetupProc
END
END InnerSetup;
(* start routine *)
PROCEDURE Start*;
BEGIN
ASSERT(~Started);
JS.do("function sketchProc(p){p.draw=InnerDraw; p.setup=InnerSetup; Instance=p;}");
JS.do("var canvas = document.getElementById('processingCanvas');");
JS.do("var processingInstance = new JS.Processing(canvas, sketchProc)");
Started := TRUE
END Start;
END Processing.
MODULE Tree;
IMPORT PageInit, P := Processing;
VAR
theta : REAL;
PROCEDURE Branch(h : REAL);
BEGIN
h := 0.66*h;
IF h > 2.0 THEN
P.PushMatrix;
P.Rotate(theta);
P.Line(0.0, 0.0, 0.0, -h);
P.Translate(0.0, -h);
Branch(h);
P.PopMatrix;
P.PushMatrix;
P.Rotate(-theta);
P.Line(0.0, 0.0, 0.0, -h);
P.Translate(0.0, -h);
Branch(h);
P.PopMatrix;
END
END Branch;
PROCEDURE Setup;
BEGIN
P.SetSize(640,360);
P.SetBackground(0H)
END Setup;
PROCEDURE Draw;
VAR
a : REAL;
BEGIN
P.SetBackground(0H);
P.SetFrameRate(30);
P.Stroke(0FF00FF00H);
a := P.MouseX/FLT(P.Width)*90.0;
theta := P.Radians(a);
P.Translate(FLT(P.Width)/2.0, FLT(P.Height));
P.Line(0.0, 0.0, 0.0, -120.0);
P.Translate(0.0, -120.0);
Branch(120.0)
END Draw;
BEGIN
PageInit.CreateCanvas;
P.SetSetupProc(Setup);
P.SetDrawProc(Draw);
P.Start
END Tree.
-
Да, этот замечательный фрактал не я придумал, это стандартная демка процессинга: http://processing.org/examples/tree.html
На всякий случай повторю код непосредственно рисуюшего модуля, без модулей биндингов (без них оно конечно не заработает): https://gist.github.com/valexey/6444140
А вот оригинал там же: https://gist.github.com/valexey/6444154
А вот так эта демка выглядит будучи написано на чистом js: https://gist.github.com/valexey/6444226
PS. У Processing'a свой язык, этот язык сильно напомнает очень упрощенную яву в котором предопределены всякие там width, height и другие переменные. Язык статически типизированный и умеет компилироваться в js. Язычок этот конечно вне Processing'a не живет.
-
Создавать отдельный репозиторий для такого недобиндинга слишком жирно, так что я пока прикопал сюда: https://gist.github.com/valexey/6444274
-
Кстати. проверил на iPad'e - тоже работает :-)
-
Ай да Алексей и Влад. Ай да молодцы.
Будет ли биндинг для web GL?
-
Итак, пробный шар - графика. Черновой набросок биндинга к processing.js. Код скопипастить в наш онлайн-компилер (http://oberspace.dyndns.org/oberonjs.html), ткнуть Compule&Run и наслаждаться :-)
Прикольно и зачётно ))
-
Ай да Алексей и Влад. Ай да молодцы.
Будет ли биндинг для web GL?
Спасибо :-)
Краткий ответ - да, будет. Но после законченного биндинга к Processing.
Поясню: Processing умеет и 3D тоже (в браузере это через WebGL как раз). По сути Processing просто сильно упрощает написание граф. приложений предоставляя удобный и понятный унифицированный API. В принципе это в чем-то похоже на SDL. Процессинговые 3D демки можно глянуть тут: http://matrix.senecac.on.ca/~asalga/pjswebide/index.php (если справа у вас сразу не запускается 3Д демка, а виден только слева текст - значит что-то пошло не так (не работает WebGl), попробуйте другой браузер).
Поэтому вначале я сделаю полный биндинг к Processing, а затем уже будут делаться биндинги к веб-стандартным методам рисование - к canvas и webgl (напрямую с ними работать программисту менее удобно, но возможностей, если хочется чего-то эдакого (ну, свой Prcessing написать например :-) ) там чуть больше, точнее оно чуть гибче).
Processing as is, отлично подходит для написания игр и для обучения. Для некоторой бизнес и научной графики тоже подойдет (визуализация молекул скажем).
PS. Энергично доводить до ума биндинг к процессингу я видимо буду только на следующей неделе либо вообще после 23 сентбяря, у меня тут все еще конкурс, ну и на работе накопилось.
-
Поэтому вначале я сделаю полный биндинг к Processing, а затем уже будут делаться биндинги к веб-стандартным методам рисование - к canvas и webgl (напрямую с ними работать программисту менее удобно, но возможностей, если хочется чего-то эдакого (ну, свой Prcessing написать например :-) ) там чуть больше, точнее оно чуть гибче).
Алексей, ты в курсе, что над WebGL очень популярен Three.JS? Насколько я смотрел, он как раз практически не уменьшает гибкость, но добавляет чуток удобства. Сейчас часто вообще под WebGL народ имеет в виду WebGL с Three.JS.
-
Поэтому вначале я сделаю полный биндинг к Processing, а затем уже будут делаться биндинги к веб-стандартным методам рисование - к canvas и webgl (напрямую с ними работать программисту менее удобно, но возможностей, если хочется чего-то эдакого (ну, свой Prcessing написать например :-) ) там чуть больше, точнее оно чуть гибче).
Алексей, ты в курсе, что над WebGL очень популярен Three.JS? Насколько я смотрел, он как раз практически не уменьшает гибкость, но добавляет чуток удобства. Сейчас часто вообще под WebGL народ имеет в виду WebGL с Three.JS.
Не в курсе. Спасибо за инфу. Возможно это будет следующее после Processing'a.
Но WebGL пока сыроват - на ряде комбинаций браузер+ось+железо оно не работает. Хотя его допиливают довольно быстро, через полгода-год думаю будет работать везде на актуальных версиях софта.
-
На самом деле для деловой интерактивной графики нужно еще что-то векторное позволяющее удобно трассировать мышку (обрабатывать onclick по фигуре). То есть для полного покрытия всех графических нужд нужен будет еще биндинг либо к Raphaël (его создателя на видео вы уже видели :-) ) либо Paper.js. Бегло ознакомиться с этим можно тут: http://habrahabr.ru/post/140286/
Ну и само собой есть большая задача по созданию биндингов к W3C стандартам - DOM, canvas, svg, webgl и так далее.
-
Но WebGL пока сыроват - на ряде комбинаций браузер+ось+железо оно не работает. Хотя его допиливают довольно быстро, через полгода-год думаю будет работать везде на актуальных версиях софта.
Интересно ещё, что там с ним на Smart TV.
Родители год назад купили Philips - там Опера 11...
Обновил им софт недавно, но вот всё времени нет попробовать у них WebGL...
-
Обновил им софт недавно, но вот всё времени нет попробовать у них WebGL...
C тебя фотка обероновского компилятора в телевизоре ;)
-
А вот про Tizen, его архитектуру и место js в нем: http://habrahabr.ru/company/samsung/blog/192780/
Выдержка:
Co-CEO компании Samsung Electronics сказал: «Мы хотим видеть Tizen на всём», и Tizen вполне на это способен, так как для этого у него есть всё необходимое, в чём мы сейчас с вами убедимся.
...
В Tizen условно можно выделить 3 типа web-приложений:
- Мобильный сайт. Или приложение, которое работает из веб-браузера.
- Так называемое hosted-приложение. Или приложение, являющееся клиентом к удалённым web-ресурсам.
- Полноценное web-приложение. Или стандартное приложение, к которым мы все привыкли, но разработанное с использованием Tizen Web API.
Для последних двух типов есть возможность публиковать их в Tizen Store.
У oberonjs соответственно наиболее приоритетным является третий тип приложений, затем второй, затем первый.
-
У oberonjs соответственно наиболее приоритетным является третий тип приложений, ...
Для этого придётся обеспечить поддержку вебсокетов. Ну и вообще некий фреймворк/платформу на серверной части...
-
У oberonjs соответственно наиболее приоритетным является третий тип приложений, ...
Для этого придётся обеспечить поддержку вебсокетов. Ну и вообще некий фреймворк/платформу на серверной части...
Нет, третьему типу приложений сеть вообще не нужна ни в каком виде. Читай внимательней.
-
Нет, третьему типу приложений сеть вообще не нужна ни в каком виде. Читай внимательней.
А, тогда я спутал со вторым типом.
-
У oberonjs соответственно наиболее приоритетным является третий тип приложений, затем второй, затем первый.
Да, это конечно не означает что пока третий тип не будет работать идеально мы даже и думать не будем о добавлении поддержки тех же вебсокетов и всякого иного ajax'а. Если в процессе разработки нам оно понадобится (скажем при создании IDE), оно будет добавлено. Благо это делается просто. Но есть принципиальная разница между просто набором фич и нацеленностью продукта на какую-то нишу. Скажем соревноваться и бороться с js в нише (простого)скриптования веб-страничек я смысла не вижу - оберно для этого просто не годится. А, вот в нише написания чего-то более развесистого и сложного (тех же редакторов кода аля codemirror) - уже смысл есть.
-
Похоже классический десктопный гуй можно похоронить.
Интерфейс ББ уже ничего не спасет. Только узкая ниша какая-нибудь.
-
Интерфейс ББ уже ничего не спасет. Только узкая ниша какая-нибудь.
Что имеется в данном случае под Интерфейсом ББ?
Если "текст как интерфейс", то мне кажется во многих случаях достаточно именно такого рода интерфейса для работы с информацией (особоенно, если добавить сюда таблицы, для разграничения видимых областей и прочего, возможность вставки картинок в текст, тоже хорошо помогает).
valexey_u
Для чего используются процедуры навроде SetSetupProc? Это хороший стиль, или напрямую присвоить процедуру нельзя?
-
valexey_u
Для чего используются процедуры навроде SetSetupProc? Это хороший стиль, или напрямую присвоить процедуру нельзя?
См. описание языка - модуль может экспортировать только скалярные переменные и только как read only.
-
Если "текст как интерфейс", то мне кажется во многих случаях достаточно именно такого рода интерфейса для работы с информацией...
Ой, ради Бога, прекратите уже размножать эту чушь. Нету в ББ никакого текстового интерфейса.
"Текст как интерфейс" - это про оригинальный оберон, коим ББ ни разу не является.
В ББ обычный десктопный гуй.
-
Если "текст как интерфейс", то мне кажется во многих случаях достаточно именно такого рода интерфейса для работы с информацией...
Ой, ради Бога, прекратите уже размножать эту чушь. Нету в ББ никакого текстового интерфейса.
"Текст как интерфейс" - это про оригинальный оберон, коим ББ ни разу не является.
как нету, в справке же вроде фигурирует , или нет - давно не смотрел? да и адепты ББ вроде Ильи говорили не раз об этой теме как о нечто само собой разумеющимся...
-
ИловБ, не пизди!
-
Если "текст как интерфейс", то мне кажется во многих случаях достаточно именно такого рода интерфейса для работы с информацией...
Ой, ради Бога, прекратите уже размножать эту чушь. Нету в ББ никакого текстового интерфейса.
"Текст как интерфейс" - это про оригинальный оберон, коим ББ ни разу не является.
В ББ обычный десктопный гуй.
Ну, насколько я понимаю, там от изначального Оберон-интерфейса остались составные документы (расширенные всякими дополнительными фенечками). А все остальное да, стало обычным (конфигурируемым через составной документ/конфиг). Составной документ как таковой тогда был вообще очень модным понятием и его изобретал и допиливал каждый.
-
как нету, в справке же вроде фигурирует , или нет - давно не смотрел? да и адепты ББ вроде Ильи говорили не раз об этой теме как о нечто само собой разумеющимся...
Текстовый интерфейс - это "текстовый фрейм" + собсна "текст" + "вьюхи", кои вставляются в этот самый текст. В Обероне это так. В ББ нет.
-
Боже, в ББ вьюхи не вставляются в текст. Мир больше никогда не будет прежним.
-
Ну, насколько я понимаю, там от изначального Оберон-интерфейса остались составные документы (расширенные всякими дополнительными фенечками). А все остальное да, стало обычным (конфигурируемым через составной документ/конфиг). Составной документ как таковой тогда был вообще очень модным понятием и его изобретал и допиливал каждый.
Составные документы остались, да. Но они уже не занимают центрального положения в ББ.
На оригинальный стиль работы (выделить фрейм -> вызвать команду) там положили...
-
Ты уж определись, а то тебя не поймёшь. Опять выпиваешь?
-
Для особо одаренных поясняю:
Когда вы запускаете оригинальный оберон, на экране нет ничего кроме текстовых фреймов, в коих унутри текст, в коем унутри вьюхи. Этого по Вирту было достаточно для взаимодействия с системой.
Когда вы запускаете ББ, то видите виндозное окно с меню, в котором унутри окна, в которых унутри хоть виюхи, хоть диалоги, хоть (куда ж без него) текст.
-
Если словеса туго воспринимаются, вот настоящий текстовый интерфейс: https://www.youtube.com/watch?v=GCcTT-B8bIQ
Разница, как говорится, на лицо.
-
Если словеса туго воспринимаются, вот настоящий текстовый интерфейс: https://www.youtube.com/watch?v=GCcTT-B8bIQ
Разница, как говорится, на лицо.
да но сама возможность, то никуда не делась?
-
Если словеса туго воспринимаются, вот настоящий текстовый интерфейс: https://www.youtube.com/watch?v=GCcTT-B8bIQ
Разница, как говорится, на лицо.
да но сама возможность, то никуда не делась?
Возможность чего? Ну можно команду с кнопкой вставить и вызвать. Ну так это и в MS Word можно. Значит там тоже текстовый интерфейс?
В ББ интерфейс изначально не ориентирован на тот стиль работы, который был в оригинальном обероне.
На тот стиль, который и был по сути текстовым интерфейсом. Разница в подходах становится очевидна, если хоть немного поработать в Обероне.
-
Илов, если для некоторых данных определена форма, то их правильнее выводить в виде формы. Твоё разоблачение нетрушности ББ, сделанное на дноберспейсе изменило этот мир. Оукей. Иди покури эволюцию оберона в картинках. АМЭН.
-
Если словеса туго воспринимаются, вот настоящий текстовый интерфейс: https://www.youtube.com/watch?v=GCcTT-B8bIQ
Разница, как говорится, на лицо.
да но сама возможность, то никуда не делась?
Возможность чего? Ну можно команду с кнопкой вставить и вызвать. Ну так это и в MS Word можно. Значит там тоже текстовый интерфейс?
Смотрите , Борис, вот в первых версиях дос вся работа с компьетером осуществлялась через командную строку (более корректно- интерфейс командной строки). В win8 командную строку может найти только искушенный пользователь, но означает ли это что win8 не имеет возможности работы с ней, или функциональность ее (в сравнении с дос ) в чем то урезана?
-
Илов, если для некоторых данных определена форма, то их правильнее выводить в виде формы. Твоё разоблачение нетрушности ББ, сделанное на дноберспейсе изменило этот мир. Оукей. Иди покури эволюцию оберона в картинках. АМЭН.
Да мне вообще насрать. Не в трушности дело, а в подмене понятий. Меня не возбуждает ни интерфейс ББ, ни оригинальный интерфейс. У меня взгляды ближе к подходу boxes&glue из TEX'а Кнута.
-
Ну если уж тут речь почему-то свелась к обсуждению ББ и его интерфейса, то следует заметить, что составной документ в том виде в котором он там есть, и возможность через "конфиг" довольно просто настроить интерфейс, тоже в некоторых задачах может быть очень даже полезен.
Если бы я не видел в этом всем потенциальную пользу для некоторых моих задач, я бы на форуме blackboxframework.org просто не стал бы даже регистрироваться.
Если же вернуться к топику, то думаю "текст как интерфейс" в том виде в котором он был в Оберон-ОС, на oberonjs сделать будет не слишком сложно. Вопрос лишь в адаптации его под полторы кнопки мышки (у многих ноуты с тачпадами, там удобно пользоваться только левой кнопкой).
-
Смотрите , Борис, вот в первых версиях дос вся работа с компьетером осуществлялась через командную строку (более корректно- интерфейс командной строки). В win8 командную строку может найти только искушенный пользователь, но означает ли это что win8 не имеет возможности работы с ней, или функциональность ее (в сравнении с дос ) в чем то урезана?
Вот! Отличный пример. Текстовый интерфейс в ББ - это командная строка в Win8. Это я и имел в виду.
Командная строка есть, и функциональность ее вроде не меньше, но интерфейс в Win8 принципиально отличается от DOS, т.к. командная строка не занимает уже центрального положения.
Спасибо :)
-
Смотрите , Борис, вот в первых версиях дос вся работа с компьетером осуществлялась через командную строку (более корректно- интерфейс командной строки). В win8 командную строку может найти только искушенный пользователь, но означает ли это что win8 не имеет возможности работы с ней, или функциональность ее (в сравнении с дос ) в чем то урезана?
На самом деле, тут речь идет о довольно важной штуке - целостности восприятия, лаконичности и непротиворечивости интерфейса. То что было у Вирта, то было действительно очень неплохо подогнано и было простым и целостным. Интерфейс ББ же тут в чем-то похож на интерфейс Win8 - смешение двух парадигм (в случае Win8 это Merto (Windows modern) интерфейс и Windows desktop), и пользователю нужно переключаться (переключение имеется ввиду в голове - перенастройка) с одной на другую, это приводит к дополнительным усилиям, UX становится менее целостным.
Эта та цена которую ББ заплатил за то, чтобы влиться в виндовозный мейнстрим, чтобы быть более привычным виндовозному пользователю. И, похоже, цена оказалась оправданной (с точки зрения расширения пользовательской базы) - помнится info21 писал, что как раз именно это его покорило в ББ относительно оригинального Оберона.
На самом деле возможно сейчас ББ стоит провернуть это еще раз, если хочется вдохнуть в него новую жизнь - сделать вариант интерфейса для Metro. Благо Metro как раз к типографике и тексту тяготеет.
-
Теоретически в ББ можно работать как в Обероне, да. Но, как сказал выше valexey, оно уже не так органично. И, кроме того, нету некоторых возможностей, которые поощряли работу с текстовыми фреймами, т.е. делали это удобным.
Взять даже треки. В обероне экран сразу разделен на два трека. Пользовательский, в котором отображается документ, и системный, в котором лежат инструменты (наборы команд)
-
Еще одина демонстрация Processing'a:
MODULE PageInit;
IMPORT JS;
PROCEDURE CreateCanvas*;
BEGIN
JS.do("var canvas = document.createElement('canvas');
canvas.id = 'processingCanvas'
document.body.insertBefore(canvas,document.body.childNodes[0]);
");
END CreateCanvas;
END PageInit.
MODULE Processing;
IMPORT JS;
TYPE
ProcessingType* = POINTER TO RECORD END; (* dummy type *)
CallbackType* = PROCEDURE;
VAR
MouseX* : REAL;
MouseY* : REAL;
Width* : INTEGER;
Height* : INTEGER;
DrawProc : CallbackType;
SetupProc : CallbackType;
Instance : ProcessingType;
Started : BOOLEAN;
(* callbacks *)
PROCEDURE SetSetupProc*(s : CallbackType);
BEGIN
SetupProc := s
END SetSetupProc;
PROCEDURE SetDrawProc*(d : CallbackType);
BEGIN
DrawProc := d
END SetDrawProc;
(* global *)
PROCEDURE SetFrameRate* (fps : INTEGER);
BEGIN
JS.do("Instance.frameRate(fps);")
END SetFrameRate;
PROCEDURE SetBackground*(argb : INTEGER);
BEGIN
JS.do("Instance.background(argb)")
END SetBackground;
PROCEDURE SetSize*(w, h : INTEGER);
BEGIN
JS.do("Instance.size(w,h);")
END SetSize;
PROCEDURE Stroke*(argb : INTEGER);
BEGIN
JS.do("Instance.stroke(argb)")
END Stroke;
(* drawing *)
PROCEDURE Line*(x0,y0,x1,y1 : REAL);
BEGIN
JS.do("Instance.line(x0,y0,x1,y1);");
END Line;
(* Color *)
PROCEDURE Fill*(r,g,b : INTEGER);
BEGIN
JS.do("Instance.fill(r, g, b)");
END Fill;
(* math *)
PROCEDURE Radians*(angle : REAL) : REAL;
VAR
ret : REAL;
BEGIN
JS.do("ret = Instance.radians(angle)");
RETURN ret
END Radians;
PROCEDURE Map*(value,low1,high1,low2,high2 : REAL) : REAL;
VAR ret : REAL;
BEGIN
JS.do("ret = Instance.map(value,low1,high1,low2,high2);");
RETURN ret
END Map;
PROCEDURE Noise2d*(x, y : REAL) : REAL;
VAR ret : REAL;
BEGIN
JS.do("ret = Instance.noise(x,y);");
RETURN ret
END Noise2d;
(* transform *)
PROCEDURE Translate*(x,y : REAL);
BEGIN
JS.do("Instance.translate(x,y);")
END Translate;
PROCEDURE PushMatrix*;
BEGIN
JS.do("Instance.pushMatrix();")
END PushMatrix;
PROCEDURE PopMatrix*;
BEGIN
JS.do("Instance.popMatrix();")
END PopMatrix;
PROCEDURE Rotate*(angle : REAL);
BEGIN
JS.do("Instance.rotate(angle);")
END Rotate;
(* Vertex *)
PROCEDURE BeginShape*();
BEGIN
JS.do("Instance.beginShape();")
END BeginShape;
PROCEDURE BezierVertex2d*(cx1, cy1, cx2, cy2, x, y : REAL);
BEGIN
JS.do("Instance.bezierVertex(cx1, cy1, cx2, cy2, x, y);")
END BezierVertex2d;
PROCEDURE CurveVertex2d*(x, y : REAL);
BEGIN
JS.do("Instance.curveVertex(x, y);")
END CurveVertex2d;
PROCEDURE EndShape*();
BEGIN
JS.do("Instance.endShape();")
END EndShape;
PROCEDURE EndAndCloseShape*();
BEGIN
JS.do("Instance.endShape(Instance.CLOSE);")
END EndAndCloseShape;
PROCEDURE Vertex2d*(x,y : REAL);
BEGIN
JS.do("Instance.vertex(x, y);")
END Vertex2d;
(* internal engine *)
PROCEDURE InnerDraw;
BEGIN
IF DrawProc # NIL THEN
JS.do("MouseX = Instance.mouseX; MouseY = Instance.mouseY;");
JS.do("Width = Instance.width; Height = Instance.height;");
DrawProc
END
END InnerDraw;
PROCEDURE InnerSetup;
BEGIN
IF SetupProc # NIL THEN
SetupProc
END
END InnerSetup;
(* start routine *)
PROCEDURE Start*;
BEGIN
ASSERT(~Started);
JS.do("function sketchProc(p){p.draw=InnerDraw; p.setup=InnerSetup; Instance=p;}");
JS.do("var canvas = document.getElementById('processingCanvas');");
JS.do("var processingInstance = new JS.Processing(canvas, sketchProc)");
Started := TRUE
END Start;
END Processing.
MODULE NoiseWave;
IMPORT PageInit, P := Processing;
CONST
width = 640;
height = 360;
VAR
yoff : REAL;
PROCEDURE Setup;
BEGIN
P.SetSize(width, height);
END Setup;
PROCEDURE Draw;
VAR
xoff : REAL;
x : INTEGER;
y : REAL;
BEGIN
xoff := 0.0;
P.SetBackground(51H);
P.Fill(255,255,255);
P.BeginShape();
FOR x := 0 TO width BY 10 DO
y := P.Map(P.Noise2d(xoff, yoff), 0.0, 1.0, 200.0, 300.0);
P.Vertex2d(FLT(x), y);
xoff := xoff + 0.05;
END;
yoff := yoff + 0.01;
P.Vertex2d(FLT(width), FLT(height));
P.Vertex2d(0.0, FLT(height));
P.EndAndCloseShape();
END Draw;
BEGIN
yoff := 0.0;
PageInit.CreateCanvas;
P.SetSetupProc(Setup);
P.SetDrawProc(Draw);
P.Start
END NoiseWave.
-
Еще одина демонстрация Processing'a:
А в чём заключается суть этой демки?
-
Прродалжаем наши игры. На этот раз демка не графическая. На этот раз у нас запрос данных с сервера:
Используются два вспомогательных модуля - JsString, для конвертации из/в js-строку в/из ARRAY OF CHAR, и, собственно, XmlHttpRequest - неполный биндинг к соответствующему объекту js, позволяющему делать запросы на сервер.
MODULE JsString;
IMPORT JS;
TYPE T* = POINTER TO RECORD END;
PROCEDURE Create*(s : ARRAY OF CHAR) : T;
VAR
res : T;
i : INTEGER;
c : CHAR;
BEGIN
JS.do("res = ''");
i := 0;
WHILE (i<LEN(s)) & (s[i]#0X) DO
c := s[i];
JS.do("res += String.fromCharCode(c);");
INC(i);
END;
RETURN res
END Create;
PROCEDURE At*(jstring : T; i : INTEGER) : CHAR;
VAR
res : CHAR;
BEGIN
JS.do("res = jstring.charCodeAt(i);");
RETURN res
END At;
PROCEDURE Length*(jstring : T) : INTEGER;
VAR
res : INTEGER;
BEGIN
JS.do("res = jstring.length;");
RETURN res
END Length;
PROCEDURE ConvertToArray*(jstring : T; VAR text : ARRAY OF CHAR);
VAR
i : INTEGER;
BEGIN
i := 0;
WHILE (i<LEN(text)) & (i<Length(jstring)) DO
text[i] := At(jstring, i);
INC(i)
END;
IF i<LEN(text) THEN text[i] := 0X; END;
END ConvertToArray;
END JsString.
MODULE XmlHttpRequest;
IMPORT JS, JsString;
TYPE T* = POINTER TO RECORD END;
PROCEDURE Create*() : T;
VAR res : T;
BEGIN
JS.do("res = new XMLHttpRequest ();");
RETURN res
END Create;
PROCEDURE Open*(r : T; method, url : ARRAY OF CHAR);
VAR
m, u : JsString.T;
BEGIN
m := JsString.Create(method);
u := JsString.Create(url);
JS.do("r.open(m, u, false);");
END Open;
PROCEDURE Send*(r : T);
BEGIN
JS.do("r.send()")
END Send;
PROCEDURE GetResponseText*(r : T; VAR text : ARRAY OF CHAR) : BOOLEAN;
VAR
t : JsString.T;
res : BOOLEAN;
BEGIN
JS.do("t = r.responseText;");
res := TRUE;
JS.do("if (t==null) res = false;");
IF res THEN
JsString.ConvertToArray(t, text);
END;
RETURN res
END GetResponseText;
END XmlHttpRequest.
MODULE Test;
IMPORT JsString, XmlHttpRequest, JS;
VAR
req : XmlHttpRequest.T;
text : ARRAY 2048 OF CHAR;
isText : BOOLEAN;
BEGIN
req := XmlHttpRequest.Create();
XmlHttpRequest.Open(req, "get", "test1.txt");
XmlHttpRequest.Send(req);
isText := XmlHttpRequest.GetResponseText(req, text);
JS.do("alert(isText);");
JS.do("alert(JsString.Create(text));")
END Test.
Чтобы попробовать делаем как обычно - копипастим на страничку онлайн-компилятора, тыкаем Compile & Run.
На всякий случай продублирую код самого примера, без модулей-биндингов:
MODULE Test;
IMPORT JsString, XmlHttpRequest, JS;
VAR
req : XmlHttpRequest.T;
text : ARRAY 2048 OF CHAR;
isText : BOOLEAN;
BEGIN
req := XmlHttpRequest.Create();
XmlHttpRequest.Open(req, "get", "test1.txt");
XmlHttpRequest.Send(req);
isText := XmlHttpRequest.GetResponseText(req, text);
JS.do("alert(isText);");
JS.do("alert(JsString.Create(text));")
END Test.
Тут псевдомодуль JS используется лишь для того, чтобы вывести результат запроса на экран в виде диалогового окошка (вначале статус запроса - есть ли ответ нормальный, затем уже сам текст). Для самого запроса он не нужен.
-
Прродалжаем наши игры. На этот раз демка не графическая. На этот раз у нас запрос данных с сервера:
Чо-та я не догоняю -- а куда эта демка коннектится? Не вижу нигде адреса сервера... о_О
-
Прродалжаем наши игры. На этот раз демка не графическая. На этот раз у нас запрос данных с сервера:
Чо-та я не догоняю -- а куда эта демка коннектится? Не вижу нигде адреса сервера... о_О
Правила безопасности в современных браузерах таковы, что запросы можно слать только к тому же серверу с которого текущая страничка была загружена.
Для ограничения XmlHttpRequest используется философия "Same Origin Policy". Она очень проста - каждый сайт в своей песочнице. Запрос можно делать только на адреса с тем же протоколом, доменом, портом, что и текущая страница.
Т.е, со страницы на адресе http://site.com нельзя сделать XmlHttpRequest на адрес https://site.com, http://site.com:81 или http://othersite.com
http://xmlhttprequest.ru/#security