1+ import CoCreateObserver from '@cocreate/observer'
2+ import ccutils from '@cocreate/utils' ;
3+ import crdt from '@cocreate/crdt'
4+ import CoCreateInput from '@cocreate/input'
5+ import floatingLabel from '@cocreate/floating-label'
6+ import htmltags from '@cocreate/htmltags'
7+
18var CoCreateCalculation = {
29 init : function ( ) {
310 this . initCalculationElements ( ) ;
@@ -17,10 +24,10 @@ var CoCreateCalculation = {
1724 }
1825
1926 for ( let i = 0 ; i < calculationElements . length ; i ++ ) {
20- if ( CoCreate . observer . getInitialized ( calculationElements [ i ] , "calculation_init" ) ) {
27+ if ( CoCreateObserver . getInitialized ( calculationElements [ i ] , "calculation_init" ) ) {
2128 return ;
2229 }
23- CoCreate . observer . setInitialized ( calculationElements [ i ] , "calculation_init" )
30+ CoCreateObserver . setInitialized ( calculationElements [ i ] , "calculation_init" )
2431
2532 this . initCalculationElement ( calculationElements [ i ] ) ;
2633 }
@@ -31,25 +38,87 @@ var CoCreateCalculation = {
3138
3239 const self = this ;
3340 let data_calculation = ele . getAttribute ( 'data-calculation' ) ;
34- let ids = this . getIds ( data_calculation ) ;
35-
41+ let ids = this . getIds ( data_calculation ) ;
42+
43+ let selectors = [ ] ;
3644 for ( let i = 0 ; i < ids . length ; i ++ ) {
3745 let id = ids [ i ] ;
3846
39- let input = document . getElementById ( id ) ;
47+ let input = null ;
48+ try {
49+ input = document . querySelector ( id ) ;
50+ } catch ( error ) { input = null ; }
51+
4052 if ( input ) {
4153 input . addEventListener ( 'input' , function ( ) {
4254 self . setCalcationResult ( ele ) ;
4355 } )
4456
4557 input . addEventListener ( 'CoCreateInput-setvalue' , function ( ) {
46- console . log ( '&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&' )
47- self . setCalcationResult ( ele )
58+ // self.setCalcationResult(ele)
4859 } )
4960
61+ if ( input . hasAttribute ( 'data-calculation' ) ) {
62+ input . addEventListener ( 'changedCalcValue' , function ( e ) {
63+ self . setCalcationResult ( ele )
64+ } )
65+ }
66+
67+ } else {
68+ //. add event of special operator
69+
70+ let selector = this . __getOperatorSelector ( id ) ;
71+ if ( selector ) {
72+ selectors . push ( selector )
73+ }
5074 }
5175 }
5276
77+ if ( selectors . length > 0 ) {
78+ document . addEventListener ( 'changedCalcValue' , function ( e ) {
79+
80+ let isMatched = false ;
81+ selectors . forEach ( selector => {
82+ if ( e . target . matches ( selector ) ) {
83+ isMatched = true ; return ;
84+ }
85+ } )
86+
87+ if ( isMatched ) {
88+ self . setCalcationResult ( ele ) ;
89+ }
90+ } )
91+ }
92+ } ,
93+
94+ __getOperatorSelector ( value ) {
95+ let result = / S U M \( \s * ( [ \w \W ] + ) \s * \) / g. exec ( value ) ;
96+ if ( result && result [ 1 ] ) {
97+ return result [ 1 ] . trim ( ) ;
98+ }
99+ return null ;
100+ } ,
101+
102+ calculationSpecialOperator ( value ) {
103+ let self = this ;
104+ let sum = null ;
105+ let result = / S U M \( \s * ( [ \w \W ] + ) \s * \) / g. exec ( value ) ;
106+ if ( result ) {
107+ let selector = result [ 1 ] . trim ( )
108+
109+ if ( value . trim ( ) . indexOf ( 'SUM' ) == 0 ) {
110+ let elements = document . querySelectorAll ( selector )
111+ sum = 0 ;
112+ elements . forEach ( el => {
113+ let tmpValue = self . __getElementValue ( el ) ;
114+ tmpValue = Number ( tmpValue ) ;
115+ if ( ! Number . isNaN ( tmpValue ) ) {
116+ sum += tmpValue ;
117+ }
118+ } )
119+ }
120+ }
121+ return sum
53122 } ,
54123
55124
@@ -58,35 +127,69 @@ var CoCreateCalculation = {
58127
59128 let calString = this . replaceIdWithValue ( data_calculation ) ;
60129
61- console . log ( calString ) ;
62130 if ( calString ) {
63131 let result = calculation ( calString ) ;
64132 if ( ele . tagName == 'INPUT' || ele . tagName == 'TEXTAREA' || ele . tagName == 'SELECT' ) {
65133 ele . value = result
66- // if (window.CoCreateInput) {
67- // window.CoCreateInput.save(ele)
68- // }
134+
135+ if ( ccutils . isUsageY ( ele ) ) {
136+ ele . value = "" ;
137+ crdt . replaceText ( {
138+ collection : ele . getAttribute ( 'data-collection' ) ,
139+ document_id : ele . getAttribute ( 'data-document_id' ) ,
140+ name : ele . getAttribute ( 'name' ) ,
141+ value : result . toString ( )
142+ } )
143+ } else {
144+ CoCreateInput . save ( ele ) ;
145+ }
146+
147+ if ( floatingLabel ) {
148+ floatingLabel . update ( ele , ele . value )
149+ }
69150 } else {
70151 ele . innerHTML = result ;
71- // if (window.CoCreateHtmlTags) {
72- // window.CoCreateHtmlTags.save(ele);
73- // }
152+ htmltags . saveContent ( ele ) ;
74153 }
154+
155+ //. set custom event
156+ var event = new CustomEvent ( 'changedCalcValue' , {
157+ bubbles : true ,
158+ } )
159+ ele . dispatchEvent ( event ) ;
75160 }
76161
77162 } ,
163+
164+ __getElementValue : function ( element ) {
165+ if ( element . tagName == 'INPUT' || element . tagName == 'TEXTAREA' || element . tagName == 'SELECT' ) {
166+ return element . value ;
167+ } else {
168+ return element . innerHTML ;
169+ }
170+ } ,
78171
79172 replaceIdWithValue : function ( data_calculation ) {
80173 let ids = this . getIds ( data_calculation ) ;
81-
174+
82175 for ( let i = 0 ; i < ids . length ; i ++ ) {
83176 let id = ids [ i ] ;
84177
85- let input = document . getElementById ( id ) ;
178+ let input = null ;
179+
180+ try {
181+ input = document . querySelector ( id ) ;
182+ } catch ( error ) { input = null ; }
183+
184+ let value = null ;
86185 if ( input ) {
87- let value = Number ( input . value ) ;
186+ value = Number ( this . __getElementValue ( input ) ) ;
187+ } else {
188+ value = this . calculationSpecialOperator ( id ) ;
189+ }
88190
89- data_calculation = data_calculation . replace ( new RegExp ( '{' + id + '}' , 'g' ) , value ) ;
191+ if ( value != null && ! Number . isNaN ( value ) ) {
192+ data_calculation = data_calculation . replaceAll ( '{' + id + '}' , value ) ;
90193 }
91194 }
92195
@@ -173,7 +276,7 @@ function calculation(string) {
173276
174277CoCreateCalculation . init ( ) ;
175278
176- CoCreate . observer . init ( {
279+ CoCreateObserver . init ( {
177280 name : 'CoCreateCalculationChangeValue' ,
178281 observe : [ 'attributes' ] ,
179282 attributes : [ 'value' ] ,
@@ -184,7 +287,7 @@ CoCreate.observer.init({
184287 }
185288} ) ;
186289
187- CoCreate . observer . init ( {
290+ CoCreateObserver . init ( {
188291 name : 'CoCreateCalculationInit' ,
189292 observe : [ 'subtree' , 'childList' ] ,
190293 include : '[data-calculation]' ,
0 commit comments