diff --git a/etc/common.shy b/etc/common.shy index 08b7766d..83dec4a7 100644 --- a/etc/common.shy +++ b/etc/common.shy @@ -1,3 +1,5 @@ +~aaa + role root user shy ~mdb note model favor spirit spirit relate relate note model money expend expend amount amount diff --git a/src/contexts/ctx/ctx.go b/src/contexts/ctx/ctx.go index 9d5548ca..7bd5875f 100644 --- a/src/contexts/ctx/ctx.go +++ b/src/contexts/ctx/ctx.go @@ -906,7 +906,7 @@ func (m *Message) Magic(begin string, chain interface{}, args ...interface{}) in func (m *Message) Current(text string) string { cs := []string{} if pod := kit.Format(m.Magic("session", "current.pod")); pod != "" { - cs = append(cs, "context", "ssh", "sh", "node", "'"+pod+"'") + cs = append(cs, "context", "ssh", "remote", "'"+pod+"'") } if ctx := kit.Format(m.Magic("session", "current.ctx")); ctx != "" { cs = append(cs, "context", ctx) @@ -1540,7 +1540,7 @@ func (m *Message) Cmdm(args ...interface{}) *Message { arg := []string{} if pod := kit.Format(m.Magic("session", "current.pod")); pod != "" { - arg = append(arg, "context", "ssh", "sh", "node", pod) + arg = append(arg, "context", "ssh", "remote", pod) } if ctx := kit.Format(m.Magic("session", "current.ctx")); ctx != "" { arg = append(arg, "context", ctx) @@ -1793,7 +1793,9 @@ func (m *Message) Confv(key string, args ...interface{}) interface{} { defer func() { m.target = target }() ps := strings.Split(key, ".") - m.target, key = m.Sess(ps[0], false).target, ps[1] + if msg := m.Sess(ps[0], false); msg != nil { + m.target, key = msg.target, ps[1] + } } var config *Config diff --git a/src/contexts/web/web.go b/src/contexts/web/web.go index 9a44a87f..633b4eeb 100644 --- a/src/contexts/web/web.go +++ b/src/contexts/web/web.go @@ -982,7 +982,7 @@ var Index = &ctx.Context{Name: "web", Help: "应用中心", // 添加设备 arg = arg[:0] if kit.Right(val["componet_pod"]) { - arg = append(arg, "sh", "node", kit.Format(m.Magic("session", "current.pod"))) + arg = append(arg, "remote", kit.Format(m.Magic("session", "current.pod"))) } // 添加命令 if kit.Right(val["componet_cmd"]) { diff --git a/src/examples/code/code.go b/src/examples/code/code.go index 754171c5..deae1527 100644 --- a/src/examples/code/code.go +++ b/src/examples/code/code.go @@ -160,7 +160,7 @@ var Index = &ctx.Context{Name: "code", Help: "代码中心", }, map[string]interface{}{"componet_name": "pod", "componet_help": "pod", "componet_tmpl": "componet", "componet_view": "PodList", "componet_init": "initPodList", - "componet_ctx": "ssh", "componet_cmd": "remote", "inputs": []interface{}{ + "componet_ctx": "ssh", "componet_cmd": "node", "inputs": []interface{}{ map[string]interface{}{"type": "text", "name": "pod", "value": "@current.pod"}, map[string]interface{}{"type": "button", "value": "refresh"}, }, diff --git a/usr/librarys/chat.css b/usr/librarys/chat.css index b5456cd1..f7291aec 100644 --- a/usr/librarys/chat.css +++ b/usr/librarys/chat.css @@ -1,5 +1,9 @@ fieldset.Ocean { + position:absolute; + width:100px; + height:100px; + background-color:red; display:none; padding:0; } diff --git a/usr/librarys/chat.js b/usr/librarys/chat.js index 642755cf..c11d78b0 100644 --- a/usr/librarys/chat.js +++ b/usr/librarys/chat.js @@ -1,26 +1,36 @@ +var pane = {} var page = Page({ - initOcean: function(page, field, option) { - page.panes.ocean = field - ctx.Run(page, option.dataset, ["ocean"], function(msg) { - kit.Log(msg.result) - }) - return [{"text": ["ocean"]}] + pane: pane, + initOcean: function(page, field, option, output) { + return {"button": ["关闭"], "action": function(event) { + pane.ocean.showDialog() + }} }, + initRiver: function(page, field, option, output) { - page.panes.river = field - page.panes.channel = output + pane.channel = output page.showRiver(page, option) - return {"button": ["添加"], "action": function(value) { - ctx.Run(page, option.dataset, ["river", "create", prompt("name")], function(msg) { - page.showRiver(page, option) - }) + return {"button": ["添加", "查找"], "action": function(value) { + switch (value) { + case "添加": + var name = prompt("name") + if (name) { + ctx.Run(page, option.dataset, ["river", "create", name], function(msg) { + page.showRiver(page, option) + }) + } + break + case "查找": + kit.showDialog(pane.ocean) + break + } }} }, showRiver: function(page, option) { - page.panes.channel.innerHTML = "" + pane.channel.innerHTML = "" page.getRiver(page, option, function(line, index) { page.conf.river = page.conf.river || page.showTarget(page, option, line.key) || line.key - kit.AppendChild(page.panes.channel, [{view: ["item", "div", line.name+"("+line.count+")"], click: function(event) { + kit.AppendChild(pane.channel, [{view: ["item", "div", line.name+"("+line.count+")"], click: function(event) { if (page.conf.river == line.key) { return } @@ -37,17 +47,16 @@ var page = Page({ }) }, initTarget: function(page, field, option) { - page.panes.target = field - page.panes.output = field.querySelector("div.target.output") + pane.output = field.querySelector("div.target.output") ctx.Run(page, option.dataset, ["river"], function(msg) { kit.Log(msg.result) }) return [{"text": ["target"]}] }, showTarget: function(page, option, id) { - page.panes.output.innerHTML = "" + pane.output.innerHTML = "" page.getTarget(page, option, id, function(line, index) { - kit.AppendChild(page.panes.output, [{"view": ["item", "div", line.text]}]) + kit.AppendChild(pane.output, [{"view": ["item", "div", line.text]}]) }) }, getTarget: function(page, option, id, cb) { @@ -61,8 +70,8 @@ var page = Page({ var ui = kit.AppendChild(option, [{"view": ["input", "textarea"], "name": "input", "data": {"onkeyup": function(event){ if (event.key == "Enter" && !event.shiftKey) { var value = event.target.value - kit.AppendChild(page.panes.output, [{"text" :[value, "div"]}]) - page.panes.output.scrollBy(0,100) + kit.AppendChild(pane.output, [{"text" :[value, "div"]}]) + pane.output.scrollBy(0,100) // event.target.value = "" ctx.Run(page, option.dataset, ["river", "wave", page.conf.river, "text", value], function(msg) { kit.Log(msg.result) @@ -73,9 +82,8 @@ var page = Page({ event.preventDefault() } }}}]) - page.panes.input = ui.input + pane.input = ui.input - page.panes.source = field ctx.Run(page, option.dataset, ["river"], function(msg) { msg.Table(function(index, line) { console.log(index) @@ -86,14 +94,12 @@ var page = Page({ return }, initStorm: function(page, field, option) { - page.panes.storm = field ctx.Run(page, option.dataset, ["river"], function(msg) { kit.Log(msg.result) }) return [{"text": ["storm"]}] }, initSteam: function(page, field, option) { - page.panes.steam = field ctx.Run(page, option.dataset, ["river"], function(msg) { kit.Log(msg.result) }) @@ -104,46 +110,46 @@ var page = Page({ range: function(sizes) { sizes = sizes || {} var width = document.body.offsetWidth - var river_width = page.panes.river.offsetWidth - var storm_width = page.panes.storm.offsetWidth - var source_width = page.panes.source.offsetWidth - var source_height = page.panes.source.offsetHeight + var river_width = pane.river.offsetWidth + var storm_width = pane.storm.offsetWidth + var source_width = pane.source.offsetWidth + var source_height = pane.source.offsetHeight var height = document.body.offsetHeight-80 - page.panes.river.style.height = height+"px" - page.panes.storm.style.height = height+"px" - page.panes.target.style.height = (height-source_height)+"px" + pane.river.style.height = height+"px" + pane.storm.style.height = height+"px" + pane.target.style.height = (height-source_height)+"px" if (sizes.left != undefined) { if (sizes.left == 0) { - page.panes.river.style.display = "none" + pane.river.style.display = "none" } else { - page.panes.river.style.display = "block" - page.panes.river.style.width = sizes.left+"px" + pane.river.style.display = "block" + pane.river.style.width = sizes.left+"px" } } if (sizes.right != undefined) { if (sizes.right == 0) { - page.panes.storm.style.display = "none" + pane.storm.style.display = "none" } else { - page.panes.storm.style.display = "block" - page.panes.storm.style.width = sizes.right+"px" + pane.storm.style.display = "block" + pane.storm.style.width = sizes.right+"px" } } if (sizes.middle != undefined) { - page.panes.source.style.height = sizes.middle+"px" - page.panes.target.style.height = (height-sizes.middle-4)+"px" - page.panes.output.style.height = (height-sizes.middle-8)+"px" - page.panes.input.style.height = (sizes.middle-7)+"px" + pane.source.style.height = sizes.middle+"px" + pane.target.style.height = (height-sizes.middle-4)+"px" + pane.output.style.height = (height-sizes.middle-8)+"px" + pane.input.style.height = (sizes.middle-7)+"px" } else { - var source_height = page.panes.source.offsetHeight-10 - page.panes.input.style.height = source_height+"px" - page.panes.output.style.height = source_height+"px" + var source_height = pane.source.offsetHeight-10 + pane.input.style.height = source_height+"px" + pane.output.style.height = source_height+"px" } - var source_width = page.panes.source.offsetWidth-10 - page.panes.input.style.width = source_width+"px" - page.panes.output.style.width = source_width+"px" + var source_width = pane.source.offsetWidth-10 + pane.input.style.width = source_width+"px" + pane.output.style.width = source_width+"px" }, init: function(exp) { @@ -152,6 +158,7 @@ var page = Page({ document.querySelectorAll("body>fieldset").forEach(function(field) { var option = field.querySelector("form.option") var output = field.querySelector("div.output") + pane[option.dataset.componet_name] = field var init = page[field.dataset.init] if (typeof init == "function") { diff --git a/usr/librarys/example.js b/usr/librarys/example.js index eec5123a..2ed9ef51 100644 --- a/usr/librarys/example.js +++ b/usr/librarys/example.js @@ -13,7 +13,6 @@ exp = example = { return [{"text": ["shycontext", "div", "title"]}] }, initField: function(page, field, option, output) { - ctx.Runs(page, option) return }, initBanner: function(page, field, option, output) { @@ -30,6 +29,7 @@ exp = example = { initFooter: function(page, field, option) { return [{"view": ["title", "div", "shylinux@163.com"]}] }, + onscroll: function(event, target, action) { var page = this switch (action) { @@ -40,6 +40,7 @@ exp = example = { break } }, + onresize: function(event) {}, reload: function() { location.reload() }, @@ -51,3 +52,8 @@ function Page(page) { } return page } +function Pane(pane) { + pane.showDialog = function(width, height) { + kit.showDialog(this, width, height) + } +} diff --git a/usr/librarys/toolkit.js b/usr/librarys/toolkit.js index 00ffc76b..41d2748d 100644 --- a/usr/librarys/toolkit.js +++ b/usr/librarys/toolkit.js @@ -420,6 +420,64 @@ kit = toolkit = { } return true }, + + setView: function(target, args) { + var width = document.body.offsetWidth-10 + var height = document.body.offsetHeight-10 + for (var k in args) { + switch (k) { + case "dialog": + var w = h = args[k] + if (typeof(args[k]) == "object") { + w = args[k][0] + h = args[k][1] + } + if (w > width) { + w = width + } + + args["top"] = (height-h)/2 + args["left"] = (width-w)/2 + args["width"] = w + args["height"] = h + break + case "window": + var w = h = args[k] + if (typeof(args[k]) == "object") { + w = args[k][0] + h = args[k][1] + } + + args["top"] = h/2 + args["left"] = w/2 + args["width"] = width-w + args["height"] = height-h + break + } + } + + for (var k in args) { + switch (k) { + case "top": + case "left": + case "width": + case "height": + target.style[k] = args[k]+"px" + break + } + } + }, + showDialog: function(pane, width, height) { + if (pane.style.display == "none") { + pane.style.display = "block" + this.setView(pane, {dialog: [width||800, height||400]}) + } else { + pane.style.display = "none" + } + }, + showWindow: function(pane, width, height) { + this.setView(pane, {window: [width||80, height||40]}) + }, } function right(arg) { diff --git a/usr/wiki/自然/编程/ctx.md b/usr/wiki/自然/编程/ctx.md new file mode 120000 index 00000000..53e75d4d --- /dev/null +++ b/usr/wiki/自然/编程/ctx.md @@ -0,0 +1 @@ +终端工具链/context.md \ No newline at end of file diff --git a/usr/wiki/自然/编程/前端小程序/html5.md b/usr/wiki/自然/编程/前端小程序/html5.md index 0315e983..6124479f 100644 --- a/usr/wiki/自然/编程/前端小程序/html5.md +++ b/usr/wiki/自然/编程/前端小程序/html5.md @@ -1,136 +1 @@ - - -## 简介 - -- 文档: -- 文档: - -### miniCAD在线绘图 -
-
-
-
- -
-
-
- - - - - - - - - - - - - - -
colorstrokeshapex1y1x2y2text
- - -### canvas绘图 - -``` - - -``` - -### 画矩形 - -``` -fillRect(x, y, width, height) -strokeRect(x, y, width, height) -clearRect(x, y, width, height) -``` - -### 画路径 - -``` - - -``` - -``` -beginPath() -moveTo(x, y) -LineTo(x, y) -closePath() -stroke() -fill() - -arc(x, y, radius, startAngle, endAngle, anticlockwise) -arcTo(x1, y1, x2, y2, radius) -quadraticCurveTo(cp1x, cp1y, x, y) -bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) -new Path2D() -``` -### 设置样式 - -``` -fillStyle = "red" -fillStyle = "#FF0000" -fillStyle = "rgb(255,0,0)" -fillStyle = "rgb(255,0,0,1)" -strokeStyle = - -var img = new Image(); -img.src = "img.png"; -img.onLoad = function() {} -createPattern(img, style) - -createLinearGradient(x1, y1, x2, y2) -createRadialGradient(x1, y1, r1, x2, y2, r2) - addColorStop(position, color) - -shadowOffsetX -shadowOffsetY -shadowBlur -shadowColor - -lineWidth -lineCap -lineJoin -``` -### 输出文字 -``` -font -textAlign -textBaseline -direction -measureText() -fillText(text, x, y[, maxWidth]) -strokeText(text, x, y[, maxWidth]) -``` - -### 坐标变换 -``` -save() -restore() -translate(x,y) -rotate(angle) -scale(x, y) -transform(a,b,c,d,e,f) -setTransform(a,b,c,d,e,f) -resetTransform() -``` - - - +## html5 diff --git a/usr/wiki/自然/编程/前端小程序/javascript.md b/usr/wiki/自然/编程/前端小程序/javascript.md index e69de29b..4f45184d 100644 --- a/usr/wiki/自然/编程/前端小程序/javascript.md +++ b/usr/wiki/自然/编程/前端小程序/javascript.md @@ -0,0 +1 @@ +## javascript diff --git a/usr/wiki/自然/编程/前端小程序/html5.css b/usr/wiki/自然/编程/前端小程序/miniCAD/html5.css similarity index 100% rename from usr/wiki/自然/编程/前端小程序/html5.css rename to usr/wiki/自然/编程/前端小程序/miniCAD/html5.css diff --git a/usr/wiki/自然/编程/前端小程序/html5.js b/usr/wiki/自然/编程/前端小程序/miniCAD/html5.js similarity index 100% rename from usr/wiki/自然/编程/前端小程序/html5.js rename to usr/wiki/自然/编程/前端小程序/miniCAD/html5.js diff --git a/usr/wiki/自然/编程/前端小程序/miniCAD/html5.md b/usr/wiki/自然/编程/前端小程序/miniCAD/html5.md new file mode 100644 index 00000000..0315e983 --- /dev/null +++ b/usr/wiki/自然/编程/前端小程序/miniCAD/html5.md @@ -0,0 +1,136 @@ + + +## 简介 + +- 文档: +- 文档: + +### miniCAD在线绘图 +
+
+
+
+ +
+
+
+ + + + + + + + + + + + + + +
colorstrokeshapex1y1x2y2text
+ + +### canvas绘图 + +``` + + +``` + +### 画矩形 + +``` +fillRect(x, y, width, height) +strokeRect(x, y, width, height) +clearRect(x, y, width, height) +``` + +### 画路径 + +``` + + +``` + +``` +beginPath() +moveTo(x, y) +LineTo(x, y) +closePath() +stroke() +fill() + +arc(x, y, radius, startAngle, endAngle, anticlockwise) +arcTo(x1, y1, x2, y2, radius) +quadraticCurveTo(cp1x, cp1y, x, y) +bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) +new Path2D() +``` +### 设置样式 + +``` +fillStyle = "red" +fillStyle = "#FF0000" +fillStyle = "rgb(255,0,0)" +fillStyle = "rgb(255,0,0,1)" +strokeStyle = + +var img = new Image(); +img.src = "img.png"; +img.onLoad = function() {} +createPattern(img, style) + +createLinearGradient(x1, y1, x2, y2) +createRadialGradient(x1, y1, r1, x2, y2, r2) + addColorStop(position, color) + +shadowOffsetX +shadowOffsetY +shadowBlur +shadowColor + +lineWidth +lineCap +lineJoin +``` +### 输出文字 +``` +font +textAlign +textBaseline +direction +measureText() +fillText(text, x, y[, maxWidth]) +strokeText(text, x, y[, maxWidth]) +``` + +### 坐标变换 +``` +save() +restore() +translate(x,y) +rotate(angle) +scale(x, y) +transform(a,b,c,d,e,f) +setTransform(a,b,c,d,e,f) +resetTransform() +``` + + + diff --git a/usr/wiki/自然/编程/终端工具链/context.md b/usr/wiki/自然/编程/终端工具链/context.md index 6defd6e5..eef59dd8 100644 --- a/usr/wiki/自然/编程/终端工具链/context.md +++ b/usr/wiki/自然/编程/终端工具链/context.md @@ -327,10 +327,76 @@ chat模块提供了信息管理。 - iOS - Android +### 应用接口 + +context的应用模块都是web的子模块，在web模块启动HTTP服务后，会根据模块名与命令名自动生成路由。 +web模块会将所有的HTTP请求转换成context的命令调用，所以HTTP的应用接口和普通命令，除了名字必须以"/"开头，其它没有太大区别。 + +当web接收到HTTP请求后，可以调用单个命令如 http://shylinux.com/code/consul 就会调用code模块下的/consul命令 + +可以调用多个命令如 http://shylinux.com/code/?componet_group=login 就会调用web模块下的/render命令， +根据code的componet下的login组件，依次调用每个接口的命令，然后将执行结果与参数一起，调用golang的template，渲染生成HTML。 + +所有命令都解析完成后就可以生成一个完整的网页。当然如果Accept是application/json，则会跳过模块渲染，直接返回多条命令的执行结果。 +所以componet就是接口的集合，统一提供参数配置、权限检查、命令执行、模板渲染，降低内部命令与外部应用的耦合性，但又将前后端完全融合在一起。 + + +如下，是web.code模块的应用接口定义。配置componet下定义了多个组件，每个组件下定义了多个接口。 + +login就是登录页面，下面定义了三个接口code、login、tail， +其中code，使用模板head生成网页头，会包括一些配置，如favicon可以指定图标文件，styles指定引用模式表。 +其中tail，使用模板tail生成网页尾，会包括一些配置，如scripts指定引用脚本文件。 + +login就是网页组件了，生成一个网页登录的输入表单，并接收表单请求调用aaa模块的auth命令，进行用户身份的验证。 +其中arguments指定了Form表单字段的列表。 +``` +... +var Index = &ctx.Context{Name: "code", Help: "代码中心", + Caches: map[string]*ctx.Cache{}, + Configs: map[string]*ctx.Config{ + "skip_login": &ctx.Config{Name: "skip_login", Value: map[string]interface{}{"/consul": "true"}, Help: "免密登录"}, + "componet": &ctx.Config{Name: "componet", Value: map[string]interface{}{ + "login": []interface{}{ + map[string]interface{}{"componet_name": "code", "componet_tmpl": "head", "metas": []interface{}{ + map[string]interface{}{"name": "viewport", "content": "width=device-width, initial-scale=0.7, user-scalable=no"}, + }, "favicon": "favicon.ico", "styles": []interface{}{"example.css", "code.css"}}, + + map[string]interface{}{"componet_name": "login", "componet_help": "login", "componet_tmpl": "componet", + "componet_ctx": "aaa", "componet_cmd": "auth", "componet_args": []interface{}{"@sessid", "ship", "username", "@username", "password", "@password"}, "inputs": []interface{}{ + map[string]interface{}{"type": "text", "name": "username", "value": "", "label": "username"}, + map[string]interface{}{"type": "password", "name": "password", "value": "", "label": "password"}, + map[string]interface{}{"type": "button", "value": "login"}, + }, + "display_append": "", "display_result": "", + }, + + map[string]interface{}{"componet_name": "tail", "componet_tmpl": "tail", + "scripts": []interface{}{"toolkit.js", "context.js", "example.js", "code.js"}, + }, + }, +... +``` +### 网页开发 + +#### 模板 + +usr/template 存放了网页的模板文件，context会调用golang的template接口进行后端渲染，生成html文件。 + +componet下每一个接口都会指定一个模板，web模块下的/render命令会依次渲染，从而生成一个完整的网页。 + + +- usr/template/common.tmpl 公共模板 +- usr/template/code/ code模块的模板 +- usr/template/wiki/ wiki +- usr/template/chat/ + +usr/librarys 存放了css与js + ### 小程序 ### 开发板 ## 接口开发 +### componet ### python ### java ### c diff --git a/usr/wiki/自然/编程/终端工具链/前端小程序 b/usr/wiki/自然/编程/终端工具链/前端小程序 new file mode 120000 index 00000000..7dfdb002 --- /dev/null +++ b/usr/wiki/自然/编程/终端工具链/前端小程序 @@ -0,0 +1 @@ +usr/wiki/自然/编程/前端小程序 \ No newline at end of file