Options
All
  • Public
  • Public/Protected
  • All
Menu

Class Model3dComponent

The 3D Model Component will display a model.

var uComps = require('u-components');
var uActions = require('u-actions');
var Action = uActions.Action;
new Action('Model Demo', modelDemo)
.addParameter('Model', uActions.ParamType.MODEL_3D)
.register();
function modelDemo(comp) {
    var modelComp = uComps.cast.toModel3d(comp);
    modelComp.filename = 'guard/model.uma';
}

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Properties

alpha

alpha: number

The alpha transparency of the Component. Range from 0 to 100.

angle

angle: number

angleX

angleX: number

Angle of rotation through the x axis, in degrees. Range -180 to 180.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.angleX = 0;

angleY

angleY: number

Angle of rotation through the y axis, in degrees. Range -180 to 180.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.angleY = 58;

angleZ

angleZ: number

Angle of rotation through the z axis, in degrees. Range -180 to 180.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.angleZ = 20;

clippingType

clippingType: ClippingType

Clip the components contents using one of the options in ClippingType.

components

components: ComponentList

Access this Component's sub-components.

defaultAngle

defaultAngle: number

When mode is set, the min, max, and default angles can be set to limit the range of rotation. Range -90 to 90.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityY = 0.2;

effect1

effect1: number

Used to change values of the effect set in effectName. Range 0 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.effect1 = 0.2;

effect2

effect2: number

Used to change values of the effect set in effectName. Range 0 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.effect2 = 0.6;

effect3

effect3: number

Used to change values of the effect set in effectName. Range 0 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.effect3 = 0.8;

effect4

effect4: number

Used to change values of the effect set in effectName. Range 0 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.effect4 = 0.6;

effectName

effectName: EffectName

How the model will be displayed. uComps.EffectName: NONE, BASIC_LIGHTING, COMPLEX_LIGHTING, MECHANICAL, NORMAL

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.effectName = uComps.EffectName.MECHANICAL;

farClip

farClip: number

Far should be set to a value bigger than the largest dimension of your 3D model. 0 to 500.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.farClip = 100;

filename

filename: string

The filename of the model in the model_3d folder.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.filename = 'guard/model.uma';

floorColor

floorColor: string

Color of base plane, as a hexadecimal value.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.floorColor = '#363636';

formEnabled

formEnabled: boolean

Whether or not is component is enabled for the parent form. Only relevant when inside a Form Component.

formFieldName

formFieldName: string

Label used to identify the field this Component belongs to in a form. Only relevant when inside a Form Component.

fov

fov: number

Field of View for viewing the model, in degrees. Range 15 to 90.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.fov = 45;

height

height: number

The height of the Component.

mask

mask: RectangleComponent | CircleComponent

Shape component to be used as a mask. Can be either a Rectangle or Circle Component.

maxAngle

maxAngle: number

When mode is set, the min, max, and default angles can be set to limit the range of rotation. Range -90 to 90.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityY = 0.2;

minAngle

minAngle: number

When mode is set, the min, max, and default angles can be set to limit the range of rotation. Range -90 to 90.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityY = 0.2;

mode

mode: InteractionMode

How the user can interact with the model. uComps.InteractionMode: NONE, ROTATE, LOOK_OUT, ROTATE_AND_ZOOM

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.mode = uComps.InteractionMode.ROTATE_AND_ZOOM;

name

name: string

Name of the component.

nearClip

nearClip: number

Near should be set to a value smaller than the smallest piece of your 3D model. Range 0.1 to 100.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.nearClip = 0.1;

opacity

opacity: number

The opacity of the model. Range 0 to 100.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.originZ = 20;

originX

originX: number

The origin point around which the object rotates, with 0,0,0 being the center. Range -50 to 50.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.originX = 0;

originY

originY: number

The origin point around which the object rotates, with 0,0,0 being the center. Range -50 to 50.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.originY = -3;

originZ

originZ: number

The origin point around which the object rotates, with 0,0,0 being the center. Range -50 to 50.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.originZ = 20;

panoFilename

panoFilename: string

Filename for panorama image.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.panoFilename = 'guard_panorama.png';

parent

parent: Component

Access this Component's parent component.

passedFormValidation

passedFormValidation: boolean

Whether or not the Component has passed form validation. Only relevant when inside a Form Component.

postEffect

postEffect: PostEffectName

