Viewer and Widgets

import { Viewer, CesiumWidget, Animation, BaseLayerPicker } from "cesium";

/**
 * A complete 3D globe widget with integrated UI controls
 */
class Viewer {
  constructor(container: Element | string, options?: ViewerOptions);
  
  readonly container: Element;
  readonly bottomContainer: Element;
  readonly canvas: HTMLCanvasElement;
  readonly cesiumWidget: CesiumWidget;
  readonly selectionIndicator: SelectionIndicator;
  readonly infoBox: InfoBox;
  readonly geocoder: Geocoder;
  readonly homeButton: HomeButton;
  readonly sceneModePicker: SceneModePicker;
  readonly baseLayerPicker: BaseLayerPicker;
  readonly navigationHelpButton: NavigationHelpButton;
  readonly animation: Animation;
  readonly timeline: Timeline;
  readonly fullscreenButton: FullscreenButton;
  readonly vrButton: VRButton;
  readonly dataSourceDisplay: DataSourceDisplay;
  readonly entities: EntityCollection;
  readonly dataSources: DataSourceCollection;
  readonly canvas: HTMLCanvasElement;
  readonly camera: Camera;
  readonly clock: Clock;
  readonly scene: Scene;
  readonly imageryLayers: ImageryLayerCollection;
  readonly terrainProvider: TerrainProvider;
  readonly skyBox: SkyBox;
  readonly skyAtmosphere: SkyAtmosphere;
  readonly shadows: boolean;
  readonly terrainShadows: ShadowMode;
  readonly resolutionScale: number;
  readonly useBrowserRecommendedResolution: boolean;
  readonly allowDataSourcesToSuspendAnimation: boolean;
  readonly trackedEntity?: Entity;
  readonly selectedEntity?: Entity;
  readonly clockTrackedDataSource?: DataSource;
  
  extend(mixin: ViewerMixin, options?: any): void;
  resize(): void;
  forceResize(): void;
  render(): void;
  isDestroyed(): boolean;
  destroy(): void;
  zoomTo(target: Entity | Entity[] | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise<Entity | Entity[] | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud>, offset?: HeadingPitchRange): Promise<boolean>;
  flyTo(target: Entity | Entity[] | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise<Entity | Entity[] | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud>, options?: ViewerFlyToOptions): Promise<boolean>;
}

interface ViewerOptions {
  animation?: boolean;
  baseLayerPicker?: boolean;
  fullscreenButton?: boolean;
  vrButton?: boolean;
  geocoder?: boolean | GeocoderService[];
  homeButton?: boolean;
  infoBox?: boolean;
  sceneModePicker?: boolean;
  selectionIndicator?: boolean;
  timeline?: boolean;
  navigationHelpButton?: boolean;
  navigationInstructionsInitiallyVisible?: boolean;
  scene3DOnly?: boolean;
  shouldAnimate?: boolean;
  clockViewModel?: ClockViewModel;
  selectedImageryProviderViewModel?: ProviderViewModel;
  imageryProviderViewModels?: ProviderViewModel[];
  selectedTerrainProviderViewModel?: ProviderViewModel;
  terrainProviderViewModels?: ProviderViewModel[];
  imageryProvider?: ImageryProvider;
  terrainProvider?: TerrainProvider;
  skyBox?: SkyBox | false;
  skyAtmosphere?: SkyAtmosphere | false;
  fullscreenElement?: Element | string;
  useDefaultRenderLoop?: boolean;
  targetFrameRate?: number;
  showRenderLoopErrors?: boolean;
  useBrowserRecommendedResolution?: boolean;
  automaticallyTrackDataSourceClocks?: boolean;
  contextOptions?: any;
  sceneMode?: SceneMode;
  mapProjection?: MapProjection;
  globe?: Globe | false;
  orderIndependentTranslucency?: boolean;
  creditContainer?: Element | string;
  creditViewport?: Element | string;
  dataSources?: DataSourceCollection;
  terrainExaggeration?: number;
  shadows?: boolean;
  terrainShadows?: ShadowMode;
  mapMode2D?: MapMode2D;
  projectionPicker?: boolean;
  requestRenderMode?: boolean;
  maximumRenderTimeChange?: number;
}

interface ViewerFlyToOptions {
  duration?: number;
  maximumHeight?: number;
  offset?: HeadingPitchRange;
}

/**
 * Cesium widget without UI controls for embedding in custom applications
 */
class CesiumWidget {
  constructor(container: Element | string, options?: CesiumWidgetOptions);
  
