diff --git a/etc/exit.shy b/etc/exit.shy
index 8babb8aa..ecde640f 100644
--- a/etc/exit.shy
+++ b/etc/exit.shy
@@ -1,3 +1,5 @@
+~chat
+    config save tmp/flow.json flow
 ~ssh
     config save tmp/cert.json cert trust
 ~aaa
diff --git a/etc/init.shy b/etc/init.shy
index bd83d65e..fe0792b1 100644
--- a/etc/init.shy
+++ b/etc/init.shy
@@ -4,6 +4,8 @@
     config load tmp/auth.json auth
 ~ssh
     config load tmp/cert.json cert trust
+~chat
+    config load tmp/flow.json flow
 
 source etc/common.shy
 ~ssh
diff --git a/src/contexts/ctx/ctx.go b/src/contexts/ctx/ctx.go
index 8d20612e..9d5548ca 100644
--- a/src/contexts/ctx/ctx.go
+++ b/src/contexts/ctx/ctx.go
@@ -1788,6 +1788,14 @@ func (m *Message) Confi(key string, arg ...interface{}) int {
 	return kit.Int(m.Confv(key, arg...))
 }
 func (m *Message) Confv(key string, args ...interface{}) interface{} {
+	if strings.Contains(key, ".") {
+		target := m.target
+		defer func() { m.target = target }()
+
+		ps := strings.Split(key, ".")
+		m.target, key = m.Sess(ps[0], false).target, ps[1]
+	}
+
 	var config *Config
 	m.Match(key, false, func(m *Message, s *Context, c *Context, key string) bool {
 		if x, ok := c.Configs[key]; ok {
diff --git a/src/examples/chat/chat.go b/src/examples/chat/chat.go
index 605b936c..a2575866 100644
--- a/src/examples/chat/chat.go
+++ b/src/examples/chat/chat.go
@@ -51,10 +51,27 @@ var Index = &ctx.Context{Name: "chat", Help: "会议中心",
 					"componet_view": "Ocean", "componet_init": "initOcean",
 					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"ocean"},
 				},
+				map[string]interface{}{"componet_name": "steam", "componet_tmpl": "fieldset",
+					"componet_view": "Steam", "componet_init": "initSteam",
+					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"steam"},
+				},
 				map[string]interface{}{"componet_name": "river", "componet_tmpl": "fieldset",
 					"componet_view": "River", "componet_init": "initRiver",
 					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"river"},
 				},
+				map[string]interface{}{"componet_name": "storm", "componet_tmpl": "fieldset",
+					"componet_view": "Storm", "componet_init": "initStorm",
+					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"storm"},
+				},
+
+				map[string]interface{}{"componet_name": "target", "componet_tmpl": "fieldset",
+					"componet_view": "Target", "componet_init": "initTarget",
+					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"target"},
+				},
+				map[string]interface{}{"componet_name": "source", "componet_tmpl": "fieldset",
+					"componet_view": "Source", "componet_init": "initSource",
+					"componet_ctx": "web.chat", "componet_cmd": "flow", "arguments": []interface{}{"source"},
+				},
 
 				map[string]interface{}{"componet_name": "footer", "componet_tmpl": "fieldset",
 					"componet_view": "Footer", "componet_init": "initFooter",
@@ -89,15 +106,75 @@ var Index = &ctx.Context{Name: "chat", Help: "会议中心",
 			"tool_path":    "/Applications/wechatwebdevtools.app/Contents/MacOS/cli",
 			"project_path": "/Users/shaoying/context/usr/client/mp",
 		}, Help: "聊天记录"},