Effect added after effect set in effectName. uComps.PostEffectName: NONE, EDGE_DETECT

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.postEffect = uComps.PostEffectName.EDGE_DETECT;

pressAnim

pressAnim: string

Name of animation to play when model is pressed.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.pressAnim = 'Jump';

pressLoop

pressLoop: boolean

When true, press animation will loop

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.pressLoop = loop;

scaleFine

scaleFine: number

The fine scale of the model.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.scaleFine = 1.6;

scaleLarge

scaleLarge: number

The rough scale of the model.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.scaleLarge = -1;

startAnim

startAnim: string

Name of animation

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.startAnim = 'Idle';

startLoop

startLoop: boolean

When true, animation will loop

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.startLoop = loop;

type

type: string

Type of the component.

uniqueId

uniqueId: string

Unique ID of the component.

velocityX

velocityX: number

How fast the model roates, if mode is set to uComps.InteractionMode.NONE. Range -1 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityX = 0.2;

velocityY

velocityY: number

How fast the model roates, if mode is set to uComps.InteractionMode.NONE. Range -1 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityY = 0.2;

velocityZ

velocityZ: number

How fast the model roates, if mode is set to uComps.InteractionMode.NONE. Range -1 to 1.

var  modelComp = uComps.cast.toModel3d(comp);
modelComp.velocityZ = 0.2;

visible

visible: boolean

Whether or not the Component is visible.

width

width: number

The width of the Component.

x

x: number

The x position of the Component relative to its parent.

y

y: number

The y position of the Component relative to its parent.

Methods

emit

  • emit(eventType: string, data: Object): void

  • Call each callback that is registered for the given eventType, in the order they were registered, passing the supplied data to each. Also works for 'on_down', 'on_up', and 'on_move'.

    new Action('Canvas emit', emit)
        .addParameter('Canvas', uActions.ParamType.CANVAS)
        .register();
    function emit(canvas) {
            var ctx = uComps.cast.toCanvas(canvas);
            ctx.emit('on_press', 'hello world');
    }

    Parameters

    • eventType: string

      The type of the event to emit.

    • data: Object

      Data object to pass to each callback.

    Returns void

focus

  • focus(): void

  • Set the keyboard focus to this component.

    new uActions.Action('set focus', setFocus)
        .addParameter('text entry',uActions.ParamType.TEXT_ENTRY)
        .register();
    function setFocus(textEntry) {
        textEntry.focus();
    }

    Returns void

get

  • get(propertyName: string): any

  • Get a property by name.

    var uActions = require('u-actions');
    new uActions.Action('get fontsize',getFontSize).register();
    function getFontSize() {
        var text1=uPages.current.components.getText('Text 1');
        console.log(text1.get('font_size'));
    }

    Parameters

    • propertyName: string

      The name of the property to get.

    Returns any

    Returned value can be of any type, or even null.

on

  • on(eventType: string, callback: Function): void

  • Adds the callback function to the end of the listeners array for eventType.

    new Action('Canvas on', on)
    .addParameter('Canvas', uActions.ParamType.CANVAS)
    .register();
    function on(canvas) {
        var ctx = uComps.cast.toCanvas(canvas);
        ctx.on('on_press', on_callback);
    }
    function on_callback() {
        print('on_callback!!!!');
    }

    Parameters

    • eventType: string

      The type of the event.

    • callback: Function

      The callback function

    Returns void

refresh

  • refresh(): void

  • Refresh this component to force it to be re-rendered, or for its dynamic data to be updated.

    Returns void

set

  • set(propertyName: string, value: any): void
  • set(data: Object): void

  • Set a properties value by name.

    var uActions = require('u-actions');
    new uActions.Action('set text color',setTextColor).register();
    function setTextColor() {
        uPages.get('follow').components.getText('Text 1').set('font_color','0x0000FFFF');
    }

    Parameters

    • propertyName: string

      The name of the property to set.

    • value: any

      The value to set. Can be of any type.

    Returns void

  • Set a number properties at once.

    Parameters

    • data: Object

      Data object containing property name and value pairs to set on this component.

    Returns void

tween

  • tween(seconds: number, params: Object, type?: TweenType): void

  • Tween a component property over time.

    Parameters

    • seconds: number

      The number of seconds to tween for.

    • params: Object

      An objects that contains key/value pairs of the properties and values to tween.

    • Optional type: TweenType

      (Optional) Tween type can be any type from "Tween.type"

    Returns void