regardscitoyens/the-law-factory

Track the french law-making process

La Fabrique de la Loi / The Law Factory

Web frontend developed for The Law Factory project: http://www.LaFabriqueDeLaLoi.fr

Data backend API code is available on repository https://github.com/RegardsCitoyens/the-law-factory-parser

Installation

• Checkout the project from git:

    git clone https://github.com/regardscitoyens/the-law-factory.git
    cd the-law-factory

• Configure the aplication by copying public/config.js.example as public/config.js and set the API Url to the path on which you serve the data directory of RegardsCitoyens:the-law-factory-parser.git. Optionnally set also there your google analytics id and host.

    cp public/config.js{.example,}
    vi public/config.js

• Serve the public directory on a webserver

• for instance, to run locally on http://localhost:8001

  cd public
  python -m SimpleHTTPServer 8001

Production setup

A sample Apache configuration is given in the conf directory.

To reduce browser request counts per page, you may build a production version that uses concatenated versions of scripts and stylesheets by running make and make install from the repository root. In this case you will want to serve the prod directory instead.

Notes:

• if you haven't created public/config.js yet, it will be copied from public/config.js.example
• you have to run make and make install again if you make any changes to the public/config.js file
• you may run make clean to return the tree to its original, fresh-from-git-repository state, but leaves the prod directory.

Credits

This work is supported by a public grant overseen by the French National Research Agency (ANR) as part of the "Investissements d'Avenir" program within the framework of the LIEPP center of excellence (ANR11LABX0091, ANR 11 IDEX000502).

the-law-factory's Issues

[mod2b] Define colors for other groups

we need colors for :

• presidence
• gouvernement
• rapporteurs
• auditionnes

In Chrome, fulltext zone gets shifted to the right when zoom/scroll

In Chrome/Chromium, after having zoomed just a little bit on the page within the browser, when we scroll down to the top of the fulltext article zone, the zone strangely gets shifted to the right

Adapt js library diff.js to get a better display of diffs (later if time)

It seems the algorithm is not perfect, we should see in the long term whether it can be improved or tuned

Examples:

• art 1 bis in Assemblee Hémicycle : the piece "du secteur public is moved around in the text but the diff displays it wrong
  
• art 11 Senat Commission : the diff should only show "en concertation avec la société civle" in green while "recherche" and the final dot should not be there in red and green (probably due to a detection of diffs only on spaces instead of also punctuation characters)

Allow to switch between different steps from the steps bar

• The steps bar at the top should present all steps of the bill and those having has_admendments as True in procedure.json from API should be clickable to present the corresponding data (a uniq url per bill at a step would be preferable rather than only a dynamic load on the same page)
• Also remember to display start and end dates of the step in some way as was proposed in the touch and feel document -enddate of a step will come soon in procedure.json cf regardscitoyens/the-law-factory-parser#4 )

stages

stages should be positionned correctly

The final goal is probably to use icons to represent the different steps.

For now please use the step identification/code provided in the data or some abbreviation.

Allow to switch between different texts with dropdown

Now the API is there, we need to be able to juggle from one text to another within the BILL page to see other texts
Reminder : the url of the csv with all texts proposed is http://www.lafabriquedelaloi.fr/api/dossiers_promulgues.csv
We will provide it as json as well soon

[mod2b] Display word counts of speaker in a right aligned column

within the text zone, in the list of seakers, align the numbers on the right as a simple table

rollover on article boxes

please add articles information on rollover :

• article number specified in article title (the actual value, not the order which should be used but never displayed)
• number of modifications (%?)
  ...
• other ?

Uniformize legends

• The bottom legend should order the groups in the same order given for the streams on both mod 2 and 2b
• The colors should be consistent from the legend to the division bars and amendments in mod 2 and 2b
• Full names of groups should be displayed in module 2 and 2b ( acronyms could be displayed only on the viz mouseover)
• The legend of mod2 should also display the codes for the status icons
• Clicking/unclicking an element on the legend should select approprate parts of the viz
• mod1 should display a similar legend with examples of articles in depot, add, suppr, small modif and big modif

Allow to realign sections horizontally for better readability of all steps

It's difficult to retrieve from which section an article belongs.

This comes from the pile of length-changing articles. This changing height is helpful to represent the amount of words in each steps, but logically causes the sections to be disaligned.
Maybe some kind of alternate rows switching background between grey and white following the stages of a section could help visually.

Another option should be proposed where the articles would be vertically aligned by section.
The pile of articles of each sections would start (y position) below the line of the highest pile of articles of the previous section.
This would also help in making the oblique lines between the stages of an article more readable.

If it's possible to switch from one version to another, it would be ideal.

title of the steps and text displayed

Currently the title of the steps are confusing for CMP commission, senat hemicycle and the text displayed for CMP commission is CMP, CMP, commission and for the senate is CMP senat hemicycle. CMP implies "commission" (it's Commission Mixte Paritiare), so CMP should be enough. Second CMP, CMP, Commission as text doesn't make a lot of sense.

Allow grouping amendments of all sections of a bill at a step

It would be really nice to be able to display the amendments also altogether without the separation per article as a switch mode. (or grouped per section?)

Fix order of articles

We should use the order info from the articles data in module 1 to display the articles in the right order in module 2.
Articles additionnel avant/après articles xxx should be placed before/after the corresponding article
Same thing for "Division additionnelle" which are new sections before or after existing ones

This will be added to the amendments data to make it easier for the interface to respect the right display order.

First version of module 0

Display all the steps of all bills based on http://www.lafabriquedelaloi.fr/api/dossiers_promulgues.csv

display diff in article fulltext zone

With a simple text diff calculation with the previous step version of anarticle, we could show the diff information inside the article fulltext box with classic color code (barred red for removed bold green for added).

There are many libraries to calculate and represent a diff.
We can help you on this if you need, just ask.

Load lighter data and load jsdiff in textzone dynamically on click

Big texts are going to be too heavy for the client otherwise, data will be updated to do so

Improve the search

If we decide to keep the pop on everything search module, we should use all the space we have to title it, provide a few samples of what can be searched, and give extra info on the bills found

Also the search should be made blurred to allow getting results with bad accents for instance (eg "hopital" should match "projet de loi de réforme de l'hôpital")

section titles as articles

The titles of the sections of a bill can sometimes be modified at different stages.
To reflect that, a section should be added as a (maybe visually different) article box at the top of its articles for each stage of the visu.

article fulltext zone scroll

article 38 for instance is far too big to be visualized this way.

We should add a scroll bar inside the article full text zone (with max height ?)

[mod1] Fix broken alignment of chapters in some cases

example with pjl09-344

[mod2b] Add onmouseover infos + keyboard arrows control in mod2b

Allow to switch between temporal and quanti views

Use the top right drop button to allow switching between

Data generation script

Please provide the script in the repository, if no script done yet, document the recipe in a markdown file

Add colors legend

A legend should be added to indicate what does each color mean.

Display a loader on a blank viz to better handle heavy data

By default the viz zone and the textzone should at least be empty with a regular size.
Some animated loading element should display within each chile data is loading.

Text for sections is miscentered in Firefox

probably due to a too much recent CSS markup used

Links between modules

• Below the step bar should be displayed direct links to mod2 & 2b when available cf #43
• In mod1's text zone when an article was modified a link to the amendment module focused on the corresponding article should be added
• In mod 2 and 2b there should be a way to get back to the mod1

article boxes colors

About the article boxes color code : grey/green/red/white

Green/red attract the eye on articles which may not be the most importantly modified ones.

Maybe we could use a heatmap style defining the colours on a define scale of intensity depending on the scale of modifications ?
for instance colourfull red for high volume of modifications, light red for small amounts of modification...

red and green could still be used on the lateral sides of the boxes to show when articles are added/removed (see isssue #2 )

any other ideas are welcome.

Fix and generalize the button to scroll down in the text zone on the right

Right now the button (present only in amendments) is not clickable and does not display nor functions very well. It is a good idea though and could be:

• fixed :)
• made clickable
• added also reverted on the top of the zone
• used also in the module 1 for the article text zone

Fine style adjustments in module 1

• the title of the bill should always be displayed
• missing space in the title of the rollover boxes
• the white text on pink zones is not completely readable, maybe some other colors could be tried out and the text put in bold ?
• some kind of right-padding on the header zone makes the page always larger than the dispayed window (bottom rollbar)
• maybe the info displayed in the rollover zone (section id and name for instance) could be displayed as well in the article fulltext title zone
• grey separation lines between article boxes (links between two steps, and horizontal separation between two articles at the same step) should be a little bit darker/thicker to be properly seen

Allow to select a step to compare all the others to

Since often the senate is bypassed by the assembly which in the end forgets all of the senate's modifications to get back to its previous version, it would scientifically be really nice to be able to select a step (for instance by checking a box under the step title) which would make all the boxes color adapt to the diff with this specific version. The diff in the fulltext zone would then also be applied in diff with this specific version

Handle representation of different information on amendments

As proposed initially, the colors of the displayed amendments should be changeable to display different information on amendments :

• status (a color code should reflect the status : adopted as green, etc)
• political group (data to be added in the files, colorcode can be found here http://cpc.regardscitoyens.org/trac/browser/cpc/trunk/project/config/app.yml.example#L31 line 31 and followings )
• other ideas ?

Grouping boxes by color as proposed initially will also certainly be interesting.

Group/ungroup options as left button instead of dropdown menu

In both modules 1 & 2, the grouping option should be proposed in the left bar under the title ETAPES as some kind of open/closed arrows for instance or such to signify what it is doing

Add intervention flowchart part for each step

data to come soon cf regardscitoyens/the-law-factory-parser#2

make the text diff column as a slide push

it might be interesting to give a try to put the text diff column as a slide push like on this demo page :

http://tympanus.net/Blueprints/SlidePushMenus/

It would offer a way to profit of the whole width of the window to display the legislative process scheme to may it less dense. On clicking on an article/amendment then the column would appear on the side, creating a slight "wow!" effect and an optimization of window space.

First stage appears last under Firefox

As showed in the confcall, the first stage strangely shows up last in Firefox (tried on v.25)

Uniformize textzone display on mod 1/2/2b

The textzone on the right in mod 1 & 2/2b should be consistent from one module to another in terms of size, sticking and overflow

article boxes heights

the minimum size of the article boxes should be set to a bigger value so that shortest articles can still be browsable and clickable

To avoid too long pages, setting a maximum height could be considered although it may hurt the interpretation quality of the result? Maybe a squareroot or logarithmic rule could be more effective?

Allow to switch between actual text and textdiff of an article in textzone

display added/removed articles

Find a way to graphically signify that an article was added at the current stage or removed at the following one.

For instance we could add a red or green bar on the vertical edge of the article box to signify the creation or disappearance of an article.

Steps bar should display more info on the steps

Right now it's really hard to read it and we need to know when we are at which stage, not only institution and step (cf data).

The way it works is actually hierarchical, so we could probably display it as such:

                        1ère lecture                    |                   CMP             
              Assemblée        |        Sénat           |     CMP    |  Sénat    | Assemblée
dépot | commission | hémicycle | commission | hémicycle | commission | hémicycle | hémicycle

Or either find a way to display all of that information to really distinguish the big stages of the process.

All the data is there to do that.

Also, the part of the code who does this should be refactored between the two modules in public/js/directives.js

Allow to switch between different steps within the steps bar

• The steps bar at the top should present all steps of the bill and those having has_admendments as True in procedure.json from API should be clickable to present the corresponding data (a uniq url per bill at a step would be preferable rather than only a dynamic load on the same page)
• Also remember to display start and end dates of the step in some way as was proposed in the touch and feel document

Full text search in articles

Could be very nice to be able to search a bunch of keywords in the articles.
The result of the search could be shown by highlighting blocks which contains the searched keywords. The lightness of the color used to highlight blocks could vary according to the density of keywords.

navigate with keyboard (advanced)

we could use the keyboard keys :
right left : move allong the line of modifications of one article from one stage to another
up down : move from article after the other in one stage

Link back to all steps from one step

And reciprocally provide a link to the one step part from module 1.
(In the step bar and/or the text zone?)

Height of divisions titles on the left needs to be adapted in amendment viz

Sometimes, the text in the legend on the left is too long and the text is divided into multiple lines, making the amendments data lines shifted from the list of divisions (articles and so on).
The previous option to cut the text and add ... whenever we're bigger than some size seems appropriate if a popover gives the full text on rollover. Otherwise amendments lines need to be multiplied in such cases.

Also it looks to me like there is a slight shift all along , probably one or two pixels extra somewhere being propagated

Variable grey color for article boxes function of the amount of modifications

The article boxes should be white to dark grey on a scale varying along with the percentage of modifications of the article at the corresponding step

Clean informative content in the articles text

Elements such as "(Texte du Sénat)" or "(Texte de la CMP)" should be removed from the articles text data since it creates a lot of visualized diffs who are actually not real differences. We'll work on it in the coming weeks along with the API serving.

article fulltext zone position

the article full text box's top should always be visible when scrolling down the visualisation so that the text can be read

article fulltext zone content

add :

• the correct title of the article ("Article 7 bis A" for instance) in the title zone instead of the order value
• the breaklines between the different alineas (the text data should be converted to html)