Skip to content
Snippets Groups Projects
Commit 828b74d6 authored by Benguria Elguezabal, Gorka's avatar Benguria Elguezabal, Gorka
Browse files

Merge remote-tracking branch 'upstream/master'

parents d225d471 b0e139fd
No related branches found
No related tags found
No related merge requests found
Expand all Show whitespace changes
Inline Side-by-side
Showing
with 8664 additions and 17530 deletions
.eslintrc.json deleted 100644 → 0
+ 0
− 47
View file @ d225d471
{
"root": true,
"ignorePatterns": [
"projects/**/*"
],
"overrides": [
{
"files": [
"*.ts"
],
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"plugin:@angular-eslint/recommended",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "app",
"style": "camelCase"
}
],
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "app",
"style": "kebab-case"
}
],
"@typescript-eslint/no-explicit-any": "off"
}
},
{
"files": [
"*.html"
],
"extends": [
"plugin:@angular-eslint/template/recommended"
],
"rules": {}
}
]
}
.gitignore
+ 4
− 0
View file @ 828b74d6
...@@ -31,3 +31,7 @@ ...@@ -31,3 +31,7 @@
/.tmpl/ /.tmpl/
.angular/* .angular/*
src/assets/kicker-aggregated-orange.json src/assets/kicker-aggregated-orange.json
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
.gitlab-ci.yml
+ 18
− 22
View file @ 828b74d6
include: include:
# $TBC_NAMESPACE is a group variable; can be globally overridden # $TBC_NAMESPACE is a group variable; can be globally overridden
# Angular template # Angular template
- project: '$TBC_NAMESPACE/angular' - component: $CI_SERVER_FQDN/$TBC_NAMESPACE/angular/gitlab-ci-angular@4
ref: '4' inputs:
file: '/templates/gitlab-ci-angular.yml' cli-image: "registry.hub.docker.com/trion/ng-cli-karma:18.0.0"
build-args: "build --configuration production"
lint-args: "version"
# Playwright template
# - component: $CI_SERVER_FQDN/$TBC_NAMESPACE/playwright/gitlab-ci-playwright@1
# inputs:
# image: 'mcr.microsoft.com/playwright:v1.45.2-jammy'
# review-enabled: true
# S3 template # S3 template
- project: '$TBC_NAMESPACE/s3' - component: $CI_SERVER_FQDN/$TBC_NAMESPACE/s3/gitlab-ci-s3@7
ref: '7' inputs:
file: '/templates/gitlab-ci-s3.yml'
variables:
NG_CLI_IMAGE: "registry.hub.docker.com/trion/ng-cli-karma:14.2.6"
NG_BUILD_ARGS: "build --configuration production"
# deploy: landing page (static/), mkdocs build (public/), Angular build (kicker/dist/) and aggregated kicker (kicker-aggregated/) # deploy: landing page (static/), mkdocs build (public/), Angular build (kicker/dist/) and aggregated kicker (kicker-aggregated/)
S3_DEPLOY_FILES: "dist/kicker/" deploy-files: "dist/kicker/browser/"
S3_STAGING_DISABLED: "true" prod-disabled: true
S3_PROD_DISABLED: "true" staging-disabled: true
review-prefix: ${CI_COMMIT_REF_SLUG}
stages:
- build
- test
- deploy
- publish
- production
# override Angular build job to run build only (no tests) # override Angular build job to run build only (no tests)
ng-build: ng-build:
...@@ -36,7 +32,7 @@ ng-build: ...@@ -36,7 +32,7 @@ ng-build:
pages: pages:
stage: deploy stage: deploy
script: script:
- cp -rf dist/kicker public - cp -rf dist/kicker/browser public
# generate build.info # generate build.info
- echo -e "Build date= $(date)\nGit Commit Ref= $CI_COMMIT_REF_NAME\nGit Commit SHA= $CI_COMMIT_SHA\n" > public/build.info - echo -e "Build date= $(date)\nGit Commit Ref= $CI_COMMIT_REF_NAME\nGit Commit SHA= $CI_COMMIT_SHA\n" > public/build.info
artifacts: artifacts:
......
angular.json
+ 94
− 132
View file @ 828b74d6
...@@ -11,23 +11,15 @@ ...@@ -11,23 +11,15 @@
"prefix": "app", "prefix": "app",
"architect": { "architect": {
"build": { "build": {
"builder": "@angular-devkit/build-angular:browser", "builder": "@angular/build:application",
"options": { "options": {
"outputPath": "dist/kicker", "outputPath": "dist/kicker",
"index": "src/index.html", "index": "src/index.html",
"main": "src/main.ts", "browser": "src/main.ts",
"polyfills": "src/polyfills.ts", "polyfills": ["zone.js", "@angular/localize/init"],
"tsConfig": "tsconfig.app.json", "tsConfig": "tsconfig.app.json",
"aot": true, "assets": ["src/favicon.ico", "src/assets"],
"assets": [ "styles": ["node_modules/boosted/dist/css/boosted.min.css", "src/styles.css"],
"src/favicon.ico",
"src/assets"
],
"styles": [
"node_modules/boosted/dist/css/orangeHelvetica.css",
"node_modules/boosted/dist/css/boosted.min.css",
"src/styles.css"
],
"scripts": [] "scripts": []
}, },
"configurations": { "configurations": {
...@@ -43,8 +35,6 @@ ...@@ -43,8 +35,6 @@
"sourceMap": false, "sourceMap": false,
"namedChunks": false, "namedChunks": false,
"extractLicenses": true, "extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [ "budgets": [
{ {
"type": "initial", "type": "initial",
...@@ -57,62 +47,36 @@ ...@@ -57,62 +47,36 @@
"maximumError": "10kb" "maximumError": "10kb"
} }
] ]
},
"development": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true
} }
} }
}, },
"serve": { "serve": {
"builder": "@angular-devkit/build-angular:dev-server", "builder": "@angular/build:dev-server",
"options": {
"browserTarget": "kicker:build"
},
"configurations": { "configurations": {
"production": { "production": {
"browserTarget": "kicker:build:production" "buildTarget": "kicker:build:production"
}
}
}, },
"extract-i18n": { "development": {
"builder": "@angular-devkit/build-angular:extract-i18n", "buildTarget": "kicker:build:development"
"options": {
"browserTarget": "kicker:build"
} }
}, },
"test": { "defaultConfiguration": "development"
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css"
],
"scripts": []
}
}, },
"e2e": { "extract-i18n": {
"builder": "@angular-devkit/build-angular:protractor", "builder": "@angular/build:extract-i18n",
"options": { "options": {
"protractorConfig": "e2e/protractor.conf.js", "buildTarget": "kicker:build"
"devServerTarget": "kicker:serve"
},
"configurations": {
"production": {
"devServerTarget": "kicker:serve:production"
}
} }
}, },
"lint": { "lint": {
"builder": "@angular-eslint/builder:lint", "builder": "@angular-eslint/builder:lint",
"options": { "options": {
"lintFilePatterns": [ "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
"src/**/*.ts",
"src/**/*.html"
]
} }
}, },
"collect-vars": { "collect-vars": {
...@@ -126,8 +90,6 @@ ...@@ -126,8 +90,6 @@
}, },
"cli": { "cli": {
"analytics": false, "analytics": false,
"schematicCollections": [ "schematicCollections": ["@angular-eslint/schematics"]
"@angular-eslint/schematics"
]
} }
} }
e2e-tests/test.spec.ts 0 → 100644
+ 12
− 0
View file @ 828b74d6
import { test, expect } from '@playwright/test';
test('Has title and simple select', async ({ page }) => {
await page.goto('/');
await expect(page).toHaveTitle(/to be continuous - Kicker/);
const buildSelector = page.locator('#build-choice');
await buildSelector.selectOption({ value: 'to-be-continuous_angular' });
await page.waitForTimeout(3000);
await expect(page.locator('body')).toContainText('Angular lint analysis');
});
e2e/protractor.conf.js deleted 100644 → 0
+ 0
− 32
View file @ d225d471
// @ts-check
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts
const { SpecReporter } = require('jasmine-spec-reporter');
/**
* @type { import("protractor").Config }
*/
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./src/**/*.e2e-spec.ts'
],
capabilities: {
browserName: 'chrome'
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: require('path').join(__dirname, './tsconfig.json')
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
};
\ No newline at end of file
e2e/src/app.e2e-spec.ts deleted 100644 → 0
+ 0
− 23
View file @ d225d471
import { AppPage } from './app.po';
import { browser, logging } from 'protractor';
describe('workspace-project App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('should display welcome message', () => {
page.navigateTo();
expect(page.getTitleText()).toEqual('kicker app is running!');
});
afterEach(async () => {
// Assert that there are no errors emitted from the browser
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
expect(logs).not.toContain(jasmine.objectContaining({
level: logging.Level.SEVERE,
} as logging.Entry));
});
});
e2e/src/app.po.ts deleted 100644 → 0
+ 0
− 11
View file @ d225d471
import { browser, by, element } from 'protractor';
export class AppPage {
navigateTo(): Promise<unknown> {
return browser.get(browser.baseUrl) as Promise<unknown>;
}
getTitleText(): Promise<string> {
return element(by.css('app-root .content span')).getText() as Promise<string>;
}
}
e2e/tsconfig.json deleted 100644 → 0
+ 0
− 13
View file @ d225d471
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/e2e",
"module": "commonjs",
"target": "es2018",
"types": [
"jasmine",
"jasminewd2",
"node"
]
}
}
karma.conf.js deleted 100644 → 0
+ 0
− 38
View file @ d225d471
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-junit-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, './coverage/kicker'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true,
junitReporter: {
outputDir: require('path').resolve('reports'),
outputFile: 'junit_test_report.xml',
useBrowserName: false,
}
});
};
kicker-screen.png
+ 0
− 0
View replaced file @ d225d471 View file @ 828b74d6
kicker-screen.png

