Merge branch 'main' into Issue_0155

README.md

@@ -18,15 +18,15 @@ Pyramid is a WYSIWYG application (What You See Is What You Get) in other terms i
 
 Pyramid helps you to produce final UI using Bloc library (and also Toplo).
 
-You can add plugins into Pyramid to extents the editor capacities or create [your own plugin](https://github.com/OpenSmock/Pyramid/wiki/Add-a-new-plugin-to-Pyramid) with your specifics functions !
+You can add plugins into Pyramid to extend the editor capacities or create [your own plugin](https://github.com/OpenSmock/Pyramid/wiki/Add-a-new-plugin-to-Pyramid) with your specific functions !
 
 <img src="https://github.com/OpenSmock/Pyramid/assets/49183340/0ddc1ac3-bd6e-4f4b-bfb4-60eac4f48e39" width="200">
 
 ## <img src="/assets/PyramidPinPtah.svg" width="75" height="75" align="bottom"> How to get Pyramid
 
 You can load a stable release version of Pyramid or the latest development version. 
 
-The latest development version can provide the new incoming functionalities but can be unstable.
+The latest development version provides the new incoming functionalities but can be unstable.
 
 To install a version of Pyramid, use one of the following scripts inside a playground.
 
@@ -41,10 +41,12 @@ Metacello new
 
 ### Stable release version
 
+Be careful, the examples with gradient paint and the gradient paint selector will not work because Bloc updated its API.
+
 ```st
 Metacello new
 	baseline: 'Pyramid';
-	repository: 'github://OpenSmock/Pyramid:alpha3';
+	repository: 'github://OpenSmock/Pyramid:alpha4';
 	load
 ```
 
@@ -58,7 +60,7 @@ spec baseline: 'Pyramid' with: [ spec repository: 'github://OpenSmock/Pyramid:ma
 
 ### Create a new project
 
-Open the Pyramid menu into Library and click `New Project`.
+Open the Pyramid menu from the Library tab and click `New Project`.
 
 ![image](https://github.com/OpenSmock/Pyramid/assets/49183340/602db97b-dcd1-4824-a3ef-125ee5bdfd16)
 
@@ -68,10 +70,16 @@ Then the project view appears in a new window.
 
 ### Add and setup graphical elements
 
-Use the create button to add graphical element in your project view.
+Use the create button to add graphical elements in your project view.
 
 https://github.com/OpenSmock/Pyramid/assets/49183340/a02db9ad-314a-4caf-884c-9da4da809293
 
+### Test behavior in the editor
+
+Use the test/edit button to switch between the edit mode and the test mode.
+
+https://github.com/OpenSmock/Pyramid/assets/49183340/a85d8c01-89dd-472c-ab4e-41d51a8629dd
+
 ### Save a project
 
 Setup the project to store your view into a Class.
@@ -101,7 +109,7 @@ element editWithPyramid.
 space editWithPyramid.
 ```
 
-You can edit in Pyramid all opened BlSpace with `F12` keyboard shortcut, this feature can be disable in the settings.
+You can edit in Pyramid all opened BlSpace with the `F12` keyboard shortcut, this feature can be disabled in the settings.
 
 When a window is open in Pyramid, an image is displayed on it to attract the user's attention:
 
@@ -110,7 +118,7 @@ https://github.com/OpenSmock/Pyramid/assets/49183340/0c66a3ac-7bea-48c1-b1e8-0b0
 ## <img src="/assets/PyramidPinPtah.svg" width="75" height="75" align="bottom"> Plugins
 
 ![image](https://user-images.githubusercontent.com/49183340/263474758-37833c2b-f7ad-4b46-ab58-cb3d92c28413.png)
-- [FigmaToWorld](https://github.com/OpenSmock/Pyramid-Plugins-FigmaToWorld) plugin provide capacities to import projects designed with [Figma](https://www.figma.com)
+- [FigmaToWorld](https://github.com/OpenSmock/Pyramid-Plugins-FigmaToWorld) plugin provides capacities to import projects designed with [Figma](https://www.figma.com)
 
 ## <img src="/assets/PyramidPinPtah.svg" width="75" height="75" align="bottom"> Dependencies
 

src/Pyramid-Bloc/BlBasicLayout.extension.st

@@ -1,7 +1,7 @@
 Extension { #name : #BlBasicLayout }
 
 { #category : #'*Pyramid-Bloc' }
-BlBasicLayout >> setLayoutOn: aPyramidLayoutInputPresenter [
+BlBasicLayout >> asIcon [
 
-	aPyramidLayoutInputPresenter setBasic
+	^ self iconNamed: #radioButtonUnselected
 ]

src/Pyramid-Bloc/BlBottomAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlBottomAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlBottomAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectEnd.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlElement.extension.st

@@ -3,5 +3,5 @@ Extension { #name : #BlElement }
 { #category : #'*Pyramid-Bloc' }
 BlElement >> asIcon [
 
-	^ self iconNamed: #class
+	^ self layout asIcon
 ]

src/Pyramid-Bloc/BlFlowLayout.extension.st

@@ -12,7 +12,7 @@ BlFlowLayout >> = anObject [
 ]
 
 { #category : #'*Pyramid-Bloc' }
-BlFlowLayout >> setLayoutOn: aPyramidLayoutInputPresenter [
+BlFlowLayout >> asIcon [
 
-	aPyramidLayoutInputPresenter setFlow
+	^ self iconNamed: #smallJustified
 ]

src/Pyramid-Bloc/BlFrameLayout.extension.st

@@ -0,0 +1,7 @@
+Extension { #name : #BlFrameLayout }
+
+{ #category : #'*Pyramid-Bloc' }
+BlFrameLayout >> asIcon [
+
+	^ self iconNamed: #windowMaximize
+]

src/Pyramid-Bloc/BlHorizontalCenterAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalCenterAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalCenterAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectCenter.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlHorizontalCoordinateEndAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalCoordinateEndAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalCoordinateEndAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectCenter.
+	aFrameConstraintsPresenter inputHasRelative state: true.
+	aFrameConstraintsPresenter inputRelative value: self coordinate negated
+]

src/Pyramid-Bloc/BlHorizontalCoordinateLeftAlignment.extension.st

@@ -0,0 +1,11 @@
+Extension { #name : #BlHorizontalCoordinateLeftAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalCoordinateLeftAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectStart.
+	aFrameConstraintsPresenter inputHasRelative
+		state: true.
+	aFrameConstraintsPresenter inputRelative
+		value: self coordinate
+]

src/Pyramid-Bloc/BlHorizontalCoordinateRightAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalCoordinateRightAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalCoordinateRightAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectEnd.
+	aFrameConstraintsPresenter inputHasRelative state: true.
+	aFrameConstraintsPresenter inputRelative value: self coordinate
+]

src/Pyramid-Bloc/BlHorizontalCoordinateStartAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalCoordinateStartAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalCoordinateStartAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectCenter.
+	aFrameConstraintsPresenter inputHasRelative state: true.
+	aFrameConstraintsPresenter inputRelative value: self coordinate
+]

src/Pyramid-Bloc/BlHorizontalEndAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalEndAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalEndAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectEnd.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlHorizontalStartAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlHorizontalStartAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlHorizontalStartAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectStart.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlLayout.extension.st

@@ -8,7 +8,7 @@ BlLayout >> = anObject [
 ]
 
 { #category : #'*Pyramid-Bloc' }
-BlLayout >> setLayoutOn: aPyramidLayoutInputPresenter [
+BlLayout >> asIcon [
 
-	aPyramidLayoutInputPresenter setUnknowValue
+	^ self iconNamed: #smallQuestion
 ]

src/Pyramid-Bloc/BlLinearLayout.extension.st

@@ -0,0 +1,7 @@
+Extension { #name : #BlLinearLayout }
+
+{ #category : #'*Pyramid-Bloc' }
+BlLinearLayout >> asIcon [
+
+	^ self iconNamed: #smallLeftFlush
+]

src/Pyramid-Bloc/BlLinearLayoutHorizontalOrientation.extension.st

@@ -0,0 +1,13 @@
+Extension { #name : #BlLinearLayoutHorizontalOrientation }
+
+{ #category : #'*Pyramid-Bloc' }
+BlLinearLayoutHorizontalOrientation >> asBooleanForPyramid [
+
+	^ false
+]
+
+{ #category : #'*Pyramid-Bloc' }
+BlLinearLayoutHorizontalOrientation >> switchOrientation [
+
+	^ BlLinearLayoutVerticalOrientation new
+]

src/Pyramid-Bloc/BlLinearLayoutVerticalOrientation.extension.st

@@ -0,0 +1,13 @@
+Extension { #name : #BlLinearLayoutVerticalOrientation }
+
+{ #category : #'*Pyramid-Bloc' }
+BlLinearLayoutVerticalOrientation >> asBooleanForPyramid [
+
+	^ true
+]
+
+{ #category : #'*Pyramid-Bloc' }
+BlLinearLayoutVerticalOrientation >> switchOrientation [
+
+	^ BlLinearLayoutHorizontalOrientation new
+]

src/Pyramid-Bloc/BlNullHorizontalAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlNullHorizontalAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlNullHorizontalAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectNull.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlNullVerticalAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlNullVerticalAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlNullVerticalAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectNull.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlProportionalLayout.extension.st

@@ -1,7 +1,7 @@
 Extension { #name : #BlProportionalLayout }
 
 { #category : #'*Pyramid-Bloc' }
-BlProportionalLayout >> setLayoutOn: aPyramidLayoutInputPresenter [
+BlProportionalLayout >> asIcon [
 
-	aPyramidLayoutInputPresenter setProportionnal
+	^ self iconNamed: #haloScale
 ]

src/Pyramid-Bloc/BlTextElement.extension.st

@@ -3,5 +3,5 @@ Extension { #name : #BlTextElement }
 { #category : #'*Pyramid-Bloc' }
 BlTextElement >> asIcon [
 
-	^ self iconNamed: #haloFontStyle
+	^ self iconNamed: #smallFonts
 ]

src/Pyramid-Bloc/BlTopAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlTopAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlTopAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectStart.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlVerticalCenterAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlVerticalCenterAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlVerticalCenterAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectCenter.
+	aFrameConstraintsPresenter inputHasRelative state: false.
+	aFrameConstraintsPresenter inputRelative value: 0
+]

src/Pyramid-Bloc/BlVerticalCoordinateBottomAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlVerticalCoordinateBottomAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlVerticalCoordinateBottomAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectEnd.
+	aFrameConstraintsPresenter inputHasRelative state: true.
+	aFrameConstraintsPresenter inputRelative value: self coordinate
+]

src/Pyramid-Bloc/BlVerticalCoordinateTopAlignment.extension.st

@@ -0,0 +1,9 @@
+Extension { #name : #BlVerticalCoordinateTopAlignment }
+
+{ #category : #'*Pyramid-Bloc' }
+BlVerticalCoordinateTopAlignment >> pyramidSelectOn: aFrameConstraintsPresenter [
+
+	aFrameConstraintsPresenter selectStart.
+	aFrameConstraintsPresenter inputHasRelative state: true.
+	aFrameConstraintsPresenter inputRelative value: self coordinate
+]

src/Pyramid-Bloc/False.extension.st

@@ -1,7 +1,13 @@
 Extension { #name : #False }
 
 { #category : #'*Pyramid-Bloc' }
-False >> asOrientationForPyramid [
+False >> asOrientationForFlowPyramid [
 
 	^ BlLayoutOrientation horizontal
 ]
+
+{ #category : #'*Pyramid-Bloc' }
+False >> asOrientationForLinearPyramid [
+
+	^ BlLinearLayoutHorizontalOrientation new
+]