@lightningjs/blits 0.9.5 → 0.9.6

package/src/components/FPScounter.orig.js

@@ -21,47 +21,1030 @@ import fps_sprite from '../../public/assets/fps_sprite.base64.js'
 
 export default () =>
   Component('FPScounter', {
-    template: `
-      <Element>
-        <Element y="15" x="20">
-          <Element>
-            <Sprite image="$image" w="43" h="25" map="$sprite" frame="fps" />
-            <Element x="58" y="2">
-              <Sprite image="$image" x="0" h="20" w="20" map="$sprite" :frame="$fps[0]" />
-              <Sprite image="$image" x="18" h="20" w="20" map="$sprite" :frame="$fps[1]" />
-              <Sprite image="$image" x="36" h="20" w="20" map="$sprite" :frame="$fps[2]" />
-            </Element>
-          </Element>
-
-          <Element x="150">
-            <Sprite image="$image" y="2" w="48" h="25" map="$sprite" frame="avg" />
-            <Element x="63" y="2">
-              <Sprite image="$image" x="0" h="20" w="20" map="$sprite" :frame="$avgFps[0]" />
-              <Sprite image="$image" x="18" h="20" w="20" map="$sprite" :frame="$avgFps[1]" />
-              <Sprite image="$image" x="36" h="20" w="20" map="$sprite" :frame="$avgFps[2]" />
-            </Element>
-          </Element>
-
-          <Element x="0" y="40" >
-            <Sprite image="$image" x="-2" w="47" h="25" map="$sprite" frame="min" />
-            <Element x="58" y="2">
-              <Sprite image="$image" x="0" h="20" w="20" map="$sprite" :frame="$minFps[0]" />
-              <Sprite image="$image" x="18" h="20" w="20" map="$sprite" :frame="$minFps[1]" />
-              <Sprite image="$image" x="36" h="20" w="20" map="$sprite" :frame="$minFps[2]" />
-            </Element>
-          </Element>
-
-          <Element x="150" y="40">
-            <Sprite image="$image" w="53" h="25" map="$sprite" frame="max" />
-            <Element x="63" y="2">
-              <Sprite image="$image" x="0" h="20" w="20" map="$sprite" :frame="$maxFps[0]" />
-              <Sprite image="$image" x="18" h="20" w="20" map="$sprite" :frame="$maxFps[1]" />
-              <Sprite image="$image" x="36" h="20" w="20" map="$sprite" :frame="$maxFps[2]" />
-            </Element>
-          </Element>
-        </Element>
-      </Element>
-    `,
+    /* eslint-disable no-unused-vars */ 
+code: { render: function anonymous(parent,component,context
+) {
+const elms = []
+
+    if(!elms[0]) {
+      elms[0] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig0 = {}
+  
+
+    if(!elms[0].nodeId) {
+      elms[0].populate(elementConfig0)
+    }
+  
+parent = elms[0]
+
+    if(!elms[1]) {
+      elms[1] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig1 = {}
+  
+elementConfig1['y'] = 15
+elementConfig1['x'] = 20
+
+    if(!elms[1].nodeId) {
+      elms[1].populate(elementConfig1)
+    }
+  
+parent = elms[1]
+
+    if(!elms[2]) {
+      elms[2] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig2 = {}
+  
+
+    if(!elms[2].nodeId) {
+      elms[2].populate(elementConfig2)
+    }
+  
+
+    const cmp3 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[2]
+
+    if(!elms[3]) {
+      elms[3] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig3 = {}
+  
+elementConfig3['image'] = component.image
+elementConfig3['w'] = 43
+elementConfig3['h'] = 25
+elementConfig3['map'] = component.sprite
+elementConfig3['frame'] = "fps"
+
+    if(typeof cmp3 !== 'undefined') {
+      for(let key in cmp3.config.props) {
+        delete elementConfig3[cmp3.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[3].nodeId) {
+      elms[3].populate(elementConfig3)
+    }
+  
+parent = elms[3]
+const props4 = {}
+props4['image'] = component.image
+props4['w'] = 43
+props4['h'] = 25
+props4['map'] = component.sprite
+props4['frame'] = "fps"
+
+    if(!elms[4]) {
+      const componentType = props4['is'] || 'Sprite'
+
+  elms[4] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props4}, elms[3], component)
+      if (elms[4][Symbol.for('slots')][0]) {
+        parent = elms[4][Symbol.for('slots')][0]
+        component = elms[4]
+      } else {
+        parent = elms[4][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[2]
+
+    if(!elms[5]) {
+      elms[5] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig5 = {}
+  
+elementConfig5['x'] = 58
+elementConfig5['y'] = 2
+
+    if(!elms[5].nodeId) {
+      elms[5].populate(elementConfig5)
+    }
+  
+
+    const cmp6 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[5]
+
+    if(!elms[6]) {
+      elms[6] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig6 = {}
+  
+elementConfig6['image'] = component.image
+elementConfig6['x'] = 0
+elementConfig6['h'] = 20
+elementConfig6['w'] = 20
+elementConfig6['map'] = component.sprite
+
+    if(typeof cmp6 !== 'undefined') {
+      for(let key in cmp6.config.props) {
+        delete elementConfig6[cmp6.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[6].nodeId) {
+      elms[6].populate(elementConfig6)
+    }
+  
+parent = elms[6]
+const props7 = {}
+props7['image'] = component.image
+props7['x'] = 0
+props7['h'] = 20
+props7['w'] = 20
+props7['map'] = component.sprite
+props7['frame'] = component.fps[0]
+
+    if(!elms[7]) {
+      const componentType = props7['is'] || 'Sprite'
+
+  elms[7] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props7}, elms[6], component)
+      if (elms[7][Symbol.for('slots')][0]) {
+        parent = elms[7][Symbol.for('slots')][0]
+        component = elms[7]
+      } else {
+        parent = elms[7][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp8 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[5]
+
+    if(!elms[8]) {
+      elms[8] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig8 = {}
+  
+elementConfig8['image'] = component.image
+elementConfig8['x'] = 18
+elementConfig8['h'] = 20
+elementConfig8['w'] = 20
+elementConfig8['map'] = component.sprite
+
+    if(typeof cmp8 !== 'undefined') {
+      for(let key in cmp8.config.props) {
+        delete elementConfig8[cmp8.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[8].nodeId) {
+      elms[8].populate(elementConfig8)
+    }
+  
+parent = elms[8]
+const props9 = {}
+props9['image'] = component.image
+props9['x'] = 18
+props9['h'] = 20
+props9['w'] = 20
+props9['map'] = component.sprite
+props9['frame'] = component.fps[1]
+
+    if(!elms[9]) {
+      const componentType = props9['is'] || 'Sprite'
+
+  elms[9] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props9}, elms[8], component)
+      if (elms[9][Symbol.for('slots')][0]) {
+        parent = elms[9][Symbol.for('slots')][0]
+        component = elms[9]
+      } else {
+        parent = elms[9][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp10 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[5]
+
+    if(!elms[10]) {
+      elms[10] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig10 = {}
+  
+elementConfig10['image'] = component.image
+elementConfig10['x'] = 36
+elementConfig10['h'] = 20
+elementConfig10['w'] = 20
+elementConfig10['map'] = component.sprite
+
+    if(typeof cmp10 !== 'undefined') {
+      for(let key in cmp10.config.props) {
+        delete elementConfig10[cmp10.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[10].nodeId) {
+      elms[10].populate(elementConfig10)
+    }
+  
+parent = elms[10]
+const props11 = {}
+props11['image'] = component.image
+props11['x'] = 36
+props11['h'] = 20
+props11['w'] = 20
+props11['map'] = component.sprite
+props11['frame'] = component.fps[2]
+
+    if(!elms[11]) {
+      const componentType = props11['is'] || 'Sprite'
+
+  elms[11] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props11}, elms[10], component)
+      if (elms[11][Symbol.for('slots')][0]) {
+        parent = elms[11][Symbol.for('slots')][0]
+        component = elms[11]
+      } else {
+        parent = elms[11][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[1]
+
+    if(!elms[12]) {
+      elms[12] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig12 = {}
+  
+elementConfig12['x'] = 150
+
+    if(!elms[12].nodeId) {
+      elms[12].populate(elementConfig12)
+    }
+  
+
+    const cmp13 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[12]
+
+    if(!elms[13]) {
+      elms[13] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig13 = {}
+  
+elementConfig13['image'] = component.image
+elementConfig13['y'] = 2
+elementConfig13['w'] = 48
+elementConfig13['h'] = 25
+elementConfig13['map'] = component.sprite
+elementConfig13['frame'] = "avg"
+
+    if(typeof cmp13 !== 'undefined') {
+      for(let key in cmp13.config.props) {
+        delete elementConfig13[cmp13.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[13].nodeId) {
+      elms[13].populate(elementConfig13)
+    }
+  
+parent = elms[13]
+const props14 = {}
+props14['image'] = component.image
+props14['y'] = 2
+props14['w'] = 48
+props14['h'] = 25
+props14['map'] = component.sprite
+props14['frame'] = "avg"
+
+    if(!elms[14]) {
+      const componentType = props14['is'] || 'Sprite'
+
+  elms[14] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props14}, elms[13], component)
+      if (elms[14][Symbol.for('slots')][0]) {
+        parent = elms[14][Symbol.for('slots')][0]
+        component = elms[14]
+      } else {
+        parent = elms[14][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[12]
+
+    if(!elms[15]) {
+      elms[15] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig15 = {}
+  
+elementConfig15['x'] = 63
+elementConfig15['y'] = 2
+
+    if(!elms[15].nodeId) {
+      elms[15].populate(elementConfig15)
+    }
+  
+
+    const cmp16 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[15]
+
+    if(!elms[16]) {
+      elms[16] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig16 = {}
+  
+elementConfig16['image'] = component.image
+elementConfig16['x'] = 0
+elementConfig16['h'] = 20
+elementConfig16['w'] = 20
+elementConfig16['map'] = component.sprite
+
+    if(typeof cmp16 !== 'undefined') {
+      for(let key in cmp16.config.props) {
+        delete elementConfig16[cmp16.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[16].nodeId) {
+      elms[16].populate(elementConfig16)
+    }
+  
+parent = elms[16]
+const props17 = {}
+props17['image'] = component.image
+props17['x'] = 0
+props17['h'] = 20
+props17['w'] = 20
+props17['map'] = component.sprite
+props17['frame'] = component.avgFps[0]
+
+    if(!elms[17]) {
+      const componentType = props17['is'] || 'Sprite'
+
+  elms[17] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props17}, elms[16], component)
+      if (elms[17][Symbol.for('slots')][0]) {
+        parent = elms[17][Symbol.for('slots')][0]
+        component = elms[17]
+      } else {
+        parent = elms[17][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp18 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[15]
+
+    if(!elms[18]) {
+      elms[18] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig18 = {}
+  
+elementConfig18['image'] = component.image
+elementConfig18['x'] = 18
+elementConfig18['h'] = 20
+elementConfig18['w'] = 20
+elementConfig18['map'] = component.sprite
+
+    if(typeof cmp18 !== 'undefined') {
+      for(let key in cmp18.config.props) {
+        delete elementConfig18[cmp18.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[18].nodeId) {
+      elms[18].populate(elementConfig18)
+    }
+  
+parent = elms[18]
+const props19 = {}
+props19['image'] = component.image
+props19['x'] = 18
+props19['h'] = 20
+props19['w'] = 20
+props19['map'] = component.sprite
+props19['frame'] = component.avgFps[1]
+
+    if(!elms[19]) {
+      const componentType = props19['is'] || 'Sprite'
+
+  elms[19] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props19}, elms[18], component)
+      if (elms[19][Symbol.for('slots')][0]) {
+        parent = elms[19][Symbol.for('slots')][0]
+        component = elms[19]
+      } else {
+        parent = elms[19][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp20 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[15]
+
+    if(!elms[20]) {
+      elms[20] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig20 = {}
+  
+elementConfig20['image'] = component.image
+elementConfig20['x'] = 36
+elementConfig20['h'] = 20
+elementConfig20['w'] = 20
+elementConfig20['map'] = component.sprite
+
+    if(typeof cmp20 !== 'undefined') {
+      for(let key in cmp20.config.props) {
+        delete elementConfig20[cmp20.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[20].nodeId) {
+      elms[20].populate(elementConfig20)
+    }
+  
+parent = elms[20]
+const props21 = {}
+props21['image'] = component.image
+props21['x'] = 36
+props21['h'] = 20
+props21['w'] = 20
+props21['map'] = component.sprite
+props21['frame'] = component.avgFps[2]
+
+    if(!elms[21]) {
+      const componentType = props21['is'] || 'Sprite'
+
+  elms[21] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props21}, elms[20], component)
+      if (elms[21][Symbol.for('slots')][0]) {
+        parent = elms[21][Symbol.for('slots')][0]
+        component = elms[21]
+      } else {
+        parent = elms[21][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[1]
+
+    if(!elms[22]) {
+      elms[22] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig22 = {}
+  
+elementConfig22['x'] = 0
+elementConfig22['y'] = 40
+
+    if(!elms[22].nodeId) {
+      elms[22].populate(elementConfig22)
+    }
+  
+
+    const cmp23 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[22]
+
+    if(!elms[23]) {
+      elms[23] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig23 = {}
+  
+elementConfig23['image'] = component.image
+elementConfig23['x'] = -2
+elementConfig23['w'] = 47
+elementConfig23['h'] = 25
+elementConfig23['map'] = component.sprite
+elementConfig23['frame'] = "min"
+
+    if(typeof cmp23 !== 'undefined') {
+      for(let key in cmp23.config.props) {
+        delete elementConfig23[cmp23.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[23].nodeId) {
+      elms[23].populate(elementConfig23)
+    }
+  
+parent = elms[23]
+const props24 = {}
+props24['image'] = component.image
+props24['x'] = -2
+props24['w'] = 47
+props24['h'] = 25
+props24['map'] = component.sprite
+props24['frame'] = "min"
+
+    if(!elms[24]) {
+      const componentType = props24['is'] || 'Sprite'
+
+  elms[24] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props24}, elms[23], component)
+      if (elms[24][Symbol.for('slots')][0]) {
+        parent = elms[24][Symbol.for('slots')][0]
+        component = elms[24]
+      } else {
+        parent = elms[24][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[22]
+
+    if(!elms[25]) {
+      elms[25] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig25 = {}
+  
+elementConfig25['x'] = 58
+elementConfig25['y'] = 2
+
+    if(!elms[25].nodeId) {
+      elms[25].populate(elementConfig25)
+    }
+  
+
+    const cmp26 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[25]
+
+    if(!elms[26]) {
+      elms[26] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig26 = {}
+  
+elementConfig26['image'] = component.image
+elementConfig26['x'] = 0
+elementConfig26['h'] = 20
+elementConfig26['w'] = 20
+elementConfig26['map'] = component.sprite
+
+    if(typeof cmp26 !== 'undefined') {
+      for(let key in cmp26.config.props) {
+        delete elementConfig26[cmp26.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[26].nodeId) {
+      elms[26].populate(elementConfig26)
+    }
+  
+parent = elms[26]
+const props27 = {}
+props27['image'] = component.image
+props27['x'] = 0
+props27['h'] = 20
+props27['w'] = 20
+props27['map'] = component.sprite
+props27['frame'] = component.minFps[0]
+
+    if(!elms[27]) {
+      const componentType = props27['is'] || 'Sprite'
+
+  elms[27] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props27}, elms[26], component)
+      if (elms[27][Symbol.for('slots')][0]) {
+        parent = elms[27][Symbol.for('slots')][0]
+        component = elms[27]
+      } else {
+        parent = elms[27][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp28 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[25]
+
+    if(!elms[28]) {
+      elms[28] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig28 = {}
+  
+elementConfig28['image'] = component.image
+elementConfig28['x'] = 18
+elementConfig28['h'] = 20
+elementConfig28['w'] = 20
+elementConfig28['map'] = component.sprite
+
+    if(typeof cmp28 !== 'undefined') {
+      for(let key in cmp28.config.props) {
+        delete elementConfig28[cmp28.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[28].nodeId) {
+      elms[28].populate(elementConfig28)
+    }
+  
+parent = elms[28]
+const props29 = {}
+props29['image'] = component.image
+props29['x'] = 18
+props29['h'] = 20
+props29['w'] = 20
+props29['map'] = component.sprite
+props29['frame'] = component.minFps[1]
+
+    if(!elms[29]) {
+      const componentType = props29['is'] || 'Sprite'
+
+  elms[29] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props29}, elms[28], component)
+      if (elms[29][Symbol.for('slots')][0]) {
+        parent = elms[29][Symbol.for('slots')][0]
+        component = elms[29]
+      } else {
+        parent = elms[29][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp30 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[25]
+
+    if(!elms[30]) {
+      elms[30] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig30 = {}
+  
+elementConfig30['image'] = component.image
+elementConfig30['x'] = 36
+elementConfig30['h'] = 20
+elementConfig30['w'] = 20
+elementConfig30['map'] = component.sprite
+
+    if(typeof cmp30 !== 'undefined') {
+      for(let key in cmp30.config.props) {
+        delete elementConfig30[cmp30.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[30].nodeId) {
+      elms[30].populate(elementConfig30)
+    }
+  
+parent = elms[30]
+const props31 = {}
+props31['image'] = component.image
+props31['x'] = 36
+props31['h'] = 20
+props31['w'] = 20
+props31['map'] = component.sprite
+props31['frame'] = component.minFps[2]
+
+    if(!elms[31]) {
+      const componentType = props31['is'] || 'Sprite'
+
+  elms[31] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props31}, elms[30], component)
+      if (elms[31][Symbol.for('slots')][0]) {
+        parent = elms[31][Symbol.for('slots')][0]
+        component = elms[31]
+      } else {
+        parent = elms[31][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[1]
+
+    if(!elms[32]) {
+      elms[32] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig32 = {}
+  
+elementConfig32['x'] = 150
+elementConfig32['y'] = 40
+
+    if(!elms[32].nodeId) {
+      elms[32].populate(elementConfig32)
+    }
+  
+
+    const cmp33 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[32]
+
+    if(!elms[33]) {
+      elms[33] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig33 = {}
+  
+elementConfig33['image'] = component.image
+elementConfig33['w'] = 53
+elementConfig33['h'] = 25
+elementConfig33['map'] = component.sprite
+elementConfig33['frame'] = "max"
+
+    if(typeof cmp33 !== 'undefined') {
+      for(let key in cmp33.config.props) {
+        delete elementConfig33[cmp33.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[33].nodeId) {
+      elms[33].populate(elementConfig33)
+    }
+  
+parent = elms[33]
+const props34 = {}
+props34['image'] = component.image
+props34['w'] = 53
+props34['h'] = 25
+props34['map'] = component.sprite
+props34['frame'] = "max"
+
+    if(!elms[34]) {
+      const componentType = props34['is'] || 'Sprite'
+
+  elms[34] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props34}, elms[33], component)
+      if (elms[34][Symbol.for('slots')][0]) {
+        parent = elms[34][Symbol.for('slots')][0]
+        component = elms[34]
+      } else {
+        parent = elms[34][Symbol.for('children')][0]
+      }
+    }
+  
+parent = elms[32]
+
+    if(!elms[35]) {
+      elms[35] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig35 = {}
+  
+elementConfig35['x'] = 63
+elementConfig35['y'] = 2
+
+    if(!elms[35].nodeId) {
+      elms[35].populate(elementConfig35)
+    }
+  
+
+    const cmp36 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[35]
+
+    if(!elms[36]) {
+      elms[36] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig36 = {}
+  
+elementConfig36['image'] = component.image
+elementConfig36['x'] = 0
+elementConfig36['h'] = 20
+elementConfig36['w'] = 20
+elementConfig36['map'] = component.sprite
+
+    if(typeof cmp36 !== 'undefined') {
+      for(let key in cmp36.config.props) {
+        delete elementConfig36[cmp36.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[36].nodeId) {
+      elms[36].populate(elementConfig36)
+    }
+  
+parent = elms[36]
+const props37 = {}
+props37['image'] = component.image
+props37['x'] = 0
+props37['h'] = 20
+props37['w'] = 20
+props37['map'] = component.sprite
+props37['frame'] = component.maxFps[0]
+
+    if(!elms[37]) {
+      const componentType = props37['is'] || 'Sprite'
+
+  elms[37] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props37}, elms[36], component)
+      if (elms[37][Symbol.for('slots')][0]) {
+        parent = elms[37][Symbol.for('slots')][0]
+        component = elms[37]
+      } else {
+        parent = elms[37][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp38 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[35]
+
+    if(!elms[38]) {
+      elms[38] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig38 = {}
+  
+elementConfig38['image'] = component.image
+elementConfig38['x'] = 18
+elementConfig38['h'] = 20
+elementConfig38['w'] = 20
+elementConfig38['map'] = component.sprite
+
+    if(typeof cmp38 !== 'undefined') {
+      for(let key in cmp38.config.props) {
+        delete elementConfig38[cmp38.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[38].nodeId) {
+      elms[38].populate(elementConfig38)
+    }
+  
+parent = elms[38]
+const props39 = {}
+props39['image'] = component.image
+props39['x'] = 18
+props39['h'] = 20
+props39['w'] = 20
+props39['map'] = component.sprite
+props39['frame'] = component.maxFps[1]
+
+    if(!elms[39]) {
+      const componentType = props39['is'] || 'Sprite'
+
+  elms[39] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props39}, elms[38], component)
+      if (elms[39][Symbol.for('slots')][0]) {
+        parent = elms[39][Symbol.for('slots')][0]
+        component = elms[39]
+      } else {
+        parent = elms[39][Symbol.for('children')][0]
+      }
+    }
+  
+
+    const cmp40 =
+      (context.components && context.components['Sprite']) ||
+      component[Symbol.for('components')]['Sprite']
+  
+parent = elms[35]
+
+    if(!elms[40]) {
+      elms[40] = this.element({parent: parent || 'root'}, component)
+    }
+    const elementConfig40 = {}
+  
+elementConfig40['image'] = component.image
+elementConfig40['x'] = 36
+elementConfig40['h'] = 20
+elementConfig40['w'] = 20
+elementConfig40['map'] = component.sprite
+
+    if(typeof cmp40 !== 'undefined') {
+      for(let key in cmp40.config.props) {
+        delete elementConfig40[cmp40.config.props[key]]
+      }
+    }
+    
+
+    if(!elms[40].nodeId) {
+      elms[40].populate(elementConfig40)
+    }
+  
+parent = elms[40]
+const props41 = {}
+props41['image'] = component.image
+props41['x'] = 36
+props41['h'] = 20
+props41['w'] = 20
+props41['map'] = component.sprite
+props41['frame'] = component.maxFps[2]
+
+    if(!elms[41]) {
+      const componentType = props41['is'] || 'Sprite'
+
+  elms[41] = (context.components && context.components[componentType] || component[Symbol.for('components')][componentType] || (() => { console.error('component Sprite not found')})).call(null, {props: props41}, elms[40], component)
+      if (elms[41][Symbol.for('slots')][0]) {
+        parent = elms[41][Symbol.for('slots')][0]
+        component = elms[41]
+      } else {
+        parent = elms[41][Symbol.for('children')][0]
+      }
+    }
+  
+return elms
+}, effects: [function anonymous(component,elms,context
+) {
+elms[6].set('frame', component.fps[0])
+},function anonymous(component,elms,context
+) {
+
+        elms[7][Symbol.for('props')]['frame'] = component.fps[0]
+},function anonymous(component,elms,context
+) {
+elms[8].set('frame', component.fps[1])
+},function anonymous(component,elms,context
+) {
+
+        elms[9][Symbol.for('props')]['frame'] = component.fps[1]
+},function anonymous(component,elms,context
+) {
+elms[10].set('frame', component.fps[2])
+},function anonymous(component,elms,context
+) {
+
+        elms[11][Symbol.for('props')]['frame'] = component.fps[2]
+},function anonymous(component,elms,context
+) {
+elms[16].set('frame', component.avgFps[0])
+},function anonymous(component,elms,context
+) {
+
+        elms[17][Symbol.for('props')]['frame'] = component.avgFps[0]
+},function anonymous(component,elms,context
+) {
+elms[18].set('frame', component.avgFps[1])
+},function anonymous(component,elms,context
+) {
+
+        elms[19][Symbol.for('props')]['frame'] = component.avgFps[1]
+},function anonymous(component,elms,context
+) {
+elms[20].set('frame', component.avgFps[2])
+},function anonymous(component,elms,context
+) {
+
+        elms[21][Symbol.for('props')]['frame'] = component.avgFps[2]
+},function anonymous(component,elms,context
+) {
+elms[26].set('frame', component.minFps[0])
+},function anonymous(component,elms,context
+) {
+
+        elms[27][Symbol.for('props')]['frame'] = component.minFps[0]
+},function anonymous(component,elms,context
+) {
+elms[28].set('frame', component.minFps[1])
+},function anonymous(component,elms,context
+) {
+
+        elms[29][Symbol.for('props')]['frame'] = component.minFps[1]
+},function anonymous(component,elms,context
+) {
+elms[30].set('frame', component.minFps[2])
+},function anonymous(component,elms,context
+) {
+
+        elms[31][Symbol.for('props')]['frame'] = component.minFps[2]
+},function anonymous(component,elms,context
+) {
+elms[36].set('frame', component.maxFps[0])
+},function anonymous(component,elms,context
+) {
+
+        elms[37][Symbol.for('props')]['frame'] = component.maxFps[0]
+},function anonymous(component,elms,context
+) {
+elms[38].set('frame', component.maxFps[1])
+},function anonymous(component,elms,context
+) {
+
+        elms[39][Symbol.for('props')]['frame'] = component.maxFps[1]
+},function anonymous(component,elms,context
+) {
+elms[40].set('frame', component.maxFps[2])
+},function anonymous(component,elms,context
+) {
+
+        elms[41][Symbol.for('props')]['frame'] = component.maxFps[2]
+}], context: {}},
     state() {
       return {
         image: fps_sprite,