feat(): merge remote into serve and add qrcode option.

Author: jthoms1

packages/cli-build-ionic-angular/src/serve.ts

@@ -40,6 +40,7 @@ export default async function(cmdMetadata: CommandData, inputs: CommandLineInput
   const settings = await appScripts.serve(context);
   return  {
     publicIp: chosenIP,
+    protocol: 'http',
     ...settings
   };
 }

packages/ionic/src/commands/index.ts

@@ -13,7 +13,6 @@ import { ServeCommand } from './serve';
 import { GenerateCommand } from './generate';
 import { LinkCommand } from './link';
 import { UploadCommand } from './upload';
-import { RemoteCommand } from './remote';
 
 export class IonicNamespace extends Namespace {
   name: 'global';
@@ -26,7 +25,6 @@ export class IonicNamespace extends Namespace {
     m.set('help', new HelpCommand());
     m.set('info', new InfoCommand());
     m.set('login', new LoginCommand());
-    m.set('remote', new RemoteCommand());
     m.set('signup', new SignupCommand());
     m.set('version', new VersionCommand());
     m.set('telemetry', new TelemetryCommand());

packages/ionic/src/commands/remote.ts

@@ -1,3 +1,5 @@
+import * as dgram from 'dgram';
+import * as qrcode from 'qrcode-terminal';
 import {
   CommandLineInputs,
   CommandLineOptions,
@@ -79,6 +81,11 @@ import {
       name: 'platform',
       description: 'Start serve with a specific platform (ios/android)',
       aliases: ['t']
+    },
+    {
+      name: 'qrcode',
+      description: 'Print a QR code for Ionic View instead of network broadcasting',
+      type: Boolean
     }
   ],
   requiresProject: true
@@ -90,13 +97,61 @@ export class ServeCommand extends Command {
 
     var tasks = new TaskChain();
 
-    await this.env.emitEvent('serve', {
+    var response = await this.env.emitEvent('serve', {
       metadata: this.metadata,
       inputs,
       options
     });
 
     tasks.next(`Starting server`);
+
+    // If qrcode option then generate a qrcode on the Command Line.
+    if (options.qrcode) {
+      const codeString = await generateQrCode(
+        `${response.protocol}://${response.publicIp}:${response.httpPort}`
+      );
+      this.env.log.msg(`\n\n\n${codeString}`);
+    }
+
+    // If broadcast option then start udp server and broadcast info
+    if (options.broadcast) {
+      tasks.next(`Broadcasting server information`);
+      const appDetails = await this.env.project.load();
+
+      const message = JSON.stringify({
+        app_name: appDetails.name,
+        app_id: appDetails.app_id,
+        local_address: `${response.protocol}://${response.publicIp}:${response.httpPort}`
+      });
+      const server = dgram.createSocket('udp4');
+
+      server.on('listening', () => {
+        server.setBroadcast(true);
+        setInterval(() => {
+          try {
+            server.send(message, 41234, '255.255.255.255');
+          } catch (e) {
+            throw e;
+          }
+        }, 3000);
+      });
+
+      server.bind();
+    }
+
     tasks.end();
   }
 }
+
+function generateQrCode(input: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+
+    try {
+      qrcode.generate(input, (response: any) => {
+        resolve(response);
+      });
+    } catch (e) {
+      reject(e);
+    }
+  });
+}