create The Domain Name-Space page.

master
Craig Oates 5 years ago
parent
commit
a193bd9936
  1. 1
      Home.md
  2. 109
      The-Domain-Name-Space.md
  3. 1
      _sidebar.md

1
Home.md

@ -45,6 +45,7 @@ Before continuing, I recommend you are familiar with the following;
- [NuGet Home](NuGet-Home)
- [Add Smouldering Beach Ball to Your Project](Add-Smouldering-Beach-Ball-to-Your-Project)
- [The Domain Name-Space](The-Domain-Name-Space)
- [Using Smouldering Beach Ball in Your Project](Using-Smouldering-Beach-Ball-in-Your-Project)
### Extra Resources

109
The-Domain-Name-Space.md

@ -0,0 +1,109 @@
Within `Domain` is a module called `DomainTypes`. (This is what is actually set to "auto-open".) In `DomainTypes`, you will find three types which are;
1. `OverlayType`
2. `OverlaySpec`
3. `ImageSpec`
Together they describe how your placeholder image will look.
To help you become more familiar with them, it might help if you think of them like Matryoshka Dolls (I.E. "Russian Dolls"). The reason why is because of how the types interact with each other. The `ImageSpec` holds an `OverlaySpec` which holds an `OverlayType`. Granted, this is a high level overview but this relationship is an important part of knowing how to use SmoulderingBeachBall (S.B.B.)
IMAGE OF THE RUSSIAN DOLL RELATIONSHIP
Having said the above, you can circumvent all this by setting the "overlay" property to "None" when creating your `ImageSpec`. For example, take a look at the following piece of code;
```f#
let spec =
{ width = 500
height = 500
colour = Brushes.Red
filePath = "your/file/path/here"
overlay = None // The important part of the example.}
spec
```
It is, also, worth pointing out you do not need to specify the file name (A.K.A. the "final part") of the `filePath`. This is because S.B.B. does it for you. Instead, you only need to specify the folder/place you want the image written to. (Perhaps "directory" might have been a better choice.)
If you would like to read the actual source code in `DomainTypes`, you can do so by using the following link;
- ["Domain.fs"](https://gitlab.com/craig.oates/Smouldering-Beach-Ball/blob/master/SmoulderingBeachBall/Domain.fs)
## Domain Types Breakdown
The following examples (amongst others) are viewable in "Snippets". You can get to "Snippets" using the following link;
- [Snippets section](https://gitlab.com/craig.oates/Smouldering-Beach-Ball/snippets)
### OverlayType
This type describes what type of overlay you want on your placeholder image. `Border` adds a border around the sides of your image and `Full` adds an "X" across the image. The colour of "X" will be the same as the border. Here are some examples;
IMAGE OF BORDER IMAGE
IMAGE OF FULL IMAGE
When it comes to creating an `OverlayType`, you tend to not make a "standalone" version. Instead, you will usually specify the type when you create an `OverlaySpec`. For example;
```f#
// The definition of the type.
type OverlayType =
| Border
| Full
// Creates a image with a black border and no "X".
let overlaySpecWithBorder =
{ colour = Brushes.Black
overlayType = Border}
// Creates a image with a red border and an "X".
let overlaySpecWithFull =
{ colour = Brushes.Red
overlayType = Full }
```
### OverlaySpec
Use this type to describe how you want the complete overlay to look. You will use this in conjunction with the `OverlayType`. You can use the above examples to help you get a grasp how to use/create `OverlaySpec`'s. With that said, here is how I defined `OverlaySpec`;
```f#
type OverlaySpec =
{ colour: Brush;
overlayType: OverlayType }
```
### ImageSpec
This type describes the whole image. Before you can use it, though, you must define the "overlay" (I.E. `OverlayType` and `OverlaySpec`). Although, you can circumvent that by using `None`.
As an aside, you could create/define the "overlay" whilst creating the `ImageSpec`. But, I would argue against that. The reason why is because it makes it hard to read -- well it did when I was in the middle of writing S.B.B.
Here are some examples of how you would create an `ImageSpec`;
```f#
// The definition of the type.
type ImageSpec =
{ width: int;
height: int;
colour: Brush;
filePath: string;
overlay: OverlaySpec option }
// Image with no overlay.
let imageSpecWithNoOverlay =
{ width: 500
height: 500
colour: Brushes.Blue
filePath: "your/file/path/here"
overlay: None }
// Image with a full overlay.
let oSpec =
{ colour = Brushes.Black
overlayType = Full } // You can change this to "Border".
let spec =
{ width = 500
height = 500
colour = Brushes.AntiqueWhite
filePath = "your/file/path/here"
overlay = Some oSpec }
```

1
_sidebar.md

@ -20,6 +20,7 @@
- [NuGet Home](NuGet-Home)
- [Add Smouldering Beach Ball to Your Project](Add-Smouldering-Beach-Ball-to-Your-Project)
- [The Domain Name-Space](The-Domain-Name-Space)
- [Using Smouldering Beach Ball in Your Project](Using-Smouldering-Beach-Ball-in-Your-Project)
### Extra Resources

Loading…
Cancel
Save