empirical-org-archive / empirical-cofactor Goto Github PK

I've been thinking about removing the top navigation bar from contentify. This will make it look much cleaner. I'd still like to give credit to the creator, so we could move some of the key bits of info information (such as how to star or fork the project) to the bottom of the page.

The one problematic issue here is that the only necessary button is the "Documents" button, which enables the user to get back to all of the documents. We need to preserve this button.

We need to set up a Static Site Generator to render the markdown files in the Documentation repo.

Enable users to log in through GitHub, and create a profile page for each user. From this profile page the user can join teams and create a bio.

The goal here is to click on a "sign in" button through GitHub. GitHub reads the username only, and then the user is brought to a profile creation page.

Each contributor belongs to a certain group of teams. For each team, the developer can set their current status (current, alumni, etc) and whether they'd like to subscribe to the team's mailing list.

Read the comments: https://docs.google.com/a/quill.org/drawings/d/1us7AaEnwIUJuhPESJKQQYY6EJuxMjE0k7sFLx8hvGwU/edit

Goal: Reduce the Cofactor menu to a single line and add some new buttons in.

Wireframe:

Details

• Add the "Back" button in Blue. This button returns to the empirical.org/cofactor page.
• Add the "Team Title" button in Green. This button loads a static html page that describes the project.
• In the CMS, each team has a field called "Team Homepage". The homepage field is simply an iframe linked to another page. This page will be an html file uploaded to S3.
• On loading a Cofactor team page, point it to load the homepage field.
• Increase the spacing between the buttons.

As a future detail, we will add a "Join the Team" and "My Profile."

Goal: Set up Heroku Scheduler for various applications.

Details: Heroku Scheduler pings an app every 30 minutes to prevent the free server from going to sleep. Scheduler prevents the 5-10 seconds it takes for the server to start up.

Location:On Heroku -

• Empirical-cofactor
• Empirical-Contentify
• Empirical-huboard

You need to be added as a collaborator on Heroku to complete this issue. Request permission from Peter or Quinn.

Goal: Set up a static site generator to render the documentation repo.

Location: https://github.com/empirical-org/Documentation

Details: We need to set up docs.empirical.org as a static site for our documentation. It is all hosted in a single folder, so it should be easy to set up the repo. The developer who chooses this project can choose to use either Nanoc, Jekyll, or another static site generator.

The cofactor page is too wide. The column should be about 650 pixels wide, it is currently around 950.

Goal: Huboard creates a kanban interface for GitHub issues. We need to change how the URLs are outputted to create direct links to a milestone or label.

Put together a 1 page guide on the best practices in pair programming - software to use, ways to coordinate, etc.

Sites to reference:

letspair.net
pairprogramwith.me has a ton of guides & talks. Draw from these talks for our best practices guide. We want to distill all of the tangible actions.

This is super useful (at least to me): https://github.com/bbatsov/ruby-style-guide

This browser extension would mimic the menu of Cofactor, in Javascript.

http://www.empirical.org/cofactor/teams/compass

This menu would be inserted over the particular Cofactor pages presented to the user.

We need a top menu that links to Docs, Contributors (all members page) and projects.

Later on we will add codex as well.

When a user signs in through GitHub, they are brought to a page where they can fill out their profile.

See details and add comments:
https://docs.google.com/a/quill.org/drawings/d/1ouGc3C7JjkMGWDy8_YTNJ3X2xXJ4QRDvhpUdNOfmCTo/edit

(1) Name: Peter Gault

(2) Image: [email protected] (gravatar email link). 

(3) Start Date: 03 / 07 / 13 (input a date - Can we sort profiles by start date?)

(4) Teams: (checkmark, present all teams)
[X] Homepage
[X] Lesson Design
[  ] Code Review
… (etc.)

(5) Bio: (static text) Peter coordinates the Empirical team. He has been designing educational video games for six years. 

