diff --git a/css/style.css b/css/style.css index bb4ba9a45b0643d495a33f24892dc4903721cd1c..2f92a4bbe02a915e2f21bef1b3eab1330bef860a 100644 --- a/css/style.css +++ b/css/style.css @@ -18,7 +18,220 @@ position: relative; display: inline-block; } +.boxes { + --size: 32px; + --duration: 800ms; + height: calc(var(--size) * 2); + width: calc(var(--size) * 3); + position: relative; + transform-style: preserve-3d; + transform-origin: 50% 50%; + margin: 250px auto; + margin-top: calc(var(--size) * 1.5 * -1); + transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px); +} + +.boxes .box { + width: var(--size); + height: var(--size); + top: 0; + left: 0; + position: absolute; + transform-style: preserve-3d; + margin: 250px auto; +} + +.boxes .box:nth-child(1) { + transform: translate(100%, 0); + -webkit-animation: box1 var(--duration) linear infinite; + animation: box1 var(--duration) linear infinite; + margin: 250px auto; +} + +.boxes .box:nth-child(2) { + transform: translate(0, 100%); + -webkit-animation: box2 var(--duration) linear infinite; + animation: box2 var(--duration) linear infinite; + margin: 250px auto; +} + +.boxes .box:nth-child(3) { + transform: translate(100%, 100%); + -webkit-animation: box3 var(--duration) linear infinite; + animation: box3 var(--duration) linear infinite; + margin: 250px auto; +} + +.boxes .box:nth-child(4) { + transform: translate(200%, 0); + -webkit-animation: box4 var(--duration) linear infinite; + animation: box4 var(--duration) linear infinite; + margin: 250px auto; +} + +.boxes .box > div { + --background: #5C8DF6; + --top: auto; + --right: auto; + --bottom: auto; + --left: auto; + --translateZ: calc(var(--size) / 2); + --rotateY: 0deg; + --rotateX: 0deg; + position: absolute; + width: 100%; + height: 100%; + background: var(--background); + top: var(--top); + right: var(--right); + bottom: var(--bottom); + left: var(--left); + margin: 250px auto; + transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ)); +} + +.boxes .box > div:nth-child(1) { + --top: 0; + --left: 0; + margin: 250px auto; +} + +.boxes .box > div:nth-child(2) { + --background: #145af2; + --right: 0; + --rotateY: 90deg; + margin: 250px auto; +} + +.boxes .box > div:nth-child(3) { + --background: #447cf5; + --rotateX: -90deg; + margin: 250px auto; +} + +.boxes .box > div:nth-child(4) { + --background: #DBE3F4; + --top: 0; + --left: 0; + --translateZ: calc(var(--size) * 3 * -1); + margin: 250px auto; +} + +@-webkit-keyframes box1 { + 0%, 50% { + transform: translate(100%, 0); + margin: 250px auto; + } + 100% { + transform: translate(200%, 0); + margin: 250px auto; + } +} + +@keyframes box1 { + 0%, 50% { + transform: translate(100%, 0); + margin: 250px auto; + } + + 100% { + transform: translate(200%, 0); + margin: 250px auto; + } +} + +@-webkit-keyframes box2 { + 0% { + transform: translate(0, 100%); + margin: 250px auto; + } + + 50% { + transform: translate(0, 0); + margin: 250px auto; + } + + 100% { + transform: translate(100%, 0); + margin: 250px auto; + } +} + +@keyframes box2 { + 0% { + transform: translate(0, 100%); + margin: 250px auto; + } + + 50% { + transform: translate(0, 0); + margin: 250px auto; + } + + 100% { + transform: translate(100%, 0); + margin: 250px auto; + } +} + +@-webkit-keyframes box3 { + 0%, 50% { + transform: translate(100%, 100%); + margin: 250px auto; + } + + 100% { + transform: translate(0, 100%); + margin: 250px auto; + } +} + +@keyframes box3 { + 0%, 50% { + transform: translate(100%, 100%); + margin: 250px auto; + } + + 100% { + transform: translate(0, 100%); + margin: 250px auto; + } +} + +@-webkit-keyframes box4 { + 0% { + transform: translate(200%, 0); + margin: 250px auto; + } + + 50% { + transform: translate(200%, 100%); + margin: 250px auto; + } + + 100% { + transform: translate(100%, 100%); + margin: 250px auto; + } +} + +@keyframes box4 { + 0% { + transform: translate(200%, 0); + margin: 250px auto; + } + + 50% { + transform: translate(200%, 100%); + margin: 250px auto; + } + + 100% { + transform: translate(100%, 100%); + margin: 250px auto; + } +} .dropdown-content { display: none; position: absolute; diff --git a/index.html b/index.html index 1258e00158c713846c8f97e762ddf45bac850ea0..5e87a3a1d38992b29d84ddbd1ed81d793b4b922c 100644 --- a/index.html +++ b/index.html @@ -8,16 +8,41 @@ - + - + - +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
- -
+ + + +
+
+
+
- -
- -
- - - - - - - - - - - - - - - - - - - - -
@@ -712,7 +743,8 @@
-

感谢者名单(排名不分前后)：
Golden Apple(服务器提供)
Google Blockly
iconpark
Gitee~
GZR
向阳一班

+

感谢者名单(排名不分前后)：
Golden Apple(提供服务器)
Google + Blockly
iconpark
Gitee~
GZR
向阳一班
boxxer（boxy）开发团队

开发者名单(排名不分前后)：
CodeKpy
ZouBochen
Wangs

Gitee仓库(NV)
 + +
+

问题手册

+
+ + PHP Helper 0.1(Beta) - 星点StarBit 保留所有权利 + +
+
+

使用本产品可能出现以下问题

+

积木栏没有显示全

+

解决方法：

+
  • 手机端：切换为竖屏模式再切换回横屏
    • +
  • 电脑端：
    第一种：按一下F12（按几次无所谓）
    第二种：改变一下浏览器窗口大小，然后再改回去
    • +
    + 点击空白区域退出 +
    +
    +     + + + + + + + + + + + + + + + + + + + + diff --git a/static/boxy/blocks/get.js b/static/boxy/blocks/get.js index 12721c71babb1b4400b3827a1a34531a909dbfa6..906dd4447f3f9bc2319aec6df2c3671e807118ae 100644 --- a/static/boxy/blocks/get.js +++ b/static/boxy/blocks/get.js @@ -514,3 +514,28 @@ Blockly.Blocks['css'] = { this.setHelpUrl(""); } }; +Blockly.Blocks['md5'] = { + init: function() { + this.appendValueInput("test") + .setCheck(null) + .appendField("MD5"); + this.setInputsInline(true); + this.setOutput(true, null); + this.setColour(230); + this.setTooltip(""); + this.setHelpUrl(""); + } +}; +Blockly.Blocks['import'] = { + init: function() { + this.appendValueInput("php_file") + .setCheck(null) + .appendField("引入PHP文件 文件路径："); + this.setInputsInline(true); + this.setPreviousStatement(true, null); + this.setNextStatement(true, null); + this.setColour(230); + this.setTooltip(""); + this.setHelpUrl(""); + } +}; \ No newline at end of file diff --git a/static/boxy/blocks/get.js.js b/static/boxy/blocks/get.js.js index e9642f8f3617379a36b62b0d767730c3fb9d686b..2b88f568de7d9c570ece02838143a3bad233a94c 100644 --- a/static/boxy/blocks/get.js.js +++ b/static/boxy/blocks/get.js.js @@ -272,4 +272,17 @@ Blockly.PHP['style_first'] = function(block) { // TODO: Assemble PHP into code variable. var code = dropdown_style_name + ':' + value_name + dropdown_unit; return code; +}; +Blockly.PHP['md5'] = function(block) { + var value_test = Blockly.PHP.valueToCode(block, 'test', Blockly.PHP.ORDER_ATOMIC); + // TODO: Assemble PHP into code variable. + var code = '...'; + // TODO: Change ORDER_NONE to the correct strength. + return [code, Blockly.PHP.ORDER_NONE]; +}; +Blockly.PHP['import'] = function(block) { + var value_php_file = Blockly.PHP.valueToCode(block, 'php_file', Blockly.PHP.ORDER_ATOMIC); + // TODO: Assemble PHP into code variable. + var code = '...;\n'; + return code; }; \ No newline at end of file diff --git a/static/boxy/blocks/library.xml b/static/boxy/blocks/library.xml new file mode 100644 index 0000000000000000000000000000000000000000..be18037a6f4f3e15f48ebbabc73b2d78ed714b59 --- /dev/null +++ b/static/boxy/blocks/library.xml @@ -0,0 +1,1811 @@ + + + get_get + INT + LEFT + + + get_key + RIGHT + + + 获取get信息 key + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + get_post + INT + LEFT + + + post_key + LEFT + + + 获取post信息 key + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + get_cookie + INT + LEFT + + + cookie_key + LEFT + + + 获取cookie值 Key: + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + php_start + AUTO + BOTH + + + php-start + LEFT + + + PHP积木块 + + + + + + + + + + <?php 代码 ?> + + + + + + + + + + + + + + + + + 230 + + + + + read + INT + BOTH + + + name + LEFT + + + 读取文件 文件名(路径): + + + + + + + + LEFT + + + 存放进变量 + + + myfile + bianname + + + + + + + return_text + LEFT + + + 读取失败后的返回文本 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 135 + + + + + write + INT + BOTH + + + path + LEFT + + + 写入文件 文件名： + + + + + + + + LEFT + + + 用于操作的变量名 + + + default + name + + + + + + + write_text + LEFT + + + 要写入的内容 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + echo + INT + BOTH + + + NAME + LEFT + + + echo输出 + + + + + + + + + + + + + + + + + + + + + + + + + + + 165 + + + + + print_r + INT + BOTH + + + NAME + LEFT + + + print_r输出 + + + + + + + + + + + + + + + + + + + + + + + + + + + 180 + + + + + htmlspecialchars + AUTO + LEFT + + + NAME + LEFT + + + 把文本 + + + + + + + + + LEFT + + + 转换为 HTML 实体 + + + + + + + + + 转义 + + + + + + + + + + + + + + 0 + + + + + mysql_connect + INT + BOTH + + + LEFT + + + 连接MySQL 数据库 + + + + + url + LEFT + + + 连接的服务器： + + + + + + + + + user_name + LEFT + + + 用户名： + + + + + + + + + key + LEFT + + + 密码： + + + + + + + + + + + + + + + + + 连接MySQL 数据库 + + + + + + + + + + + + + + + + + 230 + + + + + mail + AUTO + BOTH + + + LEFT + + + 发送邮件 + + + + + user + LEFT + + + 接收者 + + + + + + + + + main + LEFT + + + 主题 + + + + + + + + + text + LEFT + + + 发送的消息 + + + + + + + + + h + LEFT + + + 附加的标题 + + + + + + + + + NAME + LEFT + + + 邮件发送程序规定额外的参数 + + + + + + + + + + + + + + + + + + + + + 发送的消息应使用\n来分隔各行，附加的标题应当使用\r\n分隔附加的标题 + + + + + + + + + + + + + + + + + 230 + + + + + html + AUTO + TOP + + + LEFT + + + 一个网页 + + + + + NAME + LEFT + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + mysql_close + AUTO + BOTH + + + LEFT + + + 结束数据库连接 + + + + + name + LEFT + + + 数据库名 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + head + AUTO + BOTH + + + LEFT + + + 头部 + + + + + NAME + LEFT + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + body + AUTO + BOTH + + + LEFT + + + 身体 + + + + + NAME + LEFT + + + + + + LEFT + + + 属性 + + + + + attribute + LEFT + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + title + AUTO + BOTH + + + NAME + LEFT + + + 标题： + + + + + + + + + + + + + + + + + + + + + + + + + + + + 160 + + + + + html5 + AUTO + BOTH + + + LEFT + + + HTML5标准网页声明 + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + h_ + AUTO + BOTH + + + LEFT + + + + NAME + 一级 + h1 + 二级 + h2 + 三级 + h3 + 四级 + h4 + 五级 + h5 + 六级 + h6 + + + 文本 + + + + + + + LEFT + + + 内容 + + + + + NAME + LEFT + + + + + + LEFT + + + 属性 + + + + + attribute + LEFT + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 65 + + + + + p + AUTO + BOTH + + + LEFT + + + 段落标签 + + + + + LEFT + + + 内容 + + + + + NAME + LEFT + + + + + + LEFT + + + 属性 + + + + + attribute + LEFT + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 65 + + + + + img + AUTO + BOTH + + + LEFT + + + 图像 + + + 来源 + src + + + 宽 + + + 100 + width + -Infinity + Infinity + 0 + + + 高 + + + 100 + height + -Infinity + Infinity + 0 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 315 + + + + + a + AUTO + BOTH + + + LEFT + + + 超链接 + + + https://www.w3school.com.cn/html + link + + + + + + + LEFT + + + 内容 + + + + + NAME + LEFT + + + + + + LEFT + + + 属性 + + + + + attribute + LEFT + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 195 + + + + + video + AUTO + BOTH + + + LEFT + + + 视频 + + + 来源 + src + + + 宽 + + + 100 + width + -Infinity + Infinity + 0 + + + 高 + + + 100 + height + -Infinity + Infinity + 0 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 315 + + + + + br + AUTO + BOTH + + + LEFT + + + 换行 + + + + + + + + + + + + + + + + + + + + + + + + 180 + + + + + diycode + AUTO + BOTH + + + LEFT + + + 在此输入任何代码 + + + …… + code + + + + + + + + + + + + + + + + + + + + + + + + + + 75 + + + + + shuxing + INT + BOTH + + + value + LEFT + + + 属性名 + + + name + name + + + 属性值 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + diycode2 + AUTO + LEFT + + + LEFT + + + 在此输入任何代码 + + + …… + code + + + + + + + + + + + + + + + + + + + + + + + 75 + + + + + css + AUTO + BOTH + + + NAME + LEFT + + + style属性 + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + width + INT + BOTH + + + width_value + LEFT + + + 设置元素宽度为 + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + height + INT + BOTH + + + height_value + LEFT + + + 设置元素高度为 + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + point + INT + LEFT + + + value + LEFT + + + 父元素的百分比 + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + px + INT + LEFT + + + value + LEFT + + + 像素px + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + style_first + INT + BOTH + + + NAME + LEFT + + + + style_name + 宽度 + width + 高度 + height + + + + unit + 百分比 + % + 像素 + px + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + MD5 + INT + LEFT + + + test + LEFT + + + MD5 + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + + + import + INT + BOTH + + + php_file + LEFT + + + 引入PHP文件 文件路径： + + + + + + + + + + + + + + + + + + + + + + + + + + + 230 + + + \ No newline at end of file diff --git a/static/boxy/compressed.css b/static/boxy/compressed.css index 00cc2161a33ea3b92ddcc6c3445c43fd4e89a38b..ea52455653beb54e588025a1ee762038341145cd 100644 --- a/static/boxy/compressed.css +++ b/static/boxy/compressed.css @@ -310,7 +310,8 @@ body { #blocklyDiv { position: absolute; width: 100%; - height: 100% + height: 100%; + float: left; left: 0px; top: 0px; } .blocklySvg { diff --git a/static/boxy/compressed.js b/static/boxy/compressed.js index ba373c1032373725c0035b730133c59773502a61..5eb23e5f4d9a19d7637ca1284b9ac37f7964dabb 100644 --- a/static/boxy/compressed.js +++ b/static/boxy/compressed.js @@ -113,7 +113,7 @@ function loadWorkspace() { o = o.offsetParent; ); a.style.left = t + "px", - a.style.top = r + "px", + a.style.top = '70' + "px", Blockly.svgResize(workspace) } new ScrollOptions(workspace).init(); diff --git a/static/boxy/function.js b/static/boxy/function.js index d40bdfbe57c64af2cb66c5252d954fed2238ba0b..26827d54a7db8afd9fe6a613c8dd1bcdefcc2032 100644 --- a/static/boxy/function.js +++ b/static/boxy/function.js @@ -55,11 +55,31 @@ CCCGC8CC8CCCCC8CCC8CCGGC, 8C8CCCGCGCCCGCCCCC8CCCCC: `); - +console.log("欢迎使用PHP-helper") var div_div_code = document.querySelector("#code_father"); -div_div_code.setAttribute("style","height: " + window.innerHeight + "px; width:20%;float:right;") +div_div_code.setAttribute("style","float:right;height: " + (window.innerHeight -70) + "px; width:20%;"); //div_div_code.innerHTML = "
    aaa
    "; +function eee(){ + let test = document.getElementsByClassName('blocklySvg'); + console.log(test); + for(var i=0;i \ No newline at end of file diff --git a/static/boxy/svg/help.svg b/static/boxy/svg/help.svg new file mode 100644 index 0000000000000000000000000000000000000000..4501867026116dd5c6e7915eef3db86af83992e9 --- /dev/null +++ b/static/boxy/svg/help.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/boxy/svg/html.svg b/static/boxy/svg/html.svg new file mode 100644 index 0000000000000000000000000000000000000000..dba7a35b62a514ae3da183c887b4789dffbd1d08 --- /dev/null +++ b/static/boxy/svg/html.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/static/boxy/toolbox/toolbox.xml b/static/boxy/toolbox/toolbox.xml index 12942df88272793d2b5fb9cfc075cbd0812e7b4c..306503673e42021d721e11ac2597bd7c609bf99b 100644 --- a/static/boxy/toolbox/toolbox.xml +++ b/static/boxy/toolbox/toolbox.xml @@ -412,6 +412,7 @@ + @@ -440,6 +441,7 @@ + @@ -510,7 +512,7 @@ - + @@ -541,7 +543,7 @@ 100 - + myfile diff --git a/static/boxy/workspace/workspace.css b/static/boxy/workspace/workspace.css index 801e8dcae5d5136b6d0e377b7c0c0c6c1df393a1..3212f1d546a2f269e2642662b2989ecc2fb146a6 100644 --- a/static/boxy/workspace/workspace.css +++ b/static/boxy/workspace/workspace.css @@ -25,6 +25,7 @@ body { position: absolute; width: 100%; height: 100%; + float: left; left: 0px; top: 0px; } .blocklySvg { diff --git a/static/boxy/workspace/workspace.js b/static/boxy/workspace/workspace.js index a4e6dd5f1ad7ab1c474896aceb4939b3283e6d5d..7407530e927fde55174699f1ff464344253ac253 100644 --- a/static/boxy/workspace/workspace.js +++ b/static/boxy/workspace/workspace.js @@ -67,7 +67,7 @@ function loadWorkspace() { element = element.offsetParent; } while (element); blocklyDiv.style.left = x + "px"; - blocklyDiv.style.top = y + "px"; + blocklyDiv.style.top = '70' + "px"; Blockly.svgResize(workspace); }; window.addEventListener("resize", onresize, false);