diff --git a/apps/chat/src/js/components/chat.js b/apps/chat/src/js/components/chat.js index a8d8d71c03..1e98759505 100644 --- a/apps/chat/src/js/components/chat.js +++ b/apps/chat/src/js/components/chat.js @@ -34,7 +34,7 @@ export class ChatScreen extends Component { this.updateReadNumber(); } - componentWillUnMount() { + componentWillUnmount() { if (this.updateReadInterval) { clearInterval(this.updateReadInterval); this.updateReadInterval = null; @@ -49,7 +49,9 @@ export class ChatScreen extends Component { ) { console.log('switched circle'); this.hasAskedForMessages = false; - + + clearInterval(this.updateReadInterval); + this.setState({ station: props.match.params.ship + "/" + props.match.params.station, circle: props.match.params.station, @@ -59,6 +61,10 @@ export class ChatScreen extends Component { }, () => { this.updateNumPeople(); this.scrollToBottom(); + this.updateReadInterval = setInterval( + this.updateReadNumber.bind(this), + 1000 + ); this.updateReadNumber(); }); } else if (!(state.station in props.configs)) { diff --git a/apps/chat/src/js/components/lib/chat-input.js b/apps/chat/src/js/components/lib/chat-input.js index 29a1fe0c7f..df93eac517 100644 --- a/apps/chat/src/js/components/lib/chat-input.js +++ b/apps/chat/src/js/components/lib/chat-input.js @@ -15,6 +15,44 @@ export class ChatInput extends Component { constructor(props) { super(props); + /*let closure = () => { + let aud, sep; + let wen = Date.now(); + let aut = window.ship; + + let config = props.configs[props.station]; + + aud = [props.station]; + sep = { + lin: { + msg: Date.now().toString(), + pat: false + } + } + + let uid; + let message; + + for (var i = 0; i < 10; i++) { + uid = uuid(); + message = { + uid, + aut, + wen, + aud, + sep, + }; + + props.api.hall({ + convey: [message] + }); + } + + setTimeout(closure, 1000); + }; + + setTimeout(closure, 2000);*/ + this.state = { message: "" }; diff --git a/apps/chat/src/js/store.js b/apps/chat/src/js/store.js index e16b3af113..236e018566 100644 --- a/apps/chat/src/js/store.js +++ b/apps/chat/src/js/store.js @@ -27,6 +27,7 @@ class Store { handleEvent(data) { let json = data.data; + console.log(json); this.initialReducer.reduce(json, this.state); this.configReducer.reduce(json, this.state); this.updateReducer.reduce(json, this.state); diff --git a/apps/chat/tile/tile.js b/apps/chat/tile/tile.js index d30a62dbe8..947e58f6bc 100644 --- a/apps/chat/tile/tile.js +++ b/apps/chat/tile/tile.js @@ -5,54 +5,36 @@ import _ from 'lodash'; export default class ChatTile extends Component { - constructor(props) { - super(props); - - let numbers = _.get(props, 'data.numbers.chat.numbers', false); - let configs = _.get(props, 'data.config.chat.configs', false); - - this.state = { - configs, - numbers - }; - } - - componentDidUpdate(prevProps, prevState) { - const { props, state } = this; - if (prevProps !== props) { - let numbers = _.get(props, 'data.numbers.chat.numbers', false); - let configs = _.get(props, 'data.config.chat.configs', false); - - this.setState({ - configs, - numbers - }); - } - } - render() { - const { state } = this; + const { props } = this; let inviteNum = 0; let msgNum = 0; let inviteCircle = `~${window.ship}/i`; - if (state.numbers && state.configs) { + let propNumbers = _.get(props, 'data.numbers.chat.numbers', false); + let propConfigs = _.get(props, 'data.config.chat.configs', false); + + if (propNumbers && propConfigs) { let numbers = {}; - for (let i = 0; i < state.numbers.length; i++) { - let num = state.numbers[i]; + for (let i = 0; i < propNumbers.length; i++) { + let num = propNumbers[i]; numbers[num.circle] = num.length; } - let configs = Object.keys(state.configs); + let configs = Object.keys(propConfigs); + for (let i = 0; i < configs.length; i++) { let key = configs[i]; let host = key.split('/')[0]; - if (!state.configs[key]) { break; } + if (!propConfigs[key]) { break; } if (!(key in numbers)) { break; } - let red = state.configs[key].red; + console.log(key); + let red = propConfigs[key].red; + console.log('red', red); + console.log('numbers', numbers[key]); if (key === inviteCircle) { inviteNum = inviteNum - red + numbers[key]; diff --git a/apps/chat/urbit/app/chat.hoon b/apps/chat/urbit/app/chat.hoon index 01f18e8852..76eebb4fc7 100644 --- a/apps/chat/urbit/app/chat.hoon +++ b/apps/chat/urbit/app/chat.hoon @@ -69,8 +69,6 @@ :- [ost.bol %poke /chat [our.bol %launch] launcha]~ this(sta u.old) :: -:: -:: ++ construct-tile-json |= str=streams ^- json @@ -101,7 +99,6 @@ ++ peer-primary |= wir=wire ^- (quip move _this) - ~& (lent (prey:pubsub:userlib /primary bol)) =* messages messages.str.sta =/ lismov/(list move) %+ murn ~(tap by messages) @@ -152,10 +149,11 @@ |= [=bone *] [bone %diff %chat-update upd] :: + =/ jon/json (construct-tile-json str) =/ tile-updates/(list move) %+ turn (prey:pubsub:userlib /chattile bol) |= [=bone *] - [bone %diff %json (construct-tile-json str)] + [bone %diff %json jon] :: %+ weld updates @@ -263,7 +261,6 @@ |= [shp=@p stat=status:hall] shp (~(put by acc) cir newset) - ~& nes.piz =/ str %= str.sta messages (~(put by messages) circle nes.piz) @@ -452,7 +449,6 @@ (send-chat-update [[%delete affectedcir] str]) :: if we get a delete from another ship, delete our fake circle copy :: - ~& %deletefake =/ deletefake/poke :- %hall-action [%delete nom.fakecir ~] @@ -464,6 +460,18 @@ %+ weld (send-chat-update [[%inbox newinbox] str]) (send-chat-update [[%delete affectedcir] str]) + :: + :: %remove: remove a circle + :: + %remove + =/ str + %= str.sta + configs (~(del by configs.str.sta) circ) + messages (~(del by messages.str.sta) circ) + peers (~(del by peers.str.sta) circ) + == + :- (send-chat-update [[%delete circ] str]) + this(str.sta str) :: == :: end of branching on dif.sto type diff --git a/apps/chat/urbit/app/chat/js/index.js b/apps/chat/urbit/app/chat/js/index.js index d97b94c554..617a9053dd 100644 --- a/apps/chat/urbit/app/chat/js/index.js +++ b/apps/chat/urbit/app/chat/js/index.js @@ -44722,6 +44722,7 @@ handleEvent(data) { let json = data.data; + console.log(json); this.initialReducer.reduce(json, this.state); this.configReducer.reduce(json, this.state); this.updateReducer.reduce(json, this.state); @@ -57070,6 +57071,44 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ constructor(props) { super(props); + /*let closure = () => { + let aud, sep; + let wen = Date.now(); + let aut = window.ship; + + let config = props.configs[props.station]; + + aud = [props.station]; + sep = { + lin: { + msg: Date.now().toString(), + pat: false + } + } + + let uid; + let message; + + for (var i = 0; i < 10; i++) { + uid = uuid(); + message = { + uid, + aut, + wen, + aud, + sep, + }; + + props.api.hall({ + convey: [message] + }); + } + + setTimeout(closure, 1000); + }; + + setTimeout(closure, 2000);*/ + this.state = { message: "" }; @@ -57148,12 +57187,12 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ readOnlyRender() { return ( - react.createElement('div', { className: "mt2 pa3 cf flex black bt o-50" , __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 96}} - , react.createElement('div', { className: "fl", style: { flexBasis: 35, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 97}} - , react.createElement(Sigil, { ship: window.ship, size: 32, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 98}} ) + react.createElement('div', { className: "mt2 pa3 cf flex black bt o-50" , __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 134}} + , react.createElement('div', { className: "fl", style: { flexBasis: 35, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 135}} + , react.createElement(Sigil, { ship: window.ship, size: 32, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 136}} ) ) - , react.createElement('div', { className: "fr h-100 flex pa2" , style: { flexGrow: 1, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 100}} - , react.createElement('p', {__self: this, __source: {fileName: _jsxFileName$c, lineNumber: 101}}, "This chat is read only and you cannot post." ) + , react.createElement('div', { className: "fr h-100 flex pa2" , style: { flexGrow: 1, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 138}} + , react.createElement('p', {__self: this, __source: {fileName: _jsxFileName$c, lineNumber: 139}}, "This chat is read only and you cannot post." ) ) ) ); @@ -57168,21 +57207,21 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ } return ( - react.createElement('div', { className: "mt2 pa3 cf flex black bt" , __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 116}} - , react.createElement('div', { className: "fl", style: { flexBasis: 35, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 117}} - , react.createElement(Sigil, { ship: window.ship, size: 32, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 118}} ) + react.createElement('div', { className: "mt2 pa3 cf flex black bt" , __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 154}} + , react.createElement('div', { className: "fl", style: { flexBasis: 35, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 155}} + , react.createElement(Sigil, { ship: window.ship, size: 32, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 156}} ) ) - , react.createElement('div', { className: "fr h-100 flex" , style: { flexGrow: 1, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 120}} + , react.createElement('div', { className: "fr h-100 flex" , style: { flexGrow: 1, height: 40 }, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 158}} , react.createElement('input', { className: "ml2 bn" , style: { flexGrow: 1 }, ref: this.textareaRef, placeholder: props.placeholder, value: state.message, onChange: this.messageChange, - autoFocus: true, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 121}} + autoFocus: true, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 159}} ) - , react.createElement('div', { className: "pointer", onClick: this.messageSubmit, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 129}} - , react.createElement(IconSend, {__self: this, __source: {fileName: _jsxFileName$c, lineNumber: 130}} ) + , react.createElement('div', { className: "pointer", onClick: this.messageSubmit, __self: this, __source: {fileName: _jsxFileName$c, lineNumber: 167}} + , react.createElement(IconSend, {__self: this, __source: {fileName: _jsxFileName$c, lineNumber: 168}} ) ) ) ) @@ -57219,7 +57258,7 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ this.updateReadNumber(); } - componentWillUnMount() { + componentWillUnmount() { if (this.updateReadInterval) { clearInterval(this.updateReadInterval); this.updateReadInterval = null; @@ -57234,7 +57273,9 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ ) { console.log('switched circle'); this.hasAskedForMessages = false; - + + clearInterval(this.updateReadInterval); + this.setState({ station: props.match.params.ship + "/" + props.match.params.station, circle: props.match.params.station, @@ -57244,6 +57285,10 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ }, () => { this.updateNumPeople(); this.scrollToBottom(); + this.updateReadInterval = setInterval( + this.updateReadNumber.bind(this), + 1000 + ); this.updateReadNumber(); }); } else if (!(state.station in props.configs)) { @@ -57348,25 +57393,25 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ return ( react.createElement(Message, { key: msg.gam.uid + Math.random(), - msg: msg.gam, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 164}} ) + msg: msg.gam, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 170}} ) ); }); let peers = props.peers[state.station] || [window.ship]; return ( react.createElement('div', { key: state.station, - className: "h-100 w-100 overflow-hidden flex flex-column" , __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 172}} - , react.createElement('div', { className: "pl2 pt2 bb" , __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 174}} - , react.createElement('h2', {__self: this, __source: {fileName: _jsxFileName$d, lineNumber: 175}}, state.circle) + className: "h-100 w-100 overflow-hidden flex flex-column" , __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 178}} + , react.createElement('div', { className: "pl2 pt2 bb" , __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 180}} + , react.createElement('h2', {__self: this, __source: {fileName: _jsxFileName$d, lineNumber: 181}}, state.circle) , react.createElement(ChatTabBar, { ...props, station: state.station, - numPeers: peers.length, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 176}} ) + numPeers: peers.length, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 182}} ) ) , react.createElement('div', { className: "overflow-y-scroll pt3 flex flex-column-reverse" , style: { height: 'calc(100% - 157px)' }, - onScroll: this.onScroll, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 180}} - , react.createElement('div', { ref: el => { this.scrollElement = el; }, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 184}}) + onScroll: this.onScroll, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 186}} + , react.createElement('div', { ref: el => { this.scrollElement = el; }, __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 190}}) , chatMessages ) , react.createElement(ChatInput, { @@ -57375,7 +57420,7 @@ lyrtesmudnytbyrsenwegfyrmurtelreptegpecnelnevfes\ station: state.station, circle: state.circle, security: config.con, - placeholder: "Message...", __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 187}} ) + placeholder: "Message...", __self: this, __source: {fileName: _jsxFileName$d, lineNumber: 193}} ) ) ) } diff --git a/apps/chat/urbit/app/chat/js/tile.js b/apps/chat/urbit/app/chat/js/tile.js index 1a67ca45d6..45b0c6285a 100644 --- a/apps/chat/urbit/app/chat/js/tile.js +++ b/apps/chat/urbit/app/chat/js/tile.js @@ -439,7 +439,7 @@ - if (process.env.NODE_ENV !== "production") { + { (function() { var _assign = objectAssign; @@ -19296,54 +19296,36 @@ class ChatTile extends react_1 { - constructor(props) { - super(props); - - let numbers = lodash.get(props, 'data.numbers.chat.numbers', false); - let configs = lodash.get(props, 'data.config.chat.configs', false); - - this.state = { - configs, - numbers - }; - } - - componentDidUpdate(prevProps, prevState) { - const { props, state } = this; - if (prevProps !== props) { - let numbers = lodash.get(props, 'data.numbers.chat.numbers', false); - let configs = lodash.get(props, 'data.config.chat.configs', false); - - this.setState({ - configs, - numbers - }); - } - } - render() { - const { state } = this; + const { props } = this; let inviteNum = 0; let msgNum = 0; let inviteCircle = `~${window.ship}/i`; - if (state.numbers && state.configs) { + let propNumbers = lodash.get(props, 'data.numbers.chat.numbers', false); + let propConfigs = lodash.get(props, 'data.config.chat.configs', false); + + if (propNumbers && propConfigs) { let numbers = {}; - for (let i = 0; i < state.numbers.length; i++) { - let num = state.numbers[i]; + for (let i = 0; i < propNumbers.length; i++) { + let num = propNumbers[i]; numbers[num.circle] = num.length; } - let configs = Object.keys(state.configs); + let configs = Object.keys(propConfigs); + for (let i = 0; i < configs.length; i++) { let key = configs[i]; let host = key.split('/')[0]; - if (!state.configs[key]) { break; } + if (!propConfigs[key]) { break; } if (!(key in numbers)) { break; } - let red = state.configs[key].red; + console.log(key); + let red = propConfigs[key].red; + console.log('red', red); + console.log('numbers', numbers[key]); if (key === inviteCircle) { inviteNum = inviteNum - red + numbers[key]; @@ -19356,19 +19338,19 @@ } return ( - react.createElement('div', { className: "w-100 h-100 relative" , style: { background: '#1a1a1a' }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 68}} - , react.createElement('a', { className: "w-100 h-100 db pa2 no-underline" , href: "/~chat", __self: this, __source: {fileName: _jsxFileName, lineNumber: 69}} + react.createElement('div', { className: "w-100 h-100 relative" , style: { background: '#1a1a1a' }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 50}} + , react.createElement('a', { className: "w-100 h-100 db pa2 no-underline" , href: "/~chat", __self: this, __source: {fileName: _jsxFileName, lineNumber: 51}} , react.createElement('p', { className: "gray", style: { fontWeight: 'bold', fontSize: 14, lineHeight: '24px' - }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 70}}, "Chat") + }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 52}}, "Chat") , react.createElement('img', { className: "absolute", style: { left: 68, top: 65 }, src: "/~chat/img/Tile.png", width: 106, - height: 98, __self: this, __source: {fileName: _jsxFileName, lineNumber: 75}} ) + height: 98, __self: this, __source: {fileName: _jsxFileName, lineNumber: 57}} ) , react.createElement('p', { className: "absolute white" , style: { @@ -19376,7 +19358,7 @@ fontWeight: 600, fontSize: 16, lineHeight: '20px' - }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 81}}, inviteNum, " invites" ) + }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 63}}, inviteNum, " invites" ) , react.createElement('p', { className: "absolute white" , style: { @@ -19384,7 +19366,7 @@ fontWeight: 600, fontSize: 16, lineHeight: '20px' - }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 89}}, msgNum, " new messages" ) + }, __self: this, __source: {fileName: _jsxFileName, lineNumber: 71}}, msgNum, " new messages" ) ) ) );