gwt.material.design.addins.client.camera

Class MaterialCameraCapture

java.lang.Object

com.google.gwt.user.client.ui.UIObject

com.google.gwt.user.client.ui.Widget

com.google.gwt.user.client.ui.Panel

com.google.gwt.user.client.ui.ComplexPanel

gwt.material.design.client.base.MaterialWidget

gwt.material.design.addins.client.camera.MaterialCameraCapture

All Implemented Interfaces:

com.google.gwt.event.logical.shared.HasAttachHandlers, com.google.gwt.event.shared.HasHandlers, com.google.gwt.user.client.EventListener, com.google.gwt.user.client.ui.Focusable, com.google.gwt.user.client.ui.HasEnabled, com.google.gwt.user.client.ui.HasVisibility, com.google.gwt.user.client.ui.HasWidgets, com.google.gwt.user.client.ui.HasWidgets.ForIsWidget, com.google.gwt.user.client.ui.IndexedPanel, com.google.gwt.user.client.ui.IndexedPanel.ForIsWidget, com.google.gwt.user.client.ui.IsWidget, HasCameraCaptureHandlers, gwt.material.design.client.base.HasCenterOn, gwt.material.design.client.base.HasCircle, gwt.material.design.client.base.HasColors, gwt.material.design.client.base.HasDataAttributes, gwt.material.design.client.base.HasDepth, gwt.material.design.client.base.HasFlexbox, gwt.material.design.client.base.HasFloat, gwt.material.design.client.base.HasFontSize, gwt.material.design.client.base.HasFontWeight, gwt.material.design.client.base.HasGrid, gwt.material.design.client.base.HasHideOn, gwt.material.design.client.base.HasHoverable, gwt.material.design.client.base.HasId, gwt.material.design.client.base.HasInitialClasses, gwt.material.design.client.base.HasInlineStyle, gwt.material.design.client.base.HasOpacity, gwt.material.design.client.base.HasScrollspy, gwt.material.design.client.base.HasSeparator, gwt.material.design.client.base.HasShadow, gwt.material.design.client.base.HasShowOn, gwt.material.design.client.base.HasTextAlign, gwt.material.design.client.base.HasTooltip, gwt.material.design.client.base.HasWaves, Iterable<com.google.gwt.user.client.ui.Widget>

public class MaterialCameraCapture
extends gwt.material.design.client.base.MaterialWidget
implements HasCameraCaptureHandlers

MaterialCameraCapture is a widget that captures the video stream from the camera, using the HTML5 MediaDevices.getUserMedia() (Streams API). This widget can capture images from the video, to allow the upload to the server of photos from the camera.

XML Namespace Declaration

 
 xmlns:ma='urn:import:gwt.material.design.addins.client'
 
 

UiBinder Usage:

 
 <ma:camera.MaterialCameraCapture ui:field="camera" />
 
 

Java Usage:

  if (MaterialCameraCapture.isSupported()){
      MaterialCameraCapture camera = new MaterialCameraCapture();
      camera.addCameraCaptureHandler(new CameraCaptureHandler() {
           @Override
          public void onCameraCaptureChange(CameraCaptureEvent event) {
              if (event.getCaptureStatus() == CaptureStatus.ERRORED){
                  Window.alert("Error on starting the camera capture: " + event.getErrorMessage());
                  ((MaterialCameraCapture)event.getSource()).removeFromParent();
              }
          }
      });
      add(camera); //adds to the layout
  }
  else {
      Window.alert("Sorry, your browser doesn't support the camera capture.");
  }
 

Styling:

To limit the width of the camera capture widget on mobile devices, you can use max-width: 100% on the widget. The browser will take care of the aspect ratio of the video.

Notice:

This widget only works on pages served by a secure protocol (HTTPS). For the browser compatibility, access http://caniuse.com/#feat=stream

Author:

gilberto-torrezan

Nested Class Summary

Nested classes/interfaces inherited from class gwt.material.design.client.base.MaterialWidget

gwt.material.design.client.base.MaterialWidget.Feature

Nested classes/interfaces inherited from class com.google.gwt.user.client.ui.UIObject

com.google.gwt.user.client.ui.UIObject.DebugIdImpl, com.google.gwt.user.client.ui.UIObject.DebugIdImplEnabled

Nested classes/interfaces inherited from interface com.google.gwt.user.client.ui.IndexedPanel

com.google.gwt.user.client.ui.IndexedPanel.ForIsWidget

