ouija-io / ouija

Communicating with ghosts
http://ouija.io
BSD 3-Clause "New" or "Revised" License
128 stars 14 forks source link

Interrupted connection with GoInstant #27

Closed GoOz closed 10 years ago

GoOz commented 10 years ago

So, i think, i did everything by the book to install Ouija and creating the GoInstant app but i still have this error everytime i refresh :

The connection with wss://goinstant.net/usename/app/?guest=1&gid=blablaIdbla… has been interupted while loading the page.

(it's a translation, i got my error message in french :p)

FYI, for now i'm working locally and added the authorization for localhost:2368. Dunno if i did something wrong or whatever but here it is. Do you happen to know why i got this error?

GoOz commented 10 years ago

Ok, apparently it doesn't prevent the script from working. But It just doesn't work with my actual theme. I switched to Casper and saw it, working and everything. It wasn't obvious though. If you don't know that you can comment, you wouldn't be able to discover by yourself that you can. :/

Anyway, what can i do to make it work with my theme ?

colinmacdonald commented 10 years ago

Getting Ouija compatible with themes is one of our main goals with this preview. Could you make your theme public so we can debug why the comments are not showing up?

colinmacdonald commented 10 years ago

Also, good point about the comment blocks maybe being a bit too subtle for people to notice.

GoOz commented 10 years ago

@colinmacdonald Actually the theme i use is a fork of the theme Uno so you already can check it out.

colinmacdonald commented 10 years ago

Perfect. I'll try it out and get back to you.

GoOz commented 10 years ago

Thanks :)

ntassone commented 10 years ago

Hey @GoOz! That PR will help Ouija work with uno. Let me know if you see any issues after it's merged.

GoOz commented 10 years ago

Well i pulled but still nothing. When i take a look at the DOM, i don't have any ouija section tag within content elements. It must be related to the fact that in your JS, the var articleContent is fixed to '.post-content' and there is no 'post-content' class on any element in the Uno theme.

Do you have any idea of a good workaround ? i don't know if i should overwrite the var, or add this class to my Uno template. Nonetheless, it would mean that anybody using Uno theme won't get ouja working unless it's tweaked.

colinmacdonald commented 10 years ago

Ah yes, we forgot to mention the option for overriding the article_content selector. In your default.hbs under window.ouija_identifier; put window.ouija_article_content = 'section.post';. Sorry about that.

GoOz commented 10 years ago

Ah yes, much better, thanks. But on lower resolutions (e.g. 1280px wide), the "push" from the right of 18% is not enough. The ouija block is half hidden. See screenshot. welcome_to_ghost_-_2014-05-05_14 23 33

But maybe i should open another issue… Meanwhile, i'll try to figure out a solution on my own.

colinmacdonald commented 10 years ago

Realistically, Ouija won't be able to support every theme out there right out of the box. Some custom CSS would be needed to make everything look correct.

halfdan commented 10 years ago

Definitely. It would be good to have a set of predefined styles that you can configure (or automatically get it detected similar to Disqus auto-styling?). The medium-style comments really only work with a good right margin.

ntassone commented 10 years ago

If you do the developer setup for Ouija, you'll have access to the precompiled SCSS file that allows you to make modifications to those kind of values. If you just do the quick install, you can include styles (after ouija.css) to overwrite any Ouija defined properties.

GoOz commented 10 years ago

I'm sure it's not easy to make this work in every situation but there's something i don't get.

You do know the width of the Ouija comment block (300px) but you set the right position to 18% (why 18% btw?). Why not set the position to the witdh of the ouija block, the only non-relative, fixed width you know for sure? Honest question. :)

ntassone commented 10 years ago

The 18% value was chosen arbitrarily because it worked on several different themes as a good starting point. Setting the offset to the width Ouija pushes the content off on smaller screens. It does make sense to make the offset related to the width of Ouija, though. This also works well on centered posts as it centers the post with comments open.

PR I've opened to show this: https://github.com/goinstant/ouija/pull/35

GoOz commented 10 years ago

Well i'm closing this one. Ouija now works fine with my theme which was the original issue. The remaining styling issue is just with small resolutions, so not related.