Added the ability to show an image with user.prompt. … (#905)

* Added the ability to show an image with user.prompt. …
e.g. “user.prompt('Image example',text_input=False,image_url = "http://localhost:5555/lights.jpg")
user.prompt now has the optional parameter image_url.
At the moment the image must be served from a web server.
I don’t know how to get Angular to display images from a file system.
The workaround is to use python SimpleHTTPServer to serve a
folder of images “e.g. python -m SimpleHTTPServer 5555”

* Removed the show-image parameter

Co-authored-by: Aaron Keith <[email protected]>

Author: Spudmn

openhtf/output/web_gui/src/app/plugs/user-input-plug.component.html

@@ -10,6 +10,8 @@
     </div>
 
     <div class="htf-layout-widget-body">
+      
+      <img *ngIf="hasImage()" [src]="Image_URL" >
 
       <div [innerHTML]="prompt"></div>
 

openhtf/output/web_gui/src/app/plugs/user-input-plug.component.ts

@@ -22,6 +22,7 @@ export declare interface UserInputPlugState {
   id: string;
   message: string;
   'text-input': string;
+  'image-url': string;
 }
 
 @Component({
@@ -65,6 +66,14 @@ export class UserInputPlugComponent extends BasePlug {
     return this.getPlugState()['text-input'];
   }
 
+  hasImage() {
+    return this.getPlugState()['image-url'];
+  }
+
+  get Image_URL() {
+    return this.getPlugState()['image-url'];
+  }
+
   sendResponse(input: HTMLInputElement) {
     const promptId = this.getPlugState().id;
     let response: string;

openhtf/plugs/user_input.py

@@ -56,7 +56,7 @@ class PromptUnansweredError(Exception):
   """Raised when a prompt times out or otherwise comes back unanswered."""
 
 
-Prompt = collections.namedtuple('Prompt', 'id message text_input')
+Prompt = collections.namedtuple('Prompt', 'id message text_input image_url')
 
 
 class ConsolePrompt(threading.Thread):
@@ -152,7 +152,8 @@ def _asdict(self):
         return
       return {'id': self._prompt.id,
               'message': self._prompt.message,
-              'text-input': self._prompt.text_input}
+              'text-input': self._prompt.text_input,
+              'image-url': self._prompt.image_url}
 
   def tearDown(self):
     self.remove_prompt()
@@ -166,7 +167,7 @@ def remove_prompt(self):
         self._console_prompt = None
       self.notify_update()
 
-  def prompt(self, message, text_input=False, timeout_s=None, cli_color=''):
+  def prompt(self, message, text_input=False, timeout_s=None, cli_color='', image_url = None):
     """Display a prompt and wait for a response.
 
     Args:
@@ -182,10 +183,10 @@ def prompt(self, message, text_input=False, timeout_s=None, cli_color=''):
       MultiplePromptsError: There was already an existing prompt.
       PromptUnansweredError: Timed out waiting for the user to respond.
     """
-    self.start_prompt(message, text_input, cli_color)
+    self.start_prompt(message, text_input, cli_color, image_url)
     return self.wait_for_prompt(timeout_s)
 
-  def start_prompt(self, message, text_input=False, cli_color=''):
+  def start_prompt(self, message, text_input=False, cli_color='', image_url = None):
     """Display a prompt.
 
     Args:
@@ -208,7 +209,7 @@ def start_prompt(self, message, text_input=False, cli_color=''):
 
       self._response = None
       self._prompt = Prompt(
-          id=prompt_id, message=message, text_input=text_input)
+          id=prompt_id, message=message, text_input=text_input, image_url=image_url)
       if sys.stdin.isatty():
         self._console_prompt = ConsolePrompt(
             message, functools.partial(self.respond, prompt_id), cli_color)