Nested classes/interfaces inherited from interface com.google.gwt.user.client.ui.HasWidgets

com.google.gwt.user.client.ui.HasWidgets.ForIsWidget

Field Summary

Fields

Modifier and Type	Field and Description
protected boolean	pauseOnUnload

Fields inherited from class com.google.gwt.user.client.ui.UIObject

DEBUG_ID_PREFIX

Constructor Summary

Constructors

Constructor and Description
MaterialCameraCapture()

Method Summary

Modifier and Type	Method and Description
com.google.gwt.event.shared.HandlerRegistration	addCameraCaptureHandler(CameraCaptureHandler handler) Adds a CameraCaptureHandler.
String	captureToDataURL() Captures the current frame of the video to an image data URL.
String	captureToDataURL(String mimeType) Captures the current frame of the video to an image data URL.
boolean	isPauseOnUnload() Returns if the camera capture should pause when the widget is unloaded.
static boolean	isSupported() Tests if the browser supports the Streams API.
protected String	nativeCaptureToDataURL(com.google.gwt.dom.client.CanvasElement canvas, com.google.gwt.dom.client.Element video, String mimeType) Native call to capture the frame of the video stream.
protected void	nativePlay(com.google.gwt.dom.client.Element video) Native call to the streams API
protected void	onCameraCaptureError(String error) Called by the component when the stream when an error occurs.
protected void	onCameraCaptureLoad() Called by the component when the stream has started.
protected void	onCameraCapturePause() Called by the component when the stream has paused.
protected void	onLoad()
protected void	onUnload()
void	pause() Pauses the video stream from the camera.
void	play() Starts the video stream from the camera.
void	restart() Restarts the video stream from the camera.
void	setPauseOnUnload(boolean pauseOnUnload) Sets if the camera capture should pause when the widget is unloaded.

Methods inherited from class gwt.material.design.client.base.MaterialWidget

add, add, clearActiveClass, enableFeature, getBackgroundColor, getCenterOn, getCenterOnMixin, getCircleMixin, getColorsMixin, getDataAttribute, getDepth, getEnabledMixin, getFlexboxMixin, getFloat, getFloatMixin, getFocusableMixin, getFontSize, getFontSizeMixin, getFontWeight, getFontWeightMixin, getGridMixin, getHideOn, getHideOnMixin, getHoverableMixin, getId, getIdMixin, getInitialClasses, getOpacity, getScrollspy, getScrollspyMixin, getSeparatorMixin, getShadow, getShadowMixin, getShowOn, getShowOnMixin, getTabIndex, getTextAlign, getTextAlignMixin, getTextColor, getTooltip, getTooltipDelayMs, getTooltipMixin, getTooltipPosition, getTruncateMixin, getWaves, getWavesMixin, getWidth, getWidth, insert, insert, isCircle, isEnabled, isFeatureEnabled, isHoverable, isSeparator, setAccessKey, setBackgroundColor, setBottom, setCenterOn, setCircle, setDataAttribute, setDepth, setDisplay, setEnabled, setFlex, setFlexAlignContent, setFlexAlignItems, setFlexAlignSelf, setFlexBasis, setFlexDirection, setFlexGrow, setFlexJustifyContent, setFlexOrder, setFlexShrink, setFlexWrap, setFloat, setFocus, setFontSize, setFontSize, setFontWeight, setGrid, setGwtDisplay, setHideOn, setHoverable, setId, setInitialClasses, setLayoutPosition, setLeft, setMargin, setMarginBottom, setMarginLeft, setMarginRight, setMarginTop, setOffset, setOpacity, setOverflow, setPadding, setPaddingBottom, setPaddingLeft, setPaddingRight, setPaddingTop, setRight, setScrollspy, setSeparator, setShadow, setShowOn, setTabIndex, setTextAlign, setTextColor, setTooltip, setTooltipDelayMs, setTooltipPosition, setTop, setTruncate, setVisibility, setWaves, stopTouchStartEvent, stopTouchStartEvent

Methods inherited from class com.google.gwt.user.client.ui.ComplexPanel

add, adjustIndex, checkIndexBoundsForAccess, checkIndexBoundsForInsertion, getChildren, getWidget, getWidgetCount, getWidgetIndex, getWidgetIndex, insert, iterator, remove, remove

Methods inherited from class com.google.gwt.user.client.ui.Panel

add, adopt, clear, doAttachChildren, doDetachChildren, orphan, remove

Methods inherited from class com.google.gwt.user.client.ui.Widget

