{"action":"created","issue":{"url":"https://api.github.com/repos/hypothesis/h/issues/2577","labels_url":"https://api.github.com/repos/hypothesis/h/issues/2577/labels{/name}","comments_url":"https://api.github.com/repos/hypothesis/h/issues/2577/comments","events_url":"https://api.github.com/repos/hypothesis/h/issues/2577/events","html_url":"https://github.com/hypothesis/h/pull/2577","id":109535945,"number":2577,"title":"Group landing pages redesign","user":{"login":"robertknight","id":2458,"avatar_url":"https://avatars.githubusercontent.com/u/2458?v=3","gravatar_id":"","url":"https://api.github.com/users/robertknight","html_url":"https://github.com/robertknight","followers_url":"https://api.github.com/users/robertknight/followers","following_url":"https://api.github.com/users/robertknight/following{/other_user}","gists_url":"https://api.github.com/users/robertknight/gists{/gist_id}","starred_url":"https://api.github.com/users/robertknight/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/robertknight/subscriptions","organizations_url":"https://api.github.com/users/robertknight/orgs","repos_url":"https://api.github.com/users/robertknight/repos","events_url":"https://api.github.com/users/robertknight/events{/privacy}","received_events_url":"https://api.github.com/users/robertknight/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2015-10-02T17:32:43Z","updated_at":"2015-10-05T16:22:42Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/hypothesis/h/pulls/2577","html_url":"https://github.com/hypothesis/h/pull/2577","diff_url":"https://github.com/hypothesis/h/pull/2577.diff","patch_url":"https://github.com/hypothesis/h/pull/2577.patch"},"body":"This implements the new landing pages for groups. I still want to reorganize and tidy up the commits in this PR but I'm posting the PR now to review the design/flow and also to get feedback on the proposed mechanism to optimize the 'Join a Group' flow.\r\n\r\n * The 'Join Group X' and 'Login to Join Group X' pages have been merged into a single template,\r\n   as the designs are the same.\r\n * ~~To improve the common flow where a user who is not signed in and quite likely not signed up\r\n    receives a link, the 'Login to Join Group X' page subscribes to an event service. The event\r\n    service is currently a basic queue which polls a JSON array stored in localStorage\r\n    at a slow interval. When the user signs in, an event is added to this queue and the \"Login to Join\"\r\n    tab picks this up and automatically refreshes. I was thinking of using the same mechanism to\r\n    refresh the groups list in any open tabs after the user creates a new group.~~ _Edit: We decided\r\n    to approach this differently. Currently the user must refresh the 'Sign in to join' page to see\r\n    the join link_\r\n * The basic functionality of the groups pages does not require JS, but for nicities like auto-refreshing\r\n    the page, client-side validation of the group name form etc, there is a new bundle `site-bundle.js`\r\n    which contains site (rather than app)-specific code. Likewise there is also a new `site.scss`\r\n    file which contains styling that is only used for pages on the site, rather than pulling in all of the\r\n    app styling\r\n * To help achieve consistency in the design, I've extended the color palette in `variables.scss`. Since the grays\r\n     were previously named 'gray-light', 'gray-lighter' etc. trying to fit new names into this namespace\r\n     would have been awkward. To solve this, I used [this handy tool](http://chir.ag/projects/name-that-color) to come up with descriptive and grep-able names for the new colors from the design.\r\n\r\nThe flow now looks like this.\r\n\r\n**1. User clicks 'New Group'**\r\n\r\n![t93-1-create-group-initial](https://cloud.githubusercontent.com/assets/2458/10253094/6cd5d69a-6933-11e5-81d8-66e291281cf1.png)\r\n\r\n**2. User fills out the group name and possibly clicks the info link**\r\n\r\n![t93-2-create_group_filled](https://cloud.githubusercontent.com/assets/2458/10253103/79d631b4-6933-11e5-82bf-a79dc271058a.png)\r\n![t93-3-create-group-explained](https://cloud.githubusercontent.com/assets/2458/10253108/7fae03f0-6933-11e5-8316-77ba713e1fcb.png)\r\n\r\n**3. User clicks the 'Create Group' button and gets taken to the share page**\r\n\r\n![t93-4-share-group](https://cloud.githubusercontent.com/assets/2458/10253118/91bdce5e-6933-11e5-8a7c-3260922ab7d7.png)\r\n\r\n**4. A user who is not logged in receives and visits the link**\r\n\r\n![t93-5-join-group-not-logged-in](https://cloud.githubusercontent.com/assets/2458/10253141/a8b02558-6933-11e5-8c7a-911d4e46a9ae.png)\r\n\r\n**5. The 'Sign in' button opens the [login page](https://hypothes.is/login) in another tab. Once the user has signed in, (or created an account and then signed in), the original 'Join Group' tab will automatically refresh:**\r\n\r\n![t93-6-join-group-signed-in](https://cloud.githubusercontent.com/assets/2458/10253166/cd3b212a-6933-11e5-9459-11718dc0de3d.png)\r\n\r\n**6. Once the user clicks 'Join Group', they get taken to the share page (step 3 above)**\r\n\r\n\r\n\r\n\r\n\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/hypothesis/h/issues/comments/145589957","html_url":"https://github.com/hypothesis/h/pull/2577#issuecomment-145589957","issue_url":"https://api.github.com/repos/hypothesis/h/issues/2577","id":145589957,"user":{"login":"nickstenning","id":3602,"avatar_url":"https://avatars.githubusercontent.com/u/3602?v=3","gravatar_id":"","url":"https://api.github.com/users/nickstenning","html_url":"https://github.com/nickstenning","followers_url":"https://api.github.com/users/nickstenning/followers","following_url":"https://api.github.com/users/nickstenning/following{/other_user}","gists_url":"https://api.github.com/users/nickstenning/gists{/gist_id}","starred_url":"https://api.github.com/users/nickstenning/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nickstenning/subscriptions","organizations_url":"https://api.github.com/users/nickstenning/orgs","repos_url":"https://api.github.com/users/nickstenning/repos","events_url":"https://api.github.com/users/nickstenning/events{/privacy}","received_events_url":"https://api.github.com/users/nickstenning/received_events","type":"User","site_admin":false},"created_at":"2015-10-05T16:22:42Z","updated_at":"2015-10-05T16:22:42Z","body":"Functionally this looks just fine to me. The only question I have (other than the unminifiedness of the site bundle) is about testing strategy.\r\n\r\nThe swig/extracting sections of the server templates strategy seems to me to be unnecessarily involved and rather brittle. I think it might be clearer to just include some example HTML fixtures in the tests and load those, either just as raw strings in the test suite files or via ajax."}}