"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
function fitRatio(ratio, width, height) {
    if (width > height * ratio) {
        return [height * ratio, height];
    }
    return [width, width / ratio];
}
/**
 * Desktop web view
 */
class DesktopDevice {
    constructor() {
        this.frame = 'none';
        this.isMobile = false;
        this.displayName = 'Web View (16:9)';
    }
    display(availableWidth, availableHeight) {
        // The goal here is to pretend the scene is 1080p, then scale the 350px
        // default chat sidebar to its scaled size.
        const [width, height] = fitRatio(16 / 9, availableWidth, availableHeight);
        const chatWidth = 350 / 1920 * availableWidth;
        return [
            {
                x: 0,
                y: 0,
                width: width - chatWidth,
                height,
                type: 'controls',
            },
            {
                x: width - chatWidth,
                y: 0,
                width: chatWidth,
                height,
                type: 'chat',
            },
        ];
    }
}
/**
 * Fullscreen in a 16:9 view
 */
class FullscreenDevice {
    constructor() {
        this.frame = 'none';
        this.isMobile = false;
        this.displayName = 'Full Screen (16:9)';
    }
    display(availableWidth, availableHeight) {
        // The goal here is to pretend the scene is 1080p, then scale the 350px
        // default chat sidebar to its scaled size.
        const [width, height] = fitRatio(16 / 9, availableWidth, availableHeight);
        return [
            {
                x: 0,
                y: 0,
                width,
                height,
                type: 'controls',
            },
        ];
    }
}
/**
 * Some mobile, rotat-able device
 */
class MobileDevice {
    constructor(displayName, height, width) {
        this.displayName = displayName;
        this.height = height;
        this.width = width;
        this.frame = 'phone';
        this.isMobile = true;
    }
    display(_w, _h, orientation) {
        if (orientation === "landscape" /* Landscape */) {
            return [
                {
                    x: 0,
                    y: 0,
                    width: this.width,
                    height: this.height,
                    type: 'controls',
                },
            ];
        }
        const videoHeight = this.height * 9 / 16;
        return [
            {
                x: 0,
                y: 0,
                width: this.height,
                height: videoHeight,
                type: 'video',
            },
            {
                x: 0,
                y: videoHeight,
                width: this.height,
                height: this.width - videoHeight,
                type: 'controls',
            },
        ];
    }
}
exports.devices = [
    new DesktopDevice(),
    new FullscreenDevice(),
    new MobileDevice('iPhone 5', 320, 568),
    new MobileDevice('iPhone 6, 7', 375, 667),
    new MobileDevice('Google Nexus, Pixel', 411, 731),
    new MobileDevice('Galaxy Note 5, LG G5, OPO 3', 480, 853),
    new MobileDevice('Galaxy S7', 340, 640),
];