+
+		"flow": &ctx.Config{Name: "flow", Value: map[string]interface{}{}, Help: "聊天记录"},
 	},
 	Commands: map[string]*ctx.Command{
 		"flow": &ctx.Command{Name: "flow", Help: "信息流", Hand: func(m *ctx.Message, c *ctx.Context, key string, arg ...string) (e error) {
 			switch arg[0] {
 			case "ocean":
-				m.Confm("")
-				m.Echo("ocean")
+				m.Confm("ssh.cert", func(key string, value map[string]interface{}) {
+					m.Add("append", "key", key)
+					m.Add("append", "user", value["user"])
+				})
+				m.Table()
 			case "river":
-				m.Echo("river")
+				if len(arg) == 1 {
+					m.Confm("flow", func(key string, value map[string]interface{}) {
+						m.Add("append", "key", key)
+						m.Add("append", "name", kit.Chains(value, "conf.name"))
+						m.Add("append", "create_user", kit.Chains(value, "conf.create_user"))
+						m.Add("append", "create_time", kit.Chains(value, "conf.create_time"))
+					})
+					m.Table()
+					return
+				}
+
+				switch arg[1] {
+				case "create":
+					h := kit.Hashs("uniq")
+
+					m.Conf("flow", h, map[string]interface{}{
+						"conf": map[string]interface{}{
+							"create_time": m.Time(),
+							"create_user": m.Option("username"),
+							"name":        kit.Select("what", arg, 2),
+						},
+						"user": map[string]interface{}{},
+						"text": map[string]interface{}{},
+					})
+					m.Echo(h)
+
+				case "wave":
+					if len(arg) == 3 {
+						m.Confm("flow", []string{arg[2], "text.list"}, func(index int, value map[string]interface{}) {
+							m.Add("append", "index", index)
+							m.Add("append", "type", value["type"])
+							m.Add("append", "text", value["text"])
+						})
+						m.Table()
+						return
+					}
+
+					m.Conf("flow", []string{arg[2], "text.list.-2"}, map[string]interface{}{
+						"create_time": m.Time(),
+						"type":        arg[3],
+						"text":        arg[4],
+					})
+
+					count := m.Confi("flow", []string{arg[2], "text.count"}) + 1
+					m.Confi("flow", []string{arg[2], "text.count"}, count)
+					m.Echo("%d", count)
+				}
+			case "storm":
+				switch arg[1] {
+				case "wind":
+					switch arg[2] {
+					case "text":
+
+					}
+				}
+			case "steam":
 			}
 			return
 		}},
diff --git a/usr/librarys/chat.css b/usr/librarys/chat.css
new file mode 100644
index 00000000..b5456cd1
--- /dev/null
+++ b/usr/librarys/chat.css
@@ -0,0 +1,42 @@
+
+fieldset.Ocean {
+    display:none;
+    padding:0;
+}
+fieldset.River {
+    overflow:auto;
+    padding:0;
+    min-width:160px;
+    min-height:200px;
+    float:left;
+}
+fieldset.River div.output div.item {
+
+}
+fieldset.River div.output div.item:hover {
+    background-color:red;
+
+}
+fieldset.Target {
+    padding:0;
+    min-width:160px;
+    min-height:80px;
+}
+fieldset.Target div.output {
+    overflow:auto;
+}
+fieldset.Source {
+    padding:0;
+    min-width:160px;
+    min-height:30px;
+}
+fieldset.Storm {
+    padding:0;
+    min-width:160px;
+    min-height:200px;
+    float:right;
+}
+fieldset.Steam {
+    display:none;
+    padding:0;
+}
diff --git a/usr/librarys/chat.js b/usr/librarys/chat.js
new file mode 100644
index 00000000..488fe8dd
--- /dev/null
+++ b/usr/librarys/chat.js
@@ -0,0 +1,163 @@
+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"]}]
+    },
+    initRiver: function(page, field, option, output) {
+        page.panes.river = field
+        page.panes.channel = output
+        page.showRiver(page, option)
+    },
+    showRiver: function(page, option) {
+        page.panes.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], click: function(event) {
+                if (page.conf.river == line.key) {
+                    return
+                }
+                page.conf.river = line.key
+                page.showTarget(page, option, line.key)
+            }}])
+        })
+    },
+    getRiver: function(page, option, cb) {
+        ctx.Run(page, option.dataset, ["river"], function(msg) {
+            ctx.Table(msg, function(line, index) {
+                cb(line, index)
+            })
+        })
+    },
+    initTarget: function(page, field, option) {
+        page.panes.target = field
+        page.panes.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 = ""
+        page.getTarget(page, option, id, function(line, index) {
+            kit.AppendChild(page.panes.output, [{"view": ["item", "div", line.text]}])
+        })
+    },
+    getTarget: function(page, option, id, cb) {
+        ctx.Run(page, option.dataset, ["river", "wave", id], function(msg) {
+            ctx.Table(msg, function(line, index) {
+                cb(line, index)
+            })
+        })
+    },
+    initSource: function(page, field, option) {
+        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)
+                // event.target.value = ""
+                ctx.Run(page, option.dataset, ["river", "wave", page.conf.river, "text", value], function(msg) {
+                    kit.Log(msg.result)
+                })
+            }
+        }, "onkeydown": function(event) {
+            if (event.key == "Enter" && !event.shiftKey) {
+                event.preventDefault()
+            }
+        }}}])
+        page.panes.input = ui.input
+
+        page.panes.source = field
+        ctx.Run(page, option.dataset, ["river"], function(msg) {
+            msg.Table(function(index, line) {
+                console.log(index)
+                console.log(line)
+            })
+            kit.Log(msg.result)
+        })
+        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)
+        })
+        return [{"text": ["steam"]}]
+    },
+
+    panes: {},
+    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 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"
+        if (sizes.left != undefined) {
+            if (sizes.left == 0) {
+                page.panes.river.style.display = "none"
+            } else {
+                page.panes.river.style.display = "block"
+                page.panes.river.style.width = sizes.left+"px"
+            }
+        }
+        if (sizes.right != undefined) {
+            if (sizes.right == 0) {
+                page.panes.storm.style.display = "none"
+            } else {
+                page.panes.storm.style.display = "block"
+                page.panes.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"
+        } 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_width = page.panes.source.offsetWidth-10
+        page.panes.input.style.width = source_width+"px"
+        page.panes.output.style.width = source_width+"px"
+    },
+
+    init: function(exp) {
+        var page = this
+
+        document.querySelectorAll("body>fieldset").forEach(function(field) {
+            var option = field.querySelector("form.option")
+            var output = field.querySelector("div.output")
+
+            var init = page[field.dataset.init]
+            if (typeof init == "function") {
+                var conf = page[field.dataset.init](page, field, option, output)
+                if (conf) {
+                    kit.AppendChild(output, conf)
+                }
+            }
+        })
+        window.onresize = this.range
+        this.range({left:120, middle:60, right:120})
+    },
+    conf: {},
+})
diff --git a/usr/librarys/context.js b/usr/librarys/context.js
index f4fd34e8..b4fef779 100644
--- a/usr/librarys/context.js
+++ b/usr/librarys/context.js
@@ -7,7 +7,7 @@ ctx = context = {
         }
         this.GET("", option, function(msg) {
             msg = msg && msg[0]
-            // msg && (msg.__proto__ = (page || {}))
+            msg && (msg.__proto__ = (page || {}))
             typeof cb == "function" && cb(msg || {})
         })
     },