Browse Source

Add a slide on REPL

Laurent Laffont 13 years ago
parent
commit
b17ec0479e

File diff suppressed because it is too large
+ 495 - 252
examples/presentation/js/Presentation.deploy.js


File diff suppressed because it is too large
+ 839 - 501
examples/presentation/js/Presentation.js


+ 414 - 376
examples/presentation/st/Presentation.st

@@ -1,216 +1,223 @@
 Smalltalk current createPackage: 'Presentation' properties: #{}!
-Widget subclass: #Slide
-	instanceVariableNames: 'presentation'
+FOSDEMSlide subclass: #FOSDEMREPLSlide
+	instanceVariableNames: ''
 	category: 'Presentation'!
 
-!Slide methodsFor: 'accessing'!
+!FOSDEMREPLSlide methodsFor: 'rendering'!
 
-presentation
-	^presentation
+renderSlideOn: html
+	html h1: 'REPL'.
+	self renderCodeSnippetOn: html.
 !
 
-presentation: aPresentation
-	presentation := aPresentation
-!
+codeSnippet
+	^ 
+'./bin/amber
+fs := require value: ''fs''.
+fs readdir: ''/tmp'' do: [:err :file| console log: file]'.
+! !
 
-id
-	^ self class name
-!
+FOSDEMSlide subclass: #FOSDEMJSToSmalltalk
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-cssClass
-	^'slide'
-!
+!FOSDEMJSToSmalltalk methodsFor: 'accessing'!
 
-backgroundColor
-	^'#555'
+cssClass
+	^ 'slide blue3d'
 !
 