  readonly container: Element;
  readonly canvas: HTMLCanvasElement;
  readonly creditContainer: Element;
  readonly scene: Scene;
  readonly imageryLayers: ImageryLayerCollection;
  readonly terrainProvider: TerrainProvider;
  readonly camera: Camera;
  readonly clock: Clock;
  readonly screenSpaceEventHandler: ScreenSpaceEventHandler;
  readonly targetFrameRate: number;
  readonly useDefaultRenderLoop: boolean;
  readonly resolutionScale: number;
  readonly useBrowserRecommendedResolution: boolean;
  
  showErrorPanel(title: string, message?: string, error?: string): void;
  isDestroyed(): boolean;
  destroy(): void;
  resize(): void;
  render(): void;
}

interface CesiumWidgetOptions {
  clock?: Clock;
  imageryProvider?: ImageryProvider;
  terrainProvider?: TerrainProvider;
  skyBox?: SkyBox;
  skyAtmosphere?: SkyAtmosphere;
  sceneMode?: SceneMode;
  scene3DOnly?: boolean;
  ellipsoid?: Ellipsoid;
  mapProjection?: MapProjection;
  globe?: Globe;
  orderIndependentTranslucency?: boolean;
  contextOptions?: WebGLContextAttributes;
  useDefaultRenderLoop?: boolean;
  targetFrameRate?: number;
  showRenderLoopErrors?: boolean;
  useBrowserRecommendedResolution?: boolean;
  creditContainer?: Element;
  creditViewport?: Element;
  terrainExaggeration?: number;
  shadows?: boolean;
  terrainShadows?: ShadowMode;
  mapMode2D?: MapMode2D;
  requestRenderMode?: boolean;
  maximumRenderTimeChange?: number;
}

/**
 * Animation controls for time-based data
 */
class Animation {
  constructor(container: Element, viewModel: AnimationViewModel);
  readonly container: Element;
  readonly viewModel: AnimationViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
  resize(): void;
  applyThemeChanges(): void;
}

/**
 * Animation widget view model
 */
class AnimationViewModel {
  constructor(clockViewModel: ClockViewModel);
  readonly clockViewModel: ClockViewModel;
  readonly snapToTicks: boolean;
  readonly timeFormatter: AnimationViewModel.TimeFormatter;
  readonly dateFormatter: AnimationViewModel.DateFormatter;
  readonly playReverse: Command;
  readonly playForward: Command;
  readonly playPause: Command;
  readonly slower: Command;
  readonly faster: Command;
  readonly shuttleRingAngle: number;
  readonly multiplier: number;
  readonly dateLabel: string;
  readonly timeLabel: string;
  
  static defaultDateFormatter(date: JulianDate, viewModel: AnimationViewModel): string;
  static defaultTimeFormatter(date: JulianDate, viewModel: AnimationViewModel): string;
}

/**
 * Timeline widget for scrubbing through time
 */
class Timeline {
  constructor(container: Element, clock: Clock);
  readonly container: Element;
  
  isDestroyed(): boolean;
  destroy(): void;
  resize(): void;
  zoomTo(startTime: JulianDate, stopTime: JulianDate): void;
}

/**
 * Base layer picker for switching imagery providers
 */
class BaseLayerPicker {
  constructor(container: Element, options: BaseLayerPickerOptions);
  readonly container: Element;
  readonly viewModel: BaseLayerPickerViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

interface BaseLayerPickerOptions {
  globe: Globe;
  imageryProviderViewModels?: ProviderViewModel[];
  selectedImageryProviderViewModel?: ProviderViewModel;
  terrainProviderViewModels?: ProviderViewModel[];
  selectedTerrainProviderViewModel?: ProviderViewModel;
}

/**
 * Base layer picker view model
 */
class BaseLayerPickerViewModel {
  constructor(options: BaseLayerPickerViewModelOptions);
  readonly imageryProviderViewModels: ProviderViewModel[];
  readonly terrainProviderViewModels: ProviderViewModel[];
  readonly dropDownVisible: boolean;
  selectedImagery: ProviderViewModel;
  selectedTerrain: ProviderViewModel;
  readonly buttonTooltip: string;
  readonly buttonImageUrl: string;
  
