Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Navigation node as a link to an external page #121

Merged

Conversation

parostatkiem-zz
Copy link
Contributor

Description

Changes proposed in this pull request:

  • If a navigation node has externalLinkURL property defined, pathSegment property is ignored along with the whole routing mechanizm
  • Some external links example in Angular app. One in top nav, others in side nav (/#/ext)
  • Extra css classes are added to these nodes

Resolves #91

Copy link
Contributor

@klaudiagrz klaudiagrz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just two small fixes :)

@@ -66,6 +66,8 @@ window.Luigi.setConfig({
## Nodes

- **pathSegment** specifies the partial URL of the current segment. A static settings example reflects `luigidomain.test/settings`, while a dynamic one, prefixed with a colon, loads on any other value. **pathSegments** must not contain slashes.
- **externalLinkUrl** specifies the external URL that Node leads to. If this property is set, **pathSegment** will be ignored.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If this property is set, **pathSegment** is ignored.

@@ -66,6 +66,8 @@ window.Luigi.setConfig({
## Nodes

- **pathSegment** specifies the partial URL of the current segment. A static settings example reflects `luigidomain.test/settings`, while a dynamic one, prefixed with a colon, loads on any other value. **pathSegments** must not contain slashes.
- **externalLinkUrl** specifies the external URL that Node leads to. If this property is set, **pathSegment** will be ignored.
- **sameWindow** defines if the external URL should be opened in new or current tab. Works only if **externalLinkUrl** is set.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

defines if the external URL is opened in a new or current tab.

Copy link
Contributor

@klaudiagrz klaudiagrz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please correct the typo

- **externalLinkUrl** specifies the external URL that Node leads to. If this property is set, **pathSegment** will be ignored.
- **sameWindow** defines if the external URL should be opened in new or current tab. Works only if **externalLinkUrl** is set.
- **externalLinkUrl** specifies the external URL that Node leads to. If this property is set, **pathSegment** is ignored.
- **sameWindow** defines if the external URL sis opened in a new or current tab. Works only if **externalLinkUrl** is set.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sis -> is

@maxmarkus maxmarkus self-assigned this Oct 4, 2018
Copy link
Contributor

@maxmarkus maxmarkus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You could add a link to luigiCoreLinks in overview.component.tsof the Angular sample application.
Tets are not working.

@maxmarkus maxmarkus added the WIP Work in progress label Oct 4, 2018
@maxmarkus maxmarkus removed their assignment Oct 4, 2018
…avigation-node-as-a-link-to-external-page

# Conflicts:
#	core/src/LeftNav.html
#	core/src/TopNav.html
@parostatkiem-zz parostatkiem-zz force-pushed the Navigation-node-as-a-link-to-external-page branch from 0a0093b to f3bc754 Compare October 8, 2018 06:35
@parostatkiem-zz parostatkiem-zz removed the WIP Work in progress label Oct 8, 2018
- **context** sends the specified object as context to the view. Use this parameter in combination with the dynamic **pathSegment** to receive the context through the context listeners of **Luigi client**. This is an alternative to using the dynamic value in the **viewUrl**.
- **defaultChildNode** sets the child node that Luigi activates automatically if the current node has no **viewUrl** defined. Provide **pathSegment** of the child node you want to activate as a string.
- **isolateView** renders the view in a new frame when you enter and leave the Node. This setting overrides the same-domain frame re-usage. The **isolateView** is disabled by default.
- **externalLink** is an object specifying that the node should link to an external URL. If this property is set, **pathSegment** is ignored. It consists of the following properties:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

**externalLink** is an object which specifies that the Node links to an external URL.

- **isolateView** renders the view in a new frame when you enter and leave the Node. This setting overrides the same-domain frame re-usage. The **isolateView** is disabled by default.
- **externalLink** is an object specifying that the node should link to an external URL. If this property is set, **pathSegment** is ignored. It consists of the following properties:
- **sameWindow** defines if the external URL is opened in a new or current tab.
- **url** the external URL that Node leads to.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

**url** is the external URL that the Node leads to.


* **label** contains the display name of the navigation Node.
* **hideFromNav** shows or hides a navigation Node. You can still navigate to the Node but it will not show up in the top or left pane.
* **viewUrl** contains the URL or path to a view that renders when entering the navigation Node. Use either a full URL or a relative path. This value may consist of variables if you have specified a **navigationContext** with a dynamic **pathSegment**. If **viewUrl** is undefined, Luigi activates the child node specified in **defaultChildNode**. When both **viewUrl** and **defaultChildNode** are undefined, Luigi opens the first child of the current node.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  1. ...renders when you enter the navigation Node.
  2. ...Luigi activates the child Node specified... -> capitalize Node
  3. the current Node

* **hideFromNav** shows or hides a navigation Node. You can still navigate to the Node but it will not show up in the top or left pane.
* **viewUrl** contains the URL or path to a view that renders when entering the navigation Node. Use either a full URL or a relative path. This value may consist of variables if you have specified a **navigationContext** with a dynamic **pathSegment**. If **viewUrl** is undefined, Luigi activates the child node specified in **defaultChildNode**. When both **viewUrl** and **defaultChildNode** are undefined, Luigi opens the first child of the current node.
* **navigationContext** contains a named Node that is mainly for use in combination with a dynamic **pathSegment** to start navigation from a dynamic Node using `LuigiClient.navigationManager().fromContext('contextname')`.
* **context** sends the specified object as context to the view. Use this parameter in combination with the dynamic **pathSegment** to receive the context through the context listeners of **Luigi client**. This is an alternative to using the dynamic value in the **viewUrl**.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is an alternative to using the dynamic value in the **viewUrl**.

docs/navigation-configuration.md Outdated Show resolved Hide resolved
@maxmarkus maxmarkus self-assigned this Oct 8, 2018
# Conflicts:
#	core/examples/luigi-sample-angular/src/app/overview/overview.component.ts
#	core/src/LeftNav.html
#	core/src/services/navigation.js
#	docs/navigation-configuration.md
@@ -31,6 +31,11 @@ export class OverviewComponent {
link: '/projects/pr1/users/groups',
text: 'dynamic Nodes',
description: 'navigation Node configuration to set a specific node as dynamic'
},
{
link: 'http://google.com',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please do not link to an external page here. Maybe lets move the external Link from top navigation into the projects where we have also 'Default Child Node Example' and '(Isolated View)', so the features are grouped together. And link to /projects/pr1.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd leave the external link in the top navigation to show the developer he can also put it there.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What do you think @maxmarkus ?

Copy link
Contributor

@maxmarkus maxmarkus left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@kwiatekus
Copy link
Contributor

The external link should have dedicated style class so that user can distinguish them. This doesnt work yet

…om:parostatkiem/luigi into Navigation-node-as-a-link-to-external-page
…s-a-link-to-external-page

# Conflicts:
#	core/src/LeftNav.html
#	core/src/TopNav.html
@maxmarkus maxmarkus merged commit 8d6f2ad into SAP:master Oct 17, 2018
@maxmarkus maxmarkus deleted the Navigation-node-as-a-link-to-external-page branch October 17, 2018 10:02
stanleychh pushed a commit to stanleychh/luigi that referenced this pull request Dec 30, 2021
* Implement externalLink nodes

* Correct readme

* Correct the typo

* Add external links icon

* Improve route click handling

* Change externalLink to object

* Update readme

* Change overview and place of example externalUrl nodes

* fixed external link icons

* reverted backdrop changes
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants