From e9c705766bb6f814e3b1bebcdbb3da13d39c7578 Mon Sep 17 00:00:00 2001 From: Fontaine Date: Mon, 6 Jan 2020 23:55:35 +0100 Subject: [PATCH] v1.7 --- ffau.js | 4 +- www/blocs&generateurs/ffau/css.js | 114 +++++++++-------------- www/blocs&generateurs/ffau/html.js | 139 +++++++++++------------------ www/ffau.html | 16 ++-- www/js/ffau/index.js | 14 +-- 5 files changed, 117 insertions(+), 170 deletions(-) diff --git a/ffau.js b/ffau.js index 8511694b..3954483d 100644 --- a/ffau.js +++ b/ffau.js @@ -126,7 +126,7 @@ window.addEventListener('load', function load(event) { if (localStorage.getItem('contentHTML')=="on") { ffau.clearWorkspace() } else { - editor.setValue('\n\n \n \n \n \n \n \n\n \n',1) + editor.setValue('\n\n \n \n \n \n\n \n',1) } }) $('#btn_search').on('click', function(){ @@ -212,7 +212,7 @@ window.addEventListener('load', function load(event) { } }) $('#codeORblock').on("change", function(){ - var data = '\n\n \n \n \n \n \n \n'+document.getElementById('blockly_r').innerHTML+' \n' + var data = document.getElementById('blockly_r').srcdoc if (localStorage.getItem('contentHTML')=="on") { if (localStorage.getItem('size')) { document.getElementById('content_code').style.fontSize = localStorage.getItem('size') diff --git a/www/blocs&generateurs/ffau/css.js b/www/blocs&generateurs/ffau/css.js index 4c23125b..5163fd8e 100644 --- a/www/blocs&generateurs/ffau/css.js +++ b/www/blocs&generateurs/ffau/css.js @@ -38,29 +38,6 @@ function CSSEscape(input) { function isNewTabUrl(input) { return URLRegex.test(input) || (!input.includes('http://') && !input.includes('https://')) && !hashRegex.test(input) && input.length > 0; } -// CSS file -Blockly.Blocks['css'] = { - init: function () { - this.jsonInit({ - "message0": ' %1 %2 ', - "args0": [ - { - "type": "input_dummy" - }, - { - "type": "input_statement", - "name": "content", - "check": "style" - } - ], - "colour": 290 - }); - } -}; -Blockly.html['css'] = function (block) { - var statement = Blockly.html.statementToCode(block, 'content'); - return ''; -}; // Style Blockly.Blocks['style'] = { init: function () { @@ -78,9 +55,7 @@ Blockly.Blocks['style'] = { ], "previousStatement": "header", "nextStatement": "header", - "colour": 290, - "tooltip": "Style tag", - "helpUrl": "https://www.w3schools.com/tags/tag_style.asp" + "colour": 290 }); } }; @@ -106,9 +81,7 @@ Blockly.Blocks['stylearg'] = { ], "previousStatement": "args", "nextStatement": "args", - "colour": 290, - "tooltip": "Style modifier", - "helpUrl": "https://www.w3schools.com/css/css_howto.asp" + "colour": 290 }); } }; @@ -148,11 +121,38 @@ Blockly.html['cssitem'] = function (block) { var stmt = Blockly.html.statementToCode(block, 'content'); var mod = Blockly.html.statementToCode(block, 'modifier', Blockly.html.ORDER_ATOMIC); mod = mod.split(' ').join(''); // remove spaces - var selector = CSSEscape(block.getFieldValue('selector')); - return selector + mod + '{\n' + stmt + '}\n'; }; +//Other tag +Blockly.Blocks['othercss'] = { + init: function() { + this.jsonInit({ + "message0": '%1 : %2 ;', + "args0": [ + { + "type": "field_input", + "name": "property", + "text": "property" + }, + { + "type": "field_input", + "name": "value", + "text": "value" + } + ], + "previousStatement": "stylecontent", + "nextStatement": "stylecontent", + "colour": 290 + }); + } +}; +Blockly.html['othercss'] = function(block){ + var property = block.getFieldValue('property'); + var value = block.getFieldValue('value'); + var code = property+': '+value+';\n'; + return code; +}; // Font-family Blockly.Blocks['fontfamily'] = { init: function () { @@ -167,9 +167,7 @@ Blockly.Blocks['fontfamily'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS font-family", - "helpUrl": "https://www.w3schools.com/cssref/pr_font_font-family.asp" + "colour": 290 }); } }; @@ -191,9 +189,7 @@ Blockly.Blocks['fontsize'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS font-size", - "helpUrl": "https://www.w3schools.com/cssref/pr_font_font-size.asp" + "colour": 290 }); } }; @@ -240,9 +236,7 @@ Blockly.Blocks['fontweight'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "Font-weight CSS property", - "helpUrl": "https://www.w3schools.com/cssref/pr_font_weight.asp" + "colour": 290 }); } }; @@ -286,9 +280,7 @@ Blockly.Blocks['margin'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Margin", - "helpUrl": "https://www.w3schools.com/cssref/pr_margin.asp" + "colour": 290 }); } }; @@ -333,9 +325,7 @@ Blockly.Blocks['padding'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Padding", - "helpUrl": "https://www.w3schools.com/cssref/pr_padding.asp" + "colour": 290 }); } }; @@ -365,9 +355,7 @@ Blockly.Blocks['texttransform'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Text-transform", - "helpUrl": "https://www.w3schools.com/cssref/pr_text_text-transform.asp" + "colour": 290 }); } }; @@ -394,9 +382,7 @@ Blockly.Blocks['textalign'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Text-align", - "helpUrl": "https://www.w3schools.com/cssref/pr_text_text-align.asp" + "colour": 290 }) } }; @@ -418,9 +404,7 @@ Blockly.Blocks['bgcolor-new'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Background-Color", - "helpUrl": "https://www.w3schools.com/css/css_background.asp" + "colour": 290 }); } }; @@ -646,9 +630,7 @@ Blockly.Blocks['widthheightnum'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "CSS Width/height", - "helpUrl": "https://www.w3schools.com/css/css_dimension.asp" + "colour": 290 }); } }; @@ -678,9 +660,7 @@ Blockly.Blocks['float'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "Float an element left or right", - "helpUrl": "https://www.w3schools.com/cssref/pr_class_float.asp" + "colour": 290 }); } }; @@ -742,9 +722,7 @@ Blockly.Blocks['verticalalign'] = { ], "previousStatement": "stylecontent", "nextStatement": "stylecontent", - "colour": 290, - "tooltip": "Vertical-align CSS property", - "helpUrl": "https://www.w3schools.com/cssref/pr_pos_vertical-align.asp" + "colour": 290 }) } }; @@ -787,9 +765,7 @@ Blockly.Blocks['hex_picker'] = { } ], "output": "color", - "colour": 290, - "tooltip": "HTML HEX color picker", - "helpUrl": "https://www.w3schools.com/html/html_colors.asp" + "colour": 290 }); } }; @@ -859,9 +835,7 @@ Blockly.Blocks['color_picker'] = { } ], "output": "color", - "colour": 290, - "tooltip": "HTML color picker", - "helpUrl": "https://www.w3schools.com/html/html_colors.asp" + "colour": 290 }); } }; diff --git a/www/blocs&generateurs/ffau/html.js b/www/blocs&generateurs/ffau/html.js index 465421d9..c6d599ca 100644 --- a/www/blocs&generateurs/ffau/html.js +++ b/www/blocs&generateurs/ffau/html.js @@ -40,7 +40,7 @@ function URLInput(input) { Blockly.Blocks['html'] = { init: function () { this.jsonInit({ - "message0": ' %1 %2 ', + "message0": ' %1 %2 ', "args0": [ { "type": "input_dummy" @@ -67,12 +67,17 @@ Blockly.Blocks['base'] = { init: function () { this.appendDummyInput().appendField(' title').appendField(new Blockly.FieldTextInput(""), "TITLE"); this.appendDummyInput().appendField(' Bootstrap.css'); this.appendDummyInput().appendField(' FontAwesome.css'); - this.appendDummyInput().appendField(''); + this.appendValueInput("modifier","attributes").appendField(''); this.appendStatementInput("content"); this.setColour(210)} }; Blockly.html['base'] = function (block) { - return Blockly.html.statementToCode(block, 'content') + var code = "\n\n\n\n" + code += "\n\n" + code += "" + block.getFieldValue('TITLE') + "\n\n" + code += "" + code += Blockly.html.statementToCode(block, 'content') + "\n" + return code }; // Head tag Blockly.Blocks['head'] = {init:function(){ @@ -85,7 +90,7 @@ Blockly.Blocks['head'] = {init:function(){ { "type": "input_statement", "name": "content", - "check": "document" + "check": "header" } ], "previousStatement": "document", @@ -115,33 +120,31 @@ Blockly.html['title'] = function (block) { var text_content = block.getFieldValue('_text'); return '' + text_content + '\n \n'; }; -// Link PURE.css -Blockly.Blocks['pure'] = { +// Link bootstrap.css +Blockly.Blocks['bootstrap'] = { init:function(){ this.appendDummyInput() - .appendField(''); + .appendField(""); this.setInputsInline(false); this.setPreviousStatement(true); this.setNextStatement(true); this.setColour(210)} }; -Blockly.html['pure'] = function (block) { - return '\n'; +Blockly.html['bootstrap'] = function (block) { + return '' }; // Link FontAwesome.css Blockly.Blocks['fontawesome'] = { init:function(){ this.appendDummyInput() - .appendField(''); + .appendField(""); this.setInputsInline(false); this.setPreviousStatement(true); this.setNextStatement(true); this.setColour(210)} }; Blockly.html['fontawesome'] = function (block) { - var code = '\n'; - code += ' \n'; - return code; + return ''; }; // Body tag Blockly.Blocks['body'] = { @@ -253,9 +256,7 @@ Blockly.Blocks['divider'] = { "html", "form" ], - "colour": 210, - "tooltip": "Divider tag", - "helpUrl": "https://www.w3schools.com/tags/tag_div.asp" + "colour": 210 }); } }; @@ -272,9 +273,7 @@ Blockly.Blocks['linebreak'] = { "message0": '
', "previousStatement": "html", "nextStatement": "html", - "colour": 210, - "tooltip": "Line break tag", - "helpUrl": "https://www.w3schools.com/tags/tag_br.asp" + "colour": 210 }); } }; @@ -295,9 +294,7 @@ Blockly.Blocks['hline'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 210, - "tooltip": "Horizontal line tag", - "helpUrl": "https://www.w3schools.com/tags/tag_hr.asp" + "colour": 210 }); } }; @@ -341,9 +338,7 @@ Blockly.Blocks['class'] = { ], "previousStatement": "args", "nextStatement": "args", - "colour": 120, - "tooltip": "Class attribute", - "helpUrl": "https://www.w3schools.com/html/html_classes.asp" + "colour": 120 }); } }; @@ -365,9 +360,7 @@ Blockly.Blocks['id'] = { ], "previousStatement": "args", "nextStatement": "args", - "colour": 120, - "tooltip": "ID attribute", - "helpUrl": "https://www.w3schools.com/tags/att_global_id.asp" + "colour": 120 }); } }; @@ -394,9 +387,7 @@ Blockly.Blocks['emptyarg'] = { ], "previousStatement": "args", "nextStatement": "args", - "colour": 120, - "tooltip": "Empty modifier", - "helpUrl": "https://www.w3schools.com/html/html_classes.asp" + "colour": 120 }); } }; @@ -511,9 +502,7 @@ Blockly.Blocks['textmod'] = { ], "previousStatement": "textcontainer", "nextStatement": "textcontainer", - "colour": 65, - "tooltip": "Text modifier - used to achieve formatting effects with text", - "helpUrl": "https://www.w3schools.com/html/html_formatting.asp" + "colour": 65 }); } }; @@ -541,9 +530,7 @@ Blockly.Blocks['paragraph'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 65, - "tooltip": "Paragraph tag", - "helpUrl": "https://www.w3schools.com/tags/tag_p.asp" + "colour": 65 }); } }; @@ -601,9 +588,7 @@ Blockly.Blocks['header'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 65, - "tooltip": "Header tag", - "helpUrl": "https://www.w3schools.com/tags/tag_hn.asp" + "colour": 65 }); } }; @@ -637,9 +622,7 @@ Blockly.Blocks['link'] = { ], "previousStatement": "textcontainer", "nextStatement": "textcontainer", - "colour": 65, - "tooltip": "Paragraph tag", - "helpUrl": "https://www.w3schools.com/tags/tag_p.asp" + "colour": 65 }); } }; @@ -673,9 +656,7 @@ Blockly.Blocks['span'] = { ], "previousStatement": "textcontainer", "nextStatement": "textcontainer", - "colour": 65, - "tooltip": "Span tag", - "helpUrl": "https://www.w3schools.com/tags/tag_span.asp" + "colour": 65 }); } }; @@ -704,9 +685,7 @@ Blockly.Blocks['table'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 20, - "tooltip": "Table tag", - "helpUrl": "https://www.w3schools.com/tags/tag_table.asp" + "colour": 20 }); } }; @@ -734,9 +713,7 @@ Blockly.Blocks['tablerow'] = { ], "previousStatement": "table", "nextStatement": "table", - "colour": 20, - "tooltip": "Table row tag", - "helpUrl": "https://www.w3schools.com/tags/tag_tr.asp" + "colour": 20 }); } }; @@ -764,9 +741,7 @@ Blockly.Blocks['tableheading'] = { ], "previousStatement": ["tablerow", "thead", "tbody"], "nextStatement": ["tablerow", "thead", "tbody"], - "colour": 20, - "tooltip": "Table heading tag", - "helpUrl": "https://www.w3schools.com/tags/tag_th.asp" + "colour": 20 }); } }; @@ -880,9 +855,7 @@ Blockly.Blocks['form'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 160, - "tooltip": "Form tag", - "helpUrl": "https://www.w3schools.com/tags/tag_form.asp" + "colour": 160 }); } }; @@ -986,9 +959,7 @@ Blockly.Blocks['input'] = { ], "previousStatement": "form", "nextStatement": "form", - "colour": 160, - "tooltip": "Input tag", - "helpUrl": "https://www.w3schools.com/tags/tag_input.asp" + "colour": 160 }); } }; @@ -1031,9 +1002,7 @@ Blockly.Blocks['label'] = { "html", "form" ], - "colour": 160, - "tooltip": "Label tag", - "helpUrl": "https://www.w3schools.com/tags/tag_label.asp" + "colour": 160 }); } }; @@ -1144,16 +1113,16 @@ Blockly.Blocks['audio'] = { "name": "source", "options": [ [ - "8bit.ogg", - "8bit.ogg" + "acqua", + "acqua" ], [ - "classical.mp3", - "classical.mp3" + "kv", + "kv" ], [ - "happy.wav", - "happy.wav" + "vexento", + "vexento" ] ] }, @@ -1180,9 +1149,7 @@ Blockly.Blocks['audio'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 330, - "tooltip": "Audio tag", - "helpUrl": "https://www.w3schools.com/tags/tag_audio.asp" + "colour": 330 }); } }; @@ -1205,17 +1172,17 @@ Blockly.html['audio'] = function (block) { var type; var url; switch (source) { - case "8bit.ogg": - url = 'https://firebasestorage.googleapis.com/v0/b/cdr-app-firebase.appspot.com/o/8bit.ogg?alt=media&token=be7cc7aa-08b2-4ca4-95bd-677111139c8f'; - type = "audio/ogg"; + case "acqua": + url = 'media/acqua.mp3'; + type = "audio/mpeg"; break; - case "classical.mp3": - url = 'https://firebasestorage.googleapis.com/v0/b/cdr-app-firebase.appspot.com/o/classical.mp3?alt=media&token=f9a9f301-5dd2-4c3d-8857-f9883b584070'; + case "kv": + url = 'media/kv.mp3'; type = "audio/mpeg"; break; - case "happy.wav": - url = 'https://firebasestorage.googleapis.com/v0/b/cdr-app-firebase.appspot.com/o/happy.wav?alt=media&token=a7fcd6f6-7f5d-40c4-b172-c135471244b1'; - type = "audio/wav"; + case "vexento": + url = 'media/vexento.mp3'; + type = "audio/mpeg"; break; } code += '>\n\n\n'; @@ -1236,7 +1203,7 @@ Blockly.Blocks['video'] = { "bbb" ], [ - "llamadrama.mp4", + "lamadrama.mp4", "ld" ] ] @@ -1264,9 +1231,7 @@ Blockly.Blocks['video'] = { ], "previousStatement": "html", "nextStatement": "html", - "colour": 330, - "tooltip": "Video tag", - "helpUrl": "https://www.w3schools.com/tags/tag_video.asp" + "colour": 330 }); } }; @@ -1289,10 +1254,10 @@ Blockly.html['video'] = function (block) { var type = "video/mp4"; switch (source) { case "bbb": - source = "https://firebasestorage.googleapis.com/v0/b/cdr-app-firebase.appspot.com/o/bigbuckbunny_trail_720p.mp4?alt=media&token=4795c3dd-9271-4801-96da-34da2f0c65d7"; + source = "media/bigbuckbunny.mp4"; break; case "ld": - source = "https://firebasestorage.googleapis.com/v0/b/cdr-app-firebase.appspot.com/o/llamadrama_720p.mp4?alt=media&token=5ce29fab-e766-44d1-bc99-481ee2fc63cd"; + source = "media/lamadrama.mp4"; break; } code += '>\n\n\n'; diff --git a/www/ffau.html b/www/ffau.html index d33fc36f..cb292e47 100644 --- a/www/ffau.html +++ b/www/ffau.html @@ -37,12 +37,12 @@
    • +