  toggleDropDown(): void;
}

interface BaseLayerPickerViewModelOptions {
  globe: Globe;
  imageryProviderViewModels?: ProviderViewModel[];
  selectedImageryProviderViewModel?: ProviderViewModel;
  terrainProviderViewModels?: ProviderViewModel[];
  selectedTerrainProviderViewModel?: ProviderViewModel;
}

/**
 * Scene mode picker for switching between 3D, 2D, and Columbus view
 */
class SceneModePicker {
  constructor(container: Element, scene: Scene, duration?: number);
  readonly container: Element;
  readonly viewModel: SceneModePickerViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Scene mode picker view model
 */
class SceneModePickerViewModel {
  constructor(scene: Scene, duration?: number);
  readonly scene: Scene;
  readonly duration: number;
  readonly morphTo3D: Command;
  readonly morphToColumbusView: Command;
  readonly morphTo2D: Command;
  readonly sceneMode: SceneMode;
  readonly dropDownVisible: boolean;
  readonly tooltip2D: string;
  readonly tooltip3D: string;
  readonly tooltipColumbusView: string;
  readonly selectedTooltip: string;
  
  toggleDropDown(): void;
}

/**
 * Geocoder widget for searching locations
 */
class Geocoder {
  constructor(options: GeocoderOptions);
  readonly container: Element;
  readonly searchSuggestionsContainer: Element;
  readonly viewModel: GeocoderViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

interface GeocoderOptions {
  container: Element;
  scene: Scene;
  geocoderServices?: GeocoderService[];
  autoComplete?: boolean;
  flightDuration?: number;
  destinationFound?: Geocoder.DestinationFoundFunction;
}

/**
 * Geocoder view model
 */
class GeocoderViewModel {
  constructor(options: GeocoderViewModelOptions);
  readonly scene: Scene;
  readonly flightDuration: number;
  readonly search: Command;
  readonly geocoderServices: GeocoderService[];
  readonly autoComplete: boolean;
  readonly searchText: string;
  readonly isSearchInProgress: boolean;
  readonly searchSuggestions: any[];
  
  activate(): void;
  deactivate(): void;
}

interface GeocoderViewModelOptions {
  scene: Scene;
  geocoderServices?: GeocoderService[];
  flightDuration?: number;
  destinationFound?: Geocoder.DestinationFoundFunction;
}

/**
 * Home button for returning to default view
 */
class HomeButton {
  constructor(container: Element, scene: Scene, duration?: number);
  readonly container: Element;
  readonly viewModel: HomeButtonViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Home button view model
 */
class HomeButtonViewModel {
  constructor(scene: Scene, duration?: number);
  readonly scene: Scene;
  readonly duration: number;
  readonly command: Command;
  readonly tooltip: string;
}

/**
 * Fullscreen button widget
 */
class FullscreenButton {
  constructor(container: Element, fullscreenElement?: Element);
  readonly container: Element;
  readonly viewModel: FullscreenButtonViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Fullscreen button view model
 */
class FullscreenButtonViewModel {
  constructor(fullscreenElement?: Element);
  readonly fullscreenElement: Element;
  readonly isFullscreen: boolean;
  readonly isFullscreenEnabled: boolean;
  readonly tooltip: string;
  readonly command: Command;
}

/**
 * VR mode button widget
 */
class VRButton {
  constructor(container: Element, scene: Scene, vrElement?: Element);
  readonly container: Element;
  readonly viewModel: VRButtonViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * VR button view model
 */
class VRButtonViewModel {
  constructor(scene: Scene, vrElement?: Element);
  readonly isVRMode: boolean;
  readonly isVREnabled: boolean;
  readonly tooltip: string;
  readonly vrElement: Element;
  readonly command: Command;
}

/**
 * Navigation help button widget
 */
class NavigationHelpButton {
  constructor(options: NavigationHelpButtonOptions);
  readonly container: Element;
  readonly viewModel: NavigationHelpButtonViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

interface NavigationHelpButtonOptions {
  container: Element;
  instructionsInitiallyVisible?: boolean;
}

/**
 * Navigation help button view model
 */
class NavigationHelpButtonViewModel {
  constructor(options?: NavigationHelpButtonViewModelOptions);
  readonly command: Command;
  readonly showInstructions: boolean;
  readonly tooltip: string;
  readonly showClick: Command;
  readonly showTouch: Command;
}

interface NavigationHelpButtonViewModelOptions {
  instructionsInitiallyVisible?: boolean;
}

/**
 * Information box for displaying entity details
 */
class InfoBox {
  constructor(container: Element);
  readonly container: Element;
  readonly viewModel: InfoBoxViewModel;
  readonly frame: HTMLIFrameElement;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Info box view model
 */
class InfoBoxViewModel {
  constructor();
  readonly maxHeight: number;
  readonly enableCamera: boolean;
  readonly isCameraTracking: boolean;
  readonly showInfo: boolean;
  readonly titleText: string;
  readonly description: string;
  readonly cameraIconPath: string;
  readonly cameraClicked: Command;
  readonly closeClicked: Command;
  
