And then it took me like 5 seconds to figure out how to chat. I first tried to click on people's chat to reply to them and then I finally found the text input at the bottom of the screen. Then nothing would happen when I hit enter. Then I eventually found the blue circle send button and that didn't work.
Then I tried Chrome. Worked! So I found some bugs in Safari :)
Amazing that this was done in 300 lines. Something about this format is immediately appealing. Maybe it's because dots on a map feel more human than handles on a forum or comment thread. Anonymity is this double-edged sword in communities. Maybe this is the minimum amount needed to make people behave? Probably not, but something IS interesting here.
Right now it's just people shouting...I hope your next trick is to figure out how to turn it into conversations. Suggestion: Please don't be tempted to just rewrite it or start from scratch. Iterate from this version because 1) it would be faster and 2) this one already has some magic in it.
Well, that CloudApp link got taken down. It was a video of Safari asking for location permission over and over again. Here's the reason:
"We've noticed that one of your CloudApp drops has been getting an unusual amount of attention: Screen Recording 2015-06-19 at 09.44 AM.gif has had a download transfer rate of 4.2 GB in the last day or so.
Even though we deeply appreciate you trusting us with your data, this violates our download limit and fair use policy. Unfortunately this is not something we are able to host on our servers.
Your drop has been disabled and can't be reached as of this moment. We haven't deleted it from our servers though so if you need to get it back or feel you might have received this email in error please contact us so we can sort it out."
> I first tried to click on people's chat to reply to them and then I finally found the text input at the bottom of the screen. Then nothing would happen when I hit enter.
If you use safari connected to the internet with a cable safari does not give the lat-long. Only if you use the wireless. Had this issue the other day.
I agree about conversations - I actually commented that I wish I could respond to people, and somebody responded to that on the map and we had a quick conversation, just knowing that our dots were for each other. It ruled.
Thanks!
It took me about two weeks in after work hours.
The server is 70 lines of Java (vertx) and the UI is like 200 lines of JS (With very little JQuery)
Very nice! it would be nice to have an option though that would fuzz your location a bit - I dont have a problem with people knowing im from my city - pinpointing my house is a different thing though...
var entityMap = {
"&": "&",
"<": "<",
">": ">",
'"': '"',
"'": ''',
"/": '/'
};
function escapeHtml(string) {
return String(string).replace(/[&<>"'\/]/g, function (s) {
return entityMap[s];
});
}
also document.createTextNode will tell the browser not to render the children as html, whereas appending a dom element and innerHTML will.[1] I'm just assuming that behavior is correct in all browsers though.
Make your regexs global, i.e. .replace(/</g, "") (note the g at the end), otherwise only the first instance is replaced. I made it easy for you: https://github.com/idoco/map-chat/pull/1
I just looked through Google Map's API licensing options. Obviously you may quickly max out your limit. It doesn't look like there's really an extended paid model to increase the limit by much? 100k requests is the only additional limit I see.
Does Google not offer much higher limits if you're willing to pay? I'd be curious to try a similar app, but it seems that popularity might kill one pretty quickly with such low API limits.
I see some abuse from some specific IPs, and I'm thinking about automatically black-listing them after two messages in less than a specific threshold. What do you think?
Lets try to enjoy some hacking free chat, instead of ruining it. You can fill you spare time by implementing new features and sending me pull requests :)
Great work! Obviously ~300 lines of code isn't enough to do a full-fledged slick interface...but one suggestion that presumably would be easy to implement: a button that closes all current word-balloons.
I was also thinking a "reply" button for threaded discussions between users...but then that would kill the fun simplicity of the app...I just like seeing where HN users are currently this morning. And also, the ways people try to obfuscate XSS attacks
Ha haa - interesting to see this. I had something similar in mind when I bought the domain http://chattymaps.com As you can see if you look at it now, the concept has changed somewhat.
I'm still looking at adding more 'chatty' features though.
If you are interested in doing something more with this, let me know - it could be interesting.
On my Chrome+OS X Yosemite, I opened it in a separate tab, and went back to working on something else. After a couple of minutes, the laptop really started heating up :). The `Google Chrome Helper` associated with this tab was the culprit, hogging 100% CPU. Killed it and everything came back to normal.
Very cool. Wish there were some form of message persistence. Otherwise the speed at which I type is limited to how quickly others acknowledge what I say, and that slows the entire conversation down.
Adding more traditional scrolling chat bubbles (see Ultima Online) would help that I think.
* something to zoom the map (and thus, filtering messages for a given radius)
* and/or something to organize messages in a way they don't overlap :P (eg: balloons with a number, when clicked it shows the full list of messages)
It is possible to save the message history on the client side. But I though that this is fun to have no history :) Right now notifications (The switch on top) gives you some history.
I disabled the zoom buttons, because I was thinking about mobile browsers and the very limited screen space they have. I will reconsider
Alternate interface suggestion: Keep a rolling chat box. For avatars of each person, use a smallinsh picture of the area surrounding their dot. That might bump up the line count a bit though.
I think that'd provide a nice basis for fleshing it out.
Nice hack! It felt like using the old Yahoo! chat rooms implemented on a world map. Chaotic environment, everybody writes, barely anyone replies to any message that makes sense. It's fun!
Notifications should be limited to the messages visible within your bounding box. If I've zoomed in on a city, I don't want notifications from somewhere half-way around the world.
I'm not so sure about distance. Maybe based on your zoom level? Because if you're zoomed out, I'd guess you want more notifications than if you're zoomed in on a city or region.
Very cool project. A lot of people active already playing along. Would be nice if we could PM one another that to start a one-on-one convo with someone in a place we're interested in.
2. Clicking on a chat bubble needs to bring it to the front (change the z-index). Sometimes just want to read a specific message hidden behind another, and having to click to close gets tired fast. Extra bonus if future messages from the same person you've clicked on once always pop up on top of others in the area (or provide a little "pin" option in each chat bubble, but that will probably clutter too much).
And as a separate suggestion already mentioned by others:
3. The ability to toggle the enableHighAccuracy boolean. Exact street address is a little too creepy.
It doesn't work for me. I can see other people's messages but. When I type and press enter or send button nothing happens. Tried with both Iceweasel and Chromium.
Love it. Would love to read my news this way. I find this much more intuitive and antural than Twitter. You have a hot product here OP, congratulations.
Does the problem still persist? which browser are you using?
Are you on some restricted network? (Like an internal company network behind a fire wall?)
I'm using a google maps api key to track this, and so far I had only 11K hits on their server. The free limit is 25K for 90 days. After that I'll need to start pay :)
There are private rooms, but the UI do not support that yet.
Just add #word to the url and get your private chat map.
i.e. http://idoco.github.io/map-chat#test
And then it took me like 5 seconds to figure out how to chat. I first tried to click on people's chat to reply to them and then I finally found the text input at the bottom of the screen. Then nothing would happen when I hit enter. Then I eventually found the blue circle send button and that didn't work.
Then I tried Chrome. Worked! So I found some bugs in Safari :)
Amazing that this was done in 300 lines. Something about this format is immediately appealing. Maybe it's because dots on a map feel more human than handles on a forum or comment thread. Anonymity is this double-edged sword in communities. Maybe this is the minimum amount needed to make people behave? Probably not, but something IS interesting here.
Right now it's just people shouting...I hope your next trick is to figure out how to turn it into conversations. Suggestion: Please don't be tempted to just rewrite it or start from scratch. Iterate from this version because 1) it would be faster and 2) this one already has some magic in it.
Thanks for sharing!