@decidables/detectable-elements 0.2.16 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/README.md +150 -14
  3. package/lib/detectableElements.esm.js +4431 -3677
  4. package/lib/detectableElements.esm.js.map +1 -1
  5. package/lib/detectableElements.esm.min.js +839 -538
  6. package/lib/detectableElements.esm.min.js.map +1 -1
  7. package/lib/detectableElements.umd.js +4421 -3666
  8. package/lib/detectableElements.umd.js.map +1 -1
  9. package/lib/detectableElements.umd.min.js +840 -539
  10. package/lib/detectableElements.umd.min.js.map +1 -1
  11. package/package.json +6 -6
  12. package/src/components/detectable-control.js +8 -6
  13. package/src/components/detectable-response.js +24 -0
  14. package/src/components/index.js +4 -3
  15. package/src/components/roc-space.js +15 -11
  16. package/src/components/sdt-model.js +101 -98
  17. package/src/components/sdt-parameters.js +163 -0
  18. package/src/equations/dc2far.js +28 -7
  19. package/src/equations/dc2hr.js +29 -7
  20. package/src/equations/facr2far.js +19 -3
  21. package/src/equations/hfa2ppv.js +19 -3
  22. package/src/equations/hm2hr.js +19 -3
  23. package/src/equations/hmfacr2acc.js +31 -5
  24. package/src/equations/hrfar2c.js +29 -5
  25. package/src/equations/hrfar2d.js +29 -5
  26. package/src/equations/mcr2fomr.js +19 -3
  27. package/src/examples/double-interactive.js +1 -1
  28. package/src/examples/human.js +221 -89
  29. package/src/examples/interactive.js +226 -88
  30. package/src/examples/model.js +222 -97
  31. package/src/examples/multiple.js +1 -1
package/src/equations/dc2far.js CHANGED
@@ -48,9 +48,9 @@ export default class SDTEquationDC2Far extends SDTEquation {
48
48
  constructor() {
49
49
  super();
50
50
  this.unequal = false;
51
- this.d = 0;
52
- this.c = 0;
53
- this.s = 1;
51
+ this.d = SDTMath.d.DEFAULT;
52
+ this.c = SDTMath.c.DEFAULT;
53
+ this.s = SDTMath.s.DEFAULT;
54
54
  this.alignState();
55
55
  }
56
56
 
@@ -99,22 +99,43 @@ export default class SDTEquationDC2Far extends SDTEquation {
99
99
  let far;
100
100
  if (this.numeric) {
101
101
  d = html`
102
- <decidables-spinner class="d bottom" ?disabled=${!this.interactive} step=".001" .value="${this.d}" @input=${this.dInput.bind(this)}>
102
+ <decidables-spinner class="d bottom"
103
+ ?disabled=${!this.interactive}
104
+ step=${SDTMath.d.STEP}
105
+ .value=${this.d}
106
+ @input=${this.dInput.bind(this)}
107
+ >
103
108
  <var class="math-var">d′</var>
104
109
  </decidables-spinner>
105
110
  `;
106
111
  c = html`
107
- <decidables-spinner class="c bottom" ?disabled=${!this.interactive} step=".001" .value="${this.c}" @input=${this.cInput.bind(this)}>
112
+ <decidables-spinner class="c bottom"
113
+ ?disabled=${!this.interactive}
114
+ step=${SDTMath.c.DEFAULT}
115
+ .value=${this.c}
116
+ @input=${this.cInput.bind(this)}
117
+ >
108
118
  <var class="math-var">c</var>
109
119
  </decidables-spinner>
110
120
  `;
111
121
  s = html`
112
- <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
122
+ <decidables-spinner class="s bottom"
123
+ ?disabled=${!this.interactive}
124
+ min=${SDTMath.s.MIN}
125
+ step=${SDTMath.s.STEP}
126
+ .value=${this.s}
127
+ @input=${this.sInput.bind(this)}
128
+ >
113
129
  <var class="math-var">σ</var>
114
130
  </decidables-spinner>
115
131
  `;
116
132
  far = html`
117
- <decidables-spinner class="far bottom" disabled min="0" max="1" step=".001" .value="${+this.far.toFixed(3)}">
133
+ <decidables-spinner class="far bottom"
134
+ disabled min="0"
135
+ max="1"
136
+ step=".001"
137
+ .value=${+this.far.toFixed(3)}
138
+ >
118
139
  <var>False Alarm Rate</var>
119
140
  </decidables-spinner>
120
141
  `;
package/src/equations/dc2hr.js CHANGED
@@ -48,9 +48,9 @@ export default class SDTEquationDC2Hr extends SDTEquation {
48
48
  constructor() {
49
49
  super();
50
50
  this.unequal = false;
51
- this.d = 0;
52
- this.c = 0;
53
- this.s = 1;
51
+ this.d = SDTMath.d.DEFAULT;
52
+ this.c = SDTMath.c.DEFAULT;
53
+ this.s = SDTMath.s.DEFAULT;
54
54
  this.alignState();
55
55
  }
56
56
 
@@ -99,22 +99,44 @@ export default class SDTEquationDC2Hr extends SDTEquation {
99
99
  let hr;
100
100
  if (this.numeric) {
101
101
  d = html`
102
- <decidables-spinner class="d bottom" ?disabled=${!this.interactive} step=".001" .value="${this.d}" @input=${this.dInput.bind(this)}>
102
+ <decidables-spinner class="d bottom"
103
+ ?disabled=${!this.interactive}
104
+ step=${SDTMath.d.STEP}
105
+ .value=${this.d}
106
+ @input=${this.dInput.bind(this)}
107
+ >
103
108
  <var class="math-var">d′</var>
104
109
  </decidables-spinner>
105
110
  `;
106
111
  c = html`
107
- <decidables-spinner class="c bottom" ?disabled=${!this.interactive} step=".001" .value="${this.c}" @input=${this.cInput.bind(this)}>
112
+ <decidables-spinner class="c bottom"
113
+ ?disabled=${!this.interactive}
114
+ step=${SDTMath.c.STEP}
115
+ .value=${this.c}
116
+ @input=${this.cInput.bind(this)}
117
+ >
108
118
  <var class="math-var">c</var>
109
119
  </decidables-spinner>
110
120
  `;
111
121
  s = html`
112
- <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
122
+ <decidables-spinner class="s bottom"
123
+ ?disabled=${!this.interactive}
124
+ min=${SDTMath.s.MIN}
125
+ step=${SDTMath.s.STEP}
126
+ .value=${this.s}
127
+ @input=${this.sInput.bind(this)}
128
+ >
113
129
  <var class="math-var">σ</var>
114
130
  </decidables-spinner>
115
131
  `;
116
132
  hr = html`
117
- <decidables-spinner class="hr bottom" disabled min="0" max="1" step=".001" .value="${+this.hr.toFixed(3)}">
133
+ <decidables-spinner class="hr bottom"
134
+ disabled
135
+ min="0"
136
+ max="1"
137
+ step=".001"
138
+ .value=${+this.hr.toFixed(3)}
139
+ >
118
140
  <var>Hit Rate</var>
119
141
  </decidables-spinner>
120
142
  `;
package/src/equations/facr2far.js CHANGED
@@ -78,17 +78,33 @@ export default class SDTEquationFaCr2Far extends SDTEquation {
78
78
  let far;
79
79
  if (this.numeric) {
80
80
  fa = html`
81
- <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
81
+ <decidables-spinner class="fa"
82
+ ?disabled=${!this.interactive}
83
+ min="0"
84
+ .value=${this.fa}
85
+ @input=${this.faInput.bind(this)}
86
+ >
82
87
  <var>False Alarms</var>
83
88
  </decidables-spinner>
84
89
  `;
85
90
  cr = html`
86
- <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
91
+ <decidables-spinner class="cr"
92
+ ?disabled=${!this.interactive}
93
+ min="0"
94
+ .value=${this.cr}
95
+ @input=${this.crInput.bind(this)}
96
+ >
87
97
  <var>Correct Rejections</var>
88
98
  </decidables-spinner>
89
99
  `;
90
100
  far = html`
91
- <decidables-spinner class="far" disabled min="0" max="1" step=".001" .value="${+this.far.toFixed(3)}">
101
+ <decidables-spinner class="far"
102
+ disabled
103
+ min="0"
104
+ max="1"
105
+ step=".001"
106
+ .value=${+this.far.toFixed(3)}
107
+ >
92
108
  <var>False Alarm Rate</var>
93
109
  </decidables-spinner>
94
110
  `;
package/src/equations/hfa2ppv.js CHANGED
@@ -78,17 +78,33 @@ export default class SDTEquationHFa2Ppv extends SDTEquation {
78
78
  let ppv;
79
79
  if (this.numeric) {
80
80
  h = html`
81
- <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
81
+ <decidables-spinner class="h"
82
+ ?disabled=${!this.interactive}
83
+ min="0"
84
+ .value=${this.h}
85
+ @input=${this.hInput.bind(this)}
86
+ >
82
87
  <var>Hits</var>
83
88
  </decidables-spinner>
84
89
  `;
85
90
  fa = html`
86
- <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
91
+ <decidables-spinner class="fa"
92
+ ?disabled=${!this.interactive}
93
+ min="0"
94
+ .value=${this.fa}
95
+ @input=${this.faInput.bind(this)}
96
+ >
87
97
  <var>False Alarms</var>
88
98
  </decidables-spinner>
89
99
  `;
90
100
  ppv = html`
91
- <decidables-spinner class="ppv" disabled min="0" max="1" step=".001" .value="${+this.ppv.toFixed(3)}">
101
+ <decidables-spinner class="ppv"
102
+ disabled
103
+ min="0"
104
+ max="1"
105
+ step=".001"
106
+ .value=${+this.ppv.toFixed(3)}
107
+ >
92
108
  <var>Positive Predictive Value</var>
93
109
  </decidables-spinner>
94
110
  `;
package/src/equations/hm2hr.js CHANGED
@@ -78,17 +78,33 @@ export default class SDTEquationHM2Hr extends SDTEquation {
78
78
  let hr;
79
79
  if (this.numeric) {
80
80
  h = html`
81
- <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
81
+ <decidables-spinner class="h"
82
+ ?disabled=${!this.interactive}
83
+ min="0"
84
+ .value=${this.h}
85
+ @input=${this.hInput.bind(this)}
86
+ >
82
87
  <var>Hits</var>
83
88
  </decidables-spinner>
84
89
  `;
85
90
  m = html`
86
- <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
91
+ <decidables-spinner class="m"
92
+ ?disabled=${!this.interactive}
93
+ min="0"
94
+ .value=${this.m}
95
+ @input=${this.mInput.bind(this)}
96
+ >
87
97
  <var>Misses</var>
88
98
  </decidables-spinner>
89
99
  `;
90
100
  hr = html`
91
- <decidables-spinner class="hr" disabled min="0" max="1" step=".001" .value="${+this.hr.toFixed(3)}">
101
+ <decidables-spinner class="hr"
102
+ disabled
103
+ min="0"
104
+ max="1"
105
+ step=".001"
106
+ .value=${+this.hr.toFixed(3)}
107
+ >
92
108
  <var>Hit Rate</var>
93
109
  </decidables-spinner>
94
110
  `;
package/src/equations/hmfacr2acc.js CHANGED
@@ -107,27 +107,53 @@ export default class SDTEquationHMFaCr2Acc extends SDTEquation {
107
107
 
108
108
  if (this.numeric) {
109
109
  h = html`
110
- <decidables-spinner class="h" ?disabled=${!this.interactive} min="0" .value="${this.h}" @input=${this.hInput.bind(this)}>
110
+ <decidables-spinner class="h"
111
+ ?disabled=${!this.interactive}
112
+ min="0"
113
+ .value=${this.h}
114
+ @input=${this.hInput.bind(this)}
115
+ >
111
116
  <var>Hits</var>
112
117
  </decidables-spinner>
113
118
  `;
114
119
  m = html`
115
- <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
120
+ <decidables-spinner class="m"
121
+ ?disabled=${!this.interactive}
122
+ min="0"
123
+ .value=${this.m}
124
+ @input=${this.mInput.bind(this)}
125
+ >
116
126
  <var>Misses</var>
117
127
  </decidables-spinner>
118
128
  `;
119
129
  fa = html`
120
- <decidables-spinner class="fa" ?disabled=${!this.interactive} min="0" .value="${this.fa}" @input=${this.faInput.bind(this)}>
130
+ <decidables-spinner class="fa"
131
+ ?disabled=${!this.interactive}
132
+ min="0"
133
+ .value=${this.fa}
134
+ @input=${this.faInput.bind(this)}
135
+ >
121
136
  <var>False Alarms</var>
122
137
  </decidables-spinner>
123
138
  `;
124
139
  cr = html`
125
- <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
140
+ <decidables-spinner class="cr"
141
+ ?disabled=${!this.interactive}
142
+ min="0"
143
+ .value=${this.cr}
144
+ @input=${this.crInput.bind(this)}
145
+ >
126
146
  <var>Correct Rejections</var>
127
147
  </decidables-spinner>
128
148
  `;
129
149
  acc = html`
130
- <decidables-spinner class="acc" disabled min="0" max="1" step=".001" .value="${+this.acc.toFixed(3)}">
150
+ <decidables-spinner class="acc"
151
+ disabled
152
+ min="0"
153
+ max="1"
154
+ step=".001"
155
+ .value=${+this.acc.toFixed(3)}
156
+ >
131
157
  <var>Accuracy</var>
132
158
  </decidables-spinner>
133
159
  `;
package/src/equations/hrfar2c.js CHANGED
@@ -50,7 +50,7 @@ export default class SDTEquationHrFar2C extends SDTEquation {
50
50
  this.unequal = false;
51
51
  this.hr = 0;
52
52
  this.far = 0;
53
- this.s = 1;
53
+ this.s = SDTMath.s.DEFAULT;
54
54
  this.alignState();
55
55
  }
56
56
 
@@ -99,22 +99,46 @@ export default class SDTEquationHrFar2C extends SDTEquation {
99
99
  let c;
100
100
  if (this.numeric) {
101
101
  hr = html`
102
- <decidables-spinner class="hr bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.hr}" @input=${this.hrInput.bind(this)}>
102
+ <decidables-spinner class="hr bottom"
103
+ ?disabled=${!this.interactive}
104
+ min="0"
105
+ max="1"
106
+ step=".001"
107
+ .value=${this.hr}
108
+ @input=${this.hrInput.bind(this)}
109
+ >
103
110
  <var>Hit Rate</var>
104
111
  </decidables-spinner>
105
112
  `;
106
113
  far = html`
107
- <decidables-spinner class="far bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.far}" @input=${this.farInput.bind(this)}>
114
+ <decidables-spinner class="far bottom"
115
+ ?disabled=${!this.interactive}
116
+ min="0"
117
+ max="1"
118
+ step=".001"
119
+ .value=${this.far}
120
+ @input=${this.farInput.bind(this)}
121
+ >
108
122
  <var>False Alarm Rate</var>
109
123
  </decidables-spinner>
110
124
  `;
111
125
  s = html`
112
- <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
126
+ <decidables-spinner class="s bottom"
127
+ ?disabled=${!this.interactive}
128
+ min=${SDTMath.s.MIN}
129
+ step=${SDTMath.s.STEP}
130
+ .value=${this.s}
131
+ @input=${this.sInput.bind(this)}
132
+ >
113
133
  <var class="math-var">σ</var>
114
134
  </decidables-spinner>
115
135
  `;
116
136
  c = html`
117
- <decidables-spinner class="c bottom" disabled step=".001" .value="${+this.c.toFixed(3)}">
137
+ <decidables-spinner class="c bottom"
138
+ disabled
139
+ step=${SDTMath.c.MIN}
140
+ .value=${+this.c.toFixed(3)}
141
+ >
118
142
  <var class="math-var">c</var>
119
143
  </decidables-spinner>
120
144
  `;
package/src/equations/hrfar2d.js CHANGED
@@ -50,7 +50,7 @@ export default class SDTEquationHrFar2D extends SDTEquation {
50
50
  this.unequal = false;
51
51
  this.hr = 0;
52
52
  this.far = 0;
53
- this.s = 1;
53
+ this.s = SDTMath.s.DEFAULT;
54
54
  this.alignState();
55
55
  }
56
56
 
@@ -99,22 +99,46 @@ export default class SDTEquationHrFar2D extends SDTEquation {
99
99
  let d;
100
100
  if (this.numeric) {
101
101
  hr = html`
102
- <decidables-spinner class="hr bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.hr}" @input=${this.hrInput.bind(this)}>
102
+ <decidables-spinner class="hr bottom"
103
+ ?disabled=${!this.interactive}
104
+ min="0"
105
+ max="1"
106
+ step=".001"
107
+ .value=${this.hr}
108
+ @input=${this.hrInput.bind(this)}
109
+ >
103
110
  <var>Hit Rate</var>
104
111
  </decidables-spinner>
105
112
  `;
106
113
  far = html`
107
- <decidables-spinner class="far bottom" ?disabled=${!this.interactive} min="0" max="1" step=".001" .value="${this.far}" @input=${this.farInput.bind(this)}>
114
+ <decidables-spinner class="far bottom"
115
+ ?disabled=${!this.interactive}
116
+ min="0"
117
+ max="1"
118
+ step=".001"
119
+ .value=${this.far}
120
+ @input=${this.farInput.bind(this)}
121
+ >
108
122
  <var>False Alarm Rate</var>
109
123
  </decidables-spinner>
110
124
  `;
111
125
  s = html`
112
- <decidables-spinner class="s bottom" ?disabled=${!this.interactive} min="0" step=".001" .value="${this.s}" @input=${this.sInput.bind(this)}>
126
+ <decidables-spinner class="s bottom"
127
+ ?disabled=${!this.interactive}
128
+ min="0"
129
+ step=".001"
130
+ .value=${this.s}
131
+ @input=${this.sInput.bind(this)}
132
+ >
113
133
  <var class="math-var">σ</var>
114
134
  </decidables-spinner>
115
135
  `;
116
136
  d = html`
117
- <decidables-spinner class="d bottom" disabled step=".001" .value="${+this.d.toFixed(3)}">
137
+ <decidables-spinner class="d bottom"
138
+ disabled
139
+ step=${SDTMath.d.STEP}
140
+ .value=${+this.d.toFixed(3)}
141
+ >
118
142
  <var class="math-var">d′</var>
119
143
  </decidables-spinner>
120
144
  `;
package/src/equations/mcr2fomr.js CHANGED
@@ -78,17 +78,33 @@ export default class SDTEquationMCr2Fomr extends SDTEquation {
78
78
  let fomr;
79
79
  if (this.numeric) {
80
80
  m = html`
81
- <decidables-spinner class="m" ?disabled=${!this.interactive} min="0" .value="${this.m}" @input=${this.mInput.bind(this)}>
81
+ <decidables-spinner class="m"
82
+ ?disabled=${!this.interactive}
83
+ min="0"
84
+ .value=${this.m}
85
+ @input=${this.mInput.bind(this)}
86
+ >
82
87
  <var>Misses</var>
83
88
  </decidables-spinner>
84
89
  `;
85
90
  cr = html`
86
- <decidables-spinner class="cr" ?disabled=${!this.interactive} min="0" .value="${this.cr}" @input=${this.crInput.bind(this)}>
91
+ <decidables-spinner class="cr"
92
+ ?disabled=${!this.interactive}
93
+ min="0"
94
+ .value=${this.cr}
95
+ @input=${this.crInput.bind(this)}
96
+ >
87
97
  <var>Correct Rejections</var>
88
98
  </decidables-spinner>
89
99
  `;
90
100
  fomr = html`
91
- <decidables-spinner class="fomr" disabled min="0" max="1" step=".001" .value="${+this.fomr.toFixed(3)}">
101
+ <decidables-spinner class="fomr"
102
+ disabled
103
+ min="0"
104
+ max="1"
105
+ step=".001"
106
+ .value=${+this.fomr.toFixed(3)}
107
+ >
92
108
  <var>False Omission Rate</var>
93
109
  </decidables-spinner>
94
110
  `;
package/src/examples/double-interactive.js CHANGED
@@ -5,7 +5,7 @@ import SDTExample from './sdt-example';
5
5
 
6
6
  /*
7
7
  SDTExample_DoubleInteractive element
8
- <sdt-example-interactive>
8
+ <sdt-example-double-interactive>
9
9
  */
10
10
  export default class SDTExampleDoubleInteractive extends SDTExample {
11
11
  connectedCallback() {