use prefixed tutorial images
diff --git a/netbeans.apache.org/src/content/tutorials/nbm-quick-start.adoc b/netbeans.apache.org/src/content/tutorials/nbm-quick-start.adoc
index 0abf83c..366bbe4 100644
--- a/netbeans.apache.org/src/content/tutorials/nbm-quick-start.adoc
+++ b/netbeans.apache.org/src/content/tutorials/nbm-quick-start.adoc
@@ -74,7 +74,7 @@
1. Choose File | New Project and then choose NetBeans Modules. Select "NetBeans Platform Application". You should see this:
-image::images/nbm-quick-start/new-project-1.png[]
+image::images/quickstart-platform_73_new-project-1.png[]
The difference between the 4 templates above is as follows:
@@ -90,7 +90,7 @@
1. Name your new application `WordProcessor` and specify a folder on disk for storing it:
-image::images/nbm-quick-start/new-project-2.png[]
+image::images/quickstart-platform_73_new-project-2.png[]
Click btn:[Finish]. The new project appears as follows in the Projects window:
@@ -107,13 +107,13 @@
1. Right-click the "Modules" node, shown in the screenshot above, and choose "Add New":
-image::images/nbm-quick-start/new-module-1.png[]
+image::images/quickstart-platform_73_new-module-1.png[]
The New Module Project dialog will appear.
Name the new module `WordEditorCore`:
-image::images/nbm-quick-start/new-module-2.png[]
+image::images/quickstart-platform_73_new-module-2.png[]
Click btn:[Next].
@@ -122,12 +122,12 @@
1. Specify "org.word.editor.core" as the Code Name Base, which is a unique string identifying the module. The Module Display Name is used as a label for the module in the Projects window.
-image::images/nbm-quick-start/new-module-3.png[]
+image::images/quickstart-platform_73_new-module-3.png[]
Click btn:[Finish]. The new module is created and its structure is shown in the Projects window:
-image::images/nbm-quick-start/new-module-4.png[]
+image::images/quickstart-platform_73_new-module-4.png[]
=== Create the Window
@@ -138,11 +138,11 @@
[start=1]
1. Right-click the "WordEditorCore" module and choose New | Other.
-image::images/nbm-quick-start/new-window-1.png[]
+image::images/quickstart-platform_73_new-window-1.png[]
The New File dialog appears. In the Module Development category, select "Window":
-image::images/nbm-quick-start/new-window-2.png[]
+image::images/quickstart-platform_73_new-window-2.png[]
Click btn:[Next].
@@ -159,11 +159,11 @@
[start=3]
1. Set the class name prefix to `Word` and the package to `org.word.editor.core`:
-image::images/nbm-quick-start/new-window-4.png[]
+image::images/quickstart-platform_73_new-window-4.png[]
Click btn:[Finish]. The new window ("WordTopComponent.java") is added to the source structure of your module:
-image::images/nbm-quick-start/new-window-5.png[]
+image::images/quickstart-platform_73_new-window-5.png[]
[start=4]
1. The new window should have opened in the Design view of the "Matisse" GUI Builder. You can double-click (or select "Open" from the context menu) it if it didn't open automatically.
@@ -172,14 +172,14 @@
The Palette should be open on the right side (you can use menu:Window[IDE Tools>Palette] or kbd:[Ctrl+Shift+8] if not). Drag and drop a Button and a Text Area from the Palette onto the window:
-image::images/nbm-quick-start/new-window-7.png[]
+image::images/quickstart-platform_73_new-window-7.png[]
Do the following to make the new GUI components more meaningful:
* Right-click the text area, choose "Change Variable Name", and then name it `text`.
* Right-click the button, choose "Edit Text", and then set the text of the button to `Filter!`. Also rename the variable to `filterButton`.
-image::images/nbm-quick-start/new-window-7.png[]
+image::images/quickstart-platform_73_new-window-7.png[]
[start=5]
1. Double click on the button. This will create an event handling method in the Source editor. The method is called whenever the button is clicked. Change the body of the method to the following code:
@@ -206,12 +206,12 @@
[start=1]
1. Right-click the WordProcessor application (not the WordEditorCore module) and choose Run.
-image::images/nbm-quick-start/new-app-1.png[]
+image::images/quickstart-platform_73_new-app-1.png[]
Doing so will start up your new NetBeans Platform application and install your module. You will have a new window, as well as a new menu item for opening it, as shown below:
-image::images/nbm-quick-start/new-app-2.png[]
+image::images/quickstart-platform_73_new-app-2.png[]
[start=2]
@@ -251,22 +251,22 @@
1. Expand the new application in the Projects window, right-click the Modules node, and choose "Add New":
-image::images/nbm-quick-start/new-api-1.png[]
+image::images/quickstart-platform_73_new-api-1.png[]
The New Module Project dialog appears. Set the Project Name for the new module to be "WordEditorAPI":
-image::images/nbm-quick-start/new-api-2.png[]
+image::images/quickstart-platform_73_new-api-2.png[]
Click btn:[Next]. Set the Code Name Base to be `org.word.editor.api`, as shown below:
-image::images/nbm-quick-start/new-api-3.png[]
+image::images/quickstart-platform_73_new-api-3.png[]
Click btn:[Finish] to complete the wizard, which adds the module to your previously created application, just as in the previous section:
-image::images//nbm-quick-start/new-api-4.png[]
+image::images/quickstart-platform_73_new-api-4.png[]
Having created the module, the next activity is to add an Interface to it.
@@ -274,15 +274,15 @@
[start=2]
1. Right-click the "WordEditorAPI" module and choose New | Java Interface.
-image::images//nbm-quick-start/new-api-5.png[]
+image::images/quickstart-platform_73_new-api-5.png[]
Name the Java interface `WordFilter`, in the package `org.word.editor.api`:
-image::images/nbm-quick-start/new-api-6.png[]
+image::images/quickstart-platform_73_new-api-6.png[]
Click btn:[Finish] to complete the wizard, which adds the interface to your module.
-image::images/nbm-quick-start/new-api-7.png[]
+image::images/quickstart-platform_73_new-api-7.png[]
[start=3]
1. The WordFilter.java interface should be open. Use the editor to define it as follows:
@@ -304,11 +304,11 @@
[start=4]
1. Right-click the "WordEditorAPI" module, choose Properties to open the Project Properties window.
-image::images/nbm-quick-start/new-api-8.png[]
+image::images/quickstart-platform_73_new-api-8.png[]
Select the "API Versioning" category, and check the box under "Public Packages" to specify that the package containing the interface should be available throughout the application:
-image::images/nbm-quick-start/new-api-9.png[]
+image::images/quickstart-platform_73_new-api-9.png[]
Click btn:[OK].
@@ -348,42 +348,42 @@
[start=1]
1. In the Projects window, right-click the Modules node of the application, and choose "Add New" again:
-image::images/nbm-quick-start/new-impl-1.png[]
+image::images/quickstart-platform_73_new-impl-1.png[]
Name the new module "UppercaseFilter":
-image::images/nbm-quick-start/new-impl-2.png[]
+image::images/quickstart-platform_73_new-impl-2.png[]
Click btn:[Next]. Set the Code Name Base to `org.word.editor.uppercase`, as shown below:
-image::images/nbm-quick-start/new-impl-3.png[]
+image::images/quickstart-platform_73_new-impl-3.png[]
Click btn:[Finish] to complete the wizard, which adds the module to your previously created application, as you did in the previous section:
-image::images/nbm-quick-start/new-impl-4.png[]
+image::images/quickstart-platform_73_new-impl-4.png[]
[start=2]
1. Right-click the Libraries node of the "UppercaseFilter" module, and choose Add Module Dependency, as shown below:
-image::images/nbm-quick-start/new-impl-5.png[]
+image::images/quickstart-platform_73_new-impl-5.png[]
Start typing the name of the API class (WordEditorAPI) and notice that the list narrows until the module containing the class is found:
-image::images/nbm-quick-start/new-impl-6.png[]
+image::images/quickstart-platform_73_new-impl-6.png[]
Click btn:[OK].
A confirmation dialog will appear:
-image::images/nbm-quick-start/new-impl-7.png[]
+image::images/quickstart-platform_73_new-impl-7.png[]
Click btn:[Yes] to add the dependency.
In the Projects window, expand "Libraries" in the "UppercaseFilter" project to see that the "WordEditorAPI" dependency has been added:
-image::images/nbm-quick-start/new-impl-8.png[]
+image::images/quickstart-platform_73_new-impl-8.png[]
As another way to see this, in the Projects window, expand "Important Files" in the "UppercaseFilter" project, and then double-click "Project Metadata". The "project.xml" file opens and you should see that a new dependency has been declared:
@@ -421,11 +421,11 @@
[start=4]
1. You can now implement the interface defined in the WordEditorAPI module. In the "UppercaseFilter" module create a new class in the `org.word.editor.uppercase` package, as shown below.
-image::images/nbm-quick-start/new-impl-9.png[]
+image::images/quickstart-platform_73_new-impl-9.png[]
Name the new class `UppercaseFilter`:
-image::images/nbm-quick-start/new-impl-10.png[]
+image::images/quickstart-platform_73_new-impl-10.png[]
Click btn:[Finish] to exit the wizard and create the file. It should open automatically for editing.
@@ -456,15 +456,15 @@
[start=5]
1. In the Projects tree, expand the WordEditorCore module to locate the Libraries node. Right click and select "Add Modules Dependency...".
-image::images/nbm-quick-start/new-impl-11.png[]
+image::images/quickstart-platform_73_new-impl-11.png[]
Add the WordEditorAPI dependency:
-image::images/nbm-quick-start/new-impl-12.png[]
+image::images/quickstart-platform_73_new-impl-12.png[]
Expand the Libraries entries to verify the dependency as been added:
-image::images/nbm-quick-start/new-impl-13.png[]
+image::images/quickstart-platform_73_ew-impl-13.png[]
[start=6]
6. Now we can modify the `WordTopComponent.java` implementation to load implementations of the "WordFilter" interface. Replace the previous implementation (which was hard-coded to just upper-case text) with the following:
@@ -510,11 +510,11 @@
[start=1]
1. Now you can run the application again and check that everything works just as before.
-image::images/nbm-quick-start/new-impl-14.png[]
+image::images/quickstart-platform_73_new-impl-14.png[]
While the functionality is the same, the new modular design offers a clear separation between the GUI and the implementation of the filter. The structure of the application should be as shown below:
-image::images/nbm-quick-start/new-impl-15.png[]
+image::images/quickstart-platform_73_new-impl-15.png[]
[start=2]
@@ -587,11 +587,11 @@
[start=2]
1. In the WordHistory module, right-click the `org.word.editor.history` package and choose New | Window. Use the New Window wizard to create a new window component that will automatically be opened on the left side of the application frame, which is the `explorer` position:
-image::images/nbm-quick-start/new-history-1.png[]
+image::images/quickstart-platform_73_new-history-1.png[]
Click btn:[Next]. Use prefix `WordHistory` and specify that the new window will be stored in the `org.word.editor.history` package.
-image::images/nbm-quick-start/new-history-2.png[]
+image::images/quickstart-platform_73_new-history-2.png[]
Click btn:[Finish] to complete the wizard and create the Window.
@@ -599,7 +599,7 @@
1. Once you have created the window, add a Text Area (`JTextArea`) to it, resizing it so that it covers the whole area of the window:
-image::images/nbm-quick-start/new-history-3.png[]
+image::images/quickstart-platform_73_new-history-3.png[]
Change the variable name of the text area to "historyText".
@@ -643,14 +643,14 @@
1. Then you can start the application and experiment with it. The result should look similar to that shown in the screenshot below:
-image::images/nbm-quick-start/new-result-1.png[]
+image::images/quickstart-platform_73_new-result-1.png[]
As an exercise, redesign the user interface of the "WordTopComponent" in such a way that a ``JList`` displays the filters.
Congratulations! At this stage, with very little coding, you have created a small example of a loosely-coupled modular application:
-image::images/nbm-quick-start/new-result-2.png[]
+image::images/quickstart-platform_73_new-result-2.png[]
Two important concepts have been covered in this tutorial.
