strin / sharead

Open-source collaborative paper reading tool
5 stars 1 forks source link

MVP0.2: Collaborative PDF Reader #2

Open strin opened 8 years ago

strin commented 8 years ago
larryxiao commented 8 years ago

Design for Comments (Draft)

Building a comment component.

Background

Currently we have pdf (paper) converted to html using pdf2htmlEX. It parses the pdf file and generates css, html and javascript. The html is the pdf decomposed into the pieces of text or pictures it has. The css records all possible style related info about the pieces (font, line spacing, relative position to page etc.). The pieces are labeled using the styles from css, so they are unique. The pdf provides animation for scrolling and other functionalities.

Design

image

Options

Backend

Use redisdb for storage, data model:

threads {
  paperid
  threadid, used to locate all posts
  meta data {
    pos, position in paper (can be used for on demand loading)
    npost, number of posts (can be used for preview)
  }
}

comments {
  threadid
  commentid
  usedid
  text
  datetime
}

Frontend

The comments section is a side pane, it can be toggled by user.

When rendering, we give a hint on the pdf indicating it has comments somewhere, user can click/mouseover and open/see preview of it. When the side pane is toggled, we also indicate how threads correspond to original texts (simultaneous highlight or a line connecting the two).

For commenting, user can add reply to existing threads. Or click on the pdf to create a new thread. We can use a global listener, and identify the element clicked jquery.event.target, use the xpath or css selector as ID for thread.

Discussions

strin commented 8 years ago

Cool. Awesome design. I say let's just integrate medium.js and see how it works.

larryxiao commented 8 years ago

Ok let me try to make a fast prototype.

strin commented 8 years ago

Cool. I kind of want to keep our effort minimal. Some higher barrier stuff is more interesting. Let's wrap this up and build something for our own daily uses.