-title
-	^ self id
+codeSnippet
+	^
+'var counter = window.smalltalk.Counter._new();
+counter._appendToJQuery_($(''#jsToSmalltalk''));'.
 ! !
 
-!Slide methodsFor: 'actions'!
+!FOSDEMJSToSmalltalk methodsFor: 'rendering'!
 
-show
-	self backgroundColor ifNotNil: [
-		(window jQuery: '#slides') css: 'background' color: self backgroundColor].
-	(window jQuery: '.slide') hide: self presentation slideTransition options: #() duration: 300.
-	(window jQuery: '#', self id) show: self presentation slideTransition options: #() duration: 300.
+renderSlideOn: html
+	html h1: 'Call Smalltalk from Javascript'.
+	self renderCodeSnippetOn: html.
+	html div id: 'jsToSmalltalk'
 ! !
 
-!Slide methodsFor: 'rendering'!
-
-renderOn: html
-	html div class: self cssClass; id: self id; with: [
-		self renderSlideOn: html.
-		self renderMetaOn: html]
-!
+FOSDEMSlide subclass: #FOSDEMCanvasSlide
+	instanceVariableNames: 'c2d canvas'
+	category: 'Presentation'!
 
-renderSlideOn: html
-!
+!FOSDEMCanvasSlide methodsFor: 'accessing'!
 
-renderMetaOn: html
-	html div 
-		id: 'meta';
-		with: [
-			html p class: 'title'; with: self presentation title.
-			html p class: 'description'; with: self presentation description.
-			html a class: 'author'; with: self presentation author; href: 'mailto:', self presentation email.
-			html a class: 'url'; with: self presentation url; href: self presentation url]
+cssClass
+	^ 'slide red3d'
 ! !
 
-!Slide class methodsFor: 'instance creation'!
+!FOSDEMCanvasSlide methodsFor: 'drawing'!
 
-on: aPresentation
-	^self new
-		presentation: aPresentation;
-		yourself
+drawOnCanvas
+	|c2d|
+	c2d := canvas element getContext: '2d'.
+	c2d 
+		clearRect: 0 
+		y: 0 
+		width: canvas element width 
+		height: canvas element height.
+	
+	40 atRandom timesRepeat: [ |rgba|
+			rgba := ',' join: {255 atRandom. 255 atRandom. 255 atRandom. 10 atRandom / 10}.
+			c2d	at: 'fillStyle' put: 'rgba(', rgba, ')'.
+			c2d
+				fillRect: 600 atRandom 
+				y: 300 atRandom 
+				width: 200 atRandom 
+				height: 200 atRandom ]
 ! !
 
-Widget subclass: #Presentation
-	instanceVariableNames: 'currentSlide slides'
-	category: 'Presentation'!
-
-!Presentation methodsFor: 'accessing'!
+!FOSDEMCanvasSlide methodsFor: 'rendering'!
 
-title
-	^ self class title.
-!
+renderSlideOn: html
+	html h1: 'Playing with canvas'.
+	canvas := html  canvas 
+				width: 700;
+				height: 400.
 
-author
-	^'John Smith'
-!
+	self updateCanvas.
+! !
 
-url
-	^'http://jtalk-project.org'
-!
+!FOSDEMCanvasSlide methodsFor: 'updating'!
 
-description
-	^'A presentation written in Jtalk'
-!
+updateCanvas
+	self drawOnCanvas.
+	window setTimeout: [self updateCanvas] delay: 500.
+! !
 
-email
-	^'john@smith.com'
-!
+FOSDEMSlide subclass: #FOSDEMJSPlayGroundSlide
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-slides
-	slides ifNil: [self initSlides].
-	^slides
-!
+!FOSDEMJSPlayGroundSlide methodsFor: 'accessing'!
 
-slideClasses
-	^self subclassResponsibility
-!
+codeSnippet
+^'|logo|
+logo:=''img#amberlogo'' asJQuery.
 
-currentSlide
-	^currentSlide
-!
+logo
+  css:''-webkit-transition'' put:''all 10s ease-in-out''.
 
-currentSlide: aSlide
-	currentSlide := aSlide
-!
+<logo.css(''-webkit-transform'', ''rotateY(360deg)'');>.
 
-slideTransition
-	^'fade'
-!
+logo click: [window alert: ''This is cool !!''].
 
-style
-	"Should return a CSS style"
-	^ ''
+logo inspect'.
 ! !
 
-!Presentation methodsFor: 'actions'!
-
-nextSlide
-	| next |
-	self currentSlide ifNotNil: [
-		next := self slides 
-			at: (self currentSlideIndex) + 1
-			ifAbsent: [nil].
-		next ifNotNil: [currentSlide := next. next show]]
-!
+!FOSDEMJSPlayGroundSlide methodsFor: 'rendering'!
 
-showCurrentSlide
-	self currentSlide ifNotNil: [
-		'.slide' asJQuery hide.
-		('#', self currentSlide id) asJQuery show.
-          	'title' asJQuery text: self title, ' - ', self currentSlide id.
-        ]
-!
+renderSlideOn: html
+	html div
+		class: 'section center'; 
+		with: [
+			self renderCodeSnippetOn: html.
+			html img
+				id: 'amberlogo'; 
+				src: 'fosdem2012/images/amber.png'	]
+! !
 
-previousSlide
-	| next |
-	self currentSlide ifNotNil: [
-		next := self slides 
-			at: (self currentSlideIndex) - 1
-			ifAbsent: [nil].
-		next ifNotNil: [currentSlide := next. next show]]
-!
+FOSDEMSlide subclass: #FOSDEMAmberBackend
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-moveAt: anInteger
-	| next |
-	next := self slides 
-			at: anInteger
-			ifAbsent: [nil].
-	next ifNotNil: [currentSlide := next. next show]
-!
+!FOSDEMAmberBackend methodsFor: 'accessing'!
 
-currentSlideIndex
-	^ self slides indexOf: self currentSlide ifAbsent: [1]
+cssClass
+	^ 'slide green3d'
 ! !
 
-!Presentation methodsFor: 'enumerating'!
+!FOSDEMAmberBackend methodsFor: 'rendering'!
 
-slidesDo: aBlockWithArg
-	self slides do: [:aSlide| aBlockWithArg value: aSlide].
+renderSlideOn: html
+	html div
+		class: 'section center';
+		with: [	html h1: 'Need a backend ?'.
+				{'nodejs.png'. 'php.gif'. 'rails.png'.   'pharo.png'. 'ambrhino.jpg'} do: [:aString |
+						html img: 'fosdem2012/images/', aString.
+				]
+		]
 ! !
 
-!Presentation methodsFor: 'initialization'!
+FOSDEMSlide subclass: #FOSDEMBookletSlide
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-initSlides
-	slides := self slideClasses collect: [:each | each on: self]
-! !
+!FOSDEMBookletSlide methodsFor: 'accessing'!
 
-!Presentation methodsFor: 'rendering'!
+cssClass
+	^ 'slide blue3d'
+! !
 
-renderOn: html
-	html style
-		type: 'text/css';
-		with: self style.
-	html div 
-		id: 'slides';
-		with: [self renderSlidesOn: html]
-!
+!FOSDEMBookletSlide methodsFor: 'css'!
 
-renderSlidesOn: html
-	self slides do: [:each | 
-		each renderOn: html].
-	currentSlide ifNil: [currentSlide := self slides first].
-	self showCurrentSlide
+style
+	^ '
+#book { font-size: 1.4em; }
+#book .b-load .b-wrap-right { background-color: #DEC3A9;}
+#book .b-load .b-wrap-left { background-color: #DDD;} 
+'
 ! !
 
-Presentation class instanceVariableNames: 'current'!
+!FOSDEMBookletSlide methodsFor: 'rendering'!
 
-!Presentation class methodsFor: 'accessing'!
+renderSlideOn: html
+	self renderBookOn: html.
+	html link 
+		rel:'stylesheet';
+		href: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.css'.
+	
+	html style: self style.
+	
+	jQuery 
+		getScript: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.min.js' 	
+		do: ['#book' asJQuery booklet: self bookletOptions].
+!
 
-concretePresentations
-	^ self allSubclasses select: [:aPresentationClass| aPresentationClass isConcrete]
+renderBookOn: html
+	html div 
+		id: 'book';
+		with: [	html div
+					class: 'b-load';
+					with: [	html 
+								div: 'Amber makes it easy to plug existing javascript libraires';
+								div: 'Here is an example with the jQuery Booklet plugin';
+								div: 'Want to see how ?';
+								div: [ html button
+										onClick: [Browser openOn: FOSDEMBookletSlide ];
+										with: 'Just browse the code :)'.						] 	
+																							
+					]	
+		].
 !
 
-title
-	^ 'Slides'
+bookletOptions
+	^ #{ 
+		'arrows' -> true.
+		'keyboard' -> false.
+		'pageNumbers' -> false.
+		'closed' -> true
+	}
 ! !
 
-!Presentation class methodsFor: 'enumerating'!
-
-concretePresentationsDo: aBlockWithArg
-	self concretePresentations do: aBlockWithArg.
-! !
+FOSDEMSlide subclass: #FOSDEMIntroSlide
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-!Presentation class methodsFor: 'testing'!
+!FOSDEMIntroSlide methodsFor: 'not yet classified'!
 
-isConcrete
-	^false
+renderSlideOn: html
+	html div class: 'section center animate'; with: [
+		html img src: 'fosdem2012/images/amber.png'.
+		html p: self presentation author.
+          	html p: self presentation description.
+		html p: [
+			html with: self presentation email]].
 ! !
 
 Widget subclass: #PresentationNavigator
@@ -375,45 +382,259 @@ renderOn: html
 					renderPresentationSelectOn: html;
                       			renderSlideSelectOn: html].
 
