Merge pull request #9 from SoftwareAG/version2

Version2 - adding c8ycli support, cache fix  and tidy up of layout

app.module.ts

@@ -0,0 +1,68 @@
+/** @format */
+
+import { NgModule } from "@angular/core";
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
+import { RouterModule as NgRouterModule } from "@angular/router";
+import { UpgradeModule as NgUpgradeModule } from "@angular/upgrade/static";
+import { CoreModule, HOOK_COMPONENTS, RouterModule } from "@c8y/ngx-components";
+import { DashboardUpgradeModule, UpgradeModule, HybridAppModule, UPGRADE_ROUTES } from "@c8y/ngx-components/upgrade";
+import { AssetsNavigatorModule } from "@c8y/ngx-components/assets-navigator";
+import { CockpitDashboardModule } from "@c8y/ngx-components/context-dashboard";
+import { ReportsModule } from "@c8y/ngx-components/reports";
+import { SensorPhoneModule } from "@c8y/ngx-components/sensor-phone";
+import { CumulocityDatapointsChartingWidgetConfig } from "./src/cumulocity-datapoints-charting-widget/cumulocity-datapoints-charting-widget.config.component";
+import { CumulocityDatapointsChartingWidget } from "./src/cumulocity-datapoints-charting-widget/cumulocity-datapoints-charting-widget.component";
+import { NgSelectModule } from "@ng-select/ng-select";
+import { ChartsModule } from "ng2-charts";
+
+@NgModule({
+ imports: [
+ BrowserAnimationsModule,
+ RouterModule.forRoot(),
+ NgRouterModule.forRoot([...UPGRADE_ROUTES], { enableTracing: false, useHash: true }),
+ CoreModule.forRoot(),
+ AssetsNavigatorModule,
+ ReportsModule,
+ NgUpgradeModule,
+ DashboardUpgradeModule,
+ CockpitDashboardModule,
+ SensorPhoneModule,
+ UpgradeModule,
+ NgSelectModule,
+ ChartsModule
+ ],
+ declarations: [CumulocityDatapointsChartingWidget, CumulocityDatapointsChartingWidgetConfig],
+ entryComponents: [CumulocityDatapointsChartingWidget, CumulocityDatapointsChartingWidgetConfig],
+ providers: [
+ {
+ provide: HOOK_COMPONENTS,
+ multi: true,
+ useValue: [
+ {
+ id: "global.presales.CumulocityDataPointsCharting.widget",
+ label: "Data Points Charting",
+ description: "Graph measurements and statistics about measurements",
+ component: CumulocityDatapointsChartingWidget,
+ configComponent: CumulocityDatapointsChartingWidgetConfig,
+ previewImage: require("@widget-assets/img-preview.png"),
+ data: {
+ ng1: {
+ options: {
+ noDeviceTarget: true,
+ noNewWidgets: false,
+ deviceTargetNotRequired: true,
+ groupsSelectable: true
+ },
+ }
+ }
+ },
+ ],
+ },
+
+ ],
+})
+export class AppModule extends HybridAppModule {
+ constructor(protected upgrade: NgUpgradeModule) {
+ super();
+ }
+}

gulpfile.js

@@ -30,59 +30,68 @@ const compile = series(
  .pipe(bump())
  .pipe(dest('./'));
  },
- function buildAngularLibrary() { return ngPackagr.build({ project: './ng-package.json' }) },
- function separateWebpackBuildSrc() { return fs.copy('./dist/widget-library/fesm5', './dist/bundle-src') },
+ function buildAngularLibrary() {
+ return ngPackagr.ngPackagr()
+ .forProject('./ng-package.json')
+ .withTsConfig('./tsconfig.rt.json')
+ .build()
+ .catch(error => {
+ console.error(error);
+ process.exit(1);
+ });
+ },
+ function separateWebpackBuildSrc() { return fs.copy('./dist/widget-library/fesm5', './dist/bundle-src'); },
  function replaceStylePath() {
  return src('./dist/widget-library/**/*')
  .pipe(replace(/~styles/g, function () {
- return path.relative(this.file.dirname, './dist/widget-library/styles').replace(/\\/g, '/')
+ return path.relative(this.file.dirname, './dist/widget-library/styles').replace(/\\/g, '/');
  }))
- .pipe(dest('./dist/widget-library/'))
+ .pipe(dest('./dist/widget-library/'));
  },
