Contrast Plugin contrast.js

by Eric Chen - eric2022czc@gmail.com

Description

• Anything you can write to <scene>, can be supported.
• Supports left-right layout and up-down layout.
• The support for the wireframe is only an experimental function at present, some mobile do not display the wireframe.

krpano Forum Discussion Thread

Download

Syntax / XML Usage Example

<plugin name="contrast"
	url="./contrast.js"
	viewA="./panosA.xml"
	viewB="./panosB.xml"
	viewA_wireframe="false"
	viewB_wireframe="false"
	bgcolorA="0x99FFCC"
	bgcolorB="0x00CCFF"
	width="100%"
	height="100%"
	align="lefttop"
	vertical="false"
	min_percentage="0"
	divider_width="4"
	divider_color="0x000000"
	handler_bgcolor="0xFFFFFF"
	handler_active_bgcolor="0xCC00FF"
	onready=""
/>

Plugin Attributes

• viewA (*)
  • The xml path loaded by the first view, at left/top.
  • default=null
• viewB (*)
  • The xml path loaded by the first view, at right/bottom.
  • default=null
• viewA_wireframe (optionally)
  • Whether to enable the wireframe function of view A.
  • default=false
• viewB_wireframe (optionally)
  • Whether to enable the wireframe function of view B.
  • default=false
• bgcolorA (optionally)
  • The background color of view A.
  • default=0x99FFCC
• bgcolorB (optionally)
  • The background color of view B.
  • default=0x00CCFF
• width (optionally)
  • Current container width.
  • default=100%
• height (optionally)
  • Current container height.
  • default=100%
• align (optionally)
  • The container alignment.
  • default=lefttop
• vertical (optionally)
  • If vertical is true, the top-bottom layout will be used. The default layout is left-right.
  • default=false
• min_percentage (optionally)
  • The smallest proportion of the smaller of the two views.This ensures that you always see both views, rather than one completely covering the other.
  • default=0
• divider_width (optionally)
  • The width of the divider.
  • default=4
• divider_color (optionally)
  • The color of the divider.
  • default=0x000000
• handler_bgcolor (optionally)
  • The background color of the handler.
  • default=0xFFFFFF
• handler_active_bgcolor (optionally)
  • The background color of the handler when the mouse is pressed.
  • default=0xCC00FF

Plugin Events

• onready (optionally)
  • This event is fired when both views are loaded.
  • default=null

Plugin Actions

• loadview_scene(viewA_scene, viewB_scene, vars, flags, blend, loaddone)

  • viewA_scene: The scene name in viewA's xml.
  • viewB_scene: The scene name in viewB's xml.
  • vars: Same as loadpano().
  • flags: Same as loadpano().
  • blend: Same as loadpano().
  • loaddone: Actions code or a Javascript function to call when the loading is done.

Flat image example

Pano example

Wireframe example