View source for Training:Bootcamp:Chapter 2

{{Edited|July|12|2025}}
<message>Write the content here to display this box</message>
This is '''Chapter 2'''. You should consider finishing [[Training:Bootcamp:Chapter 1|Chapter 1 first.]]

=== '''Video 2: Auto-diagram, OCL, and Autoforms''' ===

<html>

<p class="video-warn">
  To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.
</p>

<div class="video">
  <div class="video__wrapper">
    <iframe src="https://www.youtube.com/embed/b2N_e6YkG4o?si=HPXVXdYfA0mGUQpP" title="YouTube video player" frameborder="0" allowfullscreen></iframe>
  </div>
  <div class="video__navigation">
 <span data-video="b2N_e6YkG4o" data-start="00" tabindex="0"> <strong> Steps 41 - 75 </strong> </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="00" tabindex="0"> Introduction </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="71" tabindex="0"> Deleting and moving </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="425" tabindex="0"> Association to self </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="564" tabindex="0"> Auto-diagram and more deleting </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="776" tabindex="0"> More Association </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="1035" tabindex="0"> OCL </span>
    <span class="navigation-item" data-video="b2N_e6YkG4o" data-start="1654" tabindex="0"> Autoforms </span>
  </div>
</div>

</html>

== Chapter 2: Understanding Class-diagrams, Creating Classes, and Making Use of AutoForms and DefaultStringRepresentation ==
'''NOTE:''' Click on the step/number to access the corresponding images/GIFs.

'''[[Training:Chapter 2 Images#Step 41|41]].''' Open the location where you saved your file and make a copy in a subfolder called "'''TasksUpTo40'''". This helps you keep track of your progress and easily access previous versions of the file.
* Copy both the [[Documentation:Modlr|modlr]] file and the '''Start Prototype Data XML''' file.
** These files contain the values that you see in the debugger for the instances of the classes in the model.
'''[[Training:Chapter 2 Images#Step 42|42]].''' Create a new [[Documentation:Class|class]] <code>Class1</code> on the diagram next to '''Person'''.

'''[[Training:Chapter 2 Images#Step 43|43]].''' Drag on a relation (or [[Documentation:Association|association]]) from '''Class1''' to '''Person'''.
* This creates a relationship between the two classes.
'''[[Training:Chapter 2 Images#Step 44|44]].''' Find '''Class1''' in Tree and double-click to see the autodiagram. 

'''[[Training:Chapter 2 Images#Step 45|45]].''' Go back to the diagram, and select the relation by clicking the line. Press delete (del key). Deleting only removes the relation from the diagram, not from the [[Documentation:Model|model]]. 

'''[[Training:Chapter 2 Images#Step 46|46]].''' Search for '''Class1''' in the Tree, click on the auto diagram, and observe that it is still there. 

'''[[Training:Chapter 2 Images#Step 47|47]].''' Go back to the diagram, right-click '''Class1''', find '''Introduce&Remove''''','' then select '''''Re-introduce'' ''removed associations''''' and click on it.  
* Notice that the [[Documentation:Association|association]] you removed is now back on the diagram. 
'''[[Training:Chapter 2 Images#Step 48|48]].''' Select the end of the association - note the blue circle. While pressing the ctrl key, click and hold the association end. Hold and drag the association end and let it go when you are over '''Car'''. You have now moved an association. 

'''[[Training:Chapter 2 Images#Step 49|49]].''' Check the AutoDiagram, click the different classes, and make sure it says the same thing as the diagram. Go back and forth a few times and move the association ends of this relation.

'''[[Training:Chapter 2 Images#Step 50|50]].''' Select the '''Class1''' - Press the delete key. Check the tree and auto diagram - it is still in the model. The delete key only removes things from the diagram - not from the model.

'''[[Training:Chapter 2 Images#Step 51|51]].''' Find '''Class1''' in Tree and click-drag it onto the diagram surface. Note that even its associations re-appear.

'''[[Training:Chapter 2 Images#Step 52|52]].''' To delete something from a diagram and the model, you must press '''ctrl+delete'''. 
* Select the association by clicking the line. 
* Press ctrl+delete to delete. 
* Check the tree, and check that the autodiagram is gone.
'''[[Training:Chapter 2 Images#Step 53|53]].''' Sometimes, you want a relation from a class back to the same [[Documentation:Class|class]]. 
* Create a relation by selecting the tool - click hold drag on '''Class1''' - let go of the mouse button over the open diagram space. 
* Note the via point. 
* Move the mouse to yet a new position in the open diagram space - click to add yet a via point. 
* From here, move the mouse back over '''Class1''' - click again. Note a relation to [[Documentation:Self|self]] has been created.
'''[[Training:Chapter 2 Images#Step 54|54]].''' Check the autodiagram - note that '''Class1''' now appears three times when shown. This is how an association to self is shown in an autodiagram.

'''55.''' The autodiagram always shows the selected class and its surroundings completely. A diagram only shows the things from the model you have explicitly added to it.

'''[[Training:Chapter 2 Images#Step 56|56]].''' In the diagram, in '''Class1''' - add two new [[Documentation:Attribute|attributes]] (right click - add Attribute - twice). Select attribute1 - press the delete key, and note that it disappears. Check the autodiagram - it still shows two attributes.

'''[[Training:Chapter 2 Images#Step 57|57]].''' Go back to the diagram using the back-and-forth arrows next to the play button in the top toolbar.

'''[[Training:Chapter 2 Images#Step 58 & 59|58]].''' Press ctrl-Z for undo - note that attribute1 re-appears.

'''[[Training:Chapter 2 Images#Step 58 & 59|59]].''' Press ctrl-Y for redo - observe that attribute1 disappears again.

'''[[Training:Chapter 2 Images#Step 60|60]].''' Right-click '''Class1''', find Features/Pick Shown features, find attribute1, and move it back to shown - close the dialog. 
* Note that attribute1 is now back in the diagram '''Class1''' display.
'''[[Training:Chapter 2 Images#Step 61|61]].''' Select '''Class1''' - press ctrl+delete. Now, '''Class1''' is deleted, and it deleted its attributes and associations.

'''[[Training:Chapter 2 Images#Step 62|62]].''' Create a new class and name it <code>BrandOfCar</code>. Remember to save your model often - ctrl-S.

'''[[Training:Chapter 2 Images#Step 63|63]].''' Add an attribute of type [[Documentation:String|string]] called '''Name'''.

'''64.''' Drag an association from '''Brand''' to '''Car'''. Note that the multiplicity marking on the association should say that Car can have '''0..1 Brand''', and '''Brand''' has '''0..*'''(many) Cars.

'''[[Training:Chapter 2 Images#Step 65|65]].''' Open the debugger - add Brand-instances (Open Brand seeker, Add new). Name them '''Volvo''', '''BMW''', and '''Tesla''' - save the Debugger data.

'''[[Training:Chapter 2 Images#Step 66|66]].''' In the debugger, open Autoform of a '''Car'''. 
* Note the new ability to assign a '''Brand'''. 
* Use it to assign a '''Brand''' and save the data.
'''[[Training:Chapter 2 Images#Step 67|67]].''' Go back to the diagram, (Close debugger + run dialog), select '''Car''', and in the property inspection, find '''DefaultStringRepresentation'''. Press the <code>...</code> to open the OCL Editor. 
 '''[[Documentation:OCL Expressions|OCL]]''' is a language that allows you to navigate and pinpoint everything in the model. You can write freehand OCL or use the context help of the OCL editor. All snippets of OCL code are called expressions. Expressions are like math functions, not only with numbers but also with information. The information you use in the expressions must be present in your model. This makes it easy to ensure that all expressions are valid. When you save the model, we start a validation and you will see a red dot when there is an error.
* [[Documentation:Learn OCL|OCL]] is object-oriented - and the self/this variable of OCL is called [[Documentation:Self|self]].
* Write <code>self. RegistrationNumber+' of type '+self.BrandOfCar.Name</code> in the expression for '''DefaultStringRepresentation'''.
* Click "okay" in the OCL editor. Save. Check for red dots. Try to introduce an error by saying '''Name2''' instead of '''Name''' - save - see the red dot warning. Fix the issue. 
'''[[Training:Chapter 2 Images#Step 68|68]].''' The '''DefaultStringRepresentation''' of an object is used whenever we are not explicit with an attribute and we need a representation in the string form of the object. The debugger [[Documentation:AutoForms–get more with less faster|Autoforms]] use this. Go into the debugger and see the header of Autoforms following your rule from above.

'''[[Training:Chapter 2 Images#Step 69|69]].''' [[Documentation:OCL Expressions|OCL]] is short for '''Object Constraints Language'''; many simple OCL tools use OCL only for [[Training:Constraints|constraints]]. In MDriven, we use OCL for almost everything. 
* Go to '''Car''' - find '''Constraint''' in the Property Inspector - click <code>...</code> - Add a new '''Constraint'''. 
* The OCL expression of a constraint should validate to true; otherwise, the constraint is broken. 
* Add the constraint <code>self.BrandOfCar->notempty</code>. 
* This means that we will be true if we have a Brand associated and false if we do not. 
* Enter the description of the constraint: <code>Cars MUST have a Brand!</code> - say that this is of type Warning.
'''[[Training:Chapter 2 Images#Step 70|70]].''' Go into debugger [[Documentation:AutoForms–get more with less faster|Autoforms]]. Check what happens when an object breaks the constraint (remove a brand of a car). 

'''[[Training:Chapter 2 Images#Step 71 & 72|71]].''' In MDriven, we can design [[Documentation:ViewModel|ViewModels]] that use OCL expressions to build information elements that can be presented to a user. There is a quick way to do the default and show everything - it is called [[Documentation:AutoForms–get more with less faster|Autoforms]]. 
* Right-click the diagram surface and find Autoforms/Create-refresh-Autoforms. 
* Note the tree is filled up with ViewModels and Actions all tagged with AutoForm.
'''[[Training:Chapter 2 Images#Step 71 & 72|72]].''' Right-click the diagram surface - find Autoforms/Drop-Autoforms. 
* Note that the tree is cleared of actions and ViewModels tagged with AutoForm.
'''[[Training:Chapter 2 Images#Step 73|73]].''' Add back the AutoForms. Press '''Play Now''' instead of the debugger and pick '''Run Model''' '''and continue modeling'''.  
* Familiarize yourself with the Menu and forms.  
* Note that this system uses the same data as in the debugger. 
'''[[Training:Chapter 2 Images#Step 74|74]].''' '''AutoForms''' are just the beginning - though, they may feel a bit clunky. Reduce clunkiness by setting properties in the model. 
* For example, select association-end '''BrandOfCar''', in propertyinspector, find '''AutoForms''' and change the value from '''SearchAndPick''' to '''Combobox'''. 
* Go to '''Autoforms''', then '''Create/Refresh Autoforms'''. 
* Save the model. 
* Switch back to the WECPOF window that can be kept open while changing the model. 
* Press '''MODEL-REFRESH'''. Notice this different way to assign brands.
'''[[Training:Chapter 2 Images#Step 75|75]].''' Assign a null brand. Do you see the broken constraint?

=== Next Chapter ===
[[Training:Bootcamp:Chapter 3|Bootcamp:Chapter 3]]
[[Category:Bootcamp]]