-	presentationBrush := html div 
-							id: 'presentation';
-							yourself.
+	presentationBrush := html div 
+							id: 'presentation';
+							yourself.
+
+	self checkHash.
+	self renderCurrentPresentation.
+!
+
+renderCurrentPresentation
+	presentationBrush contents: [:html |
+        	self currentPresentation renderOn: html.
+        ].
+	self updateSlideSelect.
+!
+
+renderSlideSelectOn: html
+	slideSelect := html select.
+	slideSelect onChange: [ self  selectSlideAt:  slideSelect asJQuery val ].
+	self updateSlideSelect.
+!
+
+updateSlideSelect
+	slideSelect contents: [:html| |index|
+		                       		index := 0.
+                		       		self currentPresentation slidesDo: [ :aSlide|  
+                                		                                    				index := index + 1.
+                                                		                    				html option
+                                                                		    					value: index;
+                                                            								with: aSlide title ] ].
+! !
+
+!PresentationNavigator class methodsFor: 'initialize'!
+
+initialize
+	^ self open
+!
+
+open
+	^ self new open
+! !
+
+Widget subclass: #Presentation
+	instanceVariableNames: 'currentSlide slides'
+	category: 'Presentation'!
+
+!Presentation methodsFor: 'accessing'!
+
+title
+	^ self class title.
+!
+
+author
+	^'John Smith'
+!
+
+url
+	^'http://jtalk-project.org'
+!
+
+description
+	^'A presentation written in Jtalk'
+!
+
+email
+	^'john@smith.com'
+!
+
+slides
+	slides ifNil: [self initSlides].
+	^slides
+!
+
+slideClasses
+	^self subclassResponsibility
+!
+
+currentSlide
+	^currentSlide
+!
+
+currentSlide: aSlide
+	currentSlide := aSlide
+!
+
+slideTransition
+	^'fade'
+!
+
+style
+	"Should return a CSS style"
+	^ ''
+! !
+
+!Presentation methodsFor: 'actions'!
+
+nextSlide
+	| next |
+	self currentSlide ifNotNil: [
+		next := self slides 
+			at: (self currentSlideIndex) + 1
+			ifAbsent: [nil].
+		next ifNotNil: [currentSlide := next. next show]]
+!
+
+showCurrentSlide
+	self currentSlide ifNotNil: [
+		'.slide' asJQuery hide.
+		('#', self currentSlide id) asJQuery show.
+          	'title' asJQuery text: self title, ' - ', self currentSlide id.
+        ]
+!
+
+previousSlide
+	| next |
+	self currentSlide ifNotNil: [
+		next := self slides 
+			at: (self currentSlideIndex) - 1
+			ifAbsent: [nil].
+		next ifNotNil: [currentSlide := next. next show]]
+!
+
+moveAt: anInteger
+	| next |
+	next := self slides 
+			at: anInteger
+			ifAbsent: [nil].
+	next ifNotNil: [currentSlide := next. next show]
+!
+
+currentSlideIndex
+	^ self slides indexOf: self currentSlide ifAbsent: [1]
+! !
+
+!Presentation methodsFor: 'enumerating'!
+
+slidesDo: aBlockWithArg
+	self slides do: [:aSlide| aBlockWithArg value: aSlide].
+! !
+
+!Presentation methodsFor: 'initialization'!
+
+initSlides
+	slides := self slideClasses collect: [:each | each on: self]
+! !
+
+!Presentation methodsFor: 'rendering'!
+
+renderOn: html
+	html style
+		type: 'text/css';
+		with: self style.
+	html div 
+		id: 'slides';
+		with: [self renderSlidesOn: html]
+!
+
+renderSlidesOn: html
+	self slides do: [:each | 
+		each renderOn: html].
+	currentSlide ifNil: [currentSlide := self slides first].
+	self showCurrentSlide
+! !
+
+Presentation class instanceVariableNames: 'current'!
+
+!Presentation class methodsFor: 'accessing'!
+
+concretePresentations
+	^ self allSubclasses select: [:aPresentationClass| aPresentationClass isConcrete]
+!
+
+title
+	^ 'Slides'
+! !
+
+!Presentation class methodsFor: 'enumerating'!
+
+concretePresentationsDo: aBlockWithArg
+	self concretePresentations do: aBlockWithArg.
+! !
+
+!Presentation class methodsFor: 'testing'!
+
+isConcrete
+	^false
+! !
+
+Widget subclass: #Slide
+	instanceVariableNames: 'presentation'
+	category: 'Presentation'!
+
+!Slide methodsFor: 'accessing'!
+
+presentation
+	^presentation
+!
+
+presentation: aPresentation
+	presentation := aPresentation
+!
 