  maxHeightOffset(offset: number): string;
}

/**
 * Selection indicator for highlighting picked objects
 */
class SelectionIndicator {
  constructor(container: Element, scene: Scene);
  readonly container: Element;
  readonly viewModel: SelectionIndicatorViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Selection indicator view model
 */
class SelectionIndicatorViewModel {
  constructor(scene: Scene, selectionIndicatorElement: Element, container: Element);
  readonly showSelection: boolean;
  readonly position: Cartesian2;
  readonly computeScreenSpacePosition: SelectionIndicatorViewModel.ComputeScreenSpacePosition;
  readonly container: Element;
  readonly selectionIndicatorElement: Element;
  readonly scene: Scene;
  
  update(): void;
  animateAppear(): void;
  animateDepart(): void;
}

/**
 * Cesium inspector widget for debugging scene properties
 */
class CesiumInspector {
  constructor(container: Element, scene: Scene);
  readonly container: Element;
  readonly viewModel: CesiumInspectorViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * Cesium inspector view model
 */
class CesiumInspectorViewModel {
  constructor(scene: Scene);
  readonly scene: Scene;
  readonly performance: boolean;
  readonly shaderCacheText: string;
  readonly primitiveBoundingSphere: boolean;
  readonly primitiveReferenceFrame: boolean;
  readonly filterPrimitive: boolean;
  readonly tileBoundingSphere: boolean;
  readonly filterTile: boolean;
  readonly wireframe: boolean;
  readonly suspendUpdates: boolean;
  readonly tileCoordinates: boolean;
  readonly frustumPlanes: boolean;
  readonly frustumStatisticText: string;
  readonly tileText: string;
  
  toggleSuspendUpdates(): void;
  toggleTileCoordinates(): void;
  toggleFrustumPlanes(): void;
  togglePerformance(): void;
  showFrustumStatistics(): void;
  showPrimitiveStatistics(): void;
  showTerrainStatistics(): void;
  showTextureAtlas(): void;
  showDrawCommands(): void;
  showDepthBuffer(): void;
}

/**
 * 3D Tiles inspector widget for debugging tilesets
 */
class Cesium3DTilesInspector {
  constructor(container: Element, scene: Scene);
  readonly container: Element;
  readonly viewModel: Cesium3DTilesInspectorViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

/**
 * 3D Tiles inspector view model
 */
class Cesium3DTilesInspectorViewModel {
  constructor(scene: Scene);
  readonly scene: Scene;
  readonly performanceContainer: Element;
  tileset?: Cesium3DTileset;
  readonly hasPickedTileset: boolean;
  readonly hasPickedParent: boolean;
  readonly hasTileDebugLabels: boolean;
  readonly eyeDomeLighting: boolean;
  
  pickTileset(): void;
  pickParent(): void;
  selectParent(): void;
  selectNW(): void;
  selectNE(): void;
  selectSW(): void;
  selectSE(): void;
  trimTilesCache(): void;
  togglePickTileset(): void;
  toggleInspector(): void;
  toggleTileDebugLabels(): void;
  toggleFreezeFrame(): void;
  toggleColorizeTiles(): void;
  toggleWireframe(): void;
  toggleBoundingVolumes(): void;
  toggleContentBoundingVolumes(): void;
  toggleRequestVolumes(): void;
  togglePointCloudShading(): void;
  toggleGeometricErrorScale(): void;
  toggleMinimumLevel(): void;
  toggleMaximumLevel(): void;
}

/**
 * Performance watchdog widget for monitoring frame rate
 */
class PerformanceWatchdog {
  constructor(options?: PerformanceWatchdogOptions);
  readonly container: Element;
  readonly viewModel: PerformanceWatchdogViewModel;
  
  isDestroyed(): boolean;
  destroy(): void;
}

interface PerformanceWatchdogOptions {
  container: Element;
  scene: Scene;
  lowFrameRateMessage?: string;
}

/**
 * Performance watchdog view model
 */
class PerformanceWatchdogViewModel {
  constructor(options?: PerformanceWatchdogViewModelOptions);
  readonly lowFrameRateMessage: string;
  readonly lowFrameRateMessageDismissed: boolean;
  readonly showingLowFrameRateMessage: boolean;
  readonly scene: Scene;
  
  dismissMessage(): void;
}

interface PerformanceWatchdogViewModelOptions {
  scene: Scene;
  lowFrameRateMessage?: string;
}

/**
 * Clock view model for time controls
 */
class ClockViewModel {
  constructor(clock?: Clock);
  readonly clock: Clock;
  readonly startTime: JulianDate;
  readonly stopTime: JulianDate;
  readonly currentTime: JulianDate;
  readonly multiplier: number;
  readonly clockStep: ClockStep;
  readonly clockRange: ClockRange;
  readonly canAnimate: boolean;
  readonly shouldAnimate: boolean;
  readonly systemTime: JulianDate;
  
  synchronize(): void;
  destroy(): void;
}

/**
 * Provider view model for imagery and terrain providers
 */
class ProviderViewModel {
  constructor(options: ProviderViewModelOptions);
  readonly name: string;
  readonly tooltip: string;
  readonly iconUrl: string;
  readonly creationFunction: ProviderViewModel.CreationFunction;
  readonly creationCommand: Command;
}

interface ProviderViewModelOptions {
  name: string;
  tooltip: string;
  iconUrl: string;
  creationFunction: ProviderViewModel.CreationFunction;
}

/**
 * Command pattern implementation for UI actions
 */
class Command {
  readonly canExecute: boolean;
  readonly beforeExecute: Event;
  readonly afterExecute: Event;
  
  execute(...args: any[]): any;
}

/**
 * Toggle button view model
 */
class ToggleButtonViewModel {
  constructor(command: Command, options?: ToggleButtonViewModelOptions);
  readonly command: Command;
  readonly tooltip: string;
  toggled: boolean;
}

interface ToggleButtonViewModelOptions {
  toggled?: boolean;
  tooltip?: string;
}

/**
 * Create a command with the given function
 */
function createCommand(func: Function, canExecute?: boolean): Command;

/**
 * Utility function for subscribing and evaluating knockout observables
 */
function subscribeAndEvaluate(observable: any, callback: Function, target?: any, debugName?: string): Function;

/**
 * Screen space event handler for mouse and touch input
 */
class ScreenSpaceEventHandler {
  constructor(element?: HTMLCanvasElement);
  readonly element: HTMLCanvasElement;
  
  setInputAction(action: ScreenSpaceEventHandler.PositionedEventCallback | ScreenSpaceEventHandler.MotionEventCallback, type: ScreenSpaceEventType, modifier?: KeyboardEventModifier): void;
  getInputAction(type: ScreenSpaceEventType, modifier?: KeyboardEventModifier): ScreenSpaceEventHandler.PositionedEventCallback | ScreenSpaceEventHandler.MotionEventCallback;
  removeInputAction(type: ScreenSpaceEventType, modifier?: KeyboardEventModifier): void;
  isDestroyed(): boolean;
  destroy(): void;
}

enum ScreenSpaceEventType {
  LEFT_DOWN = 0,
  LEFT_UP = 1,
  LEFT_CLICK = 2,
  LEFT_DOUBLE_CLICK = 3,
  RIGHT_DOWN = 5,
  RIGHT_UP = 6,
  RIGHT_CLICK = 7,
  MIDDLE_DOWN = 10,
  MIDDLE_UP = 11,
  MIDDLE_CLICK = 12,
  MOUSE_MOVE = 15,
  WHEEL = 16,
  PINCH_START = 17,
  PINCH_END = 18,
  PINCH_MOVE = 19
}

enum KeyboardEventModifier {
  SHIFT = 0,
  CTRL = 1,
  ALT = 2
}

interface ViewerMixin {
  (viewer: Viewer, options?: any): void;
}

interface GeocoderService {
  geocode(query: string): Promise<GeocoderResult[]>;
}

interface GeocoderResult {
  displayName: string;
  destination: Cartesian3 | Rectangle;
}

namespace Geocoder {
  type DestinationFoundFunction = (viewModel: GeocoderViewModel, destination: Cartesian3 | Rectangle) => void;
}

namespace SelectionIndicatorViewModel {
  type ComputeScreenSpacePosition = (position: Cartesian3, result: Cartesian2) => Cartesian2;
}

namespace ProviderViewModel {
  type CreationFunction = () => ImageryProvider | TerrainProvider | Promise<ImageryProvider | TerrainProvider>;
}

namespace ScreenSpaceEventHandler {
  type PositionedEventCallback = (event: { position: Cartesian2 }) => void;
  type MotionEventCallback = (event: { startPosition: Cartesian2; endPosition: Cartesian2 }) => void;
}

namespace AnimationViewModel {
  type TimeFormatter = (date: JulianDate, viewModel: AnimationViewModel) => string;
  type DateFormatter = (date: JulianDate, viewModel: AnimationViewModel) => string;
}

enum MapMode2D {
  INFINITE_SCROLL = 0,
  ROTATE = 1
}

interface HeadingPitchRange {
  heading?: number;
  pitch?: number;
  range?: number;
}