Workspace Space Implemented

2021-07-08 16:13:33 +02:00
1 parent f121d2641f
commit b5830d65f6
@@ -126,9 +126,7 @@ function newSidePanelTab() {
    }

    function positionPhysics() {
-        if (UI.projects.foundations.spaces.chartingSpace.viewport !== undefined) {
-            thisObject.container.frame.position.y = browserCanvas.height / 2 - TAB_HEIGHT / 2 //  TOP_SPACE_HEIGHT + UI.projects.foundations.spaces.chartingSpace.viewport.marginAmount + TAB_HEIGHT * thisObject.index
-        }
+        thisObject.container.frame.position.y = browserCanvas.height / 2 - TAB_HEIGHT / 2
    }

    function draw() {
@@ -382,7 +380,7 @@ function newSidePanelTab() {

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

-        browserCanvasContext.font =  12 + 'px ' + UI_FONT.PRIMARY
+        browserCanvasContext.font = 12 + 'px ' + UI_FONT.PRIMARY
        browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.GREY + ', 1)'
        browserCanvasContext.fillText(
            thisObject.tabLabel,
@@ -1,173 +1,38 @@
 function newFoundationsSideSpace() {
-    const MODULE_NAME = 'Side Space'
    let thisObject = {
        sidePanelTab: undefined,
        container: undefined,
        physics: physics,
        draw: draw,
+        getSidePanelTab, getSidePanelTab,
        getContainer: getContainer,
        initialize: initialize,
        finalize: finalize
    }

-    let isInitialized = false
-
-    thisObject.container = newContainer()
-    thisObject.container.name = MODULE_NAME
-    thisObject.container.initialize()
-    thisObject.container.isClickeable = true
-    thisObject.container.isDraggeable = false
-    thisObject.container.detectMouseOver = true
-    thisObject.container.status = 'hidden'
-
-    let listView
-
-    resize()
-
-    let openingEventSubscriptionId
-    let closedEventSubscriptionId
-    let browserResizedEventSubscriptionId
    return thisObject

    function initialize() {
-        thisObject.sidePanelTab = newSidePanelTab()
-        thisObject.sidePanelTab.tabIcon = UI.projects.foundations.spaces.designSpace.getIconByProjectAndName('Foundations', 'workspace')
-        thisObject.sidePanelTab.tabLabel = 'Workspaces'
-        thisObject.sidePanelTab.container.connectToParent(thisObject.container, false, false)
-        thisObject.sidePanelTab.initialize('left')
-
-        browserResizedEventSubscriptionId = canvas.eventHandler.listenToEvent('Browser Resized', resize)
-
-        initializeListView()
-        isInitialized = true
+   
    }

    function finalize() {
-        canvas.eventHandler.stopListening(browserResizedEventSubscriptionId)
-        thisObject.sidePanelTab.container.eventHandler.stopListening(openingEventSubscriptionId)
-        thisObject.sidePanelTab.container.eventHandler.stopListening(closedEventSubscriptionId)
+
    }

-    function initializeListView() {
-        listView = newListView()
-        listView.initialize()
-        listView.container.connectToParent(thisObject.container, false, false)
-        openingEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('opening', listView.turnOn)
-        closedEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('closed', listView.turnOff)
-    }
+    function getSidePanelTab() {

-    function resize() {
-        thisObject.container.frame.width = SIDE_PANEL_WIDTH
-        thisObject.container.frame.height = browserCanvas.height // - TOP_SPACE_HEIGHT
-        thisObject.container.frame.position.x = -SIDE_PANEL_WIDTH
-        thisObject.container.frame.position.y = 0 // TOP_SPACE_HEIGHT
-
-        if (listView !== undefined) {
-            listView.resize()
-        }
-
-        if (thisObject.sidePanelTab !== undefined) {
-            thisObject.sidePanelTab.resize()
-        }
    }

    function getContainer(point, purpose) {
-        if (thisObject.sidePanelTab === undefined) { return }
-        let container

-        container = thisObject.sidePanelTab.getContainer(point, purpose)
-        if (container !== undefined) { return container }
-
-        container = listView.getContainer(point, purpose)
-        if (container !== undefined) { return container }
-
-        if (thisObject.container.frame.isThisPointHere(point, true) === true) {
-            return thisObject.container
-        } else {
-            return undefined
-        }
    }

    function physics() {
-        thisObject.sidePanelTab.physics()
-        listView.physics()
+ 
    }

    function draw() {
-        if (CAN_SPACES_DRAW === false) { return }
-        if (isInitialized === false) { return }
-        borders()
-        thisObject.sidePanelTab.draw()
-        listView.draw()
-    }
-
-    function borders() {
-        let point1
-        let point2
-        let point3
-        let point4
-
-        point1 = {
-            x: 0,
-            y: 0
-        }
-
-        point2 = {
-            x: thisObject.container.frame.width,
-            y: 0
-        }
-
-        point3 = {
-            x: thisObject.container.frame.width,
-            y: thisObject.container.frame.height
-        }
-
-        point4 = {
-            x: 0,
-            y: thisObject.container.frame.height
-        }
-
-        point1 = thisObject.container.frame.frameThisPoint(point1)
-        point2 = thisObject.container.frame.frameThisPoint(point2)
-        point3 = thisObject.container.frame.frameThisPoint(point3)
-        point4 = thisObject.container.frame.frameThisPoint(point4)
-
-        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.lineTo(point4.x, point4.y)
-        browserCanvasContext.lineTo(point1.x, point1.y)
-        browserCanvasContext.closePath()
-
-        let opacity = 1
-
-        browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.LIGHT_GREY + ', ' + opacity + ''
-        browserCanvasContext.fill()
-
-        browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.GREY + ', ' + opacity + ''
-        browserCanvasContext.lineWidth = 0.3
-        browserCanvasContext.setLineDash([]) // Resets Line Dash
-        browserCanvasContext.stroke()
-
-        /* Shadow */
-
-        if (thisObject.container.status !== 'hidden') {
-            for (let i = 0; i <= 30; i++) {
-                opacity = 1 - (i / 300) - 0.95
-
-                browserCanvasContext.setLineDash([]) // Resets Line Dash
-                browserCanvasContext.beginPath()
-                browserCanvasContext.moveTo(point2.x + i, point2.y)
-                browserCanvasContext.lineTo(point3.x + i, point3.y)
-                browserCanvasContext.closePath()
-
-                browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.BLACK + ', ' + opacity + ''
-                browserCanvasContext.lineWidth = 1
-                browserCanvasContext.setLineDash([]) // Resets Line Dash
-                browserCanvasContext.stroke()
-            }
-        }
+ 
    }
 }
@@ -0,0 +1,173 @@
+function newFoundationsWorkspaceSpace() {
+    const MODULE_NAME = 'Workspace Space'
+    let thisObject = {
+        sidePanelTab: undefined,
+        container: undefined,
+        physics: physics,
+        draw: draw,
+        getContainer: getContainer,
+        initialize: initialize,
+        finalize: finalize
+    }
+
+    let isInitialized = false
+
+    thisObject.container = newContainer()
+    thisObject.container.name = MODULE_NAME
+    thisObject.container.initialize()
+    thisObject.container.isClickeable = true
+    thisObject.container.isDraggeable = false
+    thisObject.container.detectMouseOver = true
+    thisObject.container.status = 'hidden'
+
+    let listView
+
+    resize()
+
+    let openingEventSubscriptionId
+    let closedEventSubscriptionId
+    let browserResizedEventSubscriptionId
+    return thisObject
+
+    function initialize() {
+        thisObject.sidePanelTab = newSidePanelTab()
+        thisObject.sidePanelTab.tabIcon = UI.projects.foundations.spaces.designSpace.getIconByProjectAndName('Foundations', 'workspace')
+        thisObject.sidePanelTab.tabLabel = 'Workspaces'
+        thisObject.sidePanelTab.container.connectToParent(thisObject.container, false, false)
+        thisObject.sidePanelTab.initialize('left')
+
+        browserResizedEventSubscriptionId = canvas.eventHandler.listenToEvent('Browser Resized', resize)
+
+        initializeListView()
+        isInitialized = true
+    }
+
+    function finalize() {
+        canvas.eventHandler.stopListening(browserResizedEventSubscriptionId)
+        thisObject.sidePanelTab.container.eventHandler.stopListening(openingEventSubscriptionId)
+        thisObject.sidePanelTab.container.eventHandler.stopListening(closedEventSubscriptionId)
+    }
+
+    function initializeListView() {
+        listView = newListView()
+        listView.initialize()
+        listView.container.connectToParent(thisObject.container, false, false)
+        openingEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('opening', listView.turnOn)
+        closedEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('closed', listView.turnOff)
+    }
+
+    function resize() {
+        thisObject.container.frame.width = SIDE_PANEL_WIDTH
+        thisObject.container.frame.height = browserCanvas.height // - TOP_SPACE_HEIGHT
+        thisObject.container.frame.position.x = -SIDE_PANEL_WIDTH
+        thisObject.container.frame.position.y = 0 // TOP_SPACE_HEIGHT
+
+        if (listView !== undefined) {
+            listView.resize()
+        }
+
+        if (thisObject.sidePanelTab !== undefined) {
+            thisObject.sidePanelTab.resize()
+        }
+    }
+
+    function getContainer(point, purpose) {
+        if (thisObject.sidePanelTab === undefined) { return }
+        let container
+
+        container = thisObject.sidePanelTab.getContainer(point, purpose)
+        if (container !== undefined) { return container }
+
+        container = listView.getContainer(point, purpose)
+        if (container !== undefined) { return container }
+
+        if (thisObject.container.frame.isThisPointHere(point, true) === true) {
+            return thisObject.container
+        } else {
+            return undefined
+        }
+    }
+
+    function physics() {
+        thisObject.sidePanelTab.physics()
+        listView.physics()
+    }
+
+    function draw() {
+        if (CAN_SPACES_DRAW === false) { return }
+        if (isInitialized === false) { return }
+        borders()
+        thisObject.sidePanelTab.draw()
+        listView.draw()
+    }
+
+    function borders() {
+        let point1
+        let point2
+        let point3
+        let point4
+
+        point1 = {
+            x: 0,
+            y: 0
+        }
+
+        point2 = {
+            x: thisObject.container.frame.width,
+            y: 0
+        }
+
+        point3 = {
+            x: thisObject.container.frame.width,
+            y: thisObject.container.frame.height
+        }
+
+        point4 = {
+            x: 0,
+            y: thisObject.container.frame.height
+        }
+
+        point1 = thisObject.container.frame.frameThisPoint(point1)
+        point2 = thisObject.container.frame.frameThisPoint(point2)
+        point3 = thisObject.container.frame.frameThisPoint(point3)
+        point4 = thisObject.container.frame.frameThisPoint(point4)
+
+        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.lineTo(point4.x, point4.y)
+        browserCanvasContext.lineTo(point1.x, point1.y)
+        browserCanvasContext.closePath()
+
+        let opacity = 1
+
+        browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.LIGHT_GREY + ', ' + opacity + ''
+        browserCanvasContext.fill()
+
+        browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.GREY + ', ' + opacity + ''
+        browserCanvasContext.lineWidth = 0.3
+        browserCanvasContext.setLineDash([]) // Resets Line Dash
+        browserCanvasContext.stroke()
+
+        /* Shadow */
+
+        if (thisObject.container.status !== 'hidden') {
+            for (let i = 0; i <= 30; i++) {
+                opacity = 1 - (i / 300) - 0.95
+
+                browserCanvasContext.setLineDash([]) // Resets Line Dash
+                browserCanvasContext.beginPath()
+                browserCanvasContext.moveTo(point2.x + i, point2.y)
+                browserCanvasContext.lineTo(point3.x + i, point3.y)
+                browserCanvasContext.closePath()
+
+                browserCanvasContext.strokeStyle = 'rgba(' + UI_COLOR.BLACK + ', ' + opacity + ''
+                browserCanvasContext.lineWidth = 1
+                browserCanvasContext.setLineDash([]) // Resets Line Dash
+                browserCanvasContext.stroke()
+            }
+        }
+    }
+}
@@ -3,6 +3,7 @@ function newGobernanceAssetsSpace() {

    let thisObject = {
        container: undefined,
+        sidePanelTab: undefined,
        physics: physics,
        draw: draw,
        getContainer: getContainer,
@@ -17,31 +18,70 @@ function newGobernanceAssetsSpace() {
    return thisObject

    function finalize() {
+        canvas.eventHandler.stopListening(browserResizedEventSubscriptionId)
+        thisObject.sidePanelTab.container.eventHandler.stopListening(openingEventSubscriptionId)
+        thisObject.sidePanelTab.container.eventHandler.stopListening(closingEventSubscriptionId)
+
        thisObject.container.finalize()
        thisObject.container = undefined
    }

    function initialize() {
+        
+        setupSidePanelTab()

+        function setupSidePanelTab() {
+            thisObject.sidePanelTab = newSidePanelTab()
+            thisObject.sidePanelTab.container.connectToParent(thisObject.container, false, false)
+            thisObject.sidePanelTab.tabIcon = UI.projects.foundations.spaces.designSpace.getIconByProjectAndName('Governance', 'governance-tab')
+            thisObject.sidePanelTab.tabLabel = 'Governance'
+            thisObject.sidePanelTab.initialize('right')
+            openingEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('opening', onOpening)
+            closingEventSubscriptionId = thisObject.sidePanelTab.container.eventHandler.listenToEvent('closing', onClosing)
+
+            browserResizedEventSubscriptionId = canvas.eventHandler.listenToEvent('Browser Resized', resize)
+        }
+    }
+
+    function resize() {
+        thisObject.container.frame.width = UI.projects.education.globals.docs.DOCS_SPACE_WIDTH
+        thisObject.container.frame.height = browserCanvas.height // - TOP_SPACE_HEIGHT
+        thisObject.container.frame.position.x = browserCanvas.width
+        thisObject.container.frame.position.y = 0 // TOP_SPACE_HEIGHT
+
+        if (thisObject.sidePanelTab !== undefined) {
+            thisObject.sidePanelTab.resize()
+        }
    }

    function physics() {
        if (UI.projects.foundations.spaces.designSpace.workspace === undefined) { return }
+        thisObject.sidePanelTab.physics()
    }

-    function getContainer(point) {
+    function getContainer(point, purpose) {
+        if (thisObject.sidePanelTab === undefined) { return }
+        let container

-        return undefined // since this space does not draw anything we return here
+        container = thisObject.sidePanelTab.getContainer(point, purpose)
+        if (container !== undefined) { return container }

        if (thisObject.container.frame.isThisPointHere(point, true) === true) {
-            thisObject.container.space = MODULE_NAME
            return thisObject.container
        } else {
            return undefined
        }
    }

-    function draw() {
+    function onOpening() {

    }
+
+    function onClosing() {
+
+    }
+
+    function draw() {
+        thisObject.sidePanelTab.draw()
+    }
 }
@@ -228,8 +228,8 @@
                    "initializationIndex": 0,
                    "animationPhysicsIndex": 1,
                    "animationDrawIndex": 0,
-                    "onMouseWheelIndex": 5,
-                    "onMouseOverIndex": 6,
+                    "onMouseWheelIndex": 6,
+                    "onMouseOverIndex": 7,
                    "onMouseClickIndex": 4,
                    "onMouseDownIndex": 6
                },
@@ -253,8 +253,8 @@
                    "initializationIndex": 2,
                    "animationPhysicsIndex": 0,
                    "animationDrawIndex": 5,
-                    "onMouseWheelIndex": 3,
-                    "onMouseOverIndex": 2,
+                    "onMouseWheelIndex": 4,
+                    "onMouseOverIndex": 3,
                    "onMouseClickIndex": 2,
                    "onMouseDownIndex": 3
                },
@@ -267,7 +267,7 @@
                    "animationPhysicsIndex": 3,
                    "animationDrawIndex": 2,
                    "onMouseWheelIndex": 0,
-                    "onMouseOverIndex": 5,
+                    "onMouseOverIndex": 6,
                    "onMouseClickIndex": 0,
                    "onMouseDownIndex": 1
                },
@@ -279,8 +279,8 @@
                    "initializationIndex": 4,
                    "animationPhysicsIndex": 4,
                    "animationDrawIndex": 3,
-                    "onMouseWheelIndex": 2,
-                    "onMouseOverIndex": 3,
+                    "onMouseWheelIndex": 3,
+                    "onMouseOverIndex": 4,
                    "onMouseClickIndex": 3,
                    "onMouseDownIndex": 4
                },
@@ -292,8 +292,8 @@
                    "initializationIndex": 5,
                    "animationPhysicsIndex": 2,
                    "animationDrawIndex": 1,
-                    "onMouseWheelIndex": 4,
-                    "onMouseOverIndex": 4,
+                    "onMouseWheelIndex": 5,
+                    "onMouseOverIndex": 5,
                    "onMouseClickIndex": 5,
                    "onMouseDownIndex": 5
                },
@@ -305,11 +305,24 @@
                    "initializationIndex": 6,
                    "animationPhysicsIndex": 6,
                    "animationDrawIndex": 6,
-                    "onMouseWheelIndex": 1,
-                    "onMouseOverIndex": 2,
+                    "onMouseWheelIndex": 2,
+                    "onMouseOverIndex": 3,
                    "onMouseClickIndex": 6,
                    "onMouseDownIndex": 0
                },
+                {
+                    "name": "Workspace Space",
+                    "folderName": "Workspace-Space",
+                    "propertyName": "workspaceSpace",
+                    "functionName": "newFoundationsWorkspaceSpace",
+                    "initializationIndex": 7,
+                    "animationPhysicsIndex": 7,
+                    "animationDrawIndex": 7,
+                    "onMouseWheelIndex": 1,
+                    "onMouseOverIndex": 2,
+                    "onMouseClickIndex": 7,
+                    "onMouseDownIndex": 0
+                },            
                {
                    "name": "Chat Space",
                    "folderName": "Chat-Space",