-	self checkHash.
-	self renderCurrentPresentation.
+id
+	^ self class name
 !
 
-renderCurrentPresentation
-	presentationBrush contents: [:html |
-        	self currentPresentation renderOn: html.
-        ].
-	self updateSlideSelect.
+cssClass
+	^'slide'
 !
 
-renderSlideSelectOn: html
-	slideSelect := html select.
-	slideSelect onChange: [ self  selectSlideAt:  slideSelect asJQuery val ].
-	self updateSlideSelect.
+backgroundColor
+	^'#555'
 !
 
-updateSlideSelect
-	slideSelect contents: [:html| |index|
-		                       		index := 0.
-                		       		self currentPresentation slidesDo: [ :aSlide|  
-                                		                                    				index := index + 1.
-                                                		                    				html option
-                                                                		    					value: index;
-                                                            								with: aSlide title ] ].
+title
+	^ self id
 ! !
 
-!PresentationNavigator class methodsFor: 'initialize'!
+!Slide methodsFor: 'actions'!
 
-initialize
-	^ self open
+show
+	self backgroundColor ifNotNil: [
+		(window jQuery: '#slides') css: 'background' color: self backgroundColor].
+	(window jQuery: '.slide') hide: self presentation slideTransition options: #() duration: 300.
+	(window jQuery: '#', self id) show: self presentation slideTransition options: #() duration: 300.
+! !
+
+!Slide methodsFor: 'rendering'!
+
+renderOn: html
+	html div class: self cssClass; id: self id; with: [
+		self renderSlideOn: html.
+		self renderMetaOn: html]
 !
 
