Enviar pesquisa
Carregar
Blockly
•
Transferir como PPTX, PDF
•
2 gostaram
•
979 visualizações
J
JuliaDrozd
Seguir
Educação
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 13
Baixar agora
Recomendados
Лабораторная работа №1
Лабораторная работа №1
Alexey Potopakhin
фабрика Blockly
фабрика Blockly
Евгений Белов
StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG
StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG
StHack
HTML5 & The Open Web - at Nackademin
HTML5 & The Open Web - at Nackademin
Robert Nyman
Yearning jQuery
Yearning jQuery
Remy Sharp
Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)
Remy Sharp
Moustamera
Moustamera
Bram Vandewalle
Prototype UI
Prototype UI
Sébastien Gruhier
Recomendados
Лабораторная работа №1
Лабораторная работа №1
Alexey Potopakhin
фабрика Blockly
фабрика Blockly
Евгений Белов
StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG
StHack 2014 - Mario "@0x6D6172696F" Heiderich - JSMVCOMFG
StHack
HTML5 & The Open Web - at Nackademin
HTML5 & The Open Web - at Nackademin
Robert Nyman
Yearning jQuery
Yearning jQuery
Remy Sharp
Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)
Remy Sharp
Moustamera
Moustamera
Bram Vandewalle
Prototype UI
Prototype UI
Sébastien Gruhier
Reactive Type-safe WebComponents
Reactive Type-safe WebComponents
Martin Hochel
javascript examples
javascript examples
Egerton University
Backbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVC
pootsbook
Introduction to jQuery
Introduction to jQuery
Nagaraju Sangam
Browsers with Wings
Browsers with Wings
Remy Sharp
Netvibes UWA workshop at ParisWeb 2007
Netvibes UWA workshop at ParisWeb 2007
Netvibes
HTML,CSS Next
HTML,CSS Next
지수 윤
UA Testing with Selenium and PHPUnit - ZendCon 2013
UA Testing with Selenium and PHPUnit - ZendCon 2013
Michelangelo van Dam
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
Patrick Lauke
Data binding w Androidzie
Data binding w Androidzie
The Software House
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
Nagios
https://www.facebook.com/valdyna.monna?fref=ts
https://www.facebook.com/valdyna.monna?fref=ts
Arif Alexi
AngularJS and SPA
AngularJS and SPA
Lorenzo Dematté
Send.php
Send.php
abdoahmd44
Discontinuing Reader Matches
Discontinuing Reader Matches
chicagonewsonlineradio
YUI 3
YUI 3
Dav Glass
What the FUF?
What the FUF?
An Doan
DOSUG Intro to JQuery JavaScript Framework
DOSUG Intro to JQuery JavaScript Framework
Matthew McCullough
Knockout.js presentation
Knockout.js presentation
Scott Messinger
Mad Max is back, plus the rest of our new reviews and notable screenings
Mad Max is back, plus the rest of our new reviews and notable screenings
chicagonewsonlineradio
Learning to Mod Minecraft: A Father/Daughter Retrospective
Learning to Mod Minecraft: A Father/Daughter Retrospective
Kevin Hakanson
лр1
лр1
SvyatoslavPozhydaev
Mais conteúdo relacionado
Mais procurados
Reactive Type-safe WebComponents
Reactive Type-safe WebComponents
Martin Hochel
javascript examples
javascript examples
Egerton University
Backbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVC
pootsbook
Introduction to jQuery
Introduction to jQuery
Nagaraju Sangam
Browsers with Wings
Browsers with Wings
Remy Sharp
Netvibes UWA workshop at ParisWeb 2007
Netvibes UWA workshop at ParisWeb 2007
Netvibes
HTML,CSS Next
HTML,CSS Next
지수 윤
UA Testing with Selenium and PHPUnit - ZendCon 2013
UA Testing with Selenium and PHPUnit - ZendCon 2013
Michelangelo van Dam
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
Patrick Lauke
Data binding w Androidzie
Data binding w Androidzie
The Software House
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
Nagios
https://www.facebook.com/valdyna.monna?fref=ts
https://www.facebook.com/valdyna.monna?fref=ts
Arif Alexi
AngularJS and SPA
AngularJS and SPA
Lorenzo Dematté
Send.php
Send.php
abdoahmd44
Discontinuing Reader Matches
Discontinuing Reader Matches
chicagonewsonlineradio
YUI 3
YUI 3
Dav Glass
What the FUF?
What the FUF?
An Doan
DOSUG Intro to JQuery JavaScript Framework
DOSUG Intro to JQuery JavaScript Framework
Matthew McCullough
Knockout.js presentation
Knockout.js presentation
Scott Messinger
Mad Max is back, plus the rest of our new reviews and notable screenings
Mad Max is back, plus the rest of our new reviews and notable screenings
chicagonewsonlineradio
Mais procurados
(20)
Reactive Type-safe WebComponents
Reactive Type-safe WebComponents
javascript examples
javascript examples
Backbone.js — Introduction to client-side JavaScript MVC
Backbone.js — Introduction to client-side JavaScript MVC
Introduction to jQuery
Introduction to jQuery
Browsers with Wings
Browsers with Wings
Netvibes UWA workshop at ParisWeb 2007
Netvibes UWA workshop at ParisWeb 2007
HTML,CSS Next
HTML,CSS Next
UA Testing with Selenium and PHPUnit - ZendCon 2013
UA Testing with Selenium and PHPUnit - ZendCon 2013
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
HTML5 (and friends) - History, overview and current status - jsDay Verona 11....
Data binding w Androidzie
Data binding w Androidzie
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
Nagios Conference 2014 - Troy Lea - JavaScript and jQuery - Nagios XI Tips, T...
https://www.facebook.com/valdyna.monna?fref=ts
https://www.facebook.com/valdyna.monna?fref=ts
AngularJS and SPA
AngularJS and SPA
Send.php
Send.php
Discontinuing Reader Matches
Discontinuing Reader Matches
YUI 3
YUI 3
What the FUF?
What the FUF?
DOSUG Intro to JQuery JavaScript Framework
DOSUG Intro to JQuery JavaScript Framework
Knockout.js presentation
Knockout.js presentation
Mad Max is back, plus the rest of our new reviews and notable screenings
Mad Max is back, plus the rest of our new reviews and notable screenings
Destaque
Learning to Mod Minecraft: A Father/Daughter Retrospective
Learning to Mod Minecraft: A Father/Daughter Retrospective
Kevin Hakanson
лр1
лр1
SvyatoslavPozhydaev
Scratch: School and Programming Languages
Scratch: School and Programming Languages
2YOUNG2FAIL
Scratch
Scratch
Barbara M. King
Coding 101
Coding 101
Michelle Meracis
Programming&coding
Programming&coding
Barbara M. King
Picaxe manual5
Picaxe manual5
Richard Wilcamango Salas
расчетная работа
расчетная работа
JuliaDrozd
2015 JSDC Build Anything with JavaScript
2015 JSDC Build Anything with JavaScript
Web Arduino
Alternative ways of learning programming from scratch – first steps in automa...
Alternative ways of learning programming from scratch – first steps in automa...
COMAQA.BY
Python test-automation
Python test-automation
COMAQA.BY
Emerging Technologies in Banking and Finance
Emerging Technologies in Banking and Finance
amit_singh87
Programming with Scratch
Programming with Scratch
Cort1026
Programming from scratch™
Programming from scratch™
Highbury College and New Horizons
Primary Programming and Scratch
Primary Programming and Scratch
Miles Berry
Scratch - Intuitive and Accessible Programming
Scratch - Intuitive and Accessible Programming
Gigi Gilbert-Igelsrud
Programació amb Blockly Games Turtle
Programació amb Blockly Games Turtle
Xavier Rosell
Programming in scratch
Programming in scratch
Hussam Mostafa
Intro To Scratch
Intro To Scratch
Patrick Woessner
Scratch: Programming for everyone
Scratch: Programming for everyone
Akshar Desai
Destaque
(20)
Learning to Mod Minecraft: A Father/Daughter Retrospective
Learning to Mod Minecraft: A Father/Daughter Retrospective
лр1
лр1
Scratch: School and Programming Languages
Scratch: School and Programming Languages
Scratch
Scratch
Coding 101
Coding 101
Programming&coding
Programming&coding
Picaxe manual5
Picaxe manual5
расчетная работа
расчетная работа
2015 JSDC Build Anything with JavaScript
2015 JSDC Build Anything with JavaScript
Alternative ways of learning programming from scratch – first steps in automa...
Alternative ways of learning programming from scratch – first steps in automa...
Python test-automation
Python test-automation
Emerging Technologies in Banking and Finance
Emerging Technologies in Banking and Finance
Programming with Scratch
Programming with Scratch
Programming from scratch™
Programming from scratch™
Primary Programming and Scratch
Primary Programming and Scratch
Scratch - Intuitive and Accessible Programming
Scratch - Intuitive and Accessible Programming
Programació amb Blockly Games Turtle
Programació amb Blockly Games Turtle
Programming in scratch
Programming in scratch
Intro To Scratch
Intro To Scratch
Scratch: Programming for everyone
Scratch: Programming for everyone
Semelhante a Blockly
Private slideshow
Private slideshow
sblackman
Human Talks - StencilJS
Human Talks - StencilJS
Alexandre Koelsch
лукьянченко л.а. пос 10а
лукьянченко л.а. пос 10а
l10bov
Building iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" Domino
Rob Bontekoe
Jquery presentation
Jquery presentation
Mevin Mohan
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
Igor Bronovskyy
AngularJS Mobile Warsaw 20-10-2014
AngularJS Mobile Warsaw 20-10-2014
Dariusz Kalbarczyk
Internet and Web Technology (CLASS-8) [jQuery and JSON] | NIC/NIELIT Web Tech...
Internet and Web Technology (CLASS-8) [jQuery and JSON] | NIC/NIELIT Web Tech...
Ayes Chinmay
Speed up your GWT coding with gQuery
Speed up your GWT coding with gQuery
Manuel Carrasco Moñino
Upload[1]
Upload[1]
mirjana stojanova
Building the an End-to-End ASP.NET MVC 4, Entity Framework, HTML5, jQuery app...
Building the an End-to-End ASP.NET MVC 4, Entity Framework, HTML5, jQuery app...
Dan Wahlin
Jarv.us Showcase — SenchaCon 2011
Jarv.us Showcase — SenchaCon 2011
Chris Alfano
Introduction to AngularJS
Introduction to AngularJS
Marco Vito Moscaritolo
smoke1272528461
smoke1272528461
mxsmoketest
Elinvoimaa hunajasta-yleist-hunajatietoa-ja-kyttvinkkej
Elinvoimaa hunajasta-yleist-hunajatietoa-ja-kyttvinkkej
Pertti Paavola
Intro to JavaScript
Intro to JavaScript
Jussi Pohjolainen
JSMVCOMFG - To sternly look at JavaScript MVC and Templating Frameworks
JSMVCOMFG - To sternly look at JavaScript MVC and Templating Frameworks
Mario Heiderich
CSS3 Takes on the World
CSS3 Takes on the World
Jonathan Snook
JavaFX in Action (devoxx'16)
JavaFX in Action (devoxx'16)
Alexander Casall
Html5 For Jjugccc2009fall
Html5 For Jjugccc2009fall
Shumpei Shiraishi
Semelhante a Blockly
(20)
Private slideshow
Private slideshow
Human Talks - StencilJS
Human Talks - StencilJS
лукьянченко л.а. пос 10а
лукьянченко л.а. пос 10а
Building iPhone Web Apps using "classic" Domino
Building iPhone Web Apps using "classic" Domino
Jquery presentation
Jquery presentation
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
AngularJS Mobile Warsaw 20-10-2014
AngularJS Mobile Warsaw 20-10-2014
Internet and Web Technology (CLASS-8) [jQuery and JSON] | NIC/NIELIT Web Tech...
Internet and Web Technology (CLASS-8) [jQuery and JSON] | NIC/NIELIT Web Tech...
Speed up your GWT coding with gQuery
Speed up your GWT coding with gQuery
Upload[1]
Upload[1]
Building the an End-to-End ASP.NET MVC 4, Entity Framework, HTML5, jQuery app...
Building the an End-to-End ASP.NET MVC 4, Entity Framework, HTML5, jQuery app...
Jarv.us Showcase — SenchaCon 2011
Jarv.us Showcase — SenchaCon 2011
Introduction to AngularJS
Introduction to AngularJS
smoke1272528461
smoke1272528461
Elinvoimaa hunajasta-yleist-hunajatietoa-ja-kyttvinkkej
Elinvoimaa hunajasta-yleist-hunajatietoa-ja-kyttvinkkej
Intro to JavaScript
Intro to JavaScript
JSMVCOMFG - To sternly look at JavaScript MVC and Templating Frameworks
JSMVCOMFG - To sternly look at JavaScript MVC and Templating Frameworks
CSS3 Takes on the World
CSS3 Takes on the World
JavaFX in Action (devoxx'16)
JavaFX in Action (devoxx'16)
Html5 For Jjugccc2009fall
Html5 For Jjugccc2009fall
Mais de JuliaDrozd
Guid studio
Guid studio
JuliaDrozd
Uml
Uml
JuliaDrozd
Dfd и idef0
Dfd и idef0
JuliaDrozd
концептуальное моделирование!
концептуальное моделирование!
JuliaDrozd
концептуальное моделирование
концептуальное моделирование
JuliaDrozd
дрозд ю.в. пос 10а
дрозд ю.в. пос 10а
JuliaDrozd
Mais de JuliaDrozd
(6)
Guid studio
Guid studio
Uml
Uml
Dfd и idef0
Dfd и idef0
концептуальное моделирование!
концептуальное моделирование!
концептуальное моделирование
концептуальное моделирование
дрозд ю.в. пос 10а
дрозд ю.в. пос 10а
Último
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
nomboosow
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
JemimahLaneBuaron
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
VS Mahajan Coaching Centre
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
Thiyagu K
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
RoyAbrique
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
Thiyagu K
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
RAM LAL ANAND COLLEGE, DELHI UNIVERSITY.
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
Chameera Dedduwage
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
RKavithamani
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
dawncurless
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
QucHHunhnh
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
Sarwono Sutikno, Dr.Eng.,CISA,CISSP,CISM,CSX-F
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
PECB
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
EduSkills OECD
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
Marc Dusseiller Dusjagr
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
Celine George
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
Maestría en Comunicación Digital Interactiva - UNR
How to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptx
manuelaromero2013
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
David Douglas School District
Último
(20)
Interactive Powerpoint_How to Master effective communication
Interactive Powerpoint_How to Master effective communication
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Z Score,T Score, Percential Rank and Box Plot Graph
Z Score,T Score, Percential Rank and Box Plot Graph
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
INDIA QUIZ 2024 RLAC DELHI UNIVERSITY.pptx
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Beyond the EU: DORA and NIS 2 Directive's Global Impact
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
How to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptx
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
Blockly
1.
Лабораторная работа №
1 на тему «Фабрика Blockly» Выполнила студентка группы ПОС-10А Дрозд Юлия
2.
Страница Blockly.Language.webgl_a09_html = { category:
'WebGL', helpUrl: 'http://www.example.com/', init: function() { this.setColour(330); this.appendValueInput("HTML") .setAlign(Blockly.ALIGN_CENTRE) .appendTitle("HTML"); this.appendStatementInput("HTML"); this.setPreviousStatement(true); this.setNextStatement(true); this.setTooltip(''); this.appendValueInput("VALUE") .appendTitle(new Blockly.FieldImage("../../media/html.svg", 64, 48)); } }; Blockly.JavaScript.webgl_a09_html = function() { var value_html = Blockly.JavaScript.valueToCode(this, 'HTML', Blockly.JavaScript.ORDER_ATOMIC); var statements_html = Blockly.JavaScript.statementToCode(this, 'HTML'); var code = '<html>'/* + value_html + '< html>' */ return code; };
3.
Тело Blockly.Language.webgl_a09_body = { category:
'WebGL', helpUrl: 'file://localhost/C:/blockly/demos/webgl/webgl_a09_headerhtml5.help.html', init: function () { this.setColour(65); this.appendStatementInput("BODY") .appendTitle("Body"); this.appendStatementInput("NAME"); this.appendStatementInput("NAME"); this.appendDummyInput() .appendTitle("canvas id=") .appendTitle(new Blockly.FieldTextInput("canv"), "canv") this.setPreviousStatement(true); this.setNextStatement(true); this.setTooltip(''); } }; Blockly.JavaScript.webgl_a09_body = function() { var statements_body = Blockly.JavaScript.statementToCode(this, 'BODY'); var statements_name = Blockly.JavaScript.statementToCode(this, 'NAME'); var statements_name = Blockly.JavaScript.statementToCode(this, 'NAME'); var code = '<body><"'+statements_body+'"></body>n'; return code; };
4.
Blockly.Language.webgl_a09_header = { category:
'WebGL', helpUrl: 'file://localhost/C:/blockly/demos/webgl/webgl_a09_headerhtml5.help.html', init: function() { this.setColour(65); this.appendStatementInput("HEADER") .appendTitle("Header"); this.setOutput(true); this.setTooltip(''); } }; Blockly.JavaScript.webgl_a09_header = function() { var statements_header = Blockly.JavaScript.statementToCode(this, 'HEADER'); // TODO: Assemble JavaScript into code variable. var code = 'n<header>n' + value_header + 'n</header>' // TODO: Change ORDER_NONE to the correct strength. return [code, Blockly.JavaScript.ORDER_NONE]; }; Голова
5.
Заголовок Blockly.Language.webgl_a09_title = { category:
'WebGL', helpUrl: 'file://localhost/C:/blockly/demos/webgl/webgl_a09_headerhtml5.help.html', init: function() { this.setColour(160); this.appendDummyInput() .appendTitle("title") .appendTitle(new Blockly.FieldTextInput("Blockly"), "NAME"); this.setPreviousStatement(true); this.setNextStatement(true); //this.appendValueInput("TITLE") // .appendTitle("Title"); // this.setOutput(true); this.setTooltip(''); } }; Blockly.JavaScript.webgl_a09_title = function() { var value_title = Blockly.JavaScript.valueToCode(this, 'TITLE', Blockly.JavaScript.ORDER_ATOMIC); // TODO: Assemble JavaScript into code variable. //var code = 'n<title>n;' + statements_title + 'n</title>' var code = "'<title>'" + value_title.toString() +"'< Blockly ></canvas>" //return [code, Blockly.JavaScript.ORDER_NONE]; return code; };
6.
Blockly.Language.a09_img = { category:
'WebGL', helpUrl: 'file://localhost/C:/blockly/demos/webgl/webgl_a09_headerhtml5.help.html', init: function() { this.setColour(280); this.appendDummyInput() .appendTitle("img") .appendTitle(new Blockly.FieldTextInput("canvas"), "NAME"); this.setPreviousStatement(true); this.setNextStatement(true); this.setTooltip(''); } }; Blockly.JavaScript.a09_canvas = function() { var text_name_canvas = this.getTitleValue('NAME'); var code = "<canvas id='" + text_name_canvas.toString() +"' width="120" height="120" ></canvas>" canvas_name = text_name_canvas; return code; }; Canvas
7.
Отрисовкакруга Blockly.Language.webgl_a09_circle = { category:
'WebGL_2d', helpUrl: '../webgl/webgl_a08_headerhtml5.help.html', init: function() { this.setColour(350); this.appendDummyInput() .appendTitle(new Blockly.FieldImage("../../media/html1.svg", 64, 48)) .appendTitle("Set coordinates A(x,y)& radius of the round:"); this.appendValueInput("x") .setCheck(Number) .setAlign(Blockly.ALIGN_RIGHT) .appendTitle("x"); this.appendValueInput("y") .setCheck(Number) .setAlign(Blockly.ALIGN_RIGHT) .appendTitle("y"); this.appendValueInput("r") .setCheck(Number) .setAlign(Blockly.ALIGN_RIGHT) .appendTitle("radius"); this.setPreviousStatement(true); this.setNextStatement(true); this.setTooltip(''); } }; Blockly.JavaScript.webgl_a09_circle = function() { var value_canv_id = Blockly.JavaScript.valueToCode(this, 'canv_id', Blockly.Java Script.ORDER_ATOMIC); var value_x = Blockly.JavaScript.valueToCode(this, 'x', Blockly.JavaScript. ORDER_ATOMIC); var value_y = Blockly.JavaScript.valueToCode(this, 'y', Blockly.JavaScript. ORDER_ATOMIC); var value_w = Blockly.JavaScript.valueToCode(this, 'radius', Blockly.JavaSc ript.ORDER_ATOMIC); // TODO: Assemble JavaScript into code variable. var code="var ctx = document.getElementById("+ value_canv_id + ").getContext('2d');n" code += 'ctx.save();n'; code += 'ctx.beginPath();n'; code += 'ctx.translate('+ value_x+',' + value_y+');n'; code += 'ctx.scale('+value_w +', 1);n'; code += "n gl.arc(" + parseInt(text_x) + ", "+parseInt(text_y)+", "+parseInt(text_radius)+", 0, 2 * Math.PI, false);"; code += 'ctx.restore();n'; code += 'ctx.closePath();n'; code += 'ctx.fill();n'; return code; };
8.
html> <head> <title> Blockly</title> </head> <body> <canvas id
='canvas' width="1000" height=“800"> </canvas> <script> if (window.WebGLRenderingContext){ var c = document.getElementById('canvas'); var gl = c.getContext('2d'); gl.beginPath(); gl.arc(75,75, 37, 0, 2 * Math.PI, false); gl.lineWidth = 1; gl.strokeStyle = '#FFFFFF'; gl.stroke(); } </script> </body> JavaScriptкодпрограммы иеерезультат
9.
Блок-представление программы
10.
ИсходныйтекстSVG-файла <svg width="120" height="120"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ --> <g> <title>Layer 1</title> <image xlink:href="images/logo.png" opacity="0.5" id="svg_1" height="0" width="0" y="279" x="422"/> <image xlink:href="images/logo.png" opacity="0.5" id="svg_2" height="0" width="0" y="305" x="450"/> <polyline id="svg_3" points="630,301 " opacity="0.5" stroke-linecap="round" stroke-width="5" stroke="#000000" fill="none"/> <polyline id="svg_4" points="612,296 " opacity="0.5" stroke-linecap="round" stroke-width="5" stroke="#000000" fill="none"/> <polyline id="svg_6" points="637,303 " opacity="0.5" stroke-linecap="round" stroke-width="5" stroke="#000000" fill="none"/> <polyline id="svg_7" points="684,348 " opacity="0.5" stroke-linecap="round" stroke-width="5" stroke="#000000" fill="none"/> <line id="svg_9" y2="242" x2="394" y1="242" x1="394" opacity="0.5" stroke-width="5" stroke="#000000" fill="none"/> <polyline id="svg_36" points="625,301 " opacity="0.5" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" stroke="#000000" fill="none"/> <polyline id="svg_37" points="650,269 " opacity="0.5" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" stroke="#000000" fill="none"/> <ellipse stroke="#000000" ry="32" rx="35" id="svg_54" cy="61" cx="61" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#7f007f"/> <rect stroke="#000000" id="svg_63" height="41" width="44" y="41" x="39" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <ellipse stroke="#000000" ry="16" rx="17" id="svg_64" cy="62" cx="61" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#7f007f"/> <path stroke="#000000" id="svg_66" d="m58.93317,57.45358c-36.4599,27.56387 23.01157,5.06276 12.85065,0.56253c-10.16098,-4.50021 -2.09198,4.78149 -13.74719,14.62572" stroke-linecap="round" stroke- linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path transform="rotate(-128.608 103.024 53.9096)" id="svg_69" d="m106.69904,45.42442c27.60645,12.37745 -13.16621,19.80392 -13.16621,19.80392c0,0 -14.44026,-32.18137 13.16621,-19.80392z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00" stroke="#000000"/> <path transform="rotate(-83.13 102.338 84.342)" id="svg_70" d="m105.51985,74.63885c23.89774,14.15408 -11.39735,22.64655 -11.39735,22.64655c0,0 -12.50031,-36.80064 11.39735,-22.64655z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00" stroke="#000000"/> <path stroke="#000000" transform="rotate(-49.8739 78 103)" id="svg_71" d="m81.56476,94.13998c26.77625,12.92422 -12.77014,20.67876 -12.77014,20.67876c0,0 -14.00601,-33.60297 12.77014,-20.67876z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path stroke="#000000" transform="rotate(-12.1443 48 103.5)" id="svg_72" d="m51.33182,94.45209c25.02625,13.19833 -11.93561,21.11731 -11.93561,21.11731c0,0 -13.09064,-34.31563 11.93561,-21.11731z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path stroke="#000000" transform="rotate(59.3227 16.5 64.5)" id="svg_73" d="m19.88998,57.05505c25.46347,10.86002 -12.1441,17.37604 -12.1441,17.37604c0,0 -13.31931,-28.23602 12.1441,-17.37604z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path stroke="#000000" transform="rotate(7.12499 25.5 89)" id="svg_74" d="m28.36844,80.64304c21.54562,12.19043 -10.2756,19.50465 -10.2756,19.50465c0,0 -11.27005,-31.69504 10.2756,-19.50465z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path stroke="#000000" transform="rotate(88.1524 22 38)" id="svg_79" d="m25.13297,29.83795c23.5329,11.90613 -11.22336,19.0498 -11.22336,19.0498c0,0 -12.30951,-30.95595 11.22336,-19.0498z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path stroke="#000000" id="svg_80" transform="rotate(151.221 63.9286 17.1252)" d="m66.61398,8.423c20.17049,12.69402 -9.61975,20.31042 -9.61975,20.31042c0,0 -10.55069,-33.00444 9.61975,-20.31042z" stroke- linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> <path id="svg_81" transform="rotate(-170.073 92.9287 26.1252)" d="m96.8252,16.2766c29.2678,14.3662 -13.9586,22.986 -13.9586,22.986c0,0 -15.3091,-37.35224 13.9586,-22.986z" stroke-linecap="round" stroke- linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00" stroke="#000000"/> <path stroke="#000000" id="svg_83" transform="rotate(138.983 41.9287 22.6252)" d="m44.97488,13.80811c22.88126,12.86157 -10.91257,20.57852 -10.91257,20.57852c0,0 -11.96866,-33.44011 10.91257,-20.57852z" stroke-linecap="round" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="#ffff00"/> </g> </svg>
11.
ИзображениеSVG-файла
12.
МасштабированиеSVG- файла 100% 175% 250%
13.
Спасибо за внимание!
Baixar agora