Score setup and basic functionality #1

Merged

stecha merged 15 commits from dresche/bach-violin-project:master into master

2024-01-26 09:24:11 +00:00

dresche commented

2024-01-23 09:29:58 +00:00

Contributor

To get these changes on your computer, run:

git pull
git submodule update --init --recursive
npm install
npm run dev

And the open http://localhost:3000 in your browser.

Have a look on the ~/content/pieces directory. Here is for each piece a small configuration file so you can display them later on as a list on the website.

The ~/layout/default.vue is the basic grid setup for the website. I added a gray header and footer for you. You can improve them yourself. Also have a look to ~/components/TheHeader.vue, ~/components/TheFooter.vue, ~/components/TheNavigation.vue.

In the ~/pages/ directory you can find a file for each page of the website. They directory structure will be used in the URL of the website. In ~/pages/pieces/[id|.vue the [id] is a dynamic route parameter where you can pass the filename of the pieces that you can find in ~/content/pieces/… but without the .yaml extension.

In the same file you can find a computed property formattedScore where you can manipulate the score and turn on and off all the options the we discussed. I added two of the options for you. The rest we can work in the following weeks.

Also note that the directory bach-solo-violin-sonatas-partitas is now a git submodule that is directly included into your project. So whenever you change the scores in the bach-solo-violin-sonatas-partitas git repository you need to run the git submodule update --recursive command to get the newest scores into your project website as well.

To get these changes on your computer, run: ``` git pull git submodule update --init --recursive npm install npm run dev ``` And the open `http://localhost:3000` in your browser. Have a look on the `~/content/pieces` directory. Here is for each piece a small configuration file so you can display them later on as a list on the website. The `~/layout/default.vue` is the basic grid setup for the website. I added a gray header and footer for you. You can improve them yourself. Also have a look to `~/components/TheHeader.vue`, `~/components/TheFooter.vue`, `~/components/TheNavigation.vue`. In the `~/pages/` directory you can find a file for each page of the website. They directory structure will be used in the URL of the website. In `~/pages/pieces/[id|.vue` the `[id]` is a dynamic route parameter where you can pass the filename of the pieces that you can find in `~/content/pieces/…` but without the `.yaml` extension. In the same file you can find a computed property `formattedScore` where you can manipulate the score and turn on and off all the options the we discussed. I added two of the options for you. The rest we can work in the following weeks. Also note that the directory `bach-solo-violin-sonatas-partitas` is now a git submodule that is directly included into your project. So whenever you change the scores in the `bach-solo-violin-sonatas-partitas` git repository you need to run the `git submodule update --recursive` command to get the newest scores into your project website as well.

dresche added 14 commits

2024-01-23 09:29:59 +00:00