Skip to content

Commit

Permalink
Merge pull request #10 from ekko-live/feature/restructure-project
Browse files Browse the repository at this point in the history
🎨 Restructure project
  • Loading branch information
wLotherington authored Apr 21, 2021
2 parents 6ffd3c3 + af9333f commit 1dc91b4
Show file tree
Hide file tree
Showing 11 changed files with 80 additions and 1,501 deletions.
2 changes: 2 additions & 0 deletions .npmignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules
dist
50 changes: 2 additions & 48 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,49 +1,3 @@
# ekko - user app example
# `ekko-client`

## TODO

- Add wrappers around socket.io methods in BOTH `ekko-client.js` files
- Get the `publish` and `subscribe` stuff setup
- Add in DOM modification to update the actual DOM (see below)
- Look into how to actually get all the code combined and loaded in... CDN? NPM package?

```
// CODE FROM "Ephemeral" front end
<script>
const socket = io();
const form = document.querySelector("form");
const thought = document.getElementById("thought");
const thoughts = document.getElementById("thoughts");
form.addEventListener("submit", e => {
e.preventDefault();
if (thought.value) {
socket.emit("thought", thought.value);
thought.value = "";
}
})
socket.on('thought', (msg) => {
let thought = document.createElement('LI');
thought.innerHTML = msg
thoughts.insertBefore(thought, thoughts.children[0])
updateStyle()
})
const updateStyle = () => {
let thoughts = [...document.querySelectorAll("li")];
for (let i = 0; i < thoughts.length; i++) {
const thought = thoughts[i];
if (i > 9) {
thought.parentElement.removeChild(thought);
}
thought.style.color = `rgba(0, 0, 0, ${(10 - i) / 10})`;
}
}
</script>
```
JavaScript client to interact with realtime `ekko-server`
33 changes: 3 additions & 30 deletions public/js/ekko-client.js → lib/ekko-client.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
const io = require("socket.io-client");

class Ekko {
constructor({ host, uuid }) {
this.host = host;
Expand Down Expand Up @@ -45,33 +47,4 @@ class Ekko {
}
}

// Client emit actions will always have a channel in the params
/*
TODO ADD METHODS TO CLIENT API
publish
subscribe
event listener
disconnect
change ekko instatiation
- remove channel
add listner to ekko class
make ekko subscribe method
make ekko unsubscribe method
*/

/*
pubnub.addListener({
message: function(m) {
// handle message
var channelName = m.channel; // The channel to which the message was published
var channelGroup = m.subscription; // The channel group or wildcard subscription match (if exists)
var pubTT = m.timetoken; // Publish timetoken
var msg = m.message; // The params
var publisher = m.publisher; //The Publisher
},
});
*/
module.exports = Ekko;
11 changes: 0 additions & 11 deletions lib/rpl-client.js

This file was deleted.

Loading

0 comments on commit 1dc91b4

Please sign in to comment.