text: function newDocSpace() {
      const MODULE_NAME = 'Doc Space'
      let thisObject = {
          sidePanelTab: undefined,
          container: undefined,
          navigateTo: navigateTo,
          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'
  
      resize()
  
      let browserResizedEventSubscriptionId
      let openingEventSubscriptionId
      let closingEventSubscriptionId
  
      return thisObject
  
      function initialize() {
          thisObject.sidePanelTab = newSidePanelTab()
          thisObject.sidePanelTab.container.connectToParent(thisObject.container, false, false)
          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)
  
          isInitialized = true
      }
  
      function finalize() {
          canvas.eventHandler.stopListening(browserResizedEventSubscriptionId)
          thisObject.sidePanelTab.container.eventHandler.stopListening(openingEventSubscriptionId)
          thisObject.sidePanelTab.container.eventHandler.stopListening(closingEventSubscriptionId)
      }
  
      function onOpening() {
          let docIFrame = document.getElementById('docIFrame')
          if (docIFrame.src === "") {
              docIFrame.src = DOCUMENTATION_URL_PREFIX
          }
      }
  
      function onClosing() {
  
      }
  
      function navigateTo(url) {
          let docIFrame = document.getElementById('docIFrame')
          docIFrame.src = url
          thisObject.sidePanelTab.open()
      }
  
      function resize() {
          thisObject.container.frame.width = 1200
          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 getContainer(point, purpose) {
          let container
  
          container = thisObject.sidePanelTab.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()
          docAppDivPhysics()
          iFramePhysics()
  
          function docAppDivPhysics() {
              let docAppDiv = document.getElementById('docApp')
              docAppDivPosition = {
                  x: 0,
                  y: 0
              }
              docAppDivPosition = thisObject.container.frame.frameThisPoint(docAppDivPosition)
              docAppDiv.style = '   ' + 
              'position:fixed; top:' + docAppDivPosition.y + 'px; ' + 
              'left:' + docAppDivPosition.x + 'px; z-index:1; ' + 
              'width: ' + thisObject.container.frame.width + 'px;' +
              'height: ' + thisObject.container.frame.height + 'px'
          }
  
          function iFramePhysics() {
              let docIFrame = document.getElementById('docIFrame')
              docIFrame.style = '  ' + 
              'width: ' + thisObject.container.frame.width + 'px;' +
              'height: ' + thisObject.container.frame.height + 'px'
          }
      }
  
      function draw() {
          if (canWeDraw === false) { return }
          if (isInitialized === false) { return }
          borders()
          thisObject.sidePanelTab.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([0, 0])
          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.stroke()
  
          /* Shadow */
  
          if (thisObject.container.status !== 'hidden') {
              for (let i = 0; i <= 30; i++) {
                  opacity = 1 - (i / 300) - 0.95
  
                  browserCanvasContext.setLineDash([0, 0])
                  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.stroke()
              }
          }
      }
  }
  