-open
-	^ self new open
+renderSlideOn: html
+!
+
+renderMetaOn: html
+	html div 
+		id: 'meta';
+		with: [
+			html p class: 'title'; with: self presentation title.
+			html p class: 'description'; with: self presentation description.
+			html a class: 'author'; with: self presentation author; href: 'mailto:', self presentation email.
+			html a class: 'url'; with: self presentation url; href: self presentation url]
+! !
+
+!Slide class methodsFor: 'instance creation'!
+
+on: aPresentation
+	^self new
+		presentation: aPresentation;
+		yourself
 ! !
 
 Presentation subclass: #ESUG2011Presentation
@@ -1463,7 +1684,7 @@ body {
 
 
 .slide .CodeMirror {
-    width: 500px;
+    width: 700px;
     height: 300px;
     text-align: left;
 }
@@ -1593,7 +1814,8 @@ slideClasses
 	FOSDEMJSToSmalltalk.
 	FOSDEMBookletSlide.
 	FOSDEMCanvasSlide.
-	FOSDEMAmberBackend
+	FOSDEMAmberBackend.
+	FOSDEMREPLSlide
 }
 ! !
 
@@ -1607,211 +1829,27 @@ title
 	^'Amber'
 ! !
 
-Slide subclass: #FOSDEMIntroSlide
-	instanceVariableNames: ''
-	category: 'Presentation'!
-
-!FOSDEMIntroSlide methodsFor: 'not yet classified'!
-
-renderSlideOn: html
-	html div class: 'section center animate'; with: [
-		html img src: 'fosdem2012/images/amber.png'.
-		html p: self presentation author.
-          	html p: self presentation description.
-		html p: [
-			html with: self presentation email]].
-! !
-
-Slide subclass: #FOSDEMBookletSlide
-	instanceVariableNames: ''
-	category: 'Presentation'!
-
-!FOSDEMBookletSlide methodsFor: 'accessing'!
-
-cssClass
-	^ 'slide blue3d'
-! !
-
-!FOSDEMBookletSlide methodsFor: 'css'!
-
-style
-	^ '
-#book { font-size: 1.4em; }
-#book .b-load .b-wrap-right { background-color: #DEC3A9;}
-#book .b-load .b-wrap-left { background-color: #DDD;} 
-'
-! !
-
-!FOSDEMBookletSlide methodsFor: 'rendering'!
-
-renderSlideOn: html
-	self renderBookOn: html.
-	html link 
-		rel:'stylesheet';
-		href: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.css'.
-	
-	html style: self style.
-	
-	jQuery 
-		getScript: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.min.js' 	
-		do: ['#book' asJQuery booklet: self bookletOptions].
-!
-
-renderBookOn: html
-	html div 
-		id: 'book';
-		with: [	html div
-					class: 'b-load';
-					with: [	html 
-								div: 'Amber makes it easy to plug existing javascript libraires';
-								div: 'Here is an example with the jQuery Booklet plugin';
-								div: 'Want to see how ?';
-								div: [ html button
-										onClick: [Browser openOn: FOSDEMBookletSlide ];
-										with: 'Just browse the code :)'.						] 	
-																							
-					]	
-		].
-!
-
-bookletOptions
-	^ #{ 
-		'arrows' -> true.
-		'keyboard' -> false.
-		'pageNumbers' -> false.
-		'closed' -> true
-	}
-! !
-
-Slide subclass: #FOSDEMAmberBackend
-	instanceVariableNames: ''
-	category: 'Presentation'!
-
-!FOSDEMAmberBackend methodsFor: 'accessing'!
-
-cssClass
-	^ 'slide green3d'
-! !
-
-!FOSDEMAmberBackend methodsFor: 'rendering'!
-
-renderSlideOn: html
-	html div
-		class: 'section center';
-		with: [	html h1: 'Need a backend ?'.
-				{'nodejs.png'. 'php.gif'. 'rails.png'.   'pharo.png'. 'ambrhino.jpg'} do: [:aString |
-						html img: 'fosdem2012/images/', aString.
-				]
-		]
-! !
-
-Slide subclass: #FOSDEMJSPlayGroundSlide
+Slide subclass: #FOSDEMSlide
 	instanceVariableNames: ''
 	category: 'Presentation'!
 
-!FOSDEMJSPlayGroundSlide methodsFor: 'accessing'!
+!FOSDEMSlide methodsFor: 'accessing'!
 
 codeSnippet
-^'|logo|
-logo:=''img#amberlogo'' asJQuery.
-logo
-  css: ''-webkit-transition'' 
-  apply: ''all 10s ease-in-out''.
-
-<logo.css(
-	''-webkit-transform'', 
-	''rotateY(360deg)'');>.
-
-logo click: [
-    window alert: ''This is cool !!''].
-
-logo inspect'.
+	self subclassResponsibility
 ! !
 
-!FOSDEMJSPlayGroundSlide methodsFor: 'rendering'!
-
-renderSlideOn: html
-	html div
-		class: 'section center'; 
-		with: [
-			self renderSnippet: self codeSnippet on: html.
-			html img
-				id: 'amberlogo'; 
-				src: 'fosdem2012/images/amber.png'	]
-!
+!FOSDEMSlide methodsFor: 'rendering'!
 
 renderSnippet: aString on: html
 	(SourceArea new 
 			renderOn: html;
 			editor)  setValue: aString.
-! !
-
-Slide subclass: #FOSDEMCanvasSlide
-	instanceVariableNames: 'c2d canvas'
-	category: 'Presentation'!
-
-!FOSDEMCanvasSlide methodsFor: 'accessing'!
-
-cssClass
-	^ 'slide red3d'
-! !
-
-!FOSDEMCanvasSlide methodsFor: 'drawing'!
-
-drawOnCanvas
-	|c2d|
-	c2d := canvas element getContext: '2d'.
-	c2d 
-		clearRect: 0 
-		y: 0 
-		width: canvas element width 
-		height: canvas element height.
-	
-	40 atRandom timesRepeat: [ |rgba|
-			rgba := ',' join: {255 atRandom. 255 atRandom. 255 atRandom. 10 atRandom / 10}.
-			c2d	at: 'fillStyle' put: 'rgba(', rgba, ')'.
-			c2d
-				fillRect: 600 atRandom 
-				y: 300 atRandom 
-				width: 200 atRandom 
-				height: 200 atRandom ]
-! !
-
-!FOSDEMCanvasSlide methodsFor: 'rendering'!
-
-renderSlideOn: html
-	html h1: 'Playing with canvas'.
-	canvas := html  canvas 
-				width: 700;
-				height: 400.
-
-	self updateCanvas.
-! !
-
-!FOSDEMCanvasSlide methodsFor: 'updating'!
-
-updateCanvas
-	self drawOnCanvas.
-	window setTimeout: [self updateCanvas] delay: 500.
-! !
-
-Slide subclass: #FOSDEMJSToSmalltalk
-	instanceVariableNames: ''
-	category: 'Presentation'!
-
-!FOSDEMJSToSmalltalk methodsFor: 'accessing'!
-
-cssClass
-	^ 'slide blue3d'
-! !
-
-!FOSDEMJSToSmalltalk methodsFor: 'rendering'!
+!
 
-renderSlideOn: html
-	html h1: 'Call Smalltalk from Javascript'.
-	html pre with:
-'var counter = window.smalltalk.Counter._new();
-counter._appendToJQuery_($(''#jsToSmalltalk''));'.
-	html div id: 'jsToSmalltalk'
+renderCodeSnippetOn: html
+	(SourceArea new 
+			renderOn: html;
+			editor)  setValue: self codeSnippet.
 ! !
 

Some files were not shown because too many files changed in this diff