35 |
51 | );
52 | }
53 |
--------------------------------------------------------------------------------
/src/components/UI/SelectBox.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2022 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | import styled from "styled-components";
25 |
26 | const Select = styled.select`
27 | width: 100%;
28 | height: 35px;
29 | background: white;
30 | color: gray;
31 | padding: 0 5px;
32 | font-size: 14px;
33 | border: none;
34 | margin-right: 10px;
35 | border-radius: 7px;
36 |
37 | option {
38 | color: black;
39 | background: white;
40 | display: flex;
41 | white-space: pre;
42 | min-height: 20px;
43 | padding: 0px 2px 1px;
44 | }
45 | `;
46 |
47 | type SelectBoxProps = {
48 | title: string,
49 | items: object,
50 | onChange: ( event: any ) => void,
51 | selected?: string
52 | };
53 |
54 | /**
55 | * @param {String} title of select box
56 | * @param {Object} items key value pairs of all options to display
57 | * @param {Function} onChange handler to fire when option is selected
58 | * @param {String=} selected name of the optionally selected option key
59 | */
60 | export default function SelectBox({ title, items, onChange, selected = "" }: SelectBoxProps ) {
61 |
62 | return (
63 |
74 | );
75 | };
76 |
--------------------------------------------------------------------------------
/src/model/Note.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2015-2022 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | export default class Note {
25 | note : string;
26 | octave : number;
27 | offset : number;
28 | duration : number;
29 | measure : number;
30 |
31 | constructor( note: string, octave: number, offset: number, duration: number, measure: number ) {
32 | this.note = note;
33 | this.octave = octave;
34 | this.offset = offset; // offset within the sequence
35 | this.duration = duration; // length of the note
36 | this.measure = measure; // measure the Note belongs to
37 | }
38 |
39 | clone(): Note {
40 | return new Note( this.note, this.octave, this.offset, this.duration, this.measure );
41 | }
42 |
43 | equals( compareNote: Note ): boolean {
44 | if ( compareNote === this ) {
45 | return true;
46 | }
47 |
48 | return compareNote.note === this.note &&
49 | compareNote.octave === this.octave &&
50 | compareNote.offset === this.offset &&
51 | compareNote.duration === this.duration &&
52 | compareNote.measure === this.measure;
53 | }
54 |
55 | overlaps( compareNote: Note ): boolean {
56 | if ( compareNote === this ) {
57 | return false;
58 | }
59 |
60 | return compareNote.note === this.note &&
61 | compareNote.octave === this.octave &&
62 | compareNote.offset === this.offset &&
63 | compareNote.measure === this.measure;
64 | }
65 | }
66 |
--------------------------------------------------------------------------------
/src/model/Pattern.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2015 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | import Note from "./Note";
25 |
26 | export default class Pattern
27 | {
28 | name : string;
29 | notes : ArraySample compositions
36 |-
37 | {
38 | COMPOSITIONS.map( composition =>
39 |
- onSelect( composition ) }
42 | key={ composition.name }
43 | >
44 |
{ composition.name }
45 |{ composition.description }
46 |
47 | )
48 | }
49 |
32 |
70 | );
71 | }
72 |
--------------------------------------------------------------------------------
/src/definitions/samples.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2022 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | import { CompositionSource } from "../interfaces/CompositionSource";
25 |
26 | export const DEFAULT_COMPOSITION: CompositionSource = {
27 | name: "Default",
28 | description: "Something to set the mood. Ascending the C minor scale.",
29 | timeSigBeatAmount: 4,
30 | timeSigBeatUnit: 4,
31 | tempo: 120,
32 | scale: "C,D,D#,F,G,G#,A#",
33 | note1Length: 2,
34 | note2Length: 0.5,
35 | patternLength: 16,
36 | patternAmount: 8,
37 | octaveLower: 2,
38 | octaveUpper: 7,
39 | uniqueTrackPerPattern: false
40 | };
41 |
42 | export const COMPOSITIONS: Array
33 |
64 |
69 | What's this?
34 |
35 |
63 | 36 | The Molecular Music Generator (MMG) uses a simple algorithm to generate 37 | musical patterns which can be fed to hardware or software instruments. 38 |
39 |40 | The algorithm is based on "the Molecular Music Box" by Duncan Lockerby. 41 |
42 |43 | The rules for the algorithm are as follows: 44 |
45 |-
46 |
- Two different note lengths need to be defined, e.g. "4" and "3" (in quarter notes) 47 |
- a scale needs to be defined, e.g. C major (the white keys on a piano), let's say we start on the E note, the list of notes will then contain : E, F, G, A, B, C 48 | a pattern length needs to be defined, e.g. 4 bars 49 |
- The algorithm will then function like so (keeping the above definitions in mind): 50 |
- The first note of the scale (E) is played at the length of the first defined note length (4) 51 |
- Each time the duration of the played note has ended, the next note in the scale (F) is played 52 |
- Once the first pattern length has been reached (4 bars), a new pattern will start 53 |
- The previously "recorded" pattern will loop its contents indefinitely while the new patterns are created / played 54 |
- When a newly played note sounds simultaneously with another note from a PREVIOUS pattern, the note length will change (in above example from 4 to 3) 55 |
- This will be the new note length to use for all subsequent added notes, until another simultaneously played note is found, leading it to switch back to the previous note length (in above example, back to 4) 56 |
- As the pattern is now played over an existing one, it is likely that notes will be played in unison, leading to the switching of note length 57 |
- As more patterns accumulate, a perfectly mathematical pattern of notes are weaving in and out of the notes of the other patterns 58 |
60 | Experimenting with different note lengths, scales or even time signatures can lead to interesting results! 61 |
62 |
110 |
116 |
122 |
132 | );
133 | }
134 | };
135 |
--------------------------------------------------------------------------------
/src/App.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2022 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | import { useState, useEffect } from "react";
25 | import { ToastContainer, toast } from "react-toastify";
26 | import CompositionsList from "./components/CompositionsList/CompositionsList";
27 | import Form from "./components/Form/Form";
28 | import Info from "./components/Info/Info";
29 | import Player from "./components/Player/Player";
30 | import { DEFAULT_COMPOSITION } from "./definitions/samples";
31 | import { CompositionSource, ScaledCompositionSource } from "./interfaces/CompositionSource";
32 | import { createComposition } from "./services/CompositionService";
33 | import { createMIDI } from "./services/MidiService";
34 | import { saveAsFile } from "./services/FileService";
35 | import { getCompositionName } from "./utils/StringUtil";
36 |
37 | import "react-toastify/dist/ReactToastify.css";
38 | import "./App.scss";
39 | import "./styles/_mixins.scss";
40 |
41 | // not part of the Composition model, but a data structure used to easily select a scale in the Form
42 |
43 | function App() {
44 |
45 | const [ data, setData ] = useState({
46 | ...DEFAULT_COMPOSITION,
47 | scaleSelect: { note: "C", name: "" }
48 | });
49 |
50 | const [ hasChanges, setHasChanges ] = useState( true );
51 | const [ composition, setComposition ] = useState( null );
52 | const [ midi, setMidi ] = useState( null );
53 |
54 | // directly generate composition once data has been submitted (or on request)
55 |
56 | const generateComposition = ( optComposition?: CompositionSource ) => {
57 | try {
58 | setComposition( createComposition( optComposition || data ));
59 | setHasChanges( false );
60 | } catch ( error ) {
61 | toast( `Error "${error}" occurred during generation of composition. Please verify input parameters and try again.` );
62 | }
63 | };
64 |
65 | // directly generate MIDI once composition has been created
66 |
67 | useEffect( () => {
68 | async function generateMIDI() {
69 | try {
70 | if ( composition ) {
71 | composition && setMidi( await createMIDI( composition ));
72 | }
73 | } catch ( error ) {
74 | toast( `Error "${error}" occurred during generation of MIDI file. Please verify input parameters and try again.` );
75 | }
76 | }
77 | generateMIDI();
78 | }, [ composition ]);
79 |
80 |
81 | const handleChange = ( data: ScaledCompositionSource ) => {
82 | setData( data );
83 | setHasChanges( true );
84 | };
85 |
86 | const handleCompositionSelect = ( composition: CompositionSource ) => {
87 | setData({ ...composition, scaleSelect: { note: "", name: "" } });
88 | setHasChanges( false );
89 | generateComposition( composition );
90 | };
91 |
92 | const downloadMIDI = () => {
93 | const fileName = `composition_${getCompositionName( data )}.mid`;
94 | saveAsFile( midi, fileName );
95 | toast( `MIDI file "${fileName}" generated successfully.` );
96 | };
97 |
98 | return (
99 | { this.state.measure + 1 }:{ this.state.beat + 1 }:1
125 |
131 |
100 |
101 |
126 |
145 | );
146 | }
147 | export default App;
148 |
--------------------------------------------------------------------------------
/src/services/CompositionService.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * The MIT License (MIT)
3 | *
4 | * Copyright (c) 2015-2022 Igor Zinken
5 | *
6 | * Permission is hereby granted, free of charge, to any person obtaining a copy
7 | * of this software and associated documentation files (the "Software"), to deal
8 | * in the Software without restriction, including without limitation the rights
9 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
10 | * copies of the Software, and to permit persons to whom the Software is
11 | * furnished to do so, subject to the following conditions:
12 | *
13 | * The above copyright notice and this permission notice shall be included in all
14 | * copies or substantial portions of the Software.
15 | *
16 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
17 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
18 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
19 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
20 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
21 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
22 | * SOFTWARE.
23 | */
24 | import { CompositionSource } from "../interfaces/CompositionSource";
25 | import Pattern from "../model/Pattern";
26 | import Note from "../model/Note";
27 | import Composition from "../model/Composition";
28 | import { getMeasureDurationInSeconds } from "../utils/AudioMath";
29 |
30 | export const createComposition = ( props: CompositionSource ): Composition => {
31 |
32 | const out: Composition = new Composition(
33 | props.timeSigBeatAmount,
34 | props.timeSigBeatUnit,
35 | props.tempo,
36 | props.patternLength,
37 | props.patternAmount
38 | );
39 |
40 | // --- COMPOSITION
41 |
42 | let pattern = new Pattern( "melody" );
43 | out.patterns.push( pattern );
44 |
45 | let currentPosition = 0;
46 | let currentBarLength = 0;
47 | let noteLength = props.note1Length;
48 |
49 | const patterns: Array
102 | 
103 |
105 |
103 | Molecular Music Generator
104 |
106 |
125 |
107 |
124 | Generate/select a composition and press play / the spacebar to toggle playback
108 |
109 |
115 |
121 |
123 |
127 |
136 |
128 |
135 |
137 |
143 | 138 | This is an open source tool by igorski.nl. Transport icons designed by 139 | www.wishforge.games 140 | on freeicons.io. 141 |
142 |