control-panel - npm Package Compare versions

Comparing version 1.2.0 to 1.3.0

components/container.js

@@ -9,5 +9,5 @@ var css = require('dom-css')
     position: 'relative',
-    height: '25px'
+    minHeight: '25px'
   })
   return container
 }

example.js

@@ -20,5 +20,6 @@ var control = require('./')
   {type: 'select', label: 'key/value select', options: {state1: 'State One', state2: 'State Two'}, initial: 'state1'},
-  {type: 'select', label: 'array select', options: ['State One', 'State Two'], initial: 'State One'}
+  {type: 'select', label: 'array select', options: ['State One', 'State Two'], initial: 'State One'},
+  {type: 'multibox', label: 'multiple checkboxes', names: ['box1', 'box2', 'box3'], colors: ['rgb(100,220,100)', 'rgb(100,120,230)', 'rgb(210,100,190)'], initial: [true, false, true, true]}
 ],
-  {theme: 'light', title: 'example panel', position: 'top-left', width: 400}
+  {theme: 'dark', title: 'example panel', position: 'top-left', width: 400}
 )
@@ -28,2 +29,3 @@
   console.log(data)
+  console.log(panel.state)
 })

index.js

@@ -33,2 +33,3 @@ var EventEmitter = require('events').EventEmitter
   var checkboxcss = fs.readFileSync(path.join(__dirname, 'components', 'styles', 'checkbox.css'))
+  var multiboxcss = fs.readFileSync(path.join(__dirname, 'components', 'styles', 'multibox.css'))
   var buttoncss = fs.readFileSync(path.join(__dirname, 'components', 'styles', 'button.css'))
@@ -46,2 +47,6 @@ var intervalcss = fs.readFileSync(path.join(__dirname, 'components', 'styles', 'interval.css'))
     .replace(new RegExp('{{ UUID }}', 'g'), id)
+  multiboxcss = String(multiboxcss)
+    .replace(new RegExp('{{ BOX_COLOR }}', 'g'), opts.theme.background2)
+    .replace(new RegExp('{{ ICON_COLOR }}', 'g'), opts.theme.foreground1)
+    .replace(new RegExp('{{ UUID }}', 'g'), id)
   buttoncss = String(buttoncss)
@@ -68,2 +73,3 @@ .replace(new RegExp('{{ BUTTON_COLOR }}', 'g'), opts.theme.text2)
   insertcss(checkboxcss)
+  insertcss(multiboxcss)
   insertcss(buttoncss)
@@ -105,2 +111,3 @@ insertcss(intervalcss)
     checkbox: require('./components/checkbox'),
+    multibox: require('./components/multibox'),
     color: require('./components/color'),
@@ -133,3 +140,5 @@ interval: require('./components/interval'),
 
+  self.state = state
+
   opts.root.appendChild(box)
 }

package.json

 {
   "name": "control-panel",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "embeddable panel of inputs for parameter setting",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -10,3 +10,3 @@ # control-panel
 
-**[live demo](http://control-panel.surge.sh)**
+**[`LIVE DEMO`](http://control-panel.surge.sh)**
 
@@ -52,2 +52,3 @@ [![themes](images/themes.png)](http://control-panel.surge.sh)
   {type: 'select', label: 'select one', options: ['option 1', 'option 2'], initial: 'option 1'}
+  {type: 'multibox', label: 'check many', count: 3, initial: [true, false, true]}
 ], 
@@ -76,2 +77,3 @@ {theme: 'light', position: 'top-right'}
 - Inputs of type `select` can specify a list of options, either as an `Array` (in which case the value is the same as the option text) or as an object containing key/value pairs (in which case the key/value pair maps to value value/label pairs).
+- Inputs of type `multibox` can specify a number of checkboxes, either by providing a `count` or a list of `names` from which the number will be inferred, in which case the color of each box and a text name can also be provided as lists `colors` and `names`
 
@@ -93,2 +95,7 @@ The following optional parameters can also be passed as `opts`
 
+#### see also
+
+- [oui](https://github.com/wearekuva/oui)
+- [datgui](https://github.com/dataarts/dat.gui)
+
 [npm-image]: https://img.shields.io/badge/npm-v1.2.0-lightgray.svg?style=flat-square
@@ -95,0 +102,0 @@ [npm-url]: https://npmjs.org/package/control-panel

No alert changes

Improved metrics

Total package byte prevSize

94590

increased by4.55%

Number of package files

32

increased by6.67%

Lines of code

1277

increased by9.15%

Number of lines in readme file

102

increased by7.37%

No dependency changes