Imaging Features Available in HTML5

“it just makes sense” August, 2018

1

Imaging Features Available in HTML5

As part of the 5.2 SP1 release, the Images functionality is now available in HTML5 and provides the same functionalities that are also available in Silverlight:

• Accessing the Images Window

• Importing Images, Acquiring Ceph and Acquiring Pan

• Viewing the Image Series and Individual Images

• Managing and Editing the Image Series ­ Email the Layout ­ Print the Layout ­ Export the Layout and the Series ­ Lock and Unlock the Layout ­ Use Gridlines: Add Grid Line, Edit Grid Line,

Delete Grid Line ­ Change the Layout ­ Rotate; Resize and Crop an Image ­ Fit to Screen ­ Delete a Series

• Managing and Editing Individual Images ­ Email an Image ­ Print an Image ­ Export Original Image and with and without

Annotations ­ Rotate Left and Right ­ Flip Horizontally and Vertically ­ Zoom in and out ­ Auto Correct ­ Adjust Brightness, Contrast and Gamma ­ Revert to the Original Image ­ Change the Image Type ­ Delete an Image

Overview When opening a patient’s images, Cloud9 loads the patient’s most recent image series layout. Once Cloud9 displays the image series and the individual images, this release enables you to position the images in a precise manner for viewing. This creates continuity when showing the images rather than the jerky effect from viewing images that are not the same size and orientation. In addition, you only need to set the grids one time and then they are available from that point forward. *HTML5 BONUS* In HTML5, when you click on Import Images, you can choose to take a photo using the camera on the iPad, phone or tablet and import one image at a time.

IMPORTANT: Prior to using imaging functionality in HTML5, use Silverlight to set up image categories, image series types and image types.

• Setup available in Silverlight: Edit menu > Setup > Image Categories

• Setup available in Silverlight: Edit menu > Setup item > Image Series Types

• Setup available in Silverlight: Edit menu > Setup item > Image Types

2

Accessing the Images Window You can access the Images window from the following locations:

Location Description

Scheduling window

Click on the appointment and select View Patient Images.

Treatment Card window

Click on the image under the Series section and select View Image.

3

Location Description

Home menu Select Images under the Treatment heading from the Home menu.

Patient Header Select View Images under the Imaging heading from the Patient Header.

4

Importing Images, Acquiring Ceph and Acquiring Pan Once the image categories, image series types and image types are set up in Silverlight, you can import

your images into Cloud9.

Bonus: In HTML5, when you click on Import Images, you can choose to take a photo using the camera

on the iPad, phone or tablet and import one image at a time.

Importing Images

1. From the patient’s Images window, click Import/Acquire.

2. Select Import Images.

The Open dialog box displays.

3. Select the images to import and click Open. The Import Images window displays showing the imported images.

5

4. Click Close. The Import Images window displays with the imported images.

5. In the Series field, click <Add New Series>. The Image Series dialog box displays.

6

6. In the Type field, select a type. The Type displays, and the Description field displays the selected type, automatically checking the appropriate Before Series or After Series checkbox.

7. Click Add. The Series name displays on the Import Images dialog box.

8. Click Auto Fill to designate the type of image that is being imported. Note: The images are named according to the order specified in setup.

7

9. If you need to edit an image prior to importing, select the image and click the dropdown list to: a. Rename an image b. Crop this Image c. Rotate this image to the left (counter-clockwise) d. Remove this image from the import

Note: Even though you can edit images in the Import window, it is much easier to perform any edits in the Image window.

8

10. Click Import. The Images window is updated with imported images, designated practice logo and the image tree on the left-hand side.

9

Acquiring Ceph

1. From the patient’s Images window, click Import/Acquire.

2. Select Acquire Ceph.

The Acquire Ceph dialog box displays.

3. Select the series to import and click Acquire. Cloud9 acquires Ceph.

Acquiring Pan

1. From the patient’s Images window, click Import/Acquire.

2. Select Acquire Pan.

The Acquire Pan dialog box displays.

3. Select the series to import and click Acquire. Cloud9 acquires Pan.

10

Viewing the Image Series and Individual Images After being imported, the images display on the patient’s Image window where you can edit and manage the series of images or a single image. Note: When opening a patient’s images, Cloud9 loads the patient’s most recent image series layout. From the image tree, you can:

• Select Image Layouts to manage the series, including changing the layout, resizing, rotating, exporting, printing and deleting an entire series.

11

• Select an Individual Image to manage an individual image, including rotating, flipping, zooming, auto correcting, adjusting, reverting to the original image, changing the image type and deleting the selected image.

Managing and Editing the Image Series Pre-requisite: Before you can start managing the image layout, be sure the image layout is unlocked. Click Unlock.

Unlock You’ll know if the image layout is unlocked if the Lock button is displayed.

Lock

12

Managing the Image Layout

Use the following buttons to manage the image layout:

Click… Then…

Email Layout

The Send E-Mail dialog box displays.

