diff --git a/Mooflod/BlElement.extension.st b/Mooflod/BlElement.extension.st
index a6001dd..fc2227d 100644
--- a/Mooflod/BlElement.extension.st
+++ b/Mooflod/BlElement.extension.st
@@ -1,6 +1,6 @@
-Extension { #name : #BlElement }
+Extension { #name : 'BlElement' }
 
-{ #category : #'*Mooflod' }
+{ #category : '*Mooflod' }
 BlElement >> newMooflodSkin [
 
 	^ MfBasicMooflodSkin new
diff --git a/Mooflod/MfBasicMooflodSkin.class.st b/Mooflod/MfBasicMooflodSkin.class.st
index 9d8b0c4..b5325cf 100644
--- a/Mooflod/MfBasicMooflodSkin.class.st
+++ b/Mooflod/MfBasicMooflodSkin.class.st
@@ -3,7 +3,9 @@ I'm the root of all the skins of the MooFlod project.
 
 "
 Class {
-	#name : #MfBasicMooflodSkin,
-	#superclass : #ToBasicSkin,
-	#category : 'Mooflod-Core'
+	#name : 'MfBasicMooflodSkin',
+	#superclass : 'ToBasicSkin',
+	#category : 'Mooflod-Core',
+	#package : 'Mooflod',
+	#tag : 'Core'
 }
diff --git a/Mooflod/MfCircleElement.class.st b/Mooflod/MfCircleElement.class.st
index e41460f..6cb5261 100644
--- a/Mooflod/MfCircleElement.class.st
+++ b/Mooflod/MfCircleElement.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfCircleElement,
-	#superclass : #ToElement,
-	#category : 'Mooflod-FractalCircleWidget'
+	#name : 'MfCircleElement',
+	#superclass : 'ToElement',
+	#category : 'Mooflod-FractalCircleWidget',
+	#package : 'Mooflod',
+	#tag : 'FractalCircleWidget'
 }
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfCircleElement >> initialize [
 
 	super initialize.
diff --git a/Mooflod/MfFilledSquareElement.class.st b/Mooflod/MfFilledSquareElement.class.st
index 2bee2e2..18ca7e8 100644
--- a/Mooflod/MfFilledSquareElement.class.st
+++ b/Mooflod/MfFilledSquareElement.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfFilledSquareElement,
-	#superclass : #ToElement,
+	#name : 'MfFilledSquareElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'currentY',
 		'fill'
@@ -8,10 +8,12 @@ Class {
 	#classVars : [
 		'value'
 	],
-	#category : 'Mooflod-FilledSquareWidget'
+	#category : 'Mooflod-FilledSquareWidget',
+	#package : 'Mooflod',
+	#tag : 'FilledSquareWidget'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfFilledSquareElement class >> exampleSimpleFilledSquare [
 
 	<script>
@@ -28,31 +30,31 @@ MfFilledSquareElement class >> exampleSimpleFilledSquare [
 	^ aSquare
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFilledSquareElement >> currentY [
 
 ^currentY
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFilledSquareElement >> defaultGeometry [ 
 
 ^BlSquareGeometry new 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFilledSquareElement >> fill [ 
 ^fill
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFilledSquareElement >> initFill [
 
 	fill := MfFillingLineElement new .
 	self addChild: fill
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFilledSquareElement >> initialize [
 
 	super initialize.
@@ -64,7 +66,7 @@ MfFilledSquareElement >> initialize [
 	value := 0
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfFilledSquareElement >> openFilledSquare: aSquare [
 
 	| space |
@@ -77,26 +79,26 @@ MfFilledSquareElement >> openFilledSquare: aSquare [
 	^ aSquare
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFilledSquareElement >> setValue: aValue [ 
 	(aValue between: 0 and: 100) ifTrue: [ self value: aValue ].
 	self updateSquare.
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfFilledSquareElement >> squareExtent [
 
 	currentY := 0.
 	^ 200 @ 200
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfFilledSquareElement >> updateFill: anY [
 
 	fill size:200@anY
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfFilledSquareElement >> updateSquare [
 
 	currentY := 0.
@@ -105,12 +107,12 @@ MfFilledSquareElement >> updateSquare [
 		self updateFill: currentY ]
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfFilledSquareElement >> value [ 
 ^value
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFilledSquareElement >> value: aValue [
 
 value:= aValue 
diff --git a/Mooflod/MfFilledSquareElementTest.class.st b/Mooflod/MfFilledSquareElementTest.class.st
index 90bf461..0f6c178 100644
--- a/Mooflod/MfFilledSquareElementTest.class.st
+++ b/Mooflod/MfFilledSquareElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfFilledSquareElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-FilledSquareWidget'
+	#name : 'MfFilledSquareElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-FilledSquareWidget',
+	#package : 'Mooflod',
+	#tag : 'FilledSquareWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfFilledSquareElementTest >> testSquareIsFilledCorrectly [
 
 	| square |
@@ -14,7 +16,7 @@ MfFilledSquareElementTest >> testSquareIsFilledCorrectly [
 	self assert: square currentY equals: 112
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfFilledSquareElementTest >> testSquaredIsNotFilledAtAllAtInitialization [
 
 	| square |
diff --git a/Mooflod/MfFillingLineElement.class.st b/Mooflod/MfFillingLineElement.class.st
index 50dce0b..3e9ca33 100644
--- a/Mooflod/MfFillingLineElement.class.st
+++ b/Mooflod/MfFillingLineElement.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfFillingLineElement,
-	#superclass : #ToElement,
-	#category : 'Mooflod-FilledSquareWidget'
+	#name : 'MfFillingLineElement',
+	#superclass : 'ToElement',
+	#category : 'Mooflod-FilledSquareWidget',
+	#package : 'Mooflod',
+	#tag : 'FilledSquareWidget'
 }
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFillingLineElement >> initialize [
 
 	super initialize.
diff --git a/Mooflod/MfFractalCircleElement.class.st b/Mooflod/MfFractalCircleElement.class.st
index e593b12..5dece35 100644
--- a/Mooflod/MfFractalCircleElement.class.st
+++ b/Mooflod/MfFractalCircleElement.class.st
@@ -1,16 +1,18 @@
 Class {
-	#name : #MfFractalCircleElement,
-	#superclass : #ToElement,
+	#name : 'MfFractalCircleElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'currentX',
 		'currentY',
 		'value',
 		'nbOfChilds'
 	],
-	#category : 'Mooflod-FractalCircleWidget'
+	#category : 'Mooflod-FractalCircleWidget',
+	#package : 'Mooflod',
+	#tag : 'FractalCircleWidget'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfFractalCircleElement class >> exampleSimpleFractalCircle [
 
 	<script>
@@ -26,13 +28,13 @@ MfFractalCircleElement class >> exampleSimpleFractalCircle [
 	^ c
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFractalCircleElement >> circleExtent [
 
 	^ 390 @ 390
 ]
 
-{ #category : #internal }
+{ #category : 'internal' }
 MfFractalCircleElement >> createCircle: x y: anY [
 
 	| c |
@@ -40,7 +42,7 @@ MfFractalCircleElement >> createCircle: x y: anY [
 	self addChild: c
 ]
 
-{ #category : #internal }
+{ #category : 'internal' }
 MfFractalCircleElement >> createCircle: x y: anY color: aColor [
 
 	| c color |
@@ -50,24 +52,24 @@ MfFractalCircleElement >> createCircle: x y: anY color: aColor [
 	self addChild: c
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFractalCircleElement >> currentX [
 
 ^currentX.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFractalCircleElement >> currentY [ 
 ^currentY.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFractalCircleElement >> defaultGeometry [
 
 	^ BlCircleGeometry new matchExtent: self extent.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfFractalCircleElement >> initialize [
 
 	super initialize.
@@ -79,13 +81,13 @@ MfFractalCircleElement >> initialize [
 	value := 0
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfFractalCircleElement >> numberOfCircles [
 
 ^nbOfChilds 
 ]
 
-{ #category : #'public api' }
+{ #category : 'public api' }
 MfFractalCircleElement >> setValue: aValue [
 
 	(aValue between: 0 and: 100)
@@ -95,7 +97,7 @@ MfFractalCircleElement >> setValue: aValue [
 	self updateCircles
 ]
 
-{ #category : #internal }
+{ #category : 'internal' }
 MfFractalCircleElement >> updateCircles [
 
 	| c |
@@ -109,7 +111,7 @@ MfFractalCircleElement >> updateCircles [
 		self createCircle: currentX y: currentY color: c ]
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfFractalCircleElement >> value [
 
 ^value.
diff --git a/Mooflod/MfFractalCircleElementTest.class.st b/Mooflod/MfFractalCircleElementTest.class.st
index a9c0082..e92c623 100644
--- a/Mooflod/MfFractalCircleElementTest.class.st
+++ b/Mooflod/MfFractalCircleElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfFractalCircleElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-FractalCircleWidget'
+	#name : 'MfFractalCircleElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-FractalCircleWidget',
+	#package : 'Mooflod',
+	#tag : 'FractalCircleWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfFractalCircleElementTest >> testIfCirclesAreAddedCorrectly [
 
 	| circle |
@@ -14,7 +16,7 @@ MfFractalCircleElementTest >> testIfCirclesAreAddedCorrectly [
 	self assert: circle numberOfCircles equals: 20.
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfFractalCircleElementTest >> testIfValueIsInitializedCorrectly [
 
 	| circle |
@@ -23,7 +25,7 @@ MfFractalCircleElementTest >> testIfValueIsInitializedCorrectly [
 	self assert: circle value equals: 12
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfFractalCircleElementTest >> testNothingAddedIfValueIsTooHigh [
 
 	| circle |
diff --git a/Mooflod/MfInputElementSkin.class.st b/Mooflod/MfInputElementSkin.class.st
index a301fb5..9d440ac 100644
--- a/Mooflod/MfInputElementSkin.class.st
+++ b/Mooflod/MfInputElementSkin.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfInputElementSkin,
-	#superclass : #MfBasicMooflodSkin,
-	#category : 'Mooflod-InputWidget'
+	#name : 'MfInputElementSkin',
+	#superclass : 'MfBasicMooflodSkin',
+	#category : 'Mooflod-InputWidget',
+	#package : 'Mooflod',
+	#tag : 'InputWidget'
 }
 
-{ #category : #'event handling' }
+{ #category : 'event handling' }
 MfInputElementSkin >> installLookEvent: anEvent [
 	"when installing the skin, changes the properties of widget mentionned down here"
 
diff --git a/Mooflod/MfKeyboardElement.class.st b/Mooflod/MfKeyboardElement.class.st
index 3a1d11e..8a9f7a0 100644
--- a/Mooflod/MfKeyboardElement.class.st
+++ b/Mooflod/MfKeyboardElement.class.st
@@ -3,22 +3,24 @@ This is copy of the original bloc BlDevKeyboardElement.
 In particular this keyboard works independently from the language layout. 
 "
 Class {
-	#name : #MfKeyboardElement,
-	#superclass : #ToElement,
+	#name : 'MfKeyboardElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'keymap'
 	],
-	#category : 'Mooflod-KeyboardWidget'
+	#category : 'Mooflod-KeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'KeyboardWidget'
 }
 
-{ #category : #examples }
+{ #category : 'examples' }
 MfKeyboardElement class >> example [
 
 	<script>
 	self new openInSpace
 ]
 
-{ #category : #examples }
+{ #category : 'examples' }
 MfKeyboardElement class >> exampleSimpleKeyboard [
 
 	<script>
@@ -36,14 +38,14 @@ MfKeyboardElement class >> exampleSimpleKeyboard [
 	^ space
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> addButton: anElement key: aKey [
 	"add the key passed as parameter to the key dictionnary"
 	keymap at: aKey put: anElement.
 	self addChild: anElement
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initialize [
 
 	super initialize.
@@ -59,7 +61,7 @@ MfKeyboardElement >> initialize [
 	self requestFocus.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeBottomRow [
 	"add all keys from the bottom row of keyboard"
 	self addButton: (self simpleSmallKey: 'fn') key: KeyboardKey function.
@@ -76,7 +78,7 @@ MfKeyboardElement >> initializeBottomRow [
 	self addButton: (self simpleSmallKey: 'down') key: KeyboardKey down.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeEventListeners [
 	"when pressing a key, changes the color of it and notify a down/unknown if the key is not in the dico"
 
@@ -96,7 +98,7 @@ MfKeyboardElement >> initializeEventListeners [
 			ifPresent: [ :aButton | aButton background: Color black ] ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeFirstRow [
 	| theKeys |
 	"add all keys from first row to the keys dico"
@@ -110,7 +112,7 @@ MfKeyboardElement >> initializeFirstRow [
 	self addButton: (self simpleKey: '\') key: KeyboardKey backslash.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeKeys [
 	self initializeTopRow.
 	self initializeFirstRow.
@@ -119,7 +121,7 @@ MfKeyboardElement >> initializeKeys [
 	self initializeBottomRow
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeSecondRow [
 	| theKeys |
 	
@@ -133,7 +135,7 @@ MfKeyboardElement >> initializeSecondRow [
 	self addButton: (self wideKey: 'return' span: 1.8) key: KeyboardKey enter.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeThirdRow [
 	| theKeys |
 	"add all keys in the third row, for example the shift left key is a big key
@@ -150,7 +152,7 @@ MfKeyboardElement >> initializeThirdRow [
 	self addButton: (self wideKey: 'shift' span: 2.42) key: KeyboardKey shiftRight.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfKeyboardElement >> initializeTopRow [
 	| theKeys |
 	
@@ -164,25 +166,25 @@ MfKeyboardElement >> initializeTopRow [
 	self addButton: (self wideKey: 'delete' span: 1.45) key: KeyboardKey backspace.
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> keyboardHeight [
 "sets the keyboard widget height"
 	^ (5 * self rowHeight) + ((5 * 2 + 1) * self spacing)
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> keyboardWidth [
 	"sets the keyboard widget width"
 	^ self rowWidth
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfKeyboardElement >> keymap [ 
 
 	^keymap.
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfKeyboardElement >> newButton: anExtent [
 	"creates an instance of button and give its graphical properties"
 
@@ -199,17 +201,17 @@ MfKeyboardElement >> newButton: anExtent [
 		  background: Color black
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> rowHeight [
 	^ 35
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> rowWidth [
 	^ (13 * self simpleKeyWidth) + (self wideWidth: 1.5) + ((14 * 2) * self spacing)
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfKeyboardElement >> simpleKey: aString [
 
 	| button label |
@@ -230,17 +232,17 @@ MfKeyboardElement >> simpleKey: aString [
 	^ button
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> simpleKeyExtent [
 	^ self simpleKeyWidth @ self rowHeight
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> simpleKeyWidth [
 	^ self rowHeight * 1.2
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfKeyboardElement >> simpleSmallKey: aString [
 
 	| button label |
@@ -260,12 +262,12 @@ MfKeyboardElement >> simpleSmallKey: aString [
 	^ button
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> spacing [
 	^ 5
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfKeyboardElement >> wideKey: aString span: aNumber [
 
 	| button label |
@@ -285,7 +287,7 @@ MfKeyboardElement >> wideKey: aString span: aNumber [
 	^ button
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfKeyboardElement >> wideSmallKey: aString span: aNumber [
 
 	| button label |
@@ -305,7 +307,7 @@ MfKeyboardElement >> wideSmallKey: aString span: aNumber [
 	^ button
 ]
 
-{ #category : #geometry }
+{ #category : 'geometry' }
 MfKeyboardElement >> wideWidth: aNumber [
 	^ ((self simpleKeyWidth * aNumber) + self spacing)
 ]
diff --git a/Mooflod/MfKeyboardElementTest.class.st b/Mooflod/MfKeyboardElementTest.class.st
index 011a12d..2f6bfe9 100644
--- a/Mooflod/MfKeyboardElementTest.class.st
+++ b/Mooflod/MfKeyboardElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfKeyboardElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-KeyboardWidget'
+	#name : 'MfKeyboardElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-KeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'KeyboardWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfKeyboardElementTest >> testAllKeysAreInDicts [
 
 | keyB |		
@@ -14,7 +16,7 @@ self assert: keyB children size equals: 64.
 
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfKeyboardElementTest >> testWhenKeyPressedItsColorChanges [
 
 	| keyB |
diff --git a/Mooflod/MfMixingButtonElement.class.st b/Mooflod/MfMixingButtonElement.class.st
index 575a14f..553b3a9 100644
--- a/Mooflod/MfMixingButtonElement.class.st
+++ b/Mooflod/MfMixingButtonElement.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfMixingButtonElement,
-	#superclass : #ToElement,
-	#category : 'Mooflod-MixingTableWidget'
+	#name : 'MfMixingButtonElement',
+	#superclass : 'ToElement',
+	#category : 'Mooflod-MixingTableWidget',
+	#package : 'Mooflod',
+	#tag : 'MixingTableWidget'
 }
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfMixingButtonElement >> initialize [
 
 	super initialize.
diff --git a/Mooflod/MfMixingTableElement.class.st b/Mooflod/MfMixingTableElement.class.st
index 9e26bd1..a3ce029 100644
--- a/Mooflod/MfMixingTableElement.class.st
+++ b/Mooflod/MfMixingTableElement.class.st
@@ -2,17 +2,19 @@
 The key binding are using the physical position so that it works on any keyboard (the key Q on qwerty is the same as the key A on Azerty).
 "
 Class {
-	#name : #MfMixingTableElement,
-	#superclass : #ToElement,
+	#name : 'MfMixingTableElement',
+	#superclass : 'ToElement',
 	#classVars : [
 		'keymap',
 		'nbButtonPerRow',
 		'nbButtons'
 	],
-	#category : 'Mooflod-MixingTableWidget'
+	#category : 'Mooflod-MixingTableWidget',
+	#package : 'Mooflod',
+	#tag : 'MixingTableWidget'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfMixingTableElement class >> exampleMixingTable [
 
 	<script>
@@ -27,7 +29,7 @@ MfMixingTableElement class >> exampleMixingTable [
 	^ mT
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfMixingTableElement >> addButton: anElement key: aKey [
 	"add the key passed as parameter to the key dictionnary"
 
@@ -36,13 +38,13 @@ MfMixingTableElement >> addButton: anElement key: aKey [
 	
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfMixingTableElement >> defaultGeometry [
 	^ BlRectangleGeometry new
 	
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfMixingTableElement >> initialize [
 
 	super initialize.
@@ -57,7 +59,7 @@ MfMixingTableElement >> initialize [
 		aLayoutConstraints vertical fitContent ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfMixingTableElement >> initializeEventListeners [
 	"add the handler that changes color when pressing a key"
 
@@ -72,7 +74,7 @@ MfMixingTableElement >> initializeEventListeners [
 	self requestFocus
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfMixingTableElement >> initializeKeys [
 	"create the keys that will be associated to buttons"
 
@@ -85,40 +87,40 @@ MfMixingTableElement >> initializeKeys [
 	self initializeEventListeners
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfMixingTableElement >> keymap [
 
 
 ^keymap
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> nbButtonPerRow [
 
 	^ nbButtonPerRow 
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> nbButtonPerRow: rows [
 
 	nbButtonPerRow  := rows.
 	self layout columnCount: nbButtonPerRow 
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> nbButtons [
 
 ^nbButtons 
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> nbButtons: buttons [
 
 	nbButtons := buttons.
 	self initializeKeys
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> redefineKeys: keys [
 
 	| v |
@@ -131,7 +133,7 @@ MfMixingTableElement >> redefineKeys: keys [
 	self initializeEventListeners
 ]
 
-{ #category : #'as yet unclassified' }
+{ #category : 'as yet unclassified' }
 MfMixingTableElement >> tableExtent [
 
 	^ 400 @ 200
diff --git a/Mooflod/MfMixingTableTests.class.st b/Mooflod/MfMixingTableTests.class.st
index 61e5383..004931d 100644
--- a/Mooflod/MfMixingTableTests.class.st
+++ b/Mooflod/MfMixingTableTests.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfMixingTableTests,
-	#superclass : #TestCase,
-	#category : 'Mooflod-MixingTableWidget'
+	#name : 'MfMixingTableTests',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-MixingTableWidget',
+	#package : 'Mooflod',
+	#tag : 'MixingTableWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfMixingTableTests >> testIfPressingKeyTurnOnButton [
 
 	| m |
diff --git a/Mooflod/MfMooflodRootSkin.class.st b/Mooflod/MfMooflodRootSkin.class.st
index 0103595..149dc29 100644
--- a/Mooflod/MfMooflodRootSkin.class.st
+++ b/Mooflod/MfMooflodRootSkin.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfMooflodRootSkin,
-	#superclass : #ToRawSkin,
-	#category : 'Mooflod-Core'
+	#name : 'MfMooflodRootSkin',
+	#superclass : 'ToRawSkin',
+	#category : 'Mooflod-Core',
+	#package : 'Mooflod',
+	#tag : 'Core'
 }
 
-{ #category : #'event handling' }
+{ #category : 'event handling' }
 MfMooflodRootSkin >> installLookEvent: anEvent [
 
 	super installLookEvent: anEvent.
diff --git a/Mooflod/MfMooflodTheme.class.st b/Mooflod/MfMooflodTheme.class.st
index 3b623b3..0f8bb61 100644
--- a/Mooflod/MfMooflodTheme.class.st
+++ b/Mooflod/MfMooflodTheme.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfMooflodTheme,
-	#superclass : #ToTheme,
-	#category : 'Mooflod-Core'
+	#name : 'MfMooflodTheme',
+	#superclass : 'ToTheme',
+	#category : 'Mooflod-Core',
+	#package : 'Mooflod',
+	#tag : 'Core'
 }
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfMooflodTheme class >> defaultTokenProperties [
 	"define here token properties of the widget theme"
 
@@ -64,13 +66,13 @@ MfMooflodTheme class >> defaultTokenProperties [
 			   value: Color white) }
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfMooflodTheme >> newRootSkinInstance [
 
 	^ MfMooflodRootSkin new
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfMooflodTheme >> newSkinInstanceFor: anElement [
 
 	| space |
diff --git a/Mooflod/MfNumberInputElement.class.st b/Mooflod/MfNumberInputElement.class.st
index 43d9644..90565db 100644
--- a/Mooflod/MfNumberInputElement.class.st
+++ b/Mooflod/MfNumberInputElement.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfNumberInputElement,
-	#superclass : #ToElement,
+	#name : 'MfNumberInputElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'plus',
 		'minus',
@@ -9,10 +9,12 @@ Class {
 		'inputLabel',
 		'validateValueBlock'
 	],
-	#category : 'Mooflod-InputWidget'
+	#category : 'Mooflod-InputWidget',
+	#package : 'Mooflod',
+	#tag : 'InputWidget'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfNumberInputElement class >> openInputWithSkin [
 
 	<script>
@@ -25,7 +27,7 @@ MfNumberInputElement class >> openInputWithSkin [
 	^ anInput
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> changeValueTo: aValue [
 
 	inputValue text: (self configuredString: aValue asString).
@@ -33,14 +35,14 @@ MfNumberInputElement >> changeValueTo: aValue [
 	value := aValue
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> configuredString: aString [
 
 	^ aString asRopedText attributes: { (BlTextForegroundAttribute paint: Color white) }.
 	
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> createCircle [
 
 	| circle |
@@ -52,7 +54,7 @@ MfNumberInputElement >> createCircle [
 	^ circle
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> decreaseInput [
 	
 	(validateValueBlock value: value - 1) ifTrue: [
@@ -60,7 +62,7 @@ MfNumberInputElement >> decreaseInput [
 		self changeValueTo: value ]
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> increaseInput [
 
 	(validateValueBlock value: value + 1) ifTrue: [
@@ -68,7 +70,7 @@ MfNumberInputElement >> increaseInput [
 		self changeValueTo: value ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfNumberInputElement >> initialize [
 
 	super initialize.
@@ -85,7 +87,7 @@ MfNumberInputElement >> initialize [
 	self initializePlusButton
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfNumberInputElement >> initializeInputValue: aValue [
 
 	inputValue := BlTextElement new.
@@ -96,7 +98,7 @@ MfNumberInputElement >> initializeInputValue: aValue [
 	self addChild: inputValue
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> initializeMinusButton [
 
 	| text |
@@ -116,7 +118,7 @@ MfNumberInputElement >> initializeMinusButton [
 	self addChild: minus
 ]
 
-{ #category : #buttons }
+{ #category : 'buttons' }
 MfNumberInputElement >> initializePlusButton [
 
 	| text |
@@ -137,19 +139,19 @@ MfNumberInputElement >> initializePlusButton [
 	self addChild: plus
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfNumberInputElement >> inputExtent [ 
 
 	^ 300@120
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfNumberInputElement >> label [
 
 	^ inputLabel 
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfNumberInputElement >> label: aString [
 
 	inputLabel := BlTextElement new.
@@ -162,41 +164,41 @@ MfNumberInputElement >> label: aString [
 	self addChild: inputLabel
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfNumberInputElement >> minus [
 	^ minus
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfNumberInputElement >> newMooflodSkin [
 
 	^ MfInputElementSkin new
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfNumberInputElement >> plus [
 	^ plus
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfNumberInputElement >> validateValueBlock [
 
 	^ validateValueBlock
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfNumberInputElement >> validateValueBlock: aBlock [
 
 	validateValueBlock := aBlock
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfNumberInputElement >> value [
 
 	^ value
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfNumberInputElement >> value: anInteger [
 
 	value := anInteger 
diff --git a/Mooflod/MfNumberInputElementTest.class.st b/Mooflod/MfNumberInputElementTest.class.st
index 242efae..3eed862 100644
--- a/Mooflod/MfNumberInputElementTest.class.st
+++ b/Mooflod/MfNumberInputElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfNumberInputElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-InputWidget'
+	#name : 'MfNumberInputElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-InputWidget',
+	#package : 'Mooflod',
+	#tag : 'InputWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfNumberInputElementTest >> testCanChangeLabel [
 
 	| inputElem |
@@ -14,7 +16,7 @@ MfNumberInputElementTest >> testCanChangeLabel [
 	self assert: inputElem label text asString equals: 'Volume'
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfNumberInputElementTest >> testEverythingIsInitializedCorrectly [
 
 	| inputElem |
@@ -22,7 +24,7 @@ MfNumberInputElementTest >> testEverythingIsInitializedCorrectly [
 	self assert: inputElem children size equals: 4
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfNumberInputElementTest >> testValueCantBeNegative [
 
 	| inputElem value |
@@ -33,7 +35,7 @@ MfNumberInputElementTest >> testValueCantBeNegative [
 	self assert: value equals: 0
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfNumberInputElementTest >> testValueUpdatedOnClick [
 
 	| inputElem |
diff --git a/Mooflod/MfPatternElement.class.st b/Mooflod/MfPatternElement.class.st
index a87ccb0..e14709a 100644
--- a/Mooflod/MfPatternElement.class.st
+++ b/Mooflod/MfPatternElement.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfPatternElement,
-	#superclass : #ToElement,
+	#name : 'MfPatternElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'nbOfSteps'
 	],
@@ -9,10 +9,12 @@ Class {
 		'min',
 		'nbsteps'
 	],
-	#category : 'Mooflod-PatternWidget'
+	#category : 'Mooflod-PatternWidget',
+	#package : 'Mooflod',
+	#tag : 'PatternWidget'
 }
 
-{ #category : #examples }
+{ #category : 'examples' }
 MfPatternElement class >> exampleSimplePattern [
 
 	<script>
@@ -25,11 +27,12 @@ MfPatternElement class >> exampleSimplePattern [
 	space root addChild: patternelem.
 	space toTheme: MfMooflodTheme new.
 	patternelem transformDo: [ :c | c translateBy: 180 @ 200 ].
+	patternelem forSequencer: 16 upbeats .
 	space show.
 	^ patternelem
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfPatternElement >> addInstrumentToStep [
 	"Change the value of the drum attribute for the bar clicked, and update his color for visualization undestanding"
 
@@ -44,7 +47,30 @@ MfPatternElement >> addInstrumentToStep [
 					child removeInstrument  ] ] ]
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
+MfPatternElement >> addSeqStepsToThePattern: anArrayOfGates [
+	"Add all bars element in the pattern to display them"
+
+	
+"add steps element to a MfPatternElement where black are gates and white are rests"
+
+| step changingX nbSteps colors|
+nbSteps := anArrayOfGates size.
+colors := Array with: Color white with: Color black.
+	nbOfSteps := 0.
+	changingX := 2.5.
+	(nbSteps between: min and: max) ifTrue: [
+		nbOfSteps := nbSteps.
+		anArrayOfGates do: [ :i |
+			step := MfStepElement new background: (colors at: i + 1).
+			step transformDo: [ :t | t translateBy: changingX @ 0 ].
+			changingX := changingX + 35.
+			self addChild: step] ].
+	self size: 35 * nbSteps @ 60.
+	self addInstrumentToStep
+]
+
+{ #category : 'adding' }
 MfPatternElement >> addStepsToThePattern: nbSteps [
 	"Add all bars element in the pattern to display them"
 
@@ -62,13 +88,21 @@ MfPatternElement >> addStepsToThePattern: nbSteps [
 	self addInstrumentToStep
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfPatternElement >> backgroundPaint [ 
 	"Define the background for the pattern"
 	^ Color red
 ]
 
-{ #category : #initialization }
+{ #category : 'adding' }
+MfPatternElement >> forSequencer: aSequencer [
+"creates a visualization of a Sequencer, where gates are black squares and rests are white squares"
+self min: 1.
+self max: aSequencer gates size.
+self nbsSequencerStep: aSequencer gates 
+]
+
+{ #category : 'initialization' }
 MfPatternElement >> initialize [
 
 	super initialize.
@@ -77,56 +111,63 @@ MfPatternElement >> initialize [
 	self layout: BlFrameLayout new.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> max [ 
 	
 	^max.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> max: aMax [
 
 	max:= aMax.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> min [ 
 
 	^min.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> min: aMin [
 
 	min:= aMin.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> nbOfSteps [
 
 	^ nbOfSteps
 ]
 
-{ #category : #accessing }
+{ #category : 'adding' }
+MfPatternElement >> nbsSequencerStep: anArrayOfGates [
+
+	nbsteps :=anArrayOfGates size.
+	self addSeqStepsToThePattern: anArrayOfGates 
+]
+
+{ #category : 'accessing' }
 MfPatternElement >> nbsteps [
 
 	^ nbsteps
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPatternElement >> nbsteps: someNbSteps [
 
 	nbsteps := someNbSteps.
 	self addStepsToThePattern: nbsteps
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPatternElement >> newMooFlodSkin [
 
 	^ MfPatternElementSkin new
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfPatternElement >> patternExtent [
 
 	^ 36@60
diff --git a/Mooflod/MfPatternElementSkin.class.st b/Mooflod/MfPatternElementSkin.class.st
index 5a5f74a..8ee3418 100644
--- a/Mooflod/MfPatternElementSkin.class.st
+++ b/Mooflod/MfPatternElementSkin.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfPatternElementSkin,
-	#superclass : #MfBasicMooflodSkin,
-	#category : 'Mooflod-PatternWidget'
+	#name : 'MfPatternElementSkin',
+	#superclass : 'MfBasicMooflodSkin',
+	#category : 'Mooflod-PatternWidget',
+	#package : 'Mooflod',
+	#tag : 'PatternWidget'
 }
 
-{ #category : #'event handling' }
+{ #category : 'event handling' }
 MfPatternElementSkin >> installLookEvent: anEvent [
 	"when installing the skin, changes the properties of widget mentionned down here"
 
diff --git a/Mooflod/MfPatternElementTest.class.st b/Mooflod/MfPatternElementTest.class.st
index 7da2603..6a4c084 100644
--- a/Mooflod/MfPatternElementTest.class.st
+++ b/Mooflod/MfPatternElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfPatternElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-PatternWidget'
+	#name : 'MfPatternElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-PatternWidget',
+	#package : 'Mooflod',
+	#tag : 'PatternWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPatternElementTest >> testIfInstrumentAssignedOnClick [
 
 	| patternElem |
@@ -19,7 +21,7 @@ MfPatternElementTest >> testIfInstrumentAssignedOnClick [
 		self assert: e instrument equals: true "Now all bars have a drum assigned" ]
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPatternElementTest >> testInstrumentRemovedOnClick [
 
 	| patternElem |
@@ -36,7 +38,7 @@ MfPatternElementTest >> testInstrumentRemovedOnClick [
 		self assert: e instrument equals: false "Now all bars have no drums, same as creation state" ]
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPatternElementTest >> testPatternIsEmptyIfNbStepsNotValid [
 
 	| patternE1 patternE2 |
@@ -53,7 +55,7 @@ MfPatternElementTest >> testPatternIsEmptyIfNbStepsNotValid [
 	self assert: patternE2 nbOfSteps equals: 0 "Bars not added to element, under the min"
 ]
 
-{ #category : #'test-init' }
+{ #category : 'test-init' }
 MfPatternElementTest >> testStepAreInitializedCorrectlyInPattern [
 
 	| patternElem |
diff --git a/Mooflod/MfPerformanceStepsDisplayer.class.st b/Mooflod/MfPerformanceStepsDisplayer.class.st
index bebfb39..57a88a9 100644
--- a/Mooflod/MfPerformanceStepsDisplayer.class.st
+++ b/Mooflod/MfPerformanceStepsDisplayer.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfPerformanceStepsDisplayer,
-	#superclass : #ToElement,
+	#name : 'MfPerformanceStepsDisplayer',
+	#superclass : 'ToElement',
 	#instVars : [
 		'label',
 		'nbSteps',
@@ -8,10 +8,12 @@ Class {
 		'animation',
 		'animationIsRunning'
 	],
-	#category : 'Mooflod-PerformanceStepsDisplayer'
+	#category : 'Mooflod-PerformanceStepsDisplayer',
+	#package : 'Mooflod',
+	#tag : 'PerformanceStepsDisplayer'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfPerformanceStepsDisplayer class >> exampleNbSteps [
 
 	<script>
@@ -27,7 +29,7 @@ MfPerformanceStepsDisplayer class >> exampleNbSteps [
 	^ s
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfPerformanceStepsDisplayer >> addSteps: aNbOfSteps [
 
 	(aNbOfSteps between: 0 and: 30000) ifFalse: [ ^ self ].
@@ -35,25 +37,25 @@ MfPerformanceStepsDisplayer >> addSteps: aNbOfSteps [
 	self initializeStepsLabel
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> animation [
 
 	^ animation
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> animationIsRunning [
 
 	^ animationIsRunning 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> animationIsRunning: aBoolean [
 
 	animationIsRunning := aBoolean
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPerformanceStepsDisplayer >> initialize [
 
 	super initialize.
@@ -63,7 +65,7 @@ MfPerformanceStepsDisplayer >> initialize [
 	animationIsRunning := false
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPerformanceStepsDisplayer >> initializeAnimation: aBpm [
 
 	animationIsRunning := true.
@@ -79,7 +81,7 @@ MfPerformanceStepsDisplayer >> initializeAnimation: aBpm [
 	self addAnimation: animation
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPerformanceStepsDisplayer >> initializeStepsLabel [
 
 	text := BlTextElement new.
@@ -106,37 +108,25 @@ MfPerformanceStepsDisplayer >> initializeStepsLabel [
 	self initializeAnimation: 139
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> label [ 
 
 ^label
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> nbSteps [
 
 ^nbSteps
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfPerformanceStepsDisplayer >> newMooflodSkin [
 
 	^ MfPerformanceStepsDisplayerSkin new 
 ]
 
-{ #category : #'as yet unclassified' }
-MfPerformanceStepsDisplayer >> pauseAnimation: aDuration [
-
-	animation := BlAnimation new duration: aDuration seconds.
-	animation loops: 1.
-	animation addEventHandler: (BlEventHandler
-			 on: BlAnimationLoopDoneEvent
-			 do: [ :e |
-				self animationIsRunning: false]).
-	self addAnimation: animation
-]
-
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPerformanceStepsDisplayer >> setStepsLabel: aNbOfSteps [
 
 	label text: (nbSteps asString asRopedText attributes:
@@ -145,7 +135,7 @@ MfPerformanceStepsDisplayer >> setStepsLabel: aNbOfSteps [
 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPerformanceStepsDisplayer >> text [
 ^text
 ]
diff --git a/Mooflod/MfPerformanceStepsDisplayerSkin.class.st b/Mooflod/MfPerformanceStepsDisplayerSkin.class.st
index 5f21963..b5b5622 100644
--- a/Mooflod/MfPerformanceStepsDisplayerSkin.class.st
+++ b/Mooflod/MfPerformanceStepsDisplayerSkin.class.st
@@ -1,9 +1,11 @@
 Class {
-	#name : #MfPerformanceStepsDisplayerSkin,
-	#superclass : #MfBasicMooflodSkin,
+	#name : 'MfPerformanceStepsDisplayerSkin',
+	#superclass : 'MfBasicMooflodSkin',
 	#instVars : [
 		'label',
 		'nbSteps'
 	],
-	#category : 'Mooflod-PerformanceStepsDisplayer'
+	#category : 'Mooflod-PerformanceStepsDisplayer',
+	#package : 'Mooflod',
+	#tag : 'PerformanceStepsDisplayer'
 }
diff --git a/Mooflod/MfPerformanceStepsDisplayerTests.class.st b/Mooflod/MfPerformanceStepsDisplayerTests.class.st
index 035c1b5..d6dbd47 100644
--- a/Mooflod/MfPerformanceStepsDisplayerTests.class.st
+++ b/Mooflod/MfPerformanceStepsDisplayerTests.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfPerformanceStepsDisplayerTests,
-	#superclass : #TestCase,
-	#category : 'Mooflod-PerformanceStepsDisplayer'
+	#name : 'MfPerformanceStepsDisplayerTests',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-PerformanceStepsDisplayer',
+	#package : 'Mooflod',
+	#tag : 'PerformanceStepsDisplayer'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPerformanceStepsDisplayerTests >> testAnimationStartsWhenAddingSteps [
 
 		| displayer |
@@ -16,7 +18,7 @@ MfPerformanceStepsDisplayerTests >> testAnimationStartsWhenAddingSteps [
 	self assert: displayer animationIsRunning equals: true
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPerformanceStepsDisplayerTests >> testStepsCantBeOver30000 [
 
 	| displayer |
diff --git a/Mooflod/MfPianoBlackNoteElement.class.st b/Mooflod/MfPianoBlackNoteElement.class.st
index d7cf3b9..d008f59 100644
--- a/Mooflod/MfPianoBlackNoteElement.class.st
+++ b/Mooflod/MfPianoBlackNoteElement.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfPianoBlackNoteElement,
-	#superclass : #ToElement,
-	#category : 'Mooflod-PianoKeyboardWidget'
+	#name : 'MfPianoBlackNoteElement',
+	#superclass : 'ToElement',
+	#category : 'Mooflod-PianoKeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'PianoKeyboardWidget'
 }
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfPianoBlackNoteElement class >> newWithColor: aColor [
 
 	^ self new
@@ -12,7 +14,7 @@ MfPianoBlackNoteElement class >> newWithColor: aColor [
 		  yourself
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoBlackNoteElement >> initialize [
 
 	super initialize.
diff --git a/Mooflod/MfPianoElement.class.st b/Mooflod/MfPianoElement.class.st
index cff9a2c..ba53cae 100644
--- a/Mooflod/MfPianoElement.class.st
+++ b/Mooflod/MfPianoElement.class.st
@@ -5,8 +5,8 @@ I represent a 2 octaves piano.
 I should get a call back that it invoked when pressed. 
 "
 Class {
-	#name : #MfPianoElement,
-	#superclass : #ToElement,
+	#name : 'MfPianoElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'whiteKeyColor',
 		'blackKeyColor',
@@ -16,10 +16,12 @@ Class {
 		'xPositionOfBlackNotes',
 		'blacknotes'
 	],
-	#category : 'Mooflod-PianoKeyboardWidget'
+	#category : 'Mooflod-PianoKeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'PianoKeyboardWidget'
 }
 
-{ #category : #examples }
+{ #category : 'examples' }
 MfPianoElement class >> openPiano [
 
 	<script>
@@ -35,18 +37,18 @@ MfPianoElement class >> openPiano [
 	^ space
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfPianoElement >> backgroundPaint [ 
 
 	^ Color black.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> blacknotes [
 	^ blacknotes
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoElement >> initialize [
 
 	super initialize.
@@ -59,7 +61,7 @@ MfPianoElement >> initialize [
 		startNote: 'C'
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoElement >> initializeBlackHandlers [
 
 	blacknotes do: [ :n |
@@ -74,7 +76,7 @@ MfPianoElement >> initializeBlackHandlers [
 			do: [ :evt | n background: blackKeyColor ] ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoElement >> initializeNotes [
 
 	| wN wx bN bx whiteNoteDescriptions blackNoteXArray array |
@@ -116,7 +118,7 @@ MfPianoElement >> initializeNotes [
 	^ blackNoteXArray
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoElement >> initializeWhiteHandlers [
 
 	whitenotes do: [ :n |
@@ -131,7 +133,7 @@ MfPianoElement >> initializeWhiteHandlers [
 			do: [ :evt | n background: whiteKeyColor ] ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoElement >> initializeXPositionsOfBlackNotes [
 
 	| cA dA eA fA gA aA bA |
@@ -156,32 +158,32 @@ MfPianoElement >> initializeXPositionsOfBlackNotes [
 		                         bA }
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> nOctaves [
 
 ^nOctaves 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> nOctaves: num [
 
 	nOctaves := num.
 		self size: self pianoExtent.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> pianoExtent [
 
 	^ (252.5 *nOctaves)  @ 130
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> startNote [
 
 ^startNote 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> startNote: aNote [
 
 	startNote := aNote.
@@ -189,12 +191,12 @@ MfPianoElement >> startNote: aNote [
 	self initializeNotes 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> whiteKeyColor [
 	^ whiteKeyColor
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoElement >> whitenotes [
 
 ^whitenotes
diff --git a/Mooflod/MfPianoTests.class.st b/Mooflod/MfPianoTests.class.st
index 8cd6f3e..ad62cae 100644
--- a/Mooflod/MfPianoTests.class.st
+++ b/Mooflod/MfPianoTests.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfPianoTests,
-	#superclass : #TestCase,
-	#category : 'Mooflod-PianoKeyboardWidget'
+	#name : 'MfPianoTests',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-PianoKeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'PianoKeyboardWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPianoTests >> testNoteChangesOnClick [
 
 	| p |
@@ -17,7 +19,7 @@ MfPianoTests >> testNoteChangesOnClick [
 		self assert: n background paint color equals: Color lightGray ]
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPianoTests >> testNotesInitializedCorrectly [
 
 	| p |
@@ -25,7 +27,7 @@ MfPianoTests >> testNotesInitializedCorrectly [
 	self assert: p whitenotes size + p blacknotes size  equals: 24
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPianoTests >> testStartingNoteUpdatePiano [
 
 	| p |
@@ -36,7 +38,7 @@ MfPianoTests >> testStartingNoteUpdatePiano [
 		equals: #( 24 39 39 68 36 70 39 39 68 36 )
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPianoTests >> testTwoPianoCanHaveDifferentOctaves [
 
 	| p1 p2 |
@@ -49,7 +51,7 @@ MfPianoTests >> testTwoPianoCanHaveDifferentOctaves [
 	self assert: p1 nOctaves ~= p2 nOctaves.
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfPianoTests >> testTwoPianoCanHaveDifferentStartNote [
 
 	| p1 p2 |
diff --git a/Mooflod/MfPianoWhiteNoteElement.class.st b/Mooflod/MfPianoWhiteNoteElement.class.st
index f939b82..e2a7c73 100644
--- a/Mooflod/MfPianoWhiteNoteElement.class.st
+++ b/Mooflod/MfPianoWhiteNoteElement.class.st
@@ -1,19 +1,21 @@
 Class {
-	#name : #MfPianoWhiteNoteElement,
-	#superclass : #ToElement,
+	#name : 'MfPianoWhiteNoteElement',
+	#superclass : 'ToElement',
 	#classVars : [
 		'note'
 	],
-	#category : 'Mooflod-PianoKeyboardWidget'
+	#category : 'Mooflod-PianoKeyboardWidget',
+	#package : 'Mooflod',
+	#tag : 'PianoKeyboardWidget'
 }
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoWhiteNoteElement class >> newWithColor: aColor [
 
 	^ self new background: aColor; yourself
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPianoWhiteNoteElement >> initialize [
 
 	super initialize.
@@ -23,12 +25,12 @@ MfPianoWhiteNoteElement >> initialize [
 
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoWhiteNoteElement >> note [
 ^note
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPianoWhiteNoteElement >> note: aNote [
 
 note:= aNote .
diff --git a/Mooflod/MfPulsingSquare.class.st b/Mooflod/MfPulsingSquare.class.st
index 6723e2c..a7bc265 100644
--- a/Mooflod/MfPulsingSquare.class.st
+++ b/Mooflod/MfPulsingSquare.class.st
@@ -1,13 +1,15 @@
 Class {
-	#name : #MfPulsingSquare,
-	#superclass : #BlElement,
+	#name : 'MfPulsingSquare',
+	#superclass : 'BlElement',
 	#instVars : [
 		'flashingAnimation'
 	],
-	#category : 'Mooflod-PulsingSquare'
+	#category : 'Mooflod-PulsingSquare',
+	#package : 'Mooflod',
+	#tag : 'PulsingSquare'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfPulsingSquare class >> exampleSimplePulsingSquare [
 
 	<script>
@@ -22,19 +24,13 @@ MfPulsingSquare class >> exampleSimplePulsingSquare [
 	^ aSquare
 ]
 
-{ #category : #'as yet unclassified' }
-MfPulsingSquare >> changeAnimationTime: aTime [
-
-	flashingAnimation duration: aTime seconds 
-]
-
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfPulsingSquare >> flashingAnimation [
 
 ^flashingAnimation 
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPulsingSquare >> initialize [
 
 	super initialize.
@@ -44,7 +40,7 @@ MfPulsingSquare >> initialize [
 	self border: (BlBorder paint: Color black).
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPulsingSquare >> initializeAnimation [
 
 	flashingAnimation := BlAnimation new duration: 0.5 seconds.
@@ -60,7 +56,7 @@ MfPulsingSquare >> initializeAnimation [
 
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfPulsingSquare >> initializeAnimation: aTime [
 
 	flashingAnimation := BlAnimation new duration: aTime seconds.
@@ -71,8 +67,7 @@ MfPulsingSquare >> initializeAnimation: aTime [
 				 self background paint color = Color white
 					 ifTrue: [ self background: Color red ]
 					 ifFalse: [ self background: Color white ] ]).
-	self addAnimation: flashingAnimation.
-
+	self addAnimation: flashingAnimation
 	
 
 ]
diff --git a/Mooflod/MfStepElement.class.st b/Mooflod/MfStepElement.class.st
index adf636c..7ee3f46 100644
--- a/Mooflod/MfStepElement.class.st
+++ b/Mooflod/MfStepElement.class.st
@@ -1,26 +1,28 @@
 Class {
-	#name : #MfStepElement,
-	#superclass : #BlElement,
+	#name : 'MfStepElement',
+	#superclass : 'BlElement',
 	#instVars : [
 		'instrument'
 	],
-	#category : 'Mooflod-PatternWidget'
+	#category : 'Mooflod-PatternWidget',
+	#package : 'Mooflod',
+	#tag : 'PatternWidget'
 }
 
-{ #category : #action }
+{ #category : 'action' }
 MfStepElement >> assignInstrument [
 	"Sets drum attribute to true"
 
 	instrument := true
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfStepElement >> backgroundPaint [ 
 	"Define the background for a bar"
 	^ Color white.
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfStepElement >> initialize [
 
 	super initialize.
@@ -30,20 +32,20 @@ MfStepElement >> initialize [
 	self constraintsDo: [ :e | e frame vertical alignCenter ].
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfStepElement >> instrument [
 
 	^ instrument
 ]
 
-{ #category : #removing }
+{ #category : 'removing' }
 MfStepElement >> removeInstrument [
 	"Sets drum attribute to false"
 
 	instrument := false
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfStepElement >> stepExtent [
 	"Size of a bar"
 	^30@52.
diff --git a/Mooflod/MfTimerElement.class.st b/Mooflod/MfTimerElement.class.st
index 87f0c96..62642d9 100644
--- a/Mooflod/MfTimerElement.class.st
+++ b/Mooflod/MfTimerElement.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfTimerElement,
-	#superclass : #ToElement,
+	#name : 'MfTimerElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'anim',
 		'timerValue',
@@ -11,10 +11,12 @@ Class {
 	#classVars : [
 		'value'
 	],
-	#category : 'Mooflod-TimerWidget'
+	#category : 'Mooflod-TimerWidget',
+	#package : 'Mooflod',
+	#tag : 'TimerWidget'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfTimerElement class >> exampleSimpleTimer [
 
 	<script>
@@ -29,7 +31,7 @@ MfTimerElement class >> exampleSimpleTimer [
 	^ timer
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfTimerElement >> annulusGeometry [
 
 	^ BlAnnulusSectorGeometry new
@@ -38,25 +40,25 @@ MfTimerElement >> annulusGeometry [
 		  innerRadius: 0.865
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfTimerElement >> backgroundPaint [ 
 
 	^ Color black.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfTimerElement >> currentAngle [
 
 ^currentAngle .
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfTimerElement >> defaultGeometry [
 
 	^ BlCircleGeometry new matchExtent: self extent 
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfTimerElement >> initializeAnimation [
 
 	| started |
@@ -79,7 +81,7 @@ MfTimerElement >> initializeAnimation [
 	self addAnimation: anim
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfTimerElement >> initializeAnnulus [
 
 	annulus := BlElement new background: Color lightOrange.
@@ -92,7 +94,7 @@ MfTimerElement >> initializeAnnulus [
 	self initializeAnimation 
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfTimerElement >> initializeTimerValue [
 
 	decreasingAngleStep := 360 / value.
@@ -101,13 +103,13 @@ MfTimerElement >> initializeTimerValue [
 	self initializeAnnulus
 ]
 
-{ #category : #skin }
+{ #category : 'skin' }
 MfTimerElement >> newMooflodSkin [ 
 
 	^ MfTimerElementSkin new
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfTimerElement >> replaceTimerTextValue: aValue [
 
 	timerValue := BlTextElement new.
@@ -121,13 +123,13 @@ MfTimerElement >> replaceTimerTextValue: aValue [
 	self addChild: timerValue
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfTimerElement >> timerValue [
 
 ^timerValue
 ]
 
-{ #category : #'visual properties' }
+{ #category : 'visual properties' }
 MfTimerElement >> updateAnnulusAngle: newAngle [
 
 	annulus geometry: (BlAnnulusSectorGeometry new
@@ -136,7 +138,7 @@ MfTimerElement >> updateAnnulusAngle: newAngle [
 			 innerRadius: 0.865)
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfTimerElement >> updateValue [
 
 	value := value - 1.
@@ -144,12 +146,12 @@ MfTimerElement >> updateValue [
 	self replaceTimerTextValue: value
 ]
 
-{ #category : #evaluating }
+{ #category : 'evaluating' }
 MfTimerElement >> value [ 
 		^value.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfTimerElement >> value: aValue [
 
 	value := aValue.
diff --git a/Mooflod/MfTimerElementSkin.class.st b/Mooflod/MfTimerElementSkin.class.st
index a9ae94d..4ae412e 100644
--- a/Mooflod/MfTimerElementSkin.class.st
+++ b/Mooflod/MfTimerElementSkin.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfTimerElementSkin,
-	#superclass : #MfBasicMooflodSkin,
-	#category : 'Mooflod-TimerWidget'
+	#name : 'MfTimerElementSkin',
+	#superclass : 'MfBasicMooflodSkin',
+	#category : 'Mooflod-TimerWidget',
+	#package : 'Mooflod',
+	#tag : 'TimerWidget'
 }
 
-{ #category : #'event handling' }
+{ #category : 'event handling' }
 MfTimerElementSkin >> installLookEvent: anEvent [
 	"when installing the skin, changes the properties of widget mentionned down here"
 
diff --git a/Mooflod/MfTimerElementTest.class.st b/Mooflod/MfTimerElementTest.class.st
index 8713afa..6693e72 100644
--- a/Mooflod/MfTimerElementTest.class.st
+++ b/Mooflod/MfTimerElementTest.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfTimerElementTest,
-	#superclass : #TestCase,
-	#category : 'Mooflod-TimerWidget'
+	#name : 'MfTimerElementTest',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-TimerWidget',
+	#package : 'Mooflod',
+	#tag : 'TimerWidget'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfTimerElementTest >> testDefaultValueIsCorrectlyInitialized [
 
 	| timer |
diff --git a/Mooflod/MfVisualizerElement.class.st b/Mooflod/MfVisualizerElement.class.st
index 6617db1..8d45042 100644
--- a/Mooflod/MfVisualizerElement.class.st
+++ b/Mooflod/MfVisualizerElement.class.st
@@ -1,6 +1,6 @@
 Class {
-	#name : #MfVisualizerElement,
-	#superclass : #ToElement,
+	#name : 'MfVisualizerElement',
+	#superclass : 'ToElement',
 	#instVars : [
 		'nbTracks',
 		'animation',
@@ -9,10 +9,12 @@ Class {
 	#classVars : [
 		'level'
 	],
-	#category : 'Mooflod-VisualizerRepresentation'
+	#category : 'Mooflod-VisualizerRepresentation',
+	#package : 'Mooflod',
+	#tag : 'VisualizerRepresentation'
 }
 
-{ #category : #examples }
+{ #category : 'examples' }
 MfVisualizerElement class >> exampleVisualizer [
 
 	<script>
@@ -31,13 +33,13 @@ MfVisualizerElement class >> exampleVisualizer [
 	^ v
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> addElementsLevelFour: aChildren [ 
 
 	
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> addElementsLevelOne: aName [
 
 	| label name sect |
@@ -58,13 +60,13 @@ MfVisualizerElement >> addElementsLevelOne: aName [
 	sect addChild: name
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> addElementsLevelThree: aChildren [ 
 
 	
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> addElementsLevelTwo: aName [
 
 	| pattern sect |
@@ -79,7 +81,7 @@ MfVisualizerElement >> addElementsLevelTwo: aName [
 	sect addChild: pattern
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> addInstrument: aName [
 
 	nbTracks < 4 ifFalse: [ ^ self ].
@@ -87,30 +89,30 @@ MfVisualizerElement >> addInstrument: aName [
 	self initLevelRepresentation: aName
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfVisualizerElement >> animation [
 
 	^ animation
 ]
 
-{ #category : #action }
+{ #category : 'action' }
 MfVisualizerElement >> cleanVisualizer [
 
 	self childrenDo: [ :c | c childrenDo: [ :cc | cc removeFromParent ] ].
 	nbTracks := 0
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfVisualizerElement >> initAnimation: nbSteps [
 
-	animation := BlAnimation new duration: nbSteps seconds.
+	animation := BlAnimation new duration: (nbSteps) seconds.
 	animation addEventHandler: (BlEventHandler
 			 on: BlAnimationLoopDoneEvent
 			 do: [ :e | self cleanVisualizer ]).
 	self addAnimation: animation
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfVisualizerElement >> initLevelRepresentation: aName [
 
 	level == 1 ifTrue: [ self addElementsLevelOne: aName ].
@@ -119,7 +121,7 @@ MfVisualizerElement >> initLevelRepresentation: aName [
 	level == 4 ifTrue: [ self addElementsLevelFour: aName ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfVisualizerElement >> initSections [
 
 	| y |
@@ -136,7 +138,7 @@ MfVisualizerElement >> initSections [
 		self addChild: sect ]
 ]
 
-{ #category : #initialization }
+{ #category : 'initialization' }
 MfVisualizerElement >> initialize [
 
 	super initialize.
@@ -147,25 +149,25 @@ self initSections.
 	nbTracks := 0
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfVisualizerElement >> level [ 
 ^level
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfVisualizerElement >> level: aLevel [
 
 	level := aLevel.
 	
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfVisualizerElement >> nbTracks [
 
 ^nbTracks 
 ]
 
-{ #category : #'instance creation' }
+{ #category : 'instance creation' }
 MfVisualizerElement >> open [ 
 
 |space|
@@ -177,13 +179,13 @@ MfVisualizerElement >> open [
 	space show.
 ]
 
-{ #category : #accessing }
+{ #category : 'accessing' }
 MfVisualizerElement >> square [
 
 ^square
 ]
 
-{ #category : #adding }
+{ #category : 'adding' }
 MfVisualizerElement >> textFrom: aName [
 
 	^ aName asRopedText attributes:
diff --git a/Mooflod/MfVisualizerTests.class.st b/Mooflod/MfVisualizerTests.class.st
index 4af856b..b69bfe0 100644
--- a/Mooflod/MfVisualizerTests.class.st
+++ b/Mooflod/MfVisualizerTests.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfVisualizerTests,
-	#superclass : #TestCase,
-	#category : 'Mooflod-VisualizerRepresentation'
+	#name : 'MfVisualizerTests',
+	#superclass : 'TestCase',
+	#category : 'Mooflod-VisualizerRepresentation',
+	#package : 'Mooflod',
+	#tag : 'VisualizerRepresentation'
 }
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfVisualizerTests >> testLevelOneWorksCorrectly [
 
 	| v name firstSect |
@@ -17,7 +19,7 @@ MfVisualizerTests >> testLevelOneWorksCorrectly [
 	self assert: firstSect children size equals: 3
 ]
 
-{ #category : #tests }
+{ #category : 'tests' }
 MfVisualizerTests >> testLevelTwoWorksCorrectly [
 
 	| v name firstSect |
diff --git a/Mooflod/MfWidgets.class.st b/Mooflod/MfWidgets.class.st
index f28542c..2df7501 100644
--- a/Mooflod/MfWidgets.class.st
+++ b/Mooflod/MfWidgets.class.st
@@ -1,10 +1,12 @@
 Class {
-	#name : #MfWidgets,
-	#superclass : #Object,
-	#category : 'Mooflod-Widgets'
+	#name : 'MfWidgets',
+	#superclass : 'Object',
+	#category : 'Mooflod-Widgets',
+	#package : 'Mooflod',
+	#tag : 'Widgets'
 }
 
-{ #category : #example }
+{ #category : 'example' }
 MfWidgets class >> exampleDisplayingAllWidgets [
 
 	<script>
diff --git a/Mooflod/package.st b/Mooflod/package.st
index 977438c..82b3408 100644
--- a/Mooflod/package.st
+++ b/Mooflod/package.st
@@ -1 +1 @@
-Package { #name : #Mooflod }
+Package { #name : 'Mooflod' }