Consolidate navigation functions
We had getBaseHref and getBaseHrefFromPath in two places, but also it looked like they needed to do exactly the same thing. We need getApiBaseHref to be a function so we can all it in the app.module provider. We also want it to return a path, not a URL. (Ignore the 'href' in the name) We need to be able to get the base URL to use for API calls - and we need, for now, while we have links being made outside of angular, to be able to get something similar to getApiBaseHref but that returns a url and not a path. Change-Id: I7457a7b160a312ea3eec74b8a4f3380a1f95d8e1
This commit is contained in:
parent
61b83b685e
commit
56f9d37813
@ -24,7 +24,7 @@ import { FormsModule } from '@angular/forms'
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module'
|
||||
import { AppComponent } from './app.component'
|
||||
import { getBaseHref } from './util'
|
||||
import { getAppBaseHref } from './zuul/zuul.service'
|
||||
|
||||
import BuildsComponent from './builds/builds.component'
|
||||
import NavigationComponent from './navigation/navigation.component'
|
||||
@ -61,7 +61,7 @@ import ZuulService from './zuul/zuul.service'
|
||||
],
|
||||
providers: [
|
||||
ZuulService,
|
||||
{provide: APP_BASE_HREF, useValue: getBaseHref()}
|
||||
{provide: APP_BASE_HREF, useValue: getAppBaseHref()}
|
||||
],
|
||||
bootstrap: [
|
||||
AppComponent
|
||||
|
@ -16,7 +16,7 @@ under the License.
|
||||
<nav class="navbar navbar-default">
|
||||
<div class="container-fluid">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" [routerLink]="zuul.getBaseHref()" target="_self">Zuul Dashboard</a>
|
||||
<a class="navbar-brand" [routerLink]="zuul.appBaseHref" target="_self">Zuul Dashboard</a>
|
||||
</div>
|
||||
<ul class="nav navbar-nav" *ngIf="showNavbar">
|
||||
<li routerLinkActive="active" *ngFor="let route of navbarRoutes">
|
||||
|
@ -46,7 +46,7 @@ import LineTImage from '../images/line-t.png';
|
||||
return defaultValue
|
||||
}
|
||||
|
||||
$.zuul = function (options) {
|
||||
$.zuul = function (options, zuulService) {
|
||||
options = $.extend({
|
||||
'enabled': true,
|
||||
'graphite_url': '',
|
||||
@ -414,7 +414,7 @@ import LineTImage from '../images/line-t.png';
|
||||
}
|
||||
|
||||
let $icon = $('<img />')
|
||||
.attr('src', iconFile)
|
||||
.attr('src', zuulService.appBaseHref + iconFile)
|
||||
.attr('title', iconTitle)
|
||||
.css('display', 'block')
|
||||
|
||||
|
@ -53,7 +53,7 @@ function zuulStart ($, tenant, zuulService) {
|
||||
params['source'] = zuulService.getSourceUrl('status', tenant)
|
||||
}
|
||||
|
||||
let zuul = $.zuul(params)
|
||||
let zuul = $.zuul(params, zuulService)
|
||||
|
||||
zuul.jq.on('update-start', function () {
|
||||
$container.addClass('zuul-container-loading')
|
||||
|
31
web/util.ts
31
web/util.ts
@ -1,31 +0,0 @@
|
||||
// Copyright 2017 Red Hat
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License"); you may
|
||||
// not use this file except in compliance with the License. You may obtain
|
||||
// a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
// License for the specific language governing permissions and limitations
|
||||
// under the License.
|
||||
|
||||
declare var ZUUL_BASE_HREF: string
|
||||
|
||||
export function getBaseHrefFromPath (path: string) {
|
||||
if (path.includes('/t/')) {
|
||||
return path.slice(0, path.lastIndexOf('/t/') + 1)
|
||||
} else {
|
||||
return path.split('/').slice(0, -1).join('/') + '/'
|
||||
}
|
||||
}
|
||||
|
||||
export function getBaseHref (): string {
|
||||
if (typeof ZUUL_BASE_HREF !== 'undefined') {
|
||||
return ZUUL_BASE_HREF
|
||||
} else {
|
||||
return getBaseHrefFromPath(window.location.pathname)
|
||||
}
|
||||
}
|
@ -15,66 +15,79 @@
|
||||
import { Injectable } from '@angular/core'
|
||||
import { ActivatedRoute } from '@angular/router'
|
||||
|
||||
import { getBaseHrefFromPath } from '../util'
|
||||
import * as url from 'url'
|
||||
|
||||
declare var ZUUL_API_URL: string
|
||||
declare var ZUUL_BASE_HREF: string
|
||||
|
||||
function getAppBaseHrefFromPath () {
|
||||
const path = window.location.pathname
|
||||
if (path.includes('/t/')) {
|
||||
return path.slice(0, path.lastIndexOf('/t/') + 1)
|
||||
} else {
|
||||
return path.split('/').slice(0, -1).join('/') || '/'
|
||||
}
|
||||
}
|
||||
|
||||
export function getAppBaseHref (): string {
|
||||
/*
|
||||
* Return a value suitable for use in
|
||||
* https://angular.io/api/common/APP_BASE_HREF
|
||||
*/
|
||||
let path
|
||||
if (typeof ZUUL_BASE_HREF !== 'undefined') {
|
||||
path = ZUUL_BASE_HREF
|
||||
} else {
|
||||
// Use window.location.pathname because we're looking for a path
|
||||
// prefix, not a URL.
|
||||
path = getAppBaseHrefFromPath()
|
||||
}
|
||||
if (! path.endsWith('/')) {
|
||||
path = path + '/'
|
||||
}
|
||||
return path
|
||||
}
|
||||
|
||||
|
||||
@Injectable()
|
||||
class ZuulService {
|
||||
private baseHref: string
|
||||
public baseApiUrl: string
|
||||
public appBaseHref: string
|
||||
|
||||
constructor() {
|
||||
this.baseApiUrl = this.getBaseApiUrl()
|
||||
this.appBaseHref = getAppBaseHref()
|
||||
}
|
||||
|
||||
getBaseApiUrl (): string {
|
||||
let path
|
||||
if (typeof ZUUL_API_URL !== 'undefined') {
|
||||
this.baseHref = ZUUL_API_URL
|
||||
path = ZUUL_API_URL
|
||||
} else {
|
||||
this.baseHref = getBaseHrefFromPath(window.location.href)
|
||||
path = url.resolve(window.location.href, getAppBaseHrefFromPath())
|
||||
}
|
||||
if (this.baseHref.endsWith('/')) {
|
||||
this.baseHref = this.baseHref.slice(0, 1)
|
||||
if (! path.endsWith('/')) {
|
||||
path = path + '/'
|
||||
}
|
||||
return path
|
||||
}
|
||||
|
||||
getSourceUrl (filename: string, tenant?: string): string {
|
||||
if (tenant) {
|
||||
// Multi-tenant deploy. This is at t/a-tenant/x.html
|
||||
return `${this.baseHref}/api/tenant/${tenant}/${filename}`
|
||||
return url.resolve(this.baseApiUrl, `api/tenant/${tenant}/${filename}`)
|
||||
} else {
|
||||
// Whitelabel deploy or tenants list, such as /status.html,
|
||||
// /tenants.html or /zuul/status.html or /zuul/tenants.html
|
||||
return `${this.baseHref}/api/${filename}`
|
||||
return url.resolve(this.baseApiUrl, `api/${filename}`)
|
||||
}
|
||||
}
|
||||
|
||||
getWebsocketUrl (filename: string, tenant?: string): string {
|
||||
let apiBase: string
|
||||
if (typeof ZUUL_API_URL !== 'undefined') {
|
||||
apiBase = ZUUL_API_URL
|
||||
} else {
|
||||
apiBase = window.location.href
|
||||
}
|
||||
|
||||
return url
|
||||
.resolve(apiBase, this.getSourceUrl(filename, tenant))
|
||||
return this.getSourceUrl(filename, tenant)
|
||||
.replace(/(http)(s)?\:\/\//, 'ws$2://')
|
||||
}
|
||||
|
||||
getBaseHrefFromPath (path: string) {
|
||||
if (path.includes('/t/')) {
|
||||
return path.slice(0, path.lastIndexOf('/t/') + 1)
|
||||
} else {
|
||||
return path.split('/').slice(0, -1).join('/') + '/'
|
||||
}
|
||||
}
|
||||
|
||||
getBaseHref (): string {
|
||||
if (typeof ZUUL_BASE_HREF !== 'undefined') {
|
||||
return ZUUL_BASE_HREF
|
||||
} else {
|
||||
return this.getBaseHrefFromPath(window.location.pathname)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default ZuulService
|
||||
|
Loading…
Reference in New Issue
Block a user