https://www.npmjs.com/package/github-oauth

Because more sustainable (free) when scaling up while oauth-io would require to pay extra fees at some point.

Mockups : https://marvelapp.com/16ja5ag/screen/17484098

New font sets : Source Sans and Source Code (full fonts sets)

• validate mockups

• rationalize classes of visual objects and invariant parameters

• implement

In addition to the current mockups, to reduce and normalize the number of font sizes and gutter sizes, and to think through responsive rules for medium and small screens.

In mapping mode -> create a new slide -> make any change of view (pan/zoom) -> the "take snapshot" button is not present while it should be

Currently in ui branch - does not make sense.

Reimplement couchdb (currently commented) to avoid loosing one's work when refreshing page accidentally.

New active / active presentation

const presentationModel = {
metadata: {},
datasets: { // datasets as a dict of data sources
  datauuid: {
    metadata: {},
    data: [] // the data itself, as provided by user (json or raw string if xml-like or other)
  }
},
views: {
[uuid]: {
  metadata: {},
  dataset: [uuid],
  viewParameters: [], // view parameters - will be used as a basis that can be overriden
  viewDataMap: [] // data-to-vis transformations
}
}
}

New story model is identical to active story as always.

Slide data model

const slideData = {
 views: {
uuid: {
  dataset: [uuid],
  viewParameters: [], // view parameters - will be used as a basis that can be overriden
  viewDataMap: [] // data-to-vis transformations
}
}
}

What if

... a user changes the visualization type (and therefore render slides view params and data mappings irrelevant) of one of the view ?

... a user starts a visualization with two views, then edits the presentation settings and delete one of the two views ?

... a user wants to use the same data mapping / view param settings for several consequent slides ?

Changes must be directly mirrored in the related vis.

Must not be redundant with components displayed in new presentation/edit presentation modal.

For a cleaner code, and in prevision of migration of the bulgur-reader code.

OPtion 1 is Timeline JS3 project : https://github.com/NUKnightLab/TimelineJS3

It does not have any npm package as such.

Solution 2 is to build a new timeline lib for react.

Main questions to solve :

• how to expose data mapping options out of gexf-like data ?

• how to consistently handle both graphml and gexf data formats ?

presentation-editing related part of the state tree should be a dict object of objects representing each a story. This way it could be more easily envisaged to manage temp storing of active presentations with pouchdb and partially persistent state.

e.g. timeline + map

For now there is one draft instance for each slide in the active presentation.

This is problematic for use cases with a lot of slides.

Using a quinoa-server instance.

Should be able to update if working with an existing presentation.

Bulgur composition app requires far more dependencies than it should when used for readonly. And the player should be usable as a dependency in other apps like fonio. In addition, this is going to be problematic when integrating bulgur documents inside other apps.

Structure of this component :

- Visualization container
-- Visualizations components (one way controlled - can be configured when setting a slide state)
- Navbar
-- Navbar content
-- Navbar toggle (visible when navbar is closed)
- Legend container
-- Previous slide button
-- (user-generated) html contents
-- Next slide button

In all-in-one html, the code could be reduced to that component + a footer.

Like in : https://marvelapp.com/16ja5ag/screen/17495635

Continuing to dig in react-visjs, the main changes to make are :

• add categorization through colors

• go vertically

• add periods handling

Now that readonly is automatized as a service, code can be cleaned with this.

•  save/parse gist url or id when working with projects' json
• export to github > get or create gist

•  add a "parameters" step : colors, label sizes, ...
•  display edition parameters (e.g. automatic or manual snapshots) in new story dialog ?

Requires to be able to start over if needed - or display a modal to work on the previous project

When exporting to html, in the index.html building module, dynamically build strong metadata in opengraph, twitter and dublincore metadata formats with metadata available about the presentation and the datasets.

• storybook

... as other invariant parameters than inputData->visData mapping may be provided

Must be clean in terms of dependencies.

Must be tweakable at least in terms of

• spatialization settings
• nodes categorization

• being able to plug quinoa's reducer inside a wider redux logic

• being able to have a read-only mode for components

• being able to customize fields and appareance of slides

• automatic coloration of "items"

• display a legend for each item

What about very big/long slides ?

What about images in slides ?

Should slides miniatures be editable all the time ?

When building presentation metadata out of new story dialog, do not translate data directly but keep it layered

Dissociate bulgur components that have to be reused in separate mini-project modules.

quinoa-vis

First the quinoa-visualizations module which must provide with visualization components wappers for timeline, graph and map visualizations.

They all must feature the same API and functionnalities :

• controllable and declarative state representation
• user-triggered change listeners (pan, zoom, ...)
• possibility to allow/disallow interactivity

quinoa-player

Then the quinoa-player component which is composed with quinoa-visualizations modules and allows to display a readonly presentation. This component will be used both for preview in bulgur, as a standalone codebase for exports, and as a dependency in fonio.

Parameters :

• possibility in a specific instance of the player to lock/unlock visualizations navigation
• mode of interaction (scroll / buttons) and parameters

Actions :

• next/previous/jump to slide
• open/close the summary pannel
• lock/unlock visualization navigation

The (s)css code must be highly customizable.

Structure of this component :

- Visualization container
-- Visualizations components (one way controlled - can be configured when setting a slide state)
- Navbar
-- Navbar content
-- Navbar toggle (visible when navbar is closed)
- Legend container
-- Previous slide button
-- (user-generated) html contents
-- Next slide button

In all-in-one html, the code could be reduced to that component + a footer.

!! don't forget to have a server-storage-id prop for the version of the presentation synced with server.

Todo :

• modal mechanism
• story's json file output (and input as new story)
• standalone html file output
• github.io website generation through oAuth (next level)