- async function packLibrary() { return execSync("npm pack ./widget-library", { cwd: './dist', stdio: 'inherit' }) }
-)
+ async function packLibrary() { return execSync("npm pack ./widget-library", { cwd: './dist', stdio: 'inherit' }); }
+);
 
 const compileNoBump = series(
- function buildAngularLibrary() { return ngPackagr.build({ project: './ng-package.json' }) },
- function separateWebpackBuildSrc() { return fs.copy('./dist/widget-library/fesm5', './dist/bundle-src') },
+ function buildAngularLibrary() { return ngPackagr.build({ project: './ng-package.json' }); },
+ function separateWebpackBuildSrc() { return fs.copy('./dist/widget-library/fesm5', './dist/bundle-src'); },
  function replaceStylePath() {
  return src('./dist/widget-library/**/*')
  .pipe(replace(/~styles/g, function () {
- return path.relative(this.file.dirname, './dist/widget-library/styles').replace(/\\/g, '/')
+ return path.relative(this.file.dirname, './dist/widget-library/styles').replace(/\\/g, '/');
  }))
- .pipe(dest('./dist/widget-library/'))
+ .pipe(dest('./dist/widget-library/'));
  },
- async function packLibrary() { return execSync("npm pack ./widget-library", { cwd: './dist', stdio: 'inherit' }) }
-)
+ async function packLibrary() { return execSync("npm pack ./widget-library", { cwd: './dist', stdio: 'inherit' }); }
+);
 
 /**
  * Create the webpack build include the relvent items and zip it.
  */
 const bundle = series(
- async function webpackBuild() { return execSync("npx webpack", { stdio: 'inherit' }) },
- function copyCumulocityJson() { return fs.copy('./cumulocity.json', './dist/widget/cumulocity.json') },
+ async function webpackBuild() { return execSync("npx webpack", { stdio: 'inherit' }); },
+ function copyCumulocityJson() { return fs.copy('./widget-cumulocity.json', './dist/widget/cumulocity.json'); },
  function createZip() {
  const pkgJson = require('./dist/widget-library/package.json');//need bumped version.
  return src('./dist/widget/**/*')
  // Filter out the webpackRuntime chunk, we only need the widget code chunks
  .pipe(filter(file => !/^[a-f0-9]{20}\.js(\.map)?$/.test(file.relative)))
  .pipe(zip(`${pkgJson.name}-${pkgJson.version}.zip`))
- .pipe(dest('dist/'))
+ .pipe(dest('dist/'));
  }
-)
+);
 
 const bundleRelease = series(
- async function webpackBuild() { return execSync("npx webpack", { stdio: 'inherit' }) },
- function copyCumulocityJson() { return fs.copy('./cumulocity.json', './dist/widget/cumulocity.json') },
+ async function webpackBuild() { return execSync("npx webpack", { stdio: 'inherit' }); },
+ function copyCumulocityJson() { return fs.copy('./widget-cumulocity.json', './dist/widget/cumulocity.json'); },
  function createZip() {
  const pkgJson = require('./dist/widget-library/package.json');//need bumped version.
  return src('./dist/widget/**/*')
  // Filter out the webpackRuntime chunk, we only need the widget code chunks
  .pipe(filter(file => !/^[a-f0-9]{20}\.js(\.map)?$/.test(file.relative)))
  .pipe(zip(`${pkgJson.name}-${pkgJson.version}.zip`))
- .pipe(dest('release/'))
+ .pipe(dest('release/'));
  }
-)
+);
 
 exports.clean = clean;
 exports.build = compile;

index.ts

@@ -0,0 +1,17 @@
+import './polyfills';
+import './ng1';
+
+import { enableProdMode } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { AppModule } from './app.module';
+
+declare const __MODE__: string;
+if (__MODE__ === 'production') {
+ enableProdMode();
+}
+
+export function bootstrap() {
+ return platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch(err => console.log(err));
+}