87.3 KiB | W: | H:

kicker-screen.png

110 KiB | W: | H:

kicker-screen.png
kicker-screen.png
kicker-screen.png
kicker-screen.png
  • 2-up
  • Swipe
  • Onion skin
package-lock.json
+ 8214
− 17046
View file @ 828b74d6
This diff is collapsed.
package.json
+ 38
− 65
View file @ 828b74d6
...@@ -4,64 +4,37 @@ ...@@ -4,64 +4,37 @@
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve", "start": "ng serve",
"build": "ng build", "build": "ng build"
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "15.2.9", "@angular/animations": "18.1.0",
"@angular/common": "15.2.9", "@angular/common": "18.1.0",
"@angular/compiler": "15.2.9", "@angular/compiler": "18.1.0",
"@angular/core": "15.2.9", "@angular/core": "18.1.0",
"@angular/forms": "15.2.9", "@angular/forms": "18.1.0",
"@angular/localize": "15.2.9", "@angular/localize": "18.1.0",
"@angular/platform-browser": "15.2.9", "@angular/platform-browser": "18.1.0",
"@angular/platform-browser-dynamic": "15.2.9", "@angular/platform-browser-dynamic": "18.1.0",
"@angular/router": "15.2.9", "@angular/router": "18.1.0",
"@ng-bootstrap/ng-bootstrap": "14.2.0", "@ng-bootstrap/ng-bootstrap": "17.0.0",
"boosted": "4.3.1", "boosted": "5.3.3",
"marked": "^12.0.0",
"ng-process-env": "^16.0.6", "ng-process-env": "^16.0.6",
"ngx-matomo": "1.1.0", "ngx-markdown": "^18.0.0",
"ngx-showdown": "6.0.0",
"rxjs": "7.8.1", "rxjs": "7.8.1",
"showdown": "1.9.1", "tslib": "^2.3.0",
"tslib": "^2.0.0", "zone.js": "0.14.8"
"zone.js": "0.13.3"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "15.2.10", "@angular/build": "^18.1.0",
"@angular-eslint/builder": "15.2.1", "@angular/cli": "18.1.3",
"@angular-eslint/eslint-plugin": "15.2.1", "@angular/compiler-cli": "18.1.0",
"@angular-eslint/eslint-plugin-template": "15.2.1", "@angular/language-service": "18.1.0",
"@angular-eslint/schematics": "15.2.1", "@biomejs/biome": "1.8.3",
"@angular-eslint/template-parser": "15.2.1", "@playwright/test": "^1.45.2",
"@angular/cli": "15.2.10", "@types/node": "20.14.13",
"@angular/compiler-cli": "15.2.9",
"@angular/language-service": "15.2.9",
"@types/jasmine": "~5.1.0",
"@types/jasminewd2": "2.0.13",
"@types/node": "20.12.11",
"@types/showdown": "1.9.4",
"@typescript-eslint/eslint-plugin": "^7.0.0",
"@typescript-eslint/eslint-plugin-tslint": "^7.0.0",
"@typescript-eslint/parser": "^7.0.0",
"eslint": "^8.30.0",
"eslint-config-prettier": "^9.0.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-jsdoc": "^48.0.0",
"eslint-plugin-prefer-arrow": "^1.2.3",
"jasmine-core": "5.1.2",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.4.1",
"karma-chrome-launcher": "~3.2.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "2.1.0",
"karma-junit-reporter": "2.0.1",
"protractor": "~7.0.0",
"ts-node": "10.9.2", "ts-node": "10.9.2",
"typescript": "^4.8.4" "typescript": "^5.4.5"
} }
} }
playwright.config.ts 0 → 100644
+ 78
− 0
View file @ 828b74d6
import { defineConfig, devices } from '@playwright/test';
/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// import dotenv from 'dotenv';
// dotenv.config({ path: path.resolve(__dirname, '.env') });
/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: './e2e-tests',
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !!process.env.CI,
/* Retry on CI only */
retries: process.env.CI ? 2 : 0,
/* Opt out of parallel tests on CI. */
workers: process.env.CI ? 1 : undefined,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: 'html',
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://localhost:4200',
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: 'on-first-retry',
},
/* Configure projects for major browsers */
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},
{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ...devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Run your local dev server before starting the tests */
webServer: {
command: 'npm run start',
url: 'http://localhost:4200',
reuseExistingServer: !process.env.CI,
},
});
pre-playwright.sh 0 → 100644
+ 3
− 0
View file @ 828b74d6
#!/usr/bin/env sh
npx playwright install chrome
npx playwright install msedge
src/app/app.component.html
+ 17
− 14
View file @ 828b74d6
<!--HEADER START--> <!--HEADER START-->
<header role="banner"> <header data-bs-theme="dark">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark" aria-label="Main navigation"> <nav class="navbar navbar-expand-lg" aria-label="Main navigation">
<div class="container"> <div class="container">
<a class="navbar-brand my-2 py-1 my-md-0 py-sm-0" title="Home" href="/doc"> <!-- tbc logo -->
<img src="./assets/img/tbc-orange-50.png" alt="Orange Logo"> <div class="navbar-brand me-auto me-lg-4">
<a class="stretched-link" title="Home" href="/doc">
<img src="./assets/img/tbc-50.png" alt="TBC Logo">
</a> </a>
<span class="navbar-title h1 text-white mt-2 mt-md-auto ml-2 mr-auto mb-0">to be continuous</span> <h1 class="title">to be continuous</h1>
</div>
<button type="button" class="navbar-toggler" [attr.aria-expanded]="!isMenuCollapsed" (click)="isMenuCollapsed = !isMenuCollapsed"> <button type="button" class="navbar-toggler" [attr.aria-expanded]="!isMenuCollapsed" (click)="isMenuCollapsed = !isMenuCollapsed">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" [ngbCollapse]="isMenuCollapsed" > <div class="collapse navbar-collapse ms-auto" [ngbCollapse]="isMenuCollapsed" >
<ul class="nav navbar-nav ml-auto"> <ul class="navbar-nav">
<li class="nav-item ml-0"> <li class="nav-item ms-0">
<a class="nav-link" href="/doc/intro" title="Documentation portal">Docs</a> <a class="nav-link" href="/doc/intro" title="Documentation portal">Docs</a>
</li> </li>
<li class="nav-item active"> <li class="nav-item">
<span class="nav-link" title="Template initializer tool"><span <span class="nav-link active" title="Template initializer tool"><span
class="fa fa-wrench"></span> Kicker</span></li> class="fa fa-wrench pe-1"></span> Kicker</span></li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" <a class="nav-link"
href="https://gitlab.com/to-be-continuous/samples" href="https://gitlab.com/to-be-continuous/samples"
title="Project samples using templates"><span class="fab fa-gitlab"></span> Examples</a></li> title="Project samples using templates"><span class="fab fa-gitlab pe-1"></span> Examples</a></li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" <a class="nav-link"
[href]="tbcUrl" [href]="tbcUrl"
title="Templates code and documentation"><span class="fab fa-gitlab"></span> GitLab</a></li> title="Templates code and documentation"><span class="fab fa-gitlab pe-1"></span> GitLab</a></li>
</ul> </ul>
</div> </div>
</div> </div>
......
src/app/app.module.ts
+ 56
− 38
View file @ 828b74d6
import { BrowserModule } from "@angular/platform-browser"; import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from "@angular/core"; import { NgModule, SecurityContext } from '@angular/core';
import { HttpClientModule } from "@angular/common/http"; import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
import { FormsModule } from "@angular/forms"; import { FormsModule } from '@angular/forms';
import { ShowdownModule } from "ngx-showdown"; import { MARKED_OPTIONS, MarkdownModule, MarkedOptions, MarkedRenderer } from 'ngx-markdown';
// import {MatomoModule} from 'ngx-matomo'; // import {MatomoModule} from 'ngx-matomo';
import { AppComponent } from "./app.component"; import { AppComponent } from './app.component';
import { KickerComponent } from "./kicker/kicker.component"; import { KickerComponent } from './kicker/kicker.component';
import { GitlabCiComponent } from "./gitlab-ci/gitlab-ci.component"; import { GitlabCiComponent } from './gitlab-ci/gitlab-ci.component';
import { TemplatesSectionComponent } from "./templates-section/templates-section.component"; import { TemplatesSectionComponent } from './templates-section/templates-section.component';
import { StepbarComponent } from "./stepbar/stepbar.component"; import { StepbarComponent } from './stepbar/stepbar.component';
import { VariableEditorComponent } from "./variable-editor/variable-editor.component"; import { VariableEditorComponent } from './variable-editor/variable-editor.component';
import { OptionsBoxComponent } from "./options-box/options-box.component"; import { OptionsBoxComponent } from './options-box/options-box.component';
import { NgbModule } from "@ng-bootstrap/ng-bootstrap"; import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { OptionsFormComponent } from "./options-form/options-form.component"; import { OptionsFormComponent } from './options-form/options-form.component';
// Override `MarkedOptions` renderer to open in a new tab for links
export function markedOptionsFactory(): MarkedOptions {
const renderer = new MarkedRenderer();
const linkRenderer = renderer.link;
renderer.link = (href, title, text) => {
const html = linkRenderer.call(renderer, href, title, text);
return html.replace(/^<a /, '<a target="_blank" rel="nofollow noopener noreferrer" ');
};
return {
renderer: renderer,
gfm: true,
breaks: false,
pedantic: false,
};
}
@NgModule({ @NgModule({
declarations: [ declarations: [
...@@ -27,19 +45,19 @@ import { OptionsFormComponent } from "./options-form/options-form.component"; ...@@ -27,19 +45,19 @@ import { OptionsFormComponent } from "./options-form/options-form.component";
OptionsBoxComponent, OptionsBoxComponent,
OptionsFormComponent, OptionsFormComponent,
], ],
bootstrap: [AppComponent],
imports: [ imports: [
BrowserModule, BrowserModule,
HttpClientModule,
FormsModule, FormsModule,
ShowdownModule.forRoot({
emoji: true,
noHeaderId: true,
openLinksInNewWindow: true,
}),
// MatomoModule,
NgbModule, NgbModule,
MarkdownModule.forRoot({
sanitize: SecurityContext.NONE,
markedOptions: {
provide: MARKED_OPTIONS,
useFactory: markedOptionsFactory,
},
}),
], ],
providers: [], providers: [provideHttpClient(withInterceptorsFromDi())],
bootstrap: [AppComponent],
}) })
export class AppModule {} export class AppModule {}
src/app/gitlab-ci/gitlab-ci.component.css
+ 3
− 5
View file @ 828b74d6
...@@ -46,10 +46,8 @@ textarea.code { ...@@ -46,10 +46,8 @@ textarea.code {
top: 10px; top: 10px;
right: 10px; right: 10px;
} }
.btn-clipboard { .btn-toggle.selected {
background-color: white;
}
.btn-clipboard:hover, .btn-clipboard:focus, .btn-clipboard:active {
background-color: black; background-color: black;
color: white; color: white;
border-color: black;
} }
\ No newline at end of file
src/app/gitlab-ci/gitlab-ci.component.html
+ 123
− 44
View file @ 828b74d6
<div class="gitlab-ci-toolbar d-flex align-items-center flex-row p-2">
<!-- Include Mode (local/remote/template) -->
<div>
<label
class="col-form-label col-form-label-sm">Include <i class="fas fa-circle-info" ngbTooltip="Select the template include method you want to use."></i></label>
<div <div
class="btn-group btn-group-toggle btn-group-sm rounded ml-1" class="gitlab-ci-toolbar d-md-flex align-items-center flex-row p-2 bg-body-secondary"
data-toggle="buttons"
>
<label
class="btn btn-secondary"
[class.active]="options.includeMode === mode"
*ngFor="let mode of keys(includeModes)"
> >
<!-- Include Mode (local/remote/template) -->
<div>
<label class="col-form-label col-form-label-sm"
>Include
<i
class="fas fa-circle-info"
ngbTooltip="Select the template include method you want to use."
></i
></label>
<div class="btn-group btn-group-sm ms-1" data-toggle="buttons">
<input
type="radio"
class="btn-check"
name="include-mode"
id="include-mode-project"
autocomplete="off"
[(ngModel)]="options.includeMode"
value="project"
[checked]="options.includeMode === includeModes.project"
/>
<label class="btn btn-toggle" for="include-mode-project">project</label>
<input <input
type="radio" type="radio"
class="btn-check"
name="include-mode" name="include-mode"
id="include-mode-component"
autocomplete="off"
[(ngModel)]="options.includeMode" [(ngModel)]="options.includeMode"
[value]="mode" value="component"
[checked]="options.includeMode === mode" [checked]="options.includeMode === includeModes.component"
/>{{ mode }}</label />
<label class="btn btn-toggle" for="include-mode-component"
>component</label
> >
<input
type="radio"
class="btn-check"
name="include-mode"
id="include-mode-remote"
autocomplete="off"
[(ngModel)]="options.includeMode"
value="remote"
[checked]="options.includeMode === includeModes.remote"
/>
<label class="btn btn-toggle" for="include-mode-remote">remote</label>
</div> </div>
</div> </div>
<!-- Version Mode (major/minor/patch) --> <!-- Version Mode (major/minor/patch) -->
<div class="ml-4"> <div class="ms-md-4 mt-2 mt-md-0">
<label class="col-form-label col-form-label-sm">Version <i class="fas fa-circle-info" ngbTooltip="Select the template version pattern you want to include."></i></label> <label class="col-form-label col-form-label-sm"
<div >Version
class="btn-group btn-group-toggle btn-group-sm rounded ml-1" <i
data-toggle="buttons" class="fas fa-circle-info"
> ngbTooltip="Select the template version pattern you want to include."
<label ></i
class="btn btn-secondary" ></label>
[class.active]="options.versionMode === mode" <div class="btn-group btn-group-sm rounded ms-1" data-toggle="buttons">
*ngFor="let mode of keys(versionModes)"
>
<input <input
type="radio" type="radio"
class="btn-check"
name="version-mode" name="version-mode"
id="version-mode-major"
autocomplete="off"
[(ngModel)]="options.versionMode" [(ngModel)]="options.versionMode"
[value]="mode" value="major"
[checked]="options.versionMode === mode" [checked]="options.versionMode === versionModes.major"
/>{{ mode }}</label />
> <label class="btn btn-toggle" for="version-mode-major">major</label>
<input
type="radio"
class="btn-check"
name="version-mode"
id="version-mode-minor"
autocomplete="off"
[(ngModel)]="options.versionMode"
value="minor"
[checked]="options.versionMode === versionModes.minor"
/>
<label class="btn btn-toggle" for="version-mode-minor">minor</label>
<input
type="radio"
class="btn-check"
name="version-mode"
id="version-mode-full"
autocomplete="off"
[(ngModel)]="options.versionMode"
value="full"
[checked]="options.versionMode === versionModes.full"
/>
<label class="btn btn-toggle" for="version-mode-full">full</label>
</div> </div>
</div> </div>
<!-- Show Stages --> <!-- Show Stages -->
<div class="custom-control custom-control-inline custom-checkbox ml-4 mb-0"> <div class="form-check ms-md-4 mt-2 mt-md-0 mb-0">
<input type="checkbox" class="custom-control-input" id="stages-control" <input
[(ngModel)]="options.showStages"> type="checkbox"
<label class="custom-control-label" for="stages-control">With stages <i class="fas fa-circle-info" ngbTooltip="Required if you wish to override default stages."></i></label> class="form-check-input"
id="stages-control"
[(ngModel)]="options.showStages"
/>
<label class="form-check-label" for="stages-control"
>With stages
<i
class="fas fa-circle-info"
ngbTooltip="Required if you wish to override default stages."
></i
></label>
</div>
<!-- Gitlab server FQDN -->
<div *ngIf="options.includeMode == includeModes.remote" class="input-group input-group-sm ms-4">
<label class="input-group-text" for="gitlab-host"
>GitLab Host
<i
class="fas fa-circle-info ms-1"
ngbTooltip="Set the GitLab server host (FQDN) you want to use."
></i
></label>
<input
type="text"
class="form-control"
id="gitlab-host"
aria-label="GitlabHost"
[(ngModel)]="serverHost"
/>
</div> </div>
</div> </div>
<div class="gitlab-ci-container"> <div class="gitlab-ci-container">
<button <button
class="btn-clipboard btn btn-sm btn-secondary" class="btn-clipboard btn btn-sm btn-secondary"
data-bs-theme="dark"
placement="top" placement="top"
ngbTooltip="Copy to clipboard" ngbTooltip="Copy to clipboard"
id="copy-yaml-to-clipboard" id="copy-yaml-to-clipboard"
...@@ -101,7 +180,7 @@ ...@@ -101,7 +180,7 @@
</div> </div>
</div> </div>
<div *ngSwitchCase="includeModes.component"> <div *ngSwitchCase="includeModes.component">
<pre> - <span class="key">component</span>: "<span class="value">{{ serverHost }}/{{ template.project.path }}/{{ template.templateFile }}@{{ template.project.getLatestVersion(options.versionMode) }}</span>"</pre> <pre> - <span class="key">component</span>: "<span class="value">$CI_SERVER_FQDN/{{ template.project.path }}/{{ template.templateFile }}&#64;{{ template.project.getLatestVersion(options.versionMode) }}</span>"</pre>
<div [class.hide]="!hasInputs(template)"> <div [class.hide]="!hasInputs(template)">
<pre> <span class="key">inputs</span>:</pre> <pre> <span class="key">inputs</span>:</pre>
<div class="elements"> <div class="elements">
...@@ -137,7 +216,7 @@ ...@@ -137,7 +216,7 @@
<pre class="comment"> <pre class="comment">
# {{ template.name }} template ({{ variant.name }} variant)</pre # {{ template.name }} template ({{ variant.name }} variant)</pre
> >
<pre> - <span class="key">component</span>: "<span class="value">{{ serverHost }}/{{ variant.project.path }}/{{ variant.templateFile }}@{{ variant.project.getLatestVersion(options.versionMode) }}</span>"</pre> <pre> - <span class="key">component</span>: "<span class="value">{{ serverHost }}/{{ variant.project.path }}/{{ variant.templateFile }}&#64;{{ variant.project.getLatestVersion(options.versionMode) }}</span>"</pre>
<div [class.hide]="!hasInputs(variant)"> <div [class.hide]="!hasInputs(variant)">
<pre> <span class="key">inputs</span>:</pre> <pre> <span class="key">inputs</span>:</pre>
<div class="elements"> <div class="elements">
......
src/app/gitlab-ci/gitlab-ci.component.ts
+ 4
− 0
View file @ 828b74d6
...@@ -23,6 +23,10 @@ export class GitlabCiComponent { ...@@ -23,6 +23,10 @@ export class GitlabCiComponent {
) { ) {
} }
isProjectMode() {
return this.options.includeMode == IncludeMode.project;
}
hasIncludes() { hasIncludes() {
return this.templates.filter(t => t.enabled).length > 0; return this.templates.filter(t => t.enabled).length > 0;
} }
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment