[ADF-2463] Moved user guide pages to a subfolder (#3083)

* [ADF-2463] Moved user guide to a subfolder

* [ADF-2463] Fixed broken links and images

docs/README.md

@@ -28,12 +28,12 @@ that the component is complete and suitable for normal use. The other status lev
 
 <!--guide start-->
 
--   [Angular Material Design](angular-material-design.md)
+-   [Angular Material Design](user-guide/angular-material-design.md)
--   [Form Extensibility and Customisation](extensibility.md)
+-   [Form Extensibility and Customisation](user-guide/extensibility.md)
--   [Internationalization in ADF](internationalization.md)
+-   [Internationalization in ADF](user-guide/internationalization.md)
--   [Theming](theming.md)
+-   [Theming](user-guide/theming.md)
--   [Typography](typography.md)
+-   [Typography](user-guide/typography.md)
--   [Walkthrough - adding indicators to highlight information about a node](metadata-indicators.md)
+-   [Walkthrough - adding indicators to highlight information about a node](user-guide/metadata-indicators.md)
 
 <!--guide end-->
 

docs/content-services/document-list.component.md

@@ -806,7 +806,7 @@ This will give the following output:
 -   [Pagination component](../core/pagination.component.md)
 -   [Infinite pagination component](../core/infinite-pagination.component.md)
 -   [Sites dropdown component](sites-dropdown.component.md)
--   [Metadata indicators](../metadata-indicators.md)
+-   [Metadata indicators](../user-guide/metadata-indicators.md)
 -   [Document library model](document-library.model.md)
 -   [Nodes api service](../core/nodes-api.service.md)
 -   [Breadcrumb component](breadcrumb.component.md)

docs/core/form-field.model.md

@@ -60,7 +60,7 @@ You will need to use the properties of `FormFieldModel` if you want to implement
 custom widgets. Aside from the `value` property (which contains the data value entered into
 the field), there are also a few other fields that are used for specific types of data. For
 example, the `currency` property holds the currency symbol to be displayed next to the value
-(such as the dollar sign $) and the `dateDisplayFormat` defines how the elements of a date/time will be arranged. See the [Form Extensibility and Customization](../extensibility.md) for more information about creating custom widgets.
+(such as the dollar sign $) and the `dateDisplayFormat` defines how the elements of a date/time will be arranged. See the [Form Extensibility and Customization](../user-guide/extensibility.md) for more information about creating custom widgets.
 
 ### Validation
 
@@ -93,7 +93,7 @@ contains full details about how the REST calls work, along with a worked example
 
 ## See also
 
--   [Extensibility](../extensibility.md)
+-   [Extensibility](../user-guide/extensibility.md)
 -   [FormFieldValidator](form-field-validator.interface.md)
 -   [Form rendering service](form-rendering.service.md)
 -   [Form component](form.component.md)

docs/core/form-rendering.service.md

@@ -90,11 +90,11 @@ formRenderingService.setComponentTypeResolver('text', newResolver, true);
 
 You would typically use this to replace an existing widget with your own custom version that
 implements a modified layout or responds differently when the data is entered. See the
-[Form Extensibility and Customisation](../extensibility.md) guide for further details and examples
+[Form Extensibility and Customisation](../user-guide/extensibility.md) guide for further details and examples
 of this technique.
 
 ## See also
 
--   [Extensibility](../extensibility.md)
+-   [Extensibility](../user-guide/extensibility.md)
 -   [Form field model](form-field.model.md)
 -   [Form component](form.component.md)

docs/core/form.component.md

@@ -338,6 +338,6 @@ Using the CSS you can target any outcome ID and change the style as in this exam
 ## See also
 
 -   [FormFieldValidator](form-field-validator.interface.md)
--   [Extensibility](../extensibility.md)
+-   [Extensibility](../user-guide/extensibility.md)
 -   [Form rendering service](form-rendering.service.md)
 -   [Form field model](form-field.model.md)

docs/core/language-menu.component.md

@@ -72,4 +72,4 @@ In the previous example we are using the ADF Language Menu as nested menu.
 
 ## See Also
 
--   [Internationalization](../internationalization.md)
+-   [Internationalization](../user-guide/internationalization.md)

docs/core/translation.service.md

@@ -149,4 +149,4 @@ class MyComponent {
 
 ## See Also
 
--   [Internationalization](../internationalization.md)
+-   [Internationalization](../user-guide/internationalization.md)

docs/insights/widget.component.md

@@ -31,9 +31,9 @@ export class CustomEditorComponent extends WidgetComponent {}
 ## Details
 
 The Widget component is the base class for all standard and custom form widgets. See the
-[Form Extensibility and Customisation](../extensibility.md) page for full details about
+[Form Extensibility and Customisation](../user-guide/extensibility.md) page for full details about
 implementing custom widgets.
 
 ## See also
 
--   [Extensibility](../extensibility.md)
+-   [Extensibility](../user-guide/extensibility.md)

docs/seeAlsoGraph.json

@@ -1,145 +0,0 @@
-{
-    "accordion.component": ["accordion-group.component"],
-    "accordion-group.component": [],
-    "alfresco-api.service": [],
-    "analytics-generator.component": [],
-    "analytics-report-list.component": [],
-    "analytics.component": [],
-    "angular-material-design": ["theming"],
-    "app-config.service": [],
-    "apps-list.component": [],
-    "apps-process.service": ["filter.model"],
-    "auth-guard.service": ["auth-guard-bpm.service", "auth-guard-ecm.service"],
-    "auth-guard-bpm.service": ["auth-guard-ecm.service"],
-    "auth-guard-ecm.service": [],
-    "authentication.service": [],
-    "breadcrumb.component": ["document-list.component"],
-    "bpm-user.model": ["bpm-user.service", "ecm-user.model", "people-process.service"],
-    "bpm-user.service": ["ecm-user.service"],
-    "card-view.component": ["card-view-update.service"],
-    "card-view-update.service": [],
-    "checklist.component": [],
-    "comments.component": [],
-    "comment-process.model": [],
-    "comment-process.service": ["comment-process.model"],
-    "content-action.component": ["document-list.component", "document-actions.service", "folder-actions.service"],
-    "content-node-selector.component": ["document-list.component"],
-    "content.service": ["cookie.service", "storage.service"],
-    "context-menu.directive": [],
-    "cookie.service": ["content.service"],
-    "create-process-attachment.component": [],
-    "create-task-attachment.component": [],
-    "data-column.component": ["document-list.component", "datatable.component", "task-list.component"],
-    "datatable.component": [
-        "data-column.component",
-        "pagination.component"
-    ],
-    "DataTableAdapter": ["datatable.component", "task-list.component"],
-    "deleted-nodes-api.service": [],
-    "diagram.component": [],
-    "discovery-api.service": ["product-version.model"],
-    "document-actions.service": [],
-    "document-library.model": [],
-    "document-list.component": [
-        "datatable.component",
-        "data-column.component",
-        "pagination.component",
-        "infinite-pagination.component",
-        "sites-dropdown.component",
-        "metadata-indicators",
-        "document-library.model",
-        "nodes-api.service"
-    ],
-    "document-list.service": ["document-list.component"],
-    "dropdown-breadcrumb.component": ["document-list.component", "breadcrumb.component"],
-    "ecm-user.model": ["ecm-user.service", "people-content.service"],
-    "ecm-user.service": [],
-    "extensibility": [],
-    "file-uploading-dialog.component": ["upload-button.component","upload-drag-area.component"],
-    "filter.model": ["process-filters.component", "task-filters.component"],
-    "folder-actions.service": ["document-actions.service"],
-    "form-list.component": [],
-    "form-field.model": ["extensibility", "FormFieldValidator", "form-rendering.service"],
-    "form-rendering.service": ["extensibility"],
-    "form.component": [
-        "stencils",
-        "FormFieldValidator",
-        "extensibility",
-        "form-rendering.service",
-        "form-field.model"
-    ],
-    "form.service": [],
-    "FormFieldValidator": [],
-    "highlight.directive": ["text-highlight.pipe"],
-    "highlight-transform.service": ["text-highlight.pipe", "highlight.directive"],
-    "infinite-pagination.component": [],
-    "info-drawer.component": ["info-drawer-layout.component"],
-    "info-drawer-layout.component": [],
-    "like.component": ["rating.component"],
-    "login.component": ["logout.directive"],
-    "logout.directive": [],
-    "metadata-indicators": [],
-    "mime-type-icon.pipe": [],
-    "node-permission.directive": [],
-    "nodes-api.service": ["document-library.model", "deleted-nodes-api.service"],
-    "node.service": ["nodes-api.service", "deleted-nodes-api.service"],
-    "notification.service": [],
-    "pagination.component": ["infinite-pagination.component"],
-    "page-title.service": ["app-config.service"],
-    "permissions-style.model": ["document-list.component"],
-    "people-search.component": [],
-    "people.component": [],
-    "people-content.service": ["people-process.service"],
-    "people-process.service": ["user-process.model"],
-    "process-attachment-list.component": [],
-    "process-audit.directive": [],
-    "process-comments.component": [],
-    "process-filters.component": [],
-    "process-instance-details.component": [],
-    "process-instance-header.component": [],
-    "process-instance-tasks.component": [],
-    "process-list.component": [],
-    "product-version.model": [],
-    "rating.component": ["like.component"],
-    "rating.service": ["like.component", "rating.component"],
-    "renditions.service": [],
-    "search-control.component": ["search.component"],
-    "search.component": [],
-    "site.model": [],
-    "sites.service": ["site.model"],
-    "sites-dropdown.component": [],
-    "start-process.component": [],
-    "start-task.component": [],
-    "stencils": [],
-    "storage.service": ["cookie.service"],
-    "tag-actions.component": [],
-    "tag-list.component": [],
-    "tag.service": ["tag-list.component"],
-    "tag-node-list.component": [],
-    "task-attachment-list.component": [],
-    "task-audit.directive": [],
-    "task-details.component": [],
-    "task-details.model": [],
-    "task-filters.component": [],
-    "task-header.component": [],
-    "task-list.component": [],
-    "text-highlight.pipe": [],
-    "theming": [],
-    "thumbnail.service": ["mime-type-icon.pipe"],
-    "toolbar-divider.component": [],
-    "toolbar-title.component": [],
-    "toolbar.component": ["toolbar-divider.component", "toolbar-title.component"],
-    "translation.service": [],
-    "upload-button.component": [],
-    "upload-drag-area.component": [],
-    "upload.directive": [],
-    "upload.service": [],
-    "user-info.component": [],
-    "user-preferences.service": [],
-    "user-process.model": [],
-    "version-manager.component": ["version-list.component", "document-list.component"],
-    "version-list.component": [],
-    "viewer.component": [],
-    "webscript.component": [],
-    "widget.component": ["extensibility"]
-}

docs/user-guide/extensibility.md

@@ -94,7 +94,7 @@ rendered within `<adf-form>` component.
 
 First let's create a simple APS form with `Text` widgets:
 
-![default text widget](docassets/images/text-default-widget.png)
+![default text widget](../docassets/images/text-default-widget.png)
 
 Every custom widget must inherit `WidgetComponent` class in order to function properly:
 
@@ -161,7 +161,7 @@ export class MyView {
 
 At runtime it should look similar to the following:
 
-![custom text widget](docassets/images/text-custom-widget.png)
+![custom text widget](../docassets/images/text-custom-widget.png)
 
 ## Replacing custom stencils with custom components
 
@@ -171,7 +171,7 @@ This is a short walkthrough on rendering custom APS stencils by means of custom
 
 First let's create a basic stencil and call it `Custom Stencil 01`:
 
-![custom stencil](docassets/images/activiti-stencil-01.png)
+![custom stencil](../docassets/images/activiti-stencil-01.png)
 
 _Note the `internal identifier` value as it will become a `field type` value when corresponding form is rendered._
 
@@ -183,17 +183,17 @@ Next put some simple html layout for `Form runtime template` and `Form editor te
 
 Now you are ready to design a test form based on your custom stencil:
 
-![custom stencil form](docassets/images/activiti-stencil-02.png)
+![custom stencil form](../docassets/images/activiti-stencil-02.png)
 
 Once wired with a new task it should look like the following within APS web application:
 
-![custom stencil task](docassets/images/activiti-stencil-03.png)
+![custom stencil task](../docassets/images/activiti-stencil-03.png)
 
 ### Creating custom widget
 
 If you load previously created task into ADF `<adf-form>` component you will see something like the following:
 
-![adf stencil](docassets/images/adf-stencil-01.png)
+![adf stencil](../docassets/images/adf-stencil-01.png)
 
 Let's create an Angular component to render missing content:
 
@@ -255,11 +255,11 @@ export class MyView {
 
 At runtime you should now see your custom Angular component rendered in place of the stencils:
 
-![adf stencil runtime](docassets/images/adf-stencil-02.png)
+![adf stencil runtime](../docassets/images/adf-stencil-02.png)
 
 ## See Also
 
--   [Form field model](core/form-field.model.md)
+-   [Form field model](../core/form-field.model.md)
--   [Form rendering service](core/form-rendering.service.md)
+-   [Form rendering service](../core/form-rendering.service.md)
--   [Form component](core/form.component.md)
+-   [Form component](../core/form.component.md)
--   [Widget component](insights/widget.component.md)
+-   [Widget component](../insights/widget.component.md)

docs/user-guide/internationalization.md

@@ -71,7 +71,7 @@ notation (so `FORM.START_FORM.TITLE` would be the key for the "Start Form"
 string here). This is useful for grouping related messages and providing
 singular and plural versions, among other things.
 
-The [Translation service](core/translation.service.md) defines the `get` method to
+The [Translation service](../core/translation.service.md) defines the `get` method to
 get the translation of a key in the current language. A simple component might
 contain code like this:
 
@@ -107,7 +107,7 @@ export class HomeComponent implements OnInit {
 
 In the browser, this is displayed as:
 
-![English translation text](docassets/images/TransExEn.png)
+![English translation text](../docassets/images/TransExEn.png)
 
 English is used by default but you can easily change the language with the
 `use` method:
@@ -124,7 +124,7 @@ ngOnInit() {
 
 The user will now see:
 
-![German translation text](docassets/images/TransExDe.png)
+![German translation text](../docassets/images/TransExDe.png)
 
 Note that an unrecognized key will be returned unchanged as the "translation".
 If you see strings like "FORM.START_FORM.TITLE" displayed in your app then you
@@ -146,7 +146,7 @@ component's `.ts` file:
 The built-in translations certainly won't cover everything you will need for
 your app but you can easily replace them with your own lists. This involves
 making copies of the existing lists in your app's folder and adding your
-own keys. See the [Translation service](core/translation.service.md) page for
+own keys. See the [Translation service](../core/translation.service.md) page for
 full details and examples.
 
 ## Interpolations
@@ -191,30 +191,30 @@ You can use interpolations with the `translate` pipe in a similar way:
 
 ## Selecting the display language
 
-ADF provides a [Language Menu component](core/language-menu.component.md) that
+ADF provides a [Language Menu component](../core/language-menu.component.md) that
 you can add to a page to let the user choose their preferred language. The
 available languages are defined in the `app.config.json` file for the app.
 
 Note that when the user selects an item from the menu, it simply changes the "locale"
-preference (which you can get via the [User Preferences service](core/user-preferences.service.md)).
+preference (which you can get via the [User Preferences service](../core/user-preferences.service.md)).
 The `translate` pipe reacts automatically to this and changes the page text
 immediately to the new language. However, text added via a variable set using
 `TranslationService.get`, as in the example above, will not be updated like this;
 you will need to get a new translation and set the variable's value again explicitly
 from the code.
 
-See the [Language Menu component](core/language-menu.component.md) page for further
+See the [Language Menu component](../core/language-menu.component.md) page for further
 details and usage examples.
 
 ## Support for i18n within ADF components
 
 Some components allow you to use translation keys in places where you would normally
 supply your own messages directly. For example, the
-[Data Column component](core/data-column.component.md) can accept a key instead of
+[Data Column component](../core/data-column.component.md) can accept a key instead of
 normal text to specify the column title. Consult the documentation for a
 component to see if it has built-in support for i18n.
 
 ## See also
 
--   [Translation service](core/translation.service.md)
+-   [Translation service](../core/translation.service.md)
--   [Language Menu component](core/language-menu.component.md)
+-   [Language Menu component](../core/language-menu.component.md)

docs/user-guide/metadata-indicators.md

@@ -8,7 +8,7 @@ All metadata is stored inside `properties` property.
 
 Here's an example of basic image-related metadata fetched from the server:
 
-![](docassets/images/metadata-01.png)
+![](../docassets/images/metadata-01.png)
 
 ## Custom column template
 
@@ -93,12 +93,12 @@ You will need to enable `versioning` feature for the Document List to be able to
 
 Drag and drop any image file to upload it and ensure it has `1.0` displayed in the column:
 
-![](docassets/images/metadata-02.png)
+![](../docassets/images/metadata-02.png)
 
 Now drop the same file again to upload a new version of the file. 
 You should now see icons instead of version label. 
 
-![](docassets/images/metadata-03.png)
+![](../docassets/images/metadata-03.png)
 
 You can see on the screenshot above that only files with version `2.0` got extra icons.
 

docs/user-guide/theming.md

@@ -12,7 +12,7 @@ throughout the app) and the **accent** color (used mainly for highlighting and c
 out specific UI elements). Each of these colors is defined in a number of shades. For
 example, a blue/orange theme could define shades like the following:
 
-![Theme swatches](docassets/images/ThemeSwatches.png)
+![Theme swatches](../docassets/images/ThemeSwatches.png)
 
 Each shade is related to a particular purpose or set of purposes within the app. So for
 example, the shade that works best for text isn't necessarily the same shade you would use

lib/config/DocProcessor/tools/index.js

@@ -24,7 +24,9 @@ var docsFolderPath = path.resolve("..", "docs");
 var undocStoplistFileName = path.resolve(docsFolderPath, "undocStoplist.json");
 var rootFolder = ".";
 var indexMdFilePath = path.resolve(docsFolderPath, "README.md");
-var guideSummaryFileName = path.resolve(docsFolderPath, "summary.json");
+
+var guideFolderName = "user-guide";
+var guideSummaryFileName = path.resolve(docsFolderPath, guideFolderName, "summary.json");
 
 var maxBriefDescLength = 180;
 
@@ -373,7 +375,7 @@ function buildGuideSection(guideJsonFilename) {
     var listItems = [];
 
     for (var i = 0; i < summary.length; i++) {
-        var link = unist.makeLink(unist.makeText(summary[i].title), summary[i].file);
+        var link = unist.makeLink(unist.makeText(summary[i].title), guideFolderName + "/" + summary[i].file);
         listItems.push(unist.makeListItem(link));
     }