• Enter the following fields: To; Subject and Message.

• Click Send. Cloud9 sends the layout as a jpeg.

Print Layout

The Print dialog box displays.

• Enter the desired printing options.

• Click Print. Cloud9 prints the layout.

• Export Layout

• Export Series

The options to Export Layout and Export Series displays.

• Select either option. The Enter file name dialog box displays.

• Enter the file name.

• Click Save. ­ For Export Layout, Cloud9 saves the layout as the file as

a single jpeg. ­ For Export Series, Cloud9 creates a zip file containing

each image.

Unlock Layout

The layout is unlocked, and the button toggles to Lock Layout.

Lock Layout

The layout is locked, and the button toggles to Unlock Layout.

The option to Edit Grid Lines and the grid lines display; turns on the Edit Grid Lines Mode and acts as a toggle between showing and not showing the grid lines.

Note: You only must set the grids one time and then they are available from that point forward.

13

Click… Then…

The following buttons display:

• Add Grid Line

• Edit Grid Line

• Delete Grid Line

Add Grid Line

The Add Grid Line dialog box displays.

• Select the image type; select orientation; enter slope and select line color.

• Click Add. Cloud9 adds the grid line.

Edit Grid Line

The Edit Grid Line dialog box displays.

• Select where the grid lines should display; the orientation; the location where the grid lines should display and the color for the grid line.

• Click Edit. Cloud9 adds the grid line.

Pre-requiste: Select the grid line to be deleted.

Delete Grid Line

Cloud9 deletes the selected grid line.

Fit to Screen

• Cloud9 fits the image layout to the window. • The button toggles between fit to and not fit to the screen.

Layout

The layout options display.

• Select the desired layout. Cloud9 displays the selected layout.

14

Rotating, Resizing and Cropping an Image

1. From the Images window, click Unlock Layout . Cloud9 outlines the images with a black boarder.

Locked Image: No Boarder

Unlocked Image: With Boarder

2. Select the image to edit. Cloud9 outlines the image with a blue boarder and blue size boxes.

If you want to… Then…

Resize the image a. Place the mouse on a corner blue square. The mouse turns into a sizing double arrow.

b. Drag the double arrow to increase or decrease the image size.

15

If you want to… Then…

Rotate the image a. Place the mouse on the blue square hanging down from the top center. The mouse turns into a crosshair cursor.

b. Drag the cursor to rotate the image.

Crop the image Drag the mouse to resize the image and anything outside the black outline is cropped out.

3. Click on another image to see the changes.

16

4. Click Lock to lock the images.

5. Click Save or Close (and Save).

Deleting a Series

1. From the image tree, click the first line with the date and image series name.

A gear symbol displays in front of the date.

17

2. Click the gear. A dropdown list displays.

3. Select Delete Series. The Delete Image Series dialog box displays.

4. Click Delete. Cloud9 deletes the image series.

18

Managing and Editing Individual Images Use the following buttons and features to edit and manage the image layout:

Click… Then…

Email Image

The Send E-Mail dialog box displays.

• Enter the following fields: To; Subject and Message.

• Click Send. Cloud9 sends the image as a jpeg.

Print Image

The Print dialog box displays.

• Enter the desired printing options.

• Click Print. Cloud9 prints the layout.

• Export Original

• Export with Annotations

• Export without Annotations

The options to Export Layout and Export Series displays. Note: Export with Annotations is shaded and only becomes an option when annotations are added.

• Select desired option. The Enter file name dialog box displays.

• Enter the file name.

• Click Save. Cloud9 saves the file as a single jpeg.

Rotate Left

The Enter Rotation – Left dialog box displays.

• Enter the degrees of rotation.

• Click OK. Cloud9 rotates the image.

Rotate Right

The Enter Rotation – Right dialog box displays.

• Enter the degrees of rotation.

• Click OK. Cloud9 rotates the image.

Flip Horizontal

The image rotates horizontally. Note: The button toggles between the flip and the original.

Flip Vertical

The image rotates vertically. Note: The button toggles between the flip and the original.

19

Click… Then…

Zoom In

The following warning box displays.

• Click OK.

• Continue to click Zoom In until you reach the desired view.

Pre-requiste: The image must have been zoomed in.

Zoom Out

The image is zoomed in.

Auto Correct

Auto corrects the image.

Adjustments

The Brightness/Contrast/Gamma dialog box displays.

• Drag the black box on the brightness, contrast and gamma lines to adjust. The image reflects the changes.

• Click OK. Cloud9 saves the changes.

Revert to Original

The Revert to Original confirmation dialog box displays.

• Do one of the following: o Click Revert to go back to the original image and not save

any changes. o Click Cancel to not revert to the original image.

Change Image Type

The Change Image Type dialog box displays.

• Select the new image type.

• Click OK. Cloud9 updates the image type.

Delete

The Delete Image confirmation dialog box displays.

• Click OK to confirm the deletion. The image is deleted from the image layout.