Elm UI with Tachyons about hapi-socketio-redis-chat-example HOT 21 CLOSED

Thanks @nelsonic, @finnhodgkin and I are running through the tutorial now, will update here.
We don't have write access to this repo so will need that before we can assign ourselves etc.

from hapi-socketio-redis-chat-example.

Seems the problems we are having are related to versioning, similar to #69.
We changed socket.io version to 1.7.3 and socket.io-client to 2.0.3 and it started working. Have to make sure to delete package-lock.json before installing it seems.

Edit: Have made a pr #88 which updates these, re: #87. We should be okay without needing to pair on this now.

from hapi-socketio-redis-chat-example.

@ZooeyMiller / @finnhodgkin if after reading the readme and skimming the code you are unable to get it working on your laptop, please let me know so we can pair on it this afternoon. thanks!

from hapi-socketio-redis-chat-example.

@nelsonic We pomodoro'd and I compared the code to some socket stuff I've done before and we're still stuck 🤷‍♂️

Think we've found where the problem is.. Just not what's causing it. Help?

from hapi-socketio-redis-chat-example.

Just checked out the live one on heroku and seems to not be working there either at the moment...

from hapi-socketio-redis-chat-example.

Well it's now working on my comp. I just deleted the socket.io and socket.io-client entries from package.json and reinstalled them (npm i...)

Didn't work for Zooey's...

from hapi-socketio-redis-chat-example.

For the 'user has joined the channel' feature, do we want to re-implement this exactly the same in elm, or do we want an online/offline user list? In terms of complexity they're pretty much the same.

from hapi-socketio-redis-chat-example.

Things we still need to do for the UI:

• make the <user> has joined the room notification
  • We've found elm-animation which we will look at more in depth tomorrow.
  • this bit of code to do some animation stuff
  • just having a bit of trouble working out how exactly to do it but I'm sure with fresh brains and fiddling time it will come
• make the page scroll to the bottom when a new message is added

from hapi-socketio-redis-chat-example.

@ZooeyMiller please see: dwyl/chat#38 (please confirm if criteria is sufficient)

from hapi-socketio-redis-chat-example.

We've made a "user has joined the room" notification which appears in the chat log, the idea would be that this notification appears when a user joins/leaves but does not persist either through local storage or redis.

We decided to use localstorage for storing the user's name as it seems to play nicer with elm than cookies do.

from hapi-socketio-redis-chat-example.

Having completed the initial UI with Elm we're now working on hooking up our Elm front end to the back end which is already in place. (This may involve very minor modifications to the back end code, but hopefully not).

As discussed in #93 we have decided to carry on with socket.io and the back end as it stands right now.

As of right now we have got our elm front end to send out a message when a new user joins, and you can send messages from our FE to the chat (which appears on the non-elm FE).

See following comment for list of things to do

from hapi-socketio-redis-chat-example.

• emit user joined when someone joins Elm FE
• send message from Elm FE
• get message history from BE into Elm FE
• display new messages in Elm FE
• tinker with back end to get 'user joined' message to play nicely with our Elm FE
• document experiences with making Elm FE for chat app
• test Elm code
• test JS code (the ports stuff)
• convert time in milliseconds to a human readable date
• make page scroll to bottom on load and new message

from hapi-socketio-redis-chat-example.

We have now got the time to a human readable format in Elm (using Date.Extra and Time packages) , and are left with the empty checkboxes above which we will work on tomorrow.

from hapi-socketio-redis-chat-example.

Currently working on doing the HTTP request to get the message history into our app, but having a bit of trouble with decoding the result.

UPDATE: We've decided to pare down the problem, so want to make sure our decoder is working.

UPDATE 2: By passing in a JSON.stringify'd array through a port from javascript we have confirmed that our decoder works when given the correct input, so we know that our problem is with our implementation of the Http module.

UPDATE 3: We got it working 🎉 our problem was that we are using Task.perform to do the Http.get request, which returns a Request and we needed it to be a Task, so ended up using Http.toTask. We're now dealing with CORS problems as we're serving the Elm through elm-live on one port and the hapi(etc) server is running on a different port.

from hapi-socketio-redis-chat-example.

We've now added the functionality to scroll to the bottom on new messages, so the majority of the functionality is there!
We need to work on error handling (at the moment we do deal with all possibilities, but sometimes not in a very meaningful way), testing an documentation.

from hapi-socketio-redis-chat-example.

We've added a few unit tests to the easier functions (parseTimestamp, parseMessage and view).

Now we're testing the decoders by passing in fake JSON strings.

Writing tests in Elm is sweet! 😃

from hapi-socketio-redis-chat-example.

@nelsonic We don't have 100% 'test coverage' of the Elm app, but everything not covered (non-logic stuff) is heavily covered by the Elm compiler. Is this an appropriate way to write tests for Elm or should we be replicating our efforts from last week even in Elm?

from hapi-socketio-redis-chat-example.

We are now at a point of doing minor tweaks on the Elm front end including informative error messages.
Tomorrow we hope to work on documentation and then remove the [WiP] from our PR!

from hapi-socketio-redis-chat-example.

We are now working on making sure Elm can never get a runtime error due to getting the wrong data type from javascript (through ports).
In theory we should always be getting a string through the port to Elm because we send it directly from the socket without tinkering in JS at all, so it should always be a string. But we all know never to trust javascript, so using a bit of TDD we are checking all basic data types are dealt with and accounted for.

from hapi-socketio-redis-chat-example.

@nelsonic we've now got a working, commented and tested Elm front end done 🎉
The code is commented such that (to us) what it is doing and how it is doing it is clear (to someone who knows Elm). We do still need to add how to run the Elm version locally to the README.md.
Do you think we should add more documentation than the code comments, or do you think it's sufficiently explained as is?

from hapi-socketio-redis-chat-example.

This PR #91 has now been merged. 🎉

from hapi-socketio-redis-chat-example.