Design improved posting interface

[cjlee112]

The current interface has several annoyances:

• multiple buttons (Discuss, Recommend, Must-Read) for essentially the same action
• just pushes user to Google+ Post dialog, not an ideal place for writing a long post with latex etc.
• selectedpapers.net can't see the post until it gets it from Google+ update polling, which can take up to 15 minutes.

We should consider ways of streamlining this process, such as

• having our own submission form, where users can write a post directly on the selectedpapers.net page
• provide preview of how the post will look (useful when typing latex)
• get rid of redundant buttons, e.g. just have checkboxes or menu for choosing Discuss vs. Recomend etc.
• add the post to spnet database immediately upon submission, rather than waiting for it to come back from G+ updates.

[cjlee112]

Issues #24 and #37 included some discussion of these ideas.

[cjlee112]

Good news. I discovered that G+ has added a JS call that enables us to dynamically create interactive posts for Google+ (whereas previously we were restricted to static content that was locked at the time of page-load). I tested it successfully, by creating a JS helper function:

function makeButton(container, pretext)
{
  var options = {
    contenturl: ' {{- paper.get_value() -}} ',
    clientid: ' {{- gplusClientID -}} ',
    cookiepolicy: 'single_host_origin',
    prefilltext: pretext,
    calltoactionlabel: 'VIEW',
    calltoactionurl: ' {{- paper.get_value() -}} '
  };
  gapi.interactivepost.render(container, options);
}

And then tested it by adding a couple buttons to the _templates/get_paper.html page:

<button id="testShare">
Test Me
</button>
<button onclick="makeButton('testShare', document.forms['topicForm']['topic'].value)">
Make the button</button>

I typed some text into the topic text box, clicked Make the Button, then Test Me, and up came the G+ share dialog with my text correctly inserted.

[mqlaql]

That's great. Obviously, this doesn't solve rendering issues of LaTeX in Google+ but makes really easy to share a review. What does this posted message look like? Do you like the idea of using a snippet as default (editable, of course) without LaTeX describing what the review is about and add some appropriate tags? Then you can fetch further activity such as comments to the shared post.

About the submission form, you know what I think. I'd like to see I nice text editor with Markdown support, preview, autosave, similar to what Stack Exchange uses. This removes quite a few issues:

1. LaTeX and markdown support (issue #24)
2. No need to handle Google+ inconsistencies and reshares (issue #10 and #21)
3. Synchronization issues. Everything is saved in the database immediately (issue #20)
4. SelectedPaper's content is always sanitized. Fetched content from external sources is also sanitized but some safeguards are still necessary.

[cjlee112]

Seems like there are good Python modules for supporting markdown (e.g. Markdown) and sanitization (e.g. Bleach), so that part seems easy. Since Google+ doesn't support straight markdown, we'd have some work to convert markdown to a form acceptable to Google+. This all seems pretty easy and very worthwhile, so it should be one of our top priorities.

Are there other formats (or markdown variants) people would prefer over markdown? I find it slightly less intuitive (e.g. the "four spaces" rule) than restructured text but it seems better supported and more widely used.

[marcharper]

Markdown is much simpler than restructured text (and I believe was inspired by it). Markdown also has javascript parsers, which will be useful for live "preview" functions in-browser. I don't think such a thing exists for restructured text.

I've made a live previewer in the past (a few years ago) that plays well with latex, and can confirm that it's not that hard to do. I can likely dig out that code for spnet usage.

[cjlee112]

@mqlaql I think this feature is our next priority, and you seemed to have great ideas about how to do this best. I'd love to work with you on this. Are you interested?

[mqlaql]

@cjlee112 Sure. Do you need help with the submission form or with a particular aspect of this feature?

[cjlee112]

@mqlaql I tried to contact you on Google+; to begin with I think it would be helpful to just be able to chat about the best overall design, since it seems like you have good ideas about this. Could we perhaps talk briefly on Skype or Google+ or whatever?