addAttachHandler, addBitlessDomHandler, addDomHandler, addHandler, asWidget, asWidgetOrNull, createHandlerManager, delegateEvent, fireEvent, getHandlerCount, getLayoutData, getParent, isAttached, isOrWasAttached, onAttach, onBrowserEvent, onDetach, removeFromParent, setLayoutData, sinkEvents, unsinkEvents

Methods inherited from class com.google.gwt.user.client.ui.UIObject

addStyleDependentName, addStyleName, ensureDebugId, ensureDebugId, ensureDebugId, getAbsoluteLeft, getAbsoluteTop, getElement, getOffsetHeight, getOffsetWidth, getStyleElement, getStyleName, getStyleName, getStylePrimaryName, getStylePrimaryName, getTitle, isVisible, isVisible, onEnsureDebugId, removeStyleDependentName, removeStyleName, resolvePotentialElement, setElement, setElement, setHeight, setPixelSize, setSize, setStyleDependentName, setStyleName, setStyleName, setStyleName, setStyleName, setStylePrimaryName, setStylePrimaryName, setTitle, setVisible, setVisible, setWidth, sinkBitlessEvent, toString

Methods inherited from class java.lang.Object

clone, equals, finalize, getClass, hashCode, notify, notifyAll, wait, wait, wait

Methods inherited from interface com.google.gwt.event.shared.HasHandlers

fireEvent

Methods inherited from interface gwt.material.design.client.base.HasFlexbox

setVisible

Methods inherited from interface java.lang.Iterable

forEach, spliterator

Field Detail

pauseOnUnload

protected boolean pauseOnUnload

Constructor Detail

MaterialCameraCapture

public MaterialCameraCapture()

Method Detail

captureToDataURL

public String captureToDataURL()

Captures the current frame of the video to an image data URL. It's the same as calling captureToDataURL(String) using "image/png".

Returns:

The Data URL of the captured image, which can be used as "src" on an "img" element or sent to the server

captureToDataURL

public String captureToDataURL(String mimeType)

Captures the current frame of the video to an image data URL.

Parameters:

mimeType - The type of the output image, such as "image/png" or "image/jpeg".

Returns:

The Data URL of the captured image, which can be used as "src" on an "img" element or sent to the server

onLoad

protected void onLoad()

Overrides:

onLoad in class gwt.material.design.client.base.MaterialWidget

onUnload

protected void onUnload()

Overrides:

onUnload in class com.google.gwt.user.client.ui.Widget

play

public void play()

Starts the video stream from the camera. This is called when the component is loaded. Use CameraCaptureHandlers to be notified when the stream actually starts or if an error occurs.

At this point the user is requested by the browser to allow the application to use the camera. If the user doesn't allow it, an error is notified to the CameraCaptureHandlers.

restart

public void restart()

Restarts the video stream from the camera. The user is requested again by the browser to allow the application to use the camera.

pause

public void pause()

Pauses the video stream from the camera.

setPauseOnUnload

public void setPauseOnUnload(boolean pauseOnUnload)

Sets if the camera capture should pause when the widget is unloaded. The default is true.

isPauseOnUnload

public boolean isPauseOnUnload()

Returns if the camera capture should pause when the widget is unloaded. The default is true.

nativePlay

protected void nativePlay(com.google.gwt.dom.client.Element video)

Native call to the streams API

nativeCaptureToDataURL

protected String nativeCaptureToDataURL(com.google.gwt.dom.client.CanvasElement canvas,
                                        com.google.gwt.dom.client.Element video,
                                        String mimeType)

Native call to capture the frame of the video stream.

isSupported

public static boolean isSupported()

Tests if the browser supports the Streams API. This should be called before creating any MaterialCameraCapture widgets to avoid errors on the browser.

Returns:

true if the browser supports this widget, false otherwise

onCameraCaptureLoad

protected void onCameraCaptureLoad()

Called by the component when the stream has started.

onCameraCapturePause

protected void onCameraCapturePause()

Called by the component when the stream has paused.

onCameraCaptureError

protected void onCameraCaptureError(String error)

Called by the component when the stream when an error occurs.

addCameraCaptureHandler

public com.google.gwt.event.shared.HandlerRegistration addCameraCaptureHandler(CameraCaptureHandler handler)

Description copied from interface: HasCameraCaptureHandlers

Adds a CameraCaptureHandler.

Specified by:

addCameraCaptureHandler in interface HasCameraCaptureHandlers