function newFoundationsCockpitSpace() {
    const MODULE_NAME = 'CockpitSpace'
    const STATUS_TYPES = {
        ALL_GOOD: 1,
        WARNING: 2
    }
    let thisObject = {
        container: undefined,
        status: 'BOTTOM',
        fullscreen: undefined,
        statusTypes: STATUS_TYPES,
        setStatus: setStatus,
        toTop: toTop,
        toBottom: toBottom,
        toMiddle: toMiddle,
        moveUp: moveUp,
        moveDown: moveDown,
        draw: draw,
        physics: physics,
        getContainer: getContainer,
        finalize: finalize,
        initialize: initialize,
        initializePosition: initializePosition
    }

    thisObject.container = newContainer()
    thisObject.container.initialize(MODULE_NAME)
    thisObject.container.isClickeable = false
    thisObject.container.detectMouseOver = true
    thisObject.container.isDraggeable = true
    thisObject.container.notDraggingOnX = true

    controlsMap = new Map()
    resize()

    let selfMouseClickEventSubscriptionId
    let canvasBrowserResizedEventSubscriptionId

    let statusCounter = 0
    let statusText
    let statusType
    let isInitilized = false

    return thisObject

    function finalize() {
        thisObject.container.eventHandler.stopListening(selfMouseClickEventSubscriptionId)
        thisObject.container.eventHandler.stopListening(canvasBrowserResizedEventSubscriptionId)

        thisObject.container.finalize()
        thisObject.container = undefined
        thisObject.fullscreen = undefined
    }

    function initialize() {
        canvasBrowserResizedEventSubscriptionId = canvas.eventHandler.listenToEvent('Browser Resized', resize)
        selfMouseClickEventSubscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseClick', onMouseClick)

        thisObject.fullscreen = newFullScreen()
        thisObject.fullscreen.container.connectToParent(thisObject.container)
        thisObject.fullscreen.initialize()
    }

    function initializePosition() {
        thisObject.container.frame.position.x = 0

        let INITIAL_POSITION
        if (UI.projects.foundations.spaces.designSpace.workspace.enabled === true) {
            let localStorage = window.localStorage.getItem(MODULE_NAME)
            if (localStorage !== null) {
                storage = JSON.parse(localStorage)
                thisObject.container.frame.position.y = storage.spacePosition
            } else {
                INITIAL_POSITION = browserCanvas.height - 55
                thisObject.container.frame.position.y = browserCanvas.height * INITIAL_POSITION / 100 - COCKPIT_SPACE_HEIGHT
            }
        } else {
            INITIAL_POSITION = 100
            thisObject.container.frame.position.y = browserCanvas.height * INITIAL_POSITION / 100 - COCKPIT_SPACE_HEIGHT
        }
        isInitilized = true
    }

    function onMouseClick(event) {

    }

    function setStatus(text, counter, type) {
        statusCounter = counter
        statusText = text
        statusType = type
    }

    function resize() {
        thisObject.container.frame.width = browserCanvas.width
        thisObject.container.frame.height = COCKPIT_SPACE_HEIGHT

        switch (thisObject.status) {
            case 'BOTTOM': {
                thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
                break
            }
            case 'TOP': {
                thisObject.container.frame.position.y = TOP_SPACE_HEIGHT
                break
            }
        }
    }

    function toTop() {
        thisObject.container.frame.position.y = TOP_SPACE_HEIGHT
    }

    function toBottom() {
        thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
    }

    function toMiddle() {
        thisObject.container.frame.position.y = browserCanvas.height / 2 - COCKPIT_SPACE_HEIGHT
    }

    function moveUp() {
        thisObject.container.frame.position.y = thisObject.container.frame.position.y - COCKPIT_SPACE_HEIGHT * 2
        if (thisObject.container.frame.position.y < 0) {
            thisObject.container.frame.position.y = 0
        }
    }

    function moveDown() {
        thisObject.container.frame.position.y = thisObject.container.frame.position.y + COCKPIT_SPACE_HEIGHT * 2
        if (thisObject.container.frame.position.y > browserCanvas.height - COCKPIT_SPACE_HEIGHT) {
            thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
        }
    }

    function statusPhysics() {
        statusCounter--
        if (statusCounter < 0) {
            statusCounter = 0
            statusText = undefined
            statusType = undefined

            if (UI.environment.DEMO_MODE === true) {
                statusText = 'You are running Superalgos in DEMO MODE. That means that you will not be able to run or stop tasks. Remember Tutorials were designed for the full version, when you download the software.'
                statusType = STATUS_TYPES.WARNING
            }
        }
    }

    function physics() {
        thisObjectPhysics()
        childrenPhysics()
        statusPhysics()
    }

    function childrenPhysics() {
        thisObject.fullscreen.physics()
    }
    function thisObjectPhysics() {
        if (isInitilized === false) { return }
        /* Check the limits */

        thisObject.status = 'MIDDLE'

        if (UI.projects.foundations.spaces.designSpace.workspace.enabled === true) {
            thisObject.container.isDraggeable = true
        } else {
            thisObject.container.isDraggeable = false
        }

        if (thisObject.container.frame.position.y > browserCanvas.height * 99.5 / 100 - COCKPIT_SPACE_HEIGHT) {
            thisObject.container.frame.position.y = browserCanvas.height - COCKPIT_SPACE_HEIGHT
            thisObject.status = 'BOTTOM'
            UI.projects.foundations.spaces.designSpace.makeInvisible()
            UI.projects.foundations.spaces.floatingSpace.makeInvisible()
        } else {
            UI.projects.foundations.spaces.designSpace.makeVisible()
            UI.projects.foundations.spaces.floatingSpace.makeVisible()
        }

        if (thisObject.container.frame.position.y < browserCanvas.height * 0.5 / 100 + TOP_SPACE_HEIGHT) {
            thisObject.container.frame.position.y = TOP_SPACE_HEIGHT
            thisObject.status = 'TOP'
            UI.projects.foundations.spaces.panelSpace.visible = false
        } else {
            UI.projects.foundations.spaces.panelSpace.visible = true
        }

        COCKPIT_SPACE_POSITION = thisObject.container.frame.position.y
        let storage = {
            spacePosition: COCKPIT_SPACE_POSITION
        }
        window.localStorage.setItem(MODULE_NAME, JSON.stringify(storage))
        if (UI.projects.foundations.spaces.chartingSpace.viewport !== undefined) {
            UI.projects.foundations.spaces.chartingSpace.viewport.resize()
        }
    }

    function getContainer(point) {

        if (thisObject.container.frame.isThisPointHere(point, true) === true) {
            thisObject.container.space = 'Cockpit Space'
            return thisObject.container
        } else {
            return undefined
        }
    }

    function draw() {
        if (CAN_SPACES_DRAW === false) { return }
        thisObject.container.frame.draw(false, false)

        drawBackground()

        // thisObject.fullscreen.draw()
    }

    function drawBackground() {
        let opacity = 1

        let zeroPoint = {
            x: 0,
            y: 0
        }

        const RED_LINE_HIGHT = 2

        zeroPoint = thisObject.container.frame.frameThisPoint(zeroPoint)

        let barColor = UI_COLOR.DARK_TURQUOISE // default
        let textColor

        if (statusType !== undefined) {
            switch (statusType) {
                case STATUS_TYPES.ALL_GOOD:
                    {
                        barColor = UI_COLOR.PATINATED_TURQUOISE
                        textColor = UI_COLOR.WHITE
                        break
                    }
                case STATUS_TYPES.WARNING:
                    {
                        barColor = UI_COLOR.RED
                        textColor = UI_COLOR.TITANIUM_YELLOW
                        break
                    }
            }
        }

        browserCanvasContext.beginPath()
        browserCanvasContext.rect(zeroPoint.x, zeroPoint.y, thisObject.container.frame.width, thisObject.container.frame.height)
        browserCanvasContext.fillStyle = 'rgba(' + barColor + ', ' + opacity + ')'
        browserCanvasContext.closePath()
        browserCanvasContext.fill()

        browserCanvasContext.beginPath()
        browserCanvasContext.rect(zeroPoint.x, zeroPoint.y, thisObject.container.frame.width, RED_LINE_HIGHT)
        browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.RUSTED_RED + ', ' + opacity + ')'
        browserCanvasContext.closePath()
        browserCanvasContext.fill()

        browserCanvasContext.beginPath()
        browserCanvasContext.rect(zeroPoint.x, zeroPoint.y - RED_LINE_HIGHT + thisObject.container.frame.height, thisObject.container.frame.width, RED_LINE_HIGHT)
        browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.RUSTED_RED + ', ' + opacity + ')'
        browserCanvasContext.closePath()
        browserCanvasContext.fill()

        if (statusText !== undefined) {
            let position = {
                x: thisObject.container.frame.width / 2,
                y: thisObject.container.frame.height / 2 + 5
            }
            UI.projects.foundations.utilities.drawPrint.printLabel(statusText, undefined, undefined, position.x, position.y, 1, 15, textColor, 'Center', thisObject.container)
        }

        if (UI.projects.foundations.spaces.designSpace !== undefined) {
            if (UI.projects.foundations.spaces.designSpace.workspace.enabled === true && statusText === undefined) {
                arrow()
            }
        }
    }

    function arrow() {
        const X_OFFSET = thisObject.container.frame.width / 2
        const Y_OFFSET = thisObject.container.frame.height / 2
        const HEIGHT = 6
        const WIDTH = 18
        const LINE_WIDTH = 3
        const OPACITY = 1
        let DISTANCE_BETWEEN_ARROWS = 0
        let ARROW_1_DIRECTION = 0
        let ARROW_2_DIRECTION = 0

        switch (thisObject.status) {

            case ('TOP'): {
                ARROW_1_DIRECTION = -1
                ARROW_2_DIRECTION = -1
                DISTANCE_BETWEEN_ARROWS = 6
                break
            }
            case ('MIDDLE'): {
                ARROW_1_DIRECTION = 1
                ARROW_2_DIRECTION = -1
                DISTANCE_BETWEEN_ARROWS = 9
                break
            }
            case ('BOTTOM'): {
                ARROW_1_DIRECTION = 1
                ARROW_2_DIRECTION = 1
                DISTANCE_BETWEEN_ARROWS = 6
                break
            }
        }

        point1 = {
            x: X_OFFSET - WIDTH / 2,
            y: Y_OFFSET + HEIGHT / 2 * ARROW_1_DIRECTION - DISTANCE_BETWEEN_ARROWS / 2
        }

        point2 = {
            x: X_OFFSET,
            y: Y_OFFSET - HEIGHT / 2 * ARROW_1_DIRECTION - DISTANCE_BETWEEN_ARROWS / 2
        }

        point3 = {
            x: X_OFFSET + WIDTH / 2,
            y: Y_OFFSET + HEIGHT / 2 * ARROW_1_DIRECTION - DISTANCE_BETWEEN_ARROWS / 2
        }

        point1 = thisObject.container.frame.frameThisPoint(point1)
        point2 = thisObject.container.frame.frameThisPoint(point2)
        point3 = thisObject.container.frame.frameThisPoint(point3)

        point4 = {
            x: X_OFFSET - WIDTH / 2,
            y: Y_OFFSET + HEIGHT / 2 * ARROW_2_DIRECTION + DISTANCE_BETWEEN_ARROWS / 2
        }

        point5 = {
            x: X_OFFSET,
            y: Y_OFFSET - HEIGHT / 2 * ARROW_2_DIRECTION + DISTANCE_BETWEEN_ARROWS / 2
        }

        point6 = {
            x: X_OFFSET + WIDTH / 2,
            y: Y_OFFSET + HEIGHT / 2 * ARROW_2_DIRECTION + DISTANCE_BETWEEN_ARROWS / 2
        }

        point4 = thisObject.container.frame.frameThisPoint(point4)
        point5 = thisObject.container.frame.frameThisPoint(point5)
        point6 = thisObject.container.frame.frameThisPoint(point6)

        browserCanvasContext.setLineDash([]) // Resets Line Dash

        browserCanvasContext.beginPath()

        browserCanvasContext.moveTo(point1.x, point1.y)
        browserCanvasContext.lineTo(point2.x, point2.y)
        browserCanvasContext.lineTo(point3.x, point3.y)

        browserCanvasContext.moveTo(point4.x, point4.y)
        browserCanvasContext.lineTo(point5.x, point5.y)
        browserCanvasContext.lineTo(point6.x, point6.y)

        browserCanvasContext.lineWidth = LINE_WIDTH
        browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + OPACITY + ')'
        browserCanvasContext.stroke()
    }
}