From 799e5f51511db70a8da913bc3d81ff53ed5fa795 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Tue, 24 Mar 2020 17:34:41 -0500 Subject: [PATCH 1/6] Write resources --- packages/@ionic/cli/src/commands/start.ts | 28 +++++++++++++++++--- packages/@ionic/cli/src/definitions.ts | 2 ++ packages/@ionic/cli/src/lib/project/index.ts | 28 ++++++++++++++++++-- packages/@ionic/cli/src/lib/start.ts | 3 +++ 4 files changed, 56 insertions(+), 5 deletions(-) diff --git a/packages/@ionic/cli/src/commands/start.ts b/packages/@ionic/cli/src/commands/start.ts index 710b38d026..dce77468bb 100644 --- a/packages/@ionic/cli/src/commands/start.ts +++ b/packages/@ionic/cli/src/commands/start.ts @@ -31,6 +31,8 @@ interface StartWizardApp { email: string; theme: string; ip: string; + appIcon: string; + appSplash: string; utm: { [key: string]: string }; } @@ -195,17 +197,30 @@ Use the ${input('--type')} option to start projects using older versions of Ioni inputs.push(data.name); inputs.push(data.template); + console.log(data); + await this.startIdConvert(startId as string); + const appIconBuffer = data.appIcon ? + Buffer.from(data.appIcon.replace(/^data:image\/\w+;base64,/, ""), 'base64') : + undefined; + + const splashBuffer = data.appSplash ? + Buffer.from(data.appSplash.replace(/^data:image\/\w+;base64,/, ""), 'base64') : + undefined; + this.schema = { cloned: false, name: data.name, type: data.type, + forceCapacitor: true, template: data.template, projectId: slugify(data.name), projectDir, packageId: data['package-id'], appflowId: undefined, + appIcon: appIconBuffer, + splash: splashBuffer, themeColor: data.theme, }; } @@ -538,8 +553,8 @@ Use the ${input('--type')} option to start projects using older versions of Ioni } } - if (options['capacitor'] === null && !options['cordova']) { - const confirm = await this.env.prompt({ + if (this.schema.forceCapacitor || (options['capacitor'] === null && !options['cordova'])) { + const confirm = this.schema.forceCapacitor || await this.env.prompt({ type: 'confirm', name: 'confirm', message: 'Integrate your new app with Capacitor to target native iOS and Android?', @@ -555,7 +570,14 @@ Use the ${input('--type')} option to start projects using older versions of Ioni await runCommand(runinfo, ['integrations', 'enable', 'capacitor', '--quiet', '--', this.schema.name, packageId ? packageId : 'io.ionic.starter']); } - await this.project.personalize({ name: this.schema.name, projectId, packageId, themeColor: this.schema.themeColor }); + await this.project.personalize({ + name: this.schema.name, + projectId, + packageId, + appIcon: this.schema.appIcon, + splash: this.schema.splash, + themeColor: this.schema.themeColor + }); this.env.log.nl(); } diff --git a/packages/@ionic/cli/src/definitions.ts b/packages/@ionic/cli/src/definitions.ts index f8af3c1b1b..14f8908184 100644 --- a/packages/@ionic/cli/src/definitions.ts +++ b/packages/@ionic/cli/src/definitions.ts @@ -253,6 +253,8 @@ export interface ProjectPersonalizationDetails { version?: string; description?: string; themeColor?: string; + appIcon?: Buffer; + splash?: Buffer; } export interface IProjectConfig { diff --git a/packages/@ionic/cli/src/lib/project/index.ts b/packages/@ionic/cli/src/lib/project/index.ts index 00e573c472..d470bd0b39 100644 --- a/packages/@ionic/cli/src/lib/project/index.ts +++ b/packages/@ionic/cli/src/lib/project/index.ts @@ -3,7 +3,7 @@ import { PromptModule } from '@ionic/cli-framework-prompts'; import { resolveValue } from '@ionic/cli-framework/utils/fn'; import { TTY_WIDTH, prettyPath, wordWrap } from '@ionic/cli-framework/utils/format'; import { ERROR_INVALID_PACKAGE_JSON, compileNodeModulesPaths, isValidPackageName, readPackageJsonFile } from '@ionic/cli-framework/utils/node'; -import { findBaseDirectory, readFile, writeFile, writeJson } from '@ionic/utils-fs'; +import { findBaseDirectory, readFile, writeFile, writeJson, mkdir, pathExists } from '@ionic/utils-fs'; import * as Debug from 'debug'; import * as lodash from 'lodash'; import * as path from 'path'; @@ -569,7 +569,7 @@ export abstract class Project implements IProject { } async personalize(details: ProjectPersonalizationDetails): Promise { - const { name, projectId, description, version, themeColor } = details; + const { name, projectId, description, version, themeColor, appIcon, splash } = details; this.config.set('name', name); @@ -585,6 +585,11 @@ export abstract class Project implements IProject { await this.setPrimaryTheme(themeColor); } + console.log('Going to write resources, has?', appIcon, splash); + if (appIcon && splash) { + await this.setAppResources(appIcon, splash); + } + const integrations = await this.getIntegrations(); await Promise.all(integrations.map(async i => i.personalize(details))); @@ -683,6 +688,25 @@ export abstract class Project implements IProject { } } + async setAppResources(appIcon: Buffer, splash: Buffer) { + const resourcesDir = path.join(this.directory, 'resources'); + const iconPath = path.join(resourcesDir, 'icon.png'); + const splashPath = path.join(resourcesDir, 'splash.png'); + + try { + if (!(await pathExists(resourcesDir))) { + console.log('Making resources dir'); + await mkdir(resourcesDir); + } + console.log('Writing icon'); + await writeFile(iconPath, appIcon); + await writeFile(splashPath, splash); + } catch (e) { + const { log } = this.e; + log.error(`Unable to find or create the resources directory. Skipping icon generation: ${e}`); + } + } + async registerAilments(registry: IAilmentRegistry): Promise { const ailments = await import('../doctor/ailments'); const deps = { ...this.e, project: this }; diff --git a/packages/@ionic/cli/src/lib/start.ts b/packages/@ionic/cli/src/lib/start.ts index b7c4ae4801..e218a330dd 100644 --- a/packages/@ionic/cli/src/lib/start.ts +++ b/packages/@ionic/cli/src/lib/start.ts @@ -27,6 +27,9 @@ export interface NewAppSchema extends BaseAppSchema { type: ProjectType; template: string; themeColor?: string; + forceCapacitor?: boolean; + appIcon?: Buffer; + splash?: Buffer; } export interface ClonedAppSchema extends BaseAppSchema { From 678c6c04f6d60741747f305e1021c5f1591fde34 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Thu, 2 Apr 2020 16:03:31 -0500 Subject: [PATCH 2/6] Remove comments --- packages/@ionic/cli/src/commands/start.ts | 8 +++----- packages/@ionic/cli/src/lib/project/index.ts | 5 +---- 2 files changed, 4 insertions(+), 9 deletions(-) diff --git a/packages/@ionic/cli/src/commands/start.ts b/packages/@ionic/cli/src/commands/start.ts index dce77468bb..425702b3e9 100644 --- a/packages/@ionic/cli/src/commands/start.ts +++ b/packages/@ionic/cli/src/commands/start.ts @@ -197,16 +197,14 @@ Use the ${input('--type')} option to start projects using older versions of Ioni inputs.push(data.name); inputs.push(data.template); - console.log(data); - await this.startIdConvert(startId as string); const appIconBuffer = data.appIcon ? - Buffer.from(data.appIcon.replace(/^data:image\/\w+;base64,/, ""), 'base64') : + Buffer.from(data.appIcon.replace(/^data:image\/\w+;base64,/, ''), 'base64') : undefined; const splashBuffer = data.appSplash ? - Buffer.from(data.appSplash.replace(/^data:image\/\w+;base64,/, ""), 'base64') : + Buffer.from(data.appSplash.replace(/^data:image\/\w+;base64,/, ''), 'base64') : undefined; this.schema = { @@ -576,7 +574,7 @@ Use the ${input('--type')} option to start projects using older versions of Ioni packageId, appIcon: this.schema.appIcon, splash: this.schema.splash, - themeColor: this.schema.themeColor + themeColor: this.schema.themeColor, }); this.env.log.nl(); diff --git a/packages/@ionic/cli/src/lib/project/index.ts b/packages/@ionic/cli/src/lib/project/index.ts index d470bd0b39..97a863561e 100644 --- a/packages/@ionic/cli/src/lib/project/index.ts +++ b/packages/@ionic/cli/src/lib/project/index.ts @@ -3,7 +3,7 @@ import { PromptModule } from '@ionic/cli-framework-prompts'; import { resolveValue } from '@ionic/cli-framework/utils/fn'; import { TTY_WIDTH, prettyPath, wordWrap } from '@ionic/cli-framework/utils/format'; import { ERROR_INVALID_PACKAGE_JSON, compileNodeModulesPaths, isValidPackageName, readPackageJsonFile } from '@ionic/cli-framework/utils/node'; -import { findBaseDirectory, readFile, writeFile, writeJson, mkdir, pathExists } from '@ionic/utils-fs'; +import { findBaseDirectory, mkdir, pathExists, readFile, writeFile, writeJson } from '@ionic/utils-fs'; import * as Debug from 'debug'; import * as lodash from 'lodash'; import * as path from 'path'; @@ -585,7 +585,6 @@ export abstract class Project implements IProject { await this.setPrimaryTheme(themeColor); } - console.log('Going to write resources, has?', appIcon, splash); if (appIcon && splash) { await this.setAppResources(appIcon, splash); } @@ -695,10 +694,8 @@ export abstract class Project implements IProject { try { if (!(await pathExists(resourcesDir))) { - console.log('Making resources dir'); await mkdir(resourcesDir); } - console.log('Writing icon'); await writeFile(iconPath, appIcon); await writeFile(splashPath, splash); } catch (e) { From 31407905cd356a6efff8b34148e72c4edac6b569 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Mon, 6 Apr 2020 16:34:08 -0500 Subject: [PATCH 3/6] Use ensureDir --- packages/@ionic/cli/src/lib/project/index.ts | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/@ionic/cli/src/lib/project/index.ts b/packages/@ionic/cli/src/lib/project/index.ts index 97a863561e..ada74a3dd7 100644 --- a/packages/@ionic/cli/src/lib/project/index.ts +++ b/packages/@ionic/cli/src/lib/project/index.ts @@ -3,7 +3,7 @@ import { PromptModule } from '@ionic/cli-framework-prompts'; import { resolveValue } from '@ionic/cli-framework/utils/fn'; import { TTY_WIDTH, prettyPath, wordWrap } from '@ionic/cli-framework/utils/format'; import { ERROR_INVALID_PACKAGE_JSON, compileNodeModulesPaths, isValidPackageName, readPackageJsonFile } from '@ionic/cli-framework/utils/node'; -import { findBaseDirectory, mkdir, pathExists, readFile, writeFile, writeJson } from '@ionic/utils-fs'; +import { ensureDir, findBaseDirectory, readFile, writeFile, writeJson } from '@ionic/utils-fs'; import * as Debug from 'debug'; import * as lodash from 'lodash'; import * as path from 'path'; @@ -89,7 +89,7 @@ export class ProjectDetails { async getIdFromPathMatch(config: IMultiProjectConfig): Promise { const { ctx } = this.e; - for (const [ key, value ] of lodash.entries(config.projects)) { + for (const [key, value] of lodash.entries(config.projects)) { const id = key; if (value && value.root) { @@ -596,7 +596,7 @@ export abstract class Project implements IProject { // Empty to avoid sub-classes having to implement // tslint:disable-next-line:no-empty - async setPrimaryTheme(_themeColor: string): Promise {} + async setPrimaryTheme(_themeColor: string): Promise { } async writeThemeColor(variablesPath: string, themeColor: string): Promise { const light = new Color(themeColor); @@ -693,9 +693,8 @@ export abstract class Project implements IProject { const splashPath = path.join(resourcesDir, 'splash.png'); try { - if (!(await pathExists(resourcesDir))) { - await mkdir(resourcesDir); - } + await ensureDir(resourcesDir); + await writeFile(iconPath, appIcon); await writeFile(splashPath, splash); } catch (e) { From 49aaa68beaf1b0bef5335a3361399e60969f4e20 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Tue, 7 Apr 2020 11:01:32 -0500 Subject: [PATCH 4/6] Force Capacitor and tweak next steps --- packages/@ionic/cli/src/commands/start.ts | 39 +++++++++-------------- packages/@ionic/cli/src/lib/start.ts | 1 - 2 files changed, 15 insertions(+), 25 deletions(-) diff --git a/packages/@ionic/cli/src/commands/start.ts b/packages/@ionic/cli/src/commands/start.ts index 425702b3e9..da76568c10 100644 --- a/packages/@ionic/cli/src/commands/start.ts +++ b/packages/@ionic/cli/src/commands/start.ts @@ -201,17 +201,16 @@ Use the ${input('--type')} option to start projects using older versions of Ioni const appIconBuffer = data.appIcon ? Buffer.from(data.appIcon.replace(/^data:image\/\w+;base64,/, ''), 'base64') : - undefined; + undefined; const splashBuffer = data.appSplash ? Buffer.from(data.appSplash.replace(/^data:image\/\w+;base64,/, ''), 'base64') : - undefined; + undefined; this.schema = { cloned: false, name: data.name, type: data.type, - forceCapacitor: true, template: data.template, projectId: slugify(data.name), projectDir, @@ -551,20 +550,7 @@ Use the ${input('--type')} option to start projects using older versions of Ioni } } - if (this.schema.forceCapacitor || (options['capacitor'] === null && !options['cordova'])) { - const confirm = this.schema.forceCapacitor || await this.env.prompt({ - type: 'confirm', - name: 'confirm', - message: 'Integrate your new app with Capacitor to target native iOS and Android?', - default: false, - }); - - if (confirm) { - options['capacitor'] = true; - } - } - - if (options['capacitor']) { + if (!options['cordova']) { await runCommand(runinfo, ['integrations', 'enable', 'capacitor', '--quiet', '--', this.schema.name, packageId ? packageId : 'io.ionic.starter']); } @@ -642,7 +628,7 @@ Use the ${input('--type')} option to start projects using older versions of Ioni this.env.log.nl(); - await this.showNextSteps(projectDir, this.schema.cloned, linkConfirmed); + await this.showNextSteps(projectDir, this.schema.cloned, linkConfirmed, !options['cordova']); } async checkForExisting(projectDir: string) { @@ -748,18 +734,23 @@ Use the ${input('--type')} option to start projects using older versions of Ioni tasks.end(); } - async showNextSteps(projectDir: string, cloned: boolean, linkConfirmed: boolean) { + async showNextSteps(projectDir: string, cloned: boolean, linkConfirmed: boolean, isCapacitor: boolean) { + const cordovaResCommand = isCapacitor ? 'cordova-res --skip-config --copy' : 'cordova-res'; const steps = [ - `Go to your ${cloned ? 'cloned' : 'newly created'} project: ${input(`cd ${prettyPath(projectDir)}`)}`, - `Run ${input('ionic serve')} within the app directory to see your app`, - `Build features and components: ${strong('https://ion.link/scaffolding-docs')}`, - `Run your app on a hardware or virtual device: ${strong('https://ion.link/running-docs')}`, + `Go to your ${cloned ? 'cloned' : 'new'} project: ${input(`cd ${prettyPath(projectDir)}`)}`, + `Run ${input('ionic serve')} within the app directory to see your app in the browser`, + isCapacitor ? + `Run ${input('ionic capacitor add')} to add a native iOS or Android project using Capacitor` : + `Run ${input('ionic cordova platform add')} to add a native iOS or Androd project using Cordova`, + `Generate your app icon and splash using ${input(cordovaResCommand)}`, + `Explore the Ionic docs for components, tutorials, and more: ${strong('https://ion.link/docs')}`, + `Building an enterprise app? Ionic has Enterprise Support and Features: ${strong('https://ion.link/enterprise-edition')}`, ]; if (linkConfirmed) { steps.push(`Push your code to Ionic Appflow to perform real-time updates, and more: ${input('git push ionic master')}`); } - this.env.log.info(`${strong('Next Steps')}:\n${steps.map(s => `- ${s}`).join('\n')}`); + this.env.log.msg(`${strong('Your Ionic app is ready! Follow these next steps')}:\n${steps.map(s => ` - ${s}`).join('\n')}`); } } diff --git a/packages/@ionic/cli/src/lib/start.ts b/packages/@ionic/cli/src/lib/start.ts index e218a330dd..752bc5f4d2 100644 --- a/packages/@ionic/cli/src/lib/start.ts +++ b/packages/@ionic/cli/src/lib/start.ts @@ -27,7 +27,6 @@ export interface NewAppSchema extends BaseAppSchema { type: ProjectType; template: string; themeColor?: string; - forceCapacitor?: boolean; appIcon?: Buffer; splash?: Buffer; } From 7ee2c23b03b50a868eb58f3a15a6e6ea27112c32 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Tue, 7 Apr 2020 12:21:31 -0500 Subject: [PATCH 5/6] Update packages/@ionic/cli/src/commands/start.ts Co-Authored-By: dwieeb --- packages/@ionic/cli/src/commands/start.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@ionic/cli/src/commands/start.ts b/packages/@ionic/cli/src/commands/start.ts index da76568c10..90312f7f21 100644 --- a/packages/@ionic/cli/src/commands/start.ts +++ b/packages/@ionic/cli/src/commands/start.ts @@ -741,7 +741,7 @@ Use the ${input('--type')} option to start projects using older versions of Ioni `Run ${input('ionic serve')} within the app directory to see your app in the browser`, isCapacitor ? `Run ${input('ionic capacitor add')} to add a native iOS or Android project using Capacitor` : - `Run ${input('ionic cordova platform add')} to add a native iOS or Androd project using Cordova`, + `Run ${input('ionic cordova platform add')} to add a native iOS or Android project using Cordova`, `Generate your app icon and splash using ${input(cordovaResCommand)}`, `Explore the Ionic docs for components, tutorials, and more: ${strong('https://ion.link/docs')}`, `Building an enterprise app? Ionic has Enterprise Support and Features: ${strong('https://ion.link/enterprise-edition')}`, From b723dfeb531b7cea2378e91ac6c885d9c74635f2 Mon Sep 17 00:00:00 2001 From: Max Lynch Date: Tue, 7 Apr 2020 12:21:38 -0500 Subject: [PATCH 6/6] Update packages/@ionic/cli/src/commands/start.ts Co-Authored-By: dwieeb --- packages/@ionic/cli/src/commands/start.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@ionic/cli/src/commands/start.ts b/packages/@ionic/cli/src/commands/start.ts index 90312f7f21..2dbe8e3390 100644 --- a/packages/@ionic/cli/src/commands/start.ts +++ b/packages/@ionic/cli/src/commands/start.ts @@ -742,7 +742,7 @@ Use the ${input('--type')} option to start projects using older versions of Ioni isCapacitor ? `Run ${input('ionic capacitor add')} to add a native iOS or Android project using Capacitor` : `Run ${input('ionic cordova platform add')} to add a native iOS or Android project using Cordova`, - `Generate your app icon and splash using ${input(cordovaResCommand)}`, + `Generate your app icon and splash screens using ${input(cordovaResCommand)}`, `Explore the Ionic docs for components, tutorials, and more: ${strong('https://ion.link/docs')}`, `Building an enterprise app? Ionic has Enterprise Support and Features: ${strong('https://ion.link/enterprise-edition')}`, ];