(6) Contributions: (static text, presented as bullet points. It'd be great if these could include links via markdown.)

• Wrote Round 2 Grant Application. 
• Built wireframes for Stories with Friends. 
• Built wireframes for Contributor's system. 
  (Could we say display five results at a time, and then paginate the rest?)

(7) Interests: Designing interactive learning experiences, collaborate learning, board game design, hiking. 

(8) Links: [petergault.com](Personal Website), [hackernews.com/user/gault8121](Hacker News profile).
(These link to personal sites. This can be html or markdown). 

For testing individual branches, automatically create and deploy a server for that branch. This would presumably be handled through Docker, so that each docker image would become a new server.

There are services like RainforestQA and others that I can't find now. The basic idea is that with one click you can deploy a hosted branch.

Use a service like RailReady to produce UML documentation.

http://railroady.prestonlee.com/

Build a landing page that explains all of the functions of Cofactor.

Showcase screenshots (cropped to show one part of the feature) that display each of the functions of the site. Provide a description of each function. Have a nice dotted line guiding the users attention. Start the dotted line at the top.

Body Font:
http://www.google.com/fonts/specimen/Open+Sans

Header Font:
http://www.google.com/fonts/specimen/Libre+Baskerville

Use a system like this to set up a one click deploy. I'm not sure how this interfaces with Docker.

https://github.com/CG-CamSys/oneclick

The goal is to add the cofactor menu to the top of each page that is being referenced.

For example, here all of the pages involved with the Cofactor team:
http://www.empirical.org/cofactor/teams/cofactor

The goal is to use the browser extension to interject this menu, via Javascript, to the top of each page.

Goal: Add a button to the right hand side that enables the user to return to the documents menu

Location:

Return to this page: http://empirical-contentify.herokuapp.com/#/documents/Compass

From: the editor page of the particular document.

Details: We've forked Contentify, an open source tool for collaboratively editing markdown files. We've removed the top loading bar from the page, but we now to re-insert a "Back" button to allow the user to return to the documents list.

Wireframes
Current Page:

New Design:

Add this favicon to all of the empirical.org pages.

https://drive.google.com/file/d/0B-r431ws0zjXRlRhRXV0dEcxV0E/edit?usp=sharing

The "www" looks outdated, can we remove it from the domain masking?

i can't quite figure out what's going on with your issue, but i have a feeling that this may have something to do with it:

setTimeout(function () { setInterval(resizeIframe, 500) }, 100); in your cofactor.js

is there a reason you're doing this rather than just having position:

fixed; top: 55px; bottom: 0px; left: 0; right: 0 for your iframes?

The cofactor page lists all of the teams. As a future project, we'll create a system for providing a hierarchy to the teams. At the moment, given our current size, a simple list will work fine.

A mockup of this page has been built here:
https://docs.google.com/a/quill.org/document/d/1yk4YFKDeLhrQE5sIMvuvBc7JNX04DBN6C5XcXvtjqeo/edit?usp=sharing

This page needs the following features:

1. Single Column layout.
   A single column, with a background, and side padding resembling a traditional page of paper, so that the text box is about 600 pixels wide.

2. Static Text at the top of the page.
   The top of the page should list the title "empirical teams" in a header font and bold, with the description below it, and a line break.

3. Add a description field to the CMS.
   Add a description field to the CMS, which will display below each page. The description field should have HTML or Markdown enabled. On the CMS side, there should be static instructions written below the text input field stating that the field has HTML or Markdown enabled.

4. The Team Title should display in a header font, one header smaller than the Empirical Teams header.
   It should also be bold. This is the link to the particular page.

5. Description text.
   There should be a line break before the and after the description text. Description text is shown below the title.

6. Horizontal Line
   Print a horizontal line, with a line break underneath, and then list the next title.

Contentify does not stay synced with the markdown files in a GitHub repo.

Our contributors system displays all of our contributors per team. This is an empty issue at the moment, and it will be filled in later.

We show all of the user profiles, sorted by team.

Clicking on a name brings up the profile for that person.

Users can scroll through profiles.

It'd be great if this was also responsive, where highlighting a person causes the background color to change.

The header (Where the tab is) should display the name of the team.

Goal: Enable users to share a direct link to a tab within Cofactor

Example: http://www.empirical.org/cofactor/teams/cofactor#chat

Details: For example, a user can share a direct link to the chat tab within the cofactor team.

The support us page serves three purposes:

1. To feature a person who has contributed to Quill.
2. To ask the user to write a short (1-2 sentence) note of thanks to that contributor for building Quill.
3. To ask the user to support us by sharing the current lesson via social media.
4. To donate to Empirical.

To make this work we need to figure out 3 things:

1. First to build our contributor system, so that we can feature them.
2. A form field to send email notes to.
3. We need to figure out how to provide a fair number of share buttons in a tight space. We could use condensed buttons, or to open up the page to more buttons.

For donations, it'd be great if we could support:

1. Paypal donations (standard)
2. Amazon donations (people are comfortable with amazon).
3. Credit card via stripe.
4. Bitcoins?

Issues of concern:

1. We don't want to overwhelm the user with too much information. We may need to separate these 3 support us functions into separate pages?
2. We may want to also include a link to ask the user to join up with the Empirical team. I am not sure where this would go in an already crowded page.
3. We may want to set the "continue" button on a 5 second timer. This would force the person to spend a bit of time looking at the page, rather than just auto clicking through it.

Goal: Set up a static site generator with the following properties:

1. The Content Hierarchy is built from the folder structure.

For example, with Jekyll, the content hierarchy is "Documentation, Glossary, etc." While this can be modified, it is not building the hierarchy structure from the folders themselves.

Bonsai may solve this problem (https://github.com/benschwarz/bonsai/). Essentially the goal is to create a file structure from the folder structure.

So if I have a folder "Compass", and another folder within it called "Metrics". In the site I see along the left hand side a list of all of the folders and files within that folder.

2. An "Up" button for returning to a previous file.
   As you go down the content hierarchy of folders, there should also be a button in the upper left hand corner that takes you back a level.

3. Edit on GitHub button.
   Similar to how ReadTheDocs has a "Edit on GitHub" button, this button takes the user to the corresponding file within GitHub.

See this button in the upper right corner:
http://docxtemplater.readthedocs.org/en/latest/

We want to put together a markdown document that

Requirements:

1. A clear sense of steps
   Let's make sure that at the beginning we lay out what the major steps are. Each step should be mapped.

2. Detailed Instructions
   A detailed guide of each step, with screenshots if need be.

3. A comments section for each guide.
   This is the killer feature. We want to have a comments section for each guide, either via a Discourse Forum, or a Google Groups Mailing List, or something else, but one dedicated explicitly to this page. We want to create focused comments around each particular step.

Goal: Host all of our applications through Docker.

Details: We'd like to move all of our applications to Docker images. It'd be great if we could pull together a team of 3 people that have experience with Docker.

Lobsters is a rails app that provides a hacker news/reddit style link sharing interface. We are going to install lobsters, and use it to share links related to the team. For example, for the docker setup, we will share links about articles and blog posts about setting up docker containers.

For this project, we'd like to have someone with a DevOps background who can figure out how to install this software on a PaaS site.

Here is some advice about how to install a Lobsters clone on Heroku:
https://lobste.rs/s/g765vk/tips_for_launching_a_lobsters_clone