ng-package.json

@@ -1,16 +1,18 @@
 {
- "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
- "assets": [
- "styles/**/*",
- "assets/**/*"
-],
- "lib": {
- "entryFile": "./src/public_api.ts",
- "umdModuleIds": {
- "@c8y/ngx-components": "@c8y/ngx-components"
+ "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+ "assets": [
+ "./styles/**/*",
+ "./src/*/assets/**/*"
+ ],
+ "lib": {
+ "entryFile": "./src/public_api.ts",
+ "umdModuleIds": {
+ "@c8y/ngx-components": "@c8y/ngx-components"
+ },
+ "flatModuleFile": "custom-widget"
  },
- "flatModuleFile": "custom-widget"
- },
- "whitelistedNonPeerDependencies": ["."],
- "dest": "dist/widget-library"
-}
+ "whitelistedNonPeerDependencies": [
+  "."
+  ],
+  "dest": "dist/widget-library"
+}

ng1.ts

@@ -0,0 +1,42 @@
+import '@c8y/ng1-modules/core';
+import '@c8y/ng1-modules/imageWidget/cumulocity.json';
+import '@c8y/ng1-modules/assetPropertyWidget/cumulocity.json';
+import '@c8y/ng1-modules/devicePropertyWidget/cumulocity.json';
+import '@c8y/ng1-modules/alarms/cumulocity.json';
+import '@c8y/ng1-modules/assetTable/cumulocity.json';
+import '@c8y/ng1-modules/eventsBinary/cumulocity.json';
+import '@c8y/ng1-modules/devicemanagement-alarmList/cumulocity.json';
+import '@c8y/ng1-modules/deviceSelector/cumulocity.json';
+import '@c8y/ng1-modules/kpi/cumulocity.json';
+import '@c8y/ng1-modules/kpiAdmin/cumulocity.json';
+import '@c8y/ng1-modules/devicemanagement-location/cumulocity.json';
+import '@c8y/ng1-modules/dashboard2/cumulocity.json';
+import '@c8y/ng1-modules/dashboardUI/cumulocity.json';
+import '@c8y/ng1-modules/groupsHierarchy/cumulocity.json';
+import '@c8y/ng1-modules/measurements/cumulocity.json';
+import '@c8y/ng1-modules/map/cumulocity.json';
+import '@c8y/ng1-modules/alarmAssets/cumulocity.json';
+import '@c8y/ng1-modules/deviceControlMessage/cumulocity.json';
+import '@c8y/ng1-modules/deviceControlRelay/cumulocity.json';
+import '@c8y/ng1-modules/deviceControlRelayArray/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-cockpitConfig/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-assetCount/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-alarmRecent/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-reports/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-smartRulesUI/cumulocity.json';
+import '@c8y/ng1-modules/cockpit-dataPointExplorerUI/cumulocity.json';
+import '@c8y/ng1-modules/alarmsEventsExplorer/cumulocity.json';
+import '@c8y/ng1-modules/deviceDatabase4/cumulocity.json';
+import '@c8y/ng1-modules/modbusWidget4/cumulocity.json';
+import '@c8y/ng1-modules/scada/cumulocity.json';
+import '@c8y/ng1-modules/imageWidget/cumulocity.json';
+import '@c8y/ng1-modules/htmlWidget/cumulocity.json';
+import '@c8y/ng1-modules/applicationLinks/cumulocity.json';
+import '@c8y/ng1-modules/quickLinks/cumulocity.json';
+import '@c8y/ng1-modules/helpAndSupport/cumulocity.json';
+import '@c8y/ng1-modules/eventList/cumulocity.json';
+import '@c8y/ng1-modules/export/cumulocity.json';
+import '@c8y/ng1-modules/dataPointTable/cumulocity.json';
+import '@c8y/ng1-modules/switchDisplay/cumulocity.json';
+import '@c8y/ng1-modules/trafficLightWidget/cumulocity.json';
+import '@c8y/ng1-modules/infoGauge/cumulocity.json';