Repository files navigation

The Creative Commons License Chooser is meant to help people learn about CC licenses, and select the license that best fits their needs. The new version in this repo places greater importance on usability, and an educational experience of the six CC licenses.

Repository containing the source code for the new Creative Commons License Chooser.

This site is built using HTML, CSS, and JS.

CODE_OF_CONDUCT.md:

The Creative Commons team is committed to fostering a welcoming community.This project and all other Creative Commons open source projects are governedby ourCode of Conduct. Please report unacceptablebehavior toconduct@creativecommons.orgper ourreporting guidelines.

SeeCONTRIBUTING.md.

All necessary files to bundle or run the Chooser are located within the/src directory.

• /src/index.html: relevant HTML markup.
• /src/style.css: localized styles, built on top ofVocabulary.
• /src/scripts.js: relevant JavaScript logic.

The Chooser exists bundled within thevocabulary-theme repository for production purposes. This repository is for isolated development purposes, similar to the setup followed bycc-legal-tools-app +cc-legal-tools-data, andindex-prototype.

Once changes are implemented here, they need to be updated within the/chooser directory withinvocabulary-theme.

Final production changes are deployed within vocabulary-theme Releases, updated withinindex-dev-env, and finally deployed toindex__stage and thenindex__prod environments; going LIVE athttps://creativecommons.org/chooser.

For information on learning and installing the prerequisite technologies for this project, please seeFoundational technologies — Creative Commons Open Source.

1. open thesrc/index.html file within a browser to view the Chooser.

Run the following command to format files with Prettier:

docker compose run node prettier --write src/

## Or alternatively, if docker compose run is slow to rundocker compose up --detachdocker composeexec node prettier --write src/docker compose down

The initial markup is rendered via theindex.html file. Visual display is derived from thestyle.css rules. Styles extend fromsrc/vocabulary.

On initialization thescripts.js functions set the correct fieldsets to default display; based on user provided actions through the stepper fieldsets will display or hide, exposing the relevant pathways to getting atool recommendation. Correct pathways are located within therawStatePathRoutes array. When a correct pathway matches the currentstate, the appropriatetool is matched and recommended, if the current state is not a known pathway thetool is set tounknown until the required input is given.

The maintool recommendation content is pulled via the appropriate<template> markup located within HTML. Additional information for the marking formats is also sourced from these<template> elements and the contents of theAttribution Details fields.

Marking formats are pulled from a combination of HTML markup and JS string interpolation found within thescripts.js file within therenderMarkingFormats function.