@@ -2,50 +2,33 @@ var A = ["pretty", "large", "big", "small", "tall", "short", "long", "handsome",
22var  C  =  [" red"  , " yellow"  , " blue"  , " green"  , " pink"  , " brown"  , " purple"  , " brown"  , " white"  , " black"  , " orange"  ]
33var  N  =  [" table"  , " chair"  , " house"  , " bbq"  , " desk"  , " car"  , " pony"  , " cookie"  , " sandwich"  , " burger"  , " pizza"  , " mouse"  ,  " keyboard"  ]
44
5- tag  RemoveIcon  <  span 
6- 	def  build 
7- 		set (' aria-hidden'  , true )
8- 
9- 	def  render 
10- 		<self .glyphicon .glyphicon-remove >
5+ extend  tag  element 
6+ 	attr  aria-hidden 
117
128tag  Row  <  tr 
13- 	prop  select 
14- 	prop  remove 
15- 	prop  item 
16- 	prop  selected 
17- 
18- 	def  onSelect 
19- 		@select (@item )
20- 
21- 	def  onRemove 
22- 		@remove (@item )
9+ 	def  select 
10+ 		trigger (' select'  ,@data )
2311
24- 	def  render 
25- 		<self  .danger = @selected >
26- 			<td .col-md-1 > @item :id 
27- 			<td .col-md-4 ><a  :tap .onSelect > @item :label 
28- 			<td .col-md-1 ><a  :tap .onRemove ><RemoveIcon >
29- 			<td .col-md-6 >
30- 
31- tag  Button 
32- 	prop  id 
33- 	prop  cb 
34- 	prop  title 
12+ 	def  remove 
13+ 		trigger (' remove'  ,@data )
3514
3615	def  render 
16+ 		return  if  @data  ===  @prev 
17+ 		@prev  =  @data 
3718		<self >
38- 			<div .col-sm-6 .smallpad >
39- 				<button .btn .btn-primary .btn-block  type = ' button'   id = @id  :tap = @cb > @title 
19+ 			<td .col-md-1  text = @data :id >
20+ 			<td .col-md-4 > <a  :tap .select  text = @data :label >
21+ 			<td .col-md-1 > <a  :tap .remove > <span .glyphicon .glyphicon-remove  aria-hidden = true >
22+ 			<td .col-md-6 >
4023
4124var  items  =  []
4225var  selected  =  0 
4326var  nextId  =  1 
4427
4528tag  Main 
4629	def  run 
47- 		items  =  buildData (1000 )
48- 		selected  =  0 
30+ 		items  =  buildData (1000 )	 
31+ 		selected  =  0 		 
4932		Imba .commit 
5033
5134	def  runLots 
@@ -55,34 +38,39 @@ tag Main
5538	def  add 
5639		items  =  items .concat (buildData (1000 ))
5740
58- 	def  update 
41+ 	def  update 		 
5942		var  i  =  0 
6043		while  i  <  items:length 
6144			var  item  =  items [i ]
6245			items [i ] =  { id: item:id , label: item:label  +  '  !!!'   }
6346			i  =  i  +  10 
64- 		Imba .commit () 
47+ 		Imba .commit 
6548
6649	def  select  item 
6750		selected  =  item:id 
6851
6952	def  remove  item 
7053		items .splice (items .indexOf (item ), 1 )
71- 		Imba .commit ()
54+ 		Imba .commit 
55+ 	
56+ 	def  onselect  e 
57+ 		select (e .data )
58+ 	
59+ 	def  onremove  e 
60+ 		remove (e .data )
7261
7362	def  clear 
7463		items  =  []
7564		selected  =  0 
7665
77- 	def  swapRows 
66+ 	def  swapRows 		 
7867		if  (items:length  >  998 )
7968			var  temp  =  items [1 ]
8069			items [1 ] =  items [998 ]
8170			items [998 ] =  temp 
82- 
8371		Imba .commit 
8472
85- 
73+ 	 
8674	def  buildData (count )
8775		var  newItems   =  Array .new (count )
8876		var  i  =  0 
@@ -95,9 +83,9 @@ tag Main
9583			nextId  =  nextId  +  1 
9684
9785		newItems 
98- 
99- 	def  random  max 
100- 		Math .round (Math .random ()  *  1000 ) %  max 
86+ 	 
87+ 	def  random  max   
88+ 		Math .round (Math .random  *  1000 ) %  max 
10189
10290	def  render 
10391		<self >
@@ -108,16 +96,21 @@ tag Main
10896							<h1 > ' Imba non-keyed' 
10997						<div .col-md-6 >
11098							<div .row >
111- 								<Button  id = ' run'   title = ' Create 1,000 rows'   cb = (do  run )>
112- 								<Button  id = " runlots"   title = " Create 10,000 rows"   cb = (do  runLots )>
113- 								<Button  id = " add"   title = " Append 1,000 rows"   cb = (do  add )>
114- 								<Button  id = " update"   title = " Update every 10th row"   cb = (do  update )>
115- 								<Button  id = " clear"   title = " Clear"   cb = (do  clear )>
116- 								<Button  id = " swaprows"   title = " Swap Rows"   cb = (do  swapRows )>
117- 
99+ 								<div .col-sm-6 .smallpad > 
100+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = ' run'   :tap .run > ' Create 1,000 rows' 
101+ 								<div .col-sm-6 .smallpad > 
102+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = " runlots"   :tap .runLots > " Create 10,000 rows" 
103+ 								<div .col-sm-6 .smallpad > 
104+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = " add"   :tap .add > " Append 1,000 rows" 
105+ 								<div .col-sm-6 .smallpad > 
106+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = " update"   :tap .update > " Update every 10th row" 
107+ 								<div .col-sm-6 .smallpad > 
108+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = " clear"   :tap .clear > " Clear" 
109+ 								<div .col-sm-6 .smallpad > 
110+ 									<button .btn .btn-primary .btn-block  type = ' button'   id = " swaprows"   :tap .swapRows > " Swap Rows" 
118111				<table .table .table-hover .table-striped .test-data >
119112					<tbody > for  item  in  items 
120- 						<Row  item = item  selected = (selected  ===  item:id )  select = ( do   select ( item ))  remove = ( do   remove ( item ) )>
121- 				<RemoveIcon . preloadicon >
113+ 						<Row  data = item  . danger = (selected  ===  item:id )>
114+ 				<span . glyphicon . glyphicon-remove . preloadicon   aria-hidden = true >
122115
123- Imba .mount  <Main [{ selected :   0 ,  nextId :   0 }] >
116+ Imba .mount  <Main >
0 commit comments