@@ -5,119 +5,120 @@ import { EventType } from './EventType';
55 * @class ArrayElement
66 *
77 * This class is a store of arrays of objects of one type.
8- *
8+ *
99 * @property {String } provider - The provider for data
1010 *
1111 * @example
1212 * <js-array provider="provider"></js-array>
1313 */
1414export class ArrayElement extends LitElement {
15- #data = new Array ( ) ;
16- #newdata = new Array ( ) ;
17- #provider = null ;
15+ #data = [ ] ;
1816
19- static get localName ( ) {
20- return 'js-array' ;
21- }
17+ #newdata = [ ] ;
2218
23- static get properties ( ) {
24- return {
25- provider : { type : String , reflect : true } ,
26- select : { type : String , reflect : true } ,
27- } ;
28- }
19+ #provider = null ;
2920
30- firstUpdated ( ) {
31- // Set up a listener for data changes
32- this . addEventListener ( EventType . CHANGE , ( ) => {
33- this . requestUpdate ( ) ;
34- } ) ;
35- }
21+ static get localName ( ) {
22+ return 'js-array' ;
23+ }
3624
37- render ( ) {
38- return html `< div > Array contains ${ this . length } ${ this . provider } </ div > ` ;
39- }
25+ static get properties ( ) {
26+ return {
27+ provider : { type : String , reflect : true } ,
28+ select : { type : String , reflect : true } ,
29+ } ;
30+ }
4031
41- attributeChangedCallback ( name , oldVal , newVal ) {
42- super . attributeChangedCallback ( name , oldVal , newVal ) ;
43- if ( name === 'provider' ) {
44- this . #providerChanged ( newVal , oldVal ) ;
45- }
46- }
32+ firstUpdated ( ) {
33+ // Set up a listener for data changes
34+ this . addEventListener ( EventType . CHANGE , ( ) => {
35+ this . requestUpdate ( ) ;
36+ } ) ;
37+ }
4738
48- get length ( ) {
49- return this . #data . length ;
50- }
39+ render ( ) {
40+ return html ` < div > Array contains ${ this . length } elements, provider= ${ this . provider } </ div > ` ;
41+ }
5142
52- at ( index ) {
53- return this . #data[ index ] ;
43+ attributeChangedCallback ( name , oldVal , newVal ) {
44+ super . attributeChangedCallback ( name , oldVal , newVal ) ;
45+ if ( name === 'provider' ) {
46+ this . #providerChanged( newVal , oldVal ) ;
5447 }
48+ }
5549
56- #providerChanged( newVal , oldVal ) {
57- if ( oldVal != null && this . #provider && newVal !== oldVal ) {
58- this . #provider. removeEventListener ( EventType . FETCH , this . #providerFetch. bind ( this ) ) ;
59- this . #provider. removeEventListener ( EventType . OBJECT , this . #providerObject. bind ( this ) ) ;
60- this . #provider. removeEventListener ( EventType . DONE , this . #providerDone. bind ( this ) ) ;
61- this . #provider = null ;
62- }
63- if ( newVal != null && newVal !== oldVal ) {
64- this . #provider = document . querySelector ( newVal ) ;
65- if ( this . #provider) {
66- this . #provider. addEventListener ( EventType . FETCH , this . #providerFetch. bind ( this ) ) ;
67- this . #provider. addEventListener ( EventType . OBJECT , this . #providerObject. bind ( this ) ) ;
68- this . #provider. addEventListener ( EventType . DONE , this . #providerDone. bind ( this ) ) ;
69- } else {
70- throw new Error ( `Provider "${ newVal } ) ;
71- }
72- }
73- }
50+ get length ( ) {
51+ return this . #data. length ;
52+ }
53+
54+ at ( index ) {
55+ return this . #data[ index ] ;
56+ }
7457
75- #providerFetch( ) {
76- // Reset the data container
77- this . #newdata = new Array ( ) ;
58+ #providerChanged( newVal , oldVal ) {
59+ if ( oldVal != null && this . #provider && newVal !== oldVal ) {
60+ this . #provider. removeEventListener ( EventType . FETCH , this . #providerFetch. bind ( this ) ) ;
61+ this . #provider. removeEventListener ( EventType . OBJECT , this . #providerObject. bind ( this ) ) ;
62+ this . #provider. removeEventListener ( EventType . DONE , this . #providerDone. bind ( this ) ) ;
63+ this . #provider = null ;
7864 }
65+ if ( newVal != null && newVal !== oldVal ) {
66+ this . #provider = document . querySelector ( newVal ) ;
67+ if ( this . #provider) {
68+ this . #provider. addEventListener ( EventType . FETCH , this . #providerFetch. bind ( this ) ) ;
69+ this . #provider. addEventListener ( EventType . OBJECT , this . #providerObject. bind ( this ) ) ;
70+ this . #provider. addEventListener ( EventType . DONE , this . #providerDone. bind ( this ) ) ;
71+ } else {
72+ throw new Error ( `Provider "${ newVal } ) ;
73+ }
74+ }
75+ }
76+
77+ #providerFetch( ) {
78+ // Reset the data container
79+ this . #newdata = [ ] ;
80+ }
7981
80- #providerObject( event ) {
81- var data = event . detail ;
82- if ( this . select ) {
83- if ( data instanceof Object ) {
84- data = data [ this . select ] ;
85- if ( data === undefined ) {
86- throw new Error ( `Property "${ this . select } ) ;
87- } else if ( Array . isArray ( data ) ) {
88- this . #newdata = this . #newdata. concat ( data ) ;
89- } else {
90- this . #newdata. push ( data ) ;
91- }
92- }
82+ #providerObject( event ) {
83+ let data = event . detail ;
84+ if ( this . select ) {
85+ if ( data instanceof Object ) {
86+ data = data [ this . select ] ;
87+ if ( data === undefined ) {
88+ throw new Error ( `Property "${ this . select } ) ;
89+ } else if ( Array . isArray ( data ) ) {
90+ this . #newdata = this . #newdata. concat ( data ) ;
9391 } else {
94- // Add the object to the data container
95- this . #newdata. push ( data ) ;
92+ this . #newdata. push ( data ) ;
9693 }
94+ }
95+ } else {
96+ // Add the object to the data container
97+ this . #newdata. push ( data ) ;
9798 }
99+ }
98100
99- #providerDone( ) {
100- let modified = false ;
101- if ( this . #newdata. length !== this . #data. length ) {
102- modified = true ;
103- } else {
104- for ( let i = 0 ; i < this . #newdata. length ; i ++ ) {
105- if ( this . #newdata[ i ] !== this . #data[ i ] ) {
106- modified = true ;
107- break ;
108- }
109- }
101+ #providerDone( ) {
102+ let modified = false ;
103+ if ( this . #newdata. length !== this . #data. length ) {
104+ modified = true ;
105+ } else {
106+ for ( let i = 0 ; i < this . #newdata. length ; i += 1 ) {
107+ if ( this . #newdata[ i ] !== this . #data[ i ] ) {
108+ modified = true ;
109+ break ;
110110 }
111+ }
112+ }
111113
112- // Copy over the data
113- this . #data = this . #newdata;
114-
115- // Emit a change event if the data was modified
116- if ( modified ) {
117- this . dispatchEvent ( new CustomEvent ( EventType . CHANGE , {
118- detail : this
119- } ) ) ;
120- }
114+ // Copy over the data
115+ this . #data = this . #newdata;
121116
117+ // Emit a change event if the data was modified
118+ if ( modified ) {
119+ this . dispatchEvent ( new CustomEvent ( EventType . CHANGE , {
120+ detail : this ,
121+ } ) ) ;
122122 }
123+ }
123124}
0 commit comments