├── assets ├── fonts │ ├── FontAwesome.otf │ ├── fontawesome-webfont.eot │ ├── fontawesome-webfont.ttf │ └── fontawesome-webfont.woff ├── js │ ├── bootstrap.js │ ├── namespace.js │ ├── samplelibrary.js │ ├── eventdispatcher.js │ ├── ui │ │ ├── samplepicker.js │ │ ├── transport.js │ │ ├── trackmanager.js │ │ ├── track.js │ │ └── dialogs.js │ ├── channelmanager.js │ ├── pattern.js │ ├── tempo.js │ ├── vendor │ │ ├── jquery.kontrol.min.js │ │ ├── underscore-min.js │ │ └── jquery.selectbox.min.js │ └── channel.js └── css │ ├── reset.css │ ├── dialogs.css │ ├── style.css │ └── font-awesome.min.css ├── content └── audio │ └── 2002DANC │ ├── CLAP.wav │ ├── FX_1.wav │ ├── KIK5.wav │ ├── KK6.wav │ ├── RIM.wav │ ├── SN11.wav │ ├── SN4.wav │ ├── SN_1.wav │ ├── SN_2.wav │ ├── SN_3.wav │ ├── SN_5.wav │ ├── SN_7.wav │ ├── SN_8.wav │ ├── SN_9.wav │ ├── TAMB.wav │ ├── HAT_1.wav │ ├── HAT_2.wav │ ├── HAT_3.wav │ ├── HAT_5.wav │ ├── HAT_6.wav │ ├── HAT_7.wav │ ├── KIK_1.wav │ ├── KIK_10.wav │ ├── KIK_14.wav │ ├── KIK_2.wav │ ├── KIK_3.wav │ ├── KIK_4.wav │ ├── KIK_7.wav │ ├── KIK_8.wav │ ├── KIK_9.wav │ ├── OP_HAT.wav │ ├── RIM__2.wav │ ├── SHAKER.wav │ ├── SN_10.wav │ ├── SN_12.wav │ ├── SN__6.wav │ ├── CL_HAT_2.wav │ ├── CYM_REV.wav │ ├── OP_HAT_2.wav │ ├── OP_HAT_3.wav │ ├── OP_HAT_4.wav │ ├── OP_HAT_5.wav │ ├── OP_HAT_6.wav │ ├── OP_HAT_7.wav │ ├── OP_HAT_8.wav │ ├── OP_HA_8.wav │ ├── RIDE_CYM.wav │ ├── SHAKER_2.wav │ └── SHAKER_3.wav ├── index.html └── README.md /assets/fonts/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/assets/fonts/FontAwesome.otf -------------------------------------------------------------------------------- /content/audio/2002DANC/CLAP.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/CLAP.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/FX_1.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/FX_1.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK5.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK5.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KK6.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KK6.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/RIM.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/RIM.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN11.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN11.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN4.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN4.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_1.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_1.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_3.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_3.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_5.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_5.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_7.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_7.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_8.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_8.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_9.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_9.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/TAMB.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/TAMB.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_1.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_1.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_3.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_3.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_5.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_5.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_6.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_6.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/HAT_7.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/HAT_7.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_1.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_1.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_10.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_10.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_14.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_14.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_3.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_3.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_4.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_4.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_7.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_7.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_8.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_8.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/KIK_9.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/KIK_9.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/RIM__2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/RIM__2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SHAKER.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SHAKER.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_10.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_10.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN_12.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN_12.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SN__6.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SN__6.wav -------------------------------------------------------------------------------- /assets/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/assets/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /assets/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/assets/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /content/audio/2002DANC/CL_HAT_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/CL_HAT_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/CYM_REV.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/CYM_REV.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_3.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_3.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_4.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_4.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_5.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_5.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_6.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_6.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_7.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_7.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HAT_8.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HAT_8.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/OP_HA_8.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/OP_HA_8.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/RIDE_CYM.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/RIDE_CYM.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SHAKER_2.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SHAKER_2.wav -------------------------------------------------------------------------------- /content/audio/2002DANC/SHAKER_3.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/content/audio/2002DANC/SHAKER_3.wav -------------------------------------------------------------------------------- /assets/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/michd/step-sequencer/HEAD/assets/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /assets/js/bootstrap.js: -------------------------------------------------------------------------------- 1 | /*global window: true, document: true*/ 2 | (function (App, $) { 3 | "use strict"; 4 | 5 | var al = '/content/audio/2002DANC/'; 6 | 7 | $(document).ready(function () { 8 | 9 | // INIT ALL THE THINGS 10 | 11 | // Initialize main UI components 12 | App.ui.TrackManager('#sequence', '#trackmanager'); 13 | 14 | App.ui.Transport('#transport'); 15 | 16 | 17 | // Time keeper 18 | App.Tempo(); 19 | 20 | // Keeps all the ons and offs 21 | App.Pattern(); 22 | 23 | // Allow playing some sounds 24 | App.ChannelManager() 25 | .addChannel(al + 'KIK_1.wav') 26 | .addChannel(al + 'CLAP.wav') 27 | .addChannel(al + 'HAT_7.wav') 28 | .addChannel(al + 'SN_2.wav'); 29 | }); 30 | 31 | }(window.STEPSEQUENCER, window.jQuery)); 32 | -------------------------------------------------------------------------------- /assets/js/namespace.js: -------------------------------------------------------------------------------- 1 | /*global window: true */ 2 | (function (global) { 3 | "use strict"; 4 | 5 | var STEPSEQUENCER = typeof global.STEPSEQUENCER !== 'undefined' 6 | ? global.STEPSEQUENCER : {}; 7 | 8 | STEPSEQUENCER.namespace = function (ns_string) { 9 | var 10 | parts = ns_string.split('.'), 11 | parent = STEPSEQUENCER, 12 | i = 0, 13 | iMax = 0; 14 | 15 | if (parts[0] === 'STEPSEQUENCER') { 16 | parts = parts.slice(1); //remove redundant top level namespace 17 | } 18 | 19 | for (i = 0, iMax = parts.length; i < iMax; i += 1) { 20 | if (typeof parent[parts[i]] === 'undefined') { 21 | //only create new object if part does not yet exist 22 | parent[parts[i]] = {}; 23 | } 24 | parent = parent[parts[i]]; 25 | } 26 | 27 | return parent; 28 | }; 29 | 30 | global.STEPSEQUENCER = STEPSEQUENCER; //make app global 31 | 32 | }(window)); -------------------------------------------------------------------------------- /assets/css/reset.css: -------------------------------------------------------------------------------- 1 | * { /* proper box model */ 2 | -moz-box-sizing: border-box; 3 | -webkit-box-sizing: border-box; 4 | box-sizing: border-box; 5 | } 6 | 7 | html, body, div, span, applet, object, iframe, 8 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 9 | a, abbr, acronym, address, big, cite, code, 10 | del, dfn, em, img, ins, kbd, q, s, samp, 11 | small, strike, strong, sub, sup, tt, var, 12 | b, u, i, center, 13 | dl, dt, dd, ol, ul, li, 14 | fieldset, form, label, legend, 15 | table, caption, tbody, tfoot, thead, tr, th, td, 16 | article, aside, canvas, details, embed, 17 | figure, figcaption, footer, header, hgroup, 18 | menu, nav, output, ruby, section, summary, 19 | time, mark, audio, video { 20 | margin: 0; 21 | padding: 0; 22 | border: 0; 23 | font-size: 100%; 24 | font: inherit; 25 | vertical-align: baseline; 26 | } 27 | /* HTML5 display-role reset for older browsers */ 28 | article, aside, details, figcaption, figure, 29 | footer, header, hgroup, menu, nav, section { 30 | display: block; 31 | } 32 | body { 33 | line-height: 1; 34 | } 35 | ol, ul { 36 | list-style: none; 37 | } 38 | blockquote, q { 39 | quotes: none; 40 | } 41 | blockquote:before, blockquote:after, 42 | q:before, q:after { 43 | content: ''; 44 | content: none; 45 | } 46 | table { 47 | border-collapse: collapse; 48 | border-spacing: 0; 49 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Step sequencer 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 |

Step sequencer

15 |
16 | 17 |
18 | 19 | 20 | 21 |
22 | 23 |
24 | 25 |
26 | 27 |
28 | 29 |
30 | 31 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /assets/js/samplelibrary.js: -------------------------------------------------------------------------------- 1 | /*global window: true*/ 2 | (function (App) { 3 | "use strict"; 4 | 5 | var al = '/content/audio/2002DANC/'; 6 | 7 | App.sampleLibrary = [ 8 | 9 | {label: "CLAP", value: al + "CLAP.wav"}, 10 | {label: "CL_HAT_2", value: al + "CL_HAT_2.wav"}, 11 | {label: "CYM_REV", value: al + "CYM_REV.wav"}, 12 | {label: "FX_1", value: al + "FX_1.wav"}, 13 | {label: "HAT_1", value: al + "HAT_1.wav"}, 14 | {label: "HAT_2", value: al + "HAT_2.wav"}, 15 | {label: "HAT_3", value: al + "HAT_3.wav"}, 16 | {label: "HAT_5", value: al + "HAT_5.wav"}, 17 | {label: "HAT_6", value: al + "HAT_6.wav"}, 18 | {label: "HAT_7", value: al + "HAT_7.wav"}, 19 | {label: "KIK_10", value: al + "KIK_10.wav"}, 20 | {label: "KIK_14", value: al + "KIK_14.wav"}, 21 | {label: "KIK_1", value: al + "KIK_1.wav"}, 22 | {label: "KIK_2", value: al + "KIK_2.wav"}, 23 | {label: "KIK_3", value: al + "KIK_3.wav"}, 24 | {label: "KIK_4", value: al + "KIK_4.wav"}, 25 | {label: "KIK5", value: al + "KIK5.wav"}, 26 | {label: "KIK_7", value: al + "KIK_7.wav"}, 27 | {label: "KIK_8", value: al + "KIK_8.wav"}, 28 | {label: "KIK_9", value: al + "KIK_9.wav"}, 29 | {label: "KK6", value: al + "KK6.wav"}, 30 | {label: "OP_HA_8", value: al + "OP_HA_8.wav"}, 31 | {label: "OP_HAT_2", value: al + "OP_HAT_2.wav"}, 32 | {label: "OP_HAT_3", value: al + "OP_HAT_3.wav"}, 33 | {label: "OP_HAT_4", value: al + "OP_HAT_4.wav"}, 34 | {label: "OP_HAT_5", value: al + "OP_HAT_5.wav"}, 35 | {label: "OP_HAT_6", value: al + "OP_HAT_6.wav"}, 36 | {label: "OP_HAT_7", value: al + "OP_HAT_7.wav"}, 37 | {label: "OP_HAT_8", value: al + "OP_HAT_8.wav"}, 38 | {label: "OP_HAT", value: al + "OP_HAT.wav"}, 39 | {label: "RIDE_CYM", value: al + "RIDE_CYM.wav"}, 40 | {label: "RIM__2", value: al + "RIM__2.wav"}, 41 | {label: "RIM", value: al + "RIM.wav"}, 42 | {label: "SHAKER_2", value: al + "SHAKER_2.wav"}, 43 | {label: "SHAKER_3", value: al + "SHAKER_3.wav"}, 44 | {label: "SHAKER", value: al + "SHAKER.wav"}, 45 | {label: "SN_10", value: al + "SN_10.wav"}, 46 | {label: "SN11", value: al + "SN11.wav"}, 47 | {label: "SN_12", value: al + "SN_12.wav"}, 48 | {label: "SN_1", value: al + "SN_1.wav"}, 49 | {label: "SN_2", value: al + "SN_2.wav"}, 50 | {label: "SN_3", value: al + "SN_3.wav"}, 51 | {label: "SN4", value: al + "SN4.wav"}, 52 | {label: "SN_5", value: al + "SN_5.wav"}, 53 | {label: "SN__6", value: al + "SN__6.wav"}, 54 | {label: "SN_7", value: al + "SN_7.wav"}, 55 | {label: "SN_8", value: al + "SN_8.wav"}, 56 | {label: "SN_9", value: al + "SN_9.wav"} 57 | 58 | ]; 59 | 60 | }(window.STEPSEQUENCER)); 61 | -------------------------------------------------------------------------------- /assets/css/dialogs.css: -------------------------------------------------------------------------------- 1 | .overlay { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | height: 100%; 7 | background-color: rgba(0, 0, 0, .5); 8 | } 9 | 10 | .dialog { 11 | position: fixed !important; 12 | top: 5%; 13 | left: 50%; 14 | width: 450px; 15 | margin-left: -225px; 16 | border: solid 3px #1D1F23; 17 | background-color: #282b32; 18 | -webkit-box-shadow: 19 | 0 0 2px 1px rgba(0, 0, 0, .8), 20 | 0 5px 25px 10px rgba(0, 0, 0, 0.25), 21 | 0 -1px 1px rgba(170, 184, 217, 0.15) inset; 22 | box-shadow: 0 0 2px 1px rgba(0, 0, 0, .8), 23 | 0 5px 25px 10px rgba(0, 0, 0, 0.25), 24 | 0 -1px 1px rgba(170, 184, 217, 0.15) inset; 25 | } 26 | 27 | .dialog.ui-draggable { 28 | margin-left: 0; 29 | } 30 | 31 | .dialog.ui-draggable-dragging .dialog-content { 32 | cursor: move; 33 | } 34 | 35 | .dialog .dialog-content { 36 | margin: 4px; 37 | padding: 10px 10px 10px 10px; 38 | font-size: 110%; 39 | } 40 | 41 | .dialog .dialog-content p { 42 | margin-bottom: 20px; 43 | } 44 | 45 | .dialog .dialog-content p:last-child { 46 | margin-bottom: 0; 47 | } 48 | 49 | .dialog .dialog-content input[type=text], 50 | .dialog .dialog-content input[type=password], 51 | .dialog .dialog-content input[type=email], 52 | .dialog .dialog-content input[type=number], 53 | .dialog .dialog-content input[type=pattern], 54 | .dialog .dialog-content input[type=url], 55 | .dialog .dialog-content select, 56 | .dialog .dialog-content textarea { 57 | margin: 5px 0; 58 | display: block; 59 | } 60 | 61 | .dialog .dialog-controls { 62 | padding: 10px 10px 10px; 63 | text-align: center; 64 | } 65 | 66 | .dialog .dialog-controls button { 67 | display: inline-block; 68 | padding: 5px 9px; 69 | min-width: 90px; 70 | } 71 | 72 | .dialog .dialog-controls button:last-child { 73 | margin-right: 0; 74 | } 75 | 76 | 77 | /* Selectbox plugin styling */ 78 | 79 | .selectBox-dropdown { 80 | min-width: 200px; 81 | position: relative; 82 | box-shadow: 0 0 2px 1px rgba(0, 0, 0, .8); 83 | line-height: normal; 84 | padding: 5px 9px; 85 | text-decoration: none; 86 | text-align: left; 87 | outline: none; 88 | vertical-align: middle; 89 | background: #1D1F23; 90 | display: block; 91 | cursor: pointer; 92 | -webkit-transition: all 80ms linear; 93 | transition: all 80ms linear; 94 | } 95 | 96 | .selectBox-dropdown:hover { 97 | text-shadow: 0 0 7px rgba(195, 201, 217, .3); 98 | color: #FFF; 99 | background-color: #1F2125; 100 | } 101 | 102 | .selectBox-dropdown .selectBox-label { 103 | display: inline-block; 104 | white-space: nowrap; 105 | overflow: hidden; 106 | } 107 | 108 | .selectBox-dropdown .selectBox-arrow { 109 | position: absolute; 110 | top: 0; 111 | right: 0; 112 | width: 30px; 113 | height: 100%; 114 | border-left: solid 1px rgba(0, 0, 0, .5); 115 | font-family: 'FontAwesome'; 116 | font-weight: normal; 117 | font-style: normal; 118 | text-decoration: inherit; 119 | -webkit-font-smoothing: antialiased; 120 | text-align: center; 121 | line-height: 30px; 122 | } 123 | 124 | .selectBox-dropdown .selectBox-arrow:before { 125 | content: "\f078"; 126 | text-decoration: inherit; 127 | display: inline-block; 128 | speak: none; 129 | line-height: 100%; 130 | } 131 | 132 | /* Dropdown menu */ 133 | .selectBox-dropdown-menu { 134 | position: absolute; 135 | z-index: 99999; 136 | max-height: 200px; 137 | min-height: 1em; 138 | background: #1D1F23; 139 | box-shadow: 0 1px 2px 1px rgba(0, 0, 0, .8); 140 | overflow: auto; 141 | } 142 | 143 | /* Options */ 144 | .selectBox-options, 145 | .selectBox-options li, 146 | .selectBox-options li a { 147 | list-style: none; 148 | display: block; 149 | cursor: pointer; 150 | padding: 0; 151 | margin: 0; 152 | } 153 | 154 | .selectBox-options li a { 155 | line-height: 1.5; 156 | padding: 0 .5em; 157 | white-space: nowrap; 158 | overflow: hidden; 159 | background: 6px center no-repeat; 160 | -webkit-transition: all 50ms linear; 161 | transition: all 50ms linear; 162 | } 163 | 164 | .selectBox-options li.selectBox-hover a, 165 | .selectBox-options li.selectBox-selected a { 166 | background-color: rgba(195, 201, 217, .25); 167 | } 168 | 169 | 170 | .selectBox-options li.selectBox-selected a { 171 | box-shadow: 0 0px 13px 2px rgba(170, 184, 217, 0.25) inset; 172 | text-shadow: 0 0 7px rgba(195, 201, 217, .5); 173 | } 174 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Step sequencer 2 | ============== 3 | 4 | View the latest version here: [stepseq.michd.me](http://stepseq.michd.me) 5 | 6 | This is meant to be a simple step sequencer using `