diff --git a/app.js b/app.js index 7af99a5..64ee5e1 100644 --- a/app.js +++ b/app.js @@ -4,11 +4,9 @@ const ReactDOM = require('react-dom') const create = require('create-react-class') const Promise = require('bluebird') const urllib = require('url') - -const Matrix = require('./backends/matrix.js') +const sdk = require('matrix-js-sdk') const Sidebar = require('./components/sidebar.js') - const Login = require('./components/Login.js') const Info = require('./components/info.js') const Chat = require('./components/chat.js') @@ -25,33 +23,62 @@ let App = create({ displayName: "App", getInitialState: function() { - return {rooms: {}, events: {}} + return {rooms: []} }, - checkBackend: function() { - if(this.state.backend.hasUpdates()) { - console.log("RECEIVING UPDATES FROM BACKEND") - this.setState({ - rooms: this.state.backend.getRooms(), - events: this.state.backend.getEvents() - }) + componentDidMount: function() { + //check if accessToken is stored in localStorage + let accessToken = localStorage.getItem('accessToken') + if (localStorage.accessToken != undefined) { + let userId = localStorage.getItem('userId') + let apiUrl = localStorage.getItem('apiUrl') + this.loginCallback(userId, accessToken, apiUrl, true) } - setTimeout(() => { - this.checkBackend() - }, 100) }, - loginCallback: function(userId, accessToken, apiUrl) { - userId = '@' + userId.replace('@', '') - let backend = new Matrix(userId, accessToken, apiUrl) + loginCallback: function(userId, accessToken, apiUrl, restored) { + if (restored) { + console.log("Restoring from localStorage") + } else { + userId = '@' + userId.replace('@', '') + localStorage.setItem('userId', userId) + localStorage.setItem('accessToken', accessToken) + localStorage.setItem('apiUrl', apiUrl) + } + let client = sdk.createClient({ + baseUrl: apiUrl, + accessToken: accessToken, + userId: userId + }); + + console.log("CLIENT", client) this.setState({ - backend: backend + client: client + }) + this.startClient(client) + }, + + startClient: function(client) { + console.log(this.state) + client.on("sync", (state, prevState, data) => { + console.log(state) + if (state == "ERROR") { + } else if (state == "SYNCING") { + let rooms = {} + client.getRooms().forEach((room) => { + rooms[room.roomId] = room + }) + this.setState({rooms: rooms}) + } else if (state == "PREPARED") { + } + }) + client.on("event", (event) => { }) - this.checkBackend() + client.startClient() }, render: function() { - if (this.state.backend == undefined) { + if (this.state.client == undefined) { //Login screen return } @@ -60,7 +87,7 @@ let App = create({ {this.setState({roomId: roomId})}}/>
- +
diff --git a/components/chat.js b/components/chat.js index 7d7e100..4519e63 100644 --- a/components/chat.js +++ b/components/chat.js @@ -57,12 +57,20 @@ let chat = create({ }, render: function() { - if (this.props.roomId == undefined || this.props.events[this.props.roomId] == undefined) { - //empty screen - return
+ let empty = ( +
+ ) + if (this.props.roomId == undefined) { + //empty screen + return empty + } + + let room = this.props.client.getRoom(this.props.roomId) + if (room == null) { + return empty } let messageGroups = { @@ -74,22 +82,27 @@ let chat = create({ // if the sender is the same, add it to the 'current' messageGroup, if not, // push the old one to 'groups' and start with a new array. - this.props.events[this.props.roomId].forEach((event, id) => { - if (event.sender != messageGroups.sender) { - messageGroups.sender = event.sender - if (messageGroups.current.length != 0) { - messageGroups.groups.push(messageGroups.current) + console.log("GROUPING EVENTS", room.timeline.length) + let events = [] + if (room.timeline.length > 0) { + room.timeline.forEach((timeline) => { + console.log("TIMELINE", timeline); + let event = timeline.event; + if (event.sender != messageGroups.sender) { + messageGroups.sender = event.sender + if (messageGroups.current.length != 0) { + messageGroups.groups.push(messageGroups.current) + } + messageGroups.current = [] } - messageGroups.current = [] - } - messageGroups.current.push(event) - }) - messageGroups.groups.push(messageGroups.current) - - let events = messageGroups.groups.map((events, id) => { - return - }) + messageGroups.current.push(event) + }) + messageGroups.groups.push(messageGroups.current) + events = messageGroups.groups.map((events, id) => { + return + }) + } //TODO: replace with something that only renders events in view return
@@ -116,7 +129,7 @@ let EventGroup = create({ render: function() { let events = this.props.events.map((event, id) => { - return getRenderedEvent(event, id, this.props.backend) + return getRenderedEvent(event, id, this.props.client) }) return
@@ -128,10 +141,10 @@ let EventGroup = create({ } }) -function getRenderedEvent(event, id, backend) { +function getRenderedEvent(event, id, client) { if (event.type == "m.room.message") { let msgtype = event.content.msgtype; - return React.createElement(defaultValue(elements[msgtype], elements["m.text"]), {event: event, key: id, backend: backend}) + return React.createElement(defaultValue(elements[msgtype], elements["m.text"]), {event: event, key: id, client: client}) } } diff --git a/components/events/image.js b/components/events/image.js index 6872d88..c727b93 100644 --- a/components/events/image.js +++ b/components/events/image.js @@ -10,7 +10,7 @@ let Event = create({ displayName: "m.image", getInitialState: function() { - let hs = this.props.backend.getHS() + let hs = this.props.client.baseUrl let event = this.props.event; let media_mxc = event.content.url.slice(7); let thumb_mxc = event.content.info.thumbnail_url.slice(6); diff --git a/components/filterList.js b/components/filterList.js index 0e8f680..4c25414 100644 --- a/components/filterList.js +++ b/components/filterList.js @@ -16,6 +16,7 @@ let FilterList = create({ }, select: function(id) { + console.log("SELECTED", id) this.setState({selection: id}) this.props.callback(id) }, @@ -40,6 +41,7 @@ let FilterList = create({ let keys = Object.keys(this.props.items) let items = keys.map((itemKey, id) => { let item = this.props.items[itemKey] + console.log(item) let props = { selected: this.state.selection == itemKey, filter: this.state.filter, diff --git a/components/sidebar.js b/components/sidebar.js index acef70f..e113ea6 100644 --- a/components/sidebar.js +++ b/components/sidebar.js @@ -65,6 +65,7 @@ let Sidebar = create({ }, render: function() { + console.log(this.props.rooms) return
{this.props.selectRoom(roomId)}}/>