moved download button

src/core/Global.ttslua

@@ -43,10 +43,21 @@ local hideTitleSplashWaitFunctionId = nil
 -- online functionality related variables
 local MOD_VERSION = "3.3.0"
 local SOURCE_REPO = 'https://raw.githubusercontent.com/chr1z93/loadable-objects/main'
-local library, requestObj, modMeta, notificationVisible, latestPreviewUpdate
+local library, requestObj, modMeta, contentToShow, currentListItem
-local downloadWindowVisible = false
-local optionPanelVisible = false
 local acknowledgedUpgradeVersions = {}
+local xmlVisibility = {
+  updateNotification = false,
+  downloadWindow = false,
+  previewWindow = false,
+  optionPanel = false
+}
+local idTable = {
+  tab1 = "campaigns",
+  tab2 = "scenarios",
+  tab3 = "fanmadeCampaigns",
+  tab4 = "fanmadeScenarios",
+  tab5 = "fanmadePlayerCards"
+}
 
 -- optionPanel data
 optionPanel = {}
@@ -626,30 +637,58 @@ end
 -- Content Importing and XML functions
 ---------------------------------------------------------
 
--- forwards the requested content type to the update function
+-- forwards the requested content type to the update function and sets highlight to clicked tab
----@param player LuaPlayer Player that triggered this
----@param contentToShow String Name of the content type to show
 ---@param id String Id of the clicked tab
-function onClick_tab(player, contentToShow, id)
+function onClick_tab(_, _, id)
-  -- sets highlight to clicked tab
+  local contentToShow
-  local idTable = {"tab1", "tab2","tab3","tab4","tab5"}
+  for listId, listContent in pairs(idTable) do
-  for _, listId in ipairs(idTable) do
     if listId == id then
       UI.setClass(listId, 'downloadTab activeTab')
+      contentToShow = listContent
     else
       UI.setClass(listId, 'downloadTab')
     end
   end
   update_list(contentToShow)
+
+  -- select the first item
+  Wait.time(function() onClick_select(_, _, contentToShow .. "_1") end, 0.1)
 end
 
 -- click function for the items in the download window
-function onClick_select(player, param)
+-- updates backgroundcolor for row panel and fontcolor for list item
-  local parsed = parseKey(param) or {}
+function onClick_select(_, _, id)
-  local contentToShow = parsed.contentToShow
+  if currentListItem then
-  local index = parsed.index
+    UI.setAttribute("panel" .. currentListItem, "color", "clear")
-  if not contentToShow or not index then return end
+    UI.setAttribute(contentToShow .. "_" .. currentListItem, "color", "white")
-  startContentDownload(library[contentToShow][index])
+  end
+  
+  -- update contentToShow & currentListItem
+  parseKey(id)
+  UI.setAttribute("panel" .. currentListItem, "color", "grey")
+  UI.setAttribute(contentToShow .. "_" .. currentListItem, "color", "black")
+
+  updateAndShowPreviewWindow()
+end
+
+-- parses the identification key (contentToShow_currentListItem)
+function parseKey(unparsedStr)
+  contentToShow = nil
+  currentListItem = nil
+  for str in string.gmatch(unparsedStr, "([^_]+)") do
+    if not contentToShow then
+      -- grab the first part to know the content type
+      contentToShow = str
+    else
+      -- get the index
+      currentListItem = tonumber(str)
+      break
+    end
+  end
+end
+
+function onClick_download()
+  startContentDownload(library[contentToShow][currentListItem])
 end
 
 -- download requested content
@@ -660,11 +699,20 @@ function startContentDownload(param)
 end
 
 function downloadCoroutine()
+  -- show progress bar
+  UI.setAttribute('download_button', 'active', false)
+  UI.setAttribute('download_progress', 'active', true)
+
+  -- update progress bar
   while requestObj do
     UI.setAttribute('download_progress', 'percentage', requestObj.download_progress * 100)
     coroutine.yield(0)
   end
   UI.setAttribute('download_progress', 'percentage', 100)
+
+  -- hide progress bar
+  UI.setAttribute('download_button', 'active', true)
+  UI.setAttribute('download_progress', 'active', false)
   return 1
 end
 
@@ -675,46 +723,33 @@ function onClick_toggleUi(player, title)
   if title == "Navigation Overlay" then
     navigationOverlayApi.cycleVisibility(player.color)
   elseif title == "Downloadable Content" then
-    if downloadWindowVisible then
+    if xmlVisibility.downloadWindow then
       UI.hide('downloadWindow')
       UI.hide("previewWindow")
     else
+      if xmlVisibility.previewWindow then
+        UI.show("previewWindow")
+      end
       UI.show('downloadWindow')
     end
-    downloadWindowVisible = not downloadWindowVisible
+    xmlVisibility.downloadWindow = not xmlVisibility.downloadWindow
   elseif title == "Options" then
-    if optionPanelVisible then
+    if xmlVisibility.optionPanel then
       UI.hide('optionPanel')
     else
       UI.show('optionPanel')
     end
-    optionPanelVisible = not optionPanelVisible
+    xmlVisibility.optionPanel = not xmlVisibility.optionPanel
   end
 end
 
--- hides the content preview window when moving the mouse out of the main window
+-- updates + shows the preview window
-function onMouseExit_window()
+function updateAndShowPreviewWindow()
+  xmlVisibility.previewWindow = false
   UI.hide("previewWindow")
-end
-
--- updates the preview window when mousing over any item in the table
-function onMouseEnter_item(player, param)
-  -- only update once per request
-  if param == latestPreviewUpdate then return end
-  latestPreviewUpdate = param
-
-  -- hide window in case data is incomplete
-  UI.hide("previewWindow")
-
-  -- parse parameters
-  local parsed = parseKey(param) or {}
-  local contentToShow = parsed.contentToShow
-  local index = parsed.index
-
-  if not contentToShow or not index then return end
 
   -- get metadata from library
-  local item = library[contentToShow][index]
+  local item = library[contentToShow][currentListItem]
 
   -- error handling (only author + description can by empty)
   if not item
@@ -759,17 +794,17 @@ function onMouseEnter_item(player, param)
   -- update the preview window height according to box size
   local hWindow, hArt, offsetXY
   if item.boxsize == "big" then
-    hWindow = 510
+    hWindow = 560
     hArt = 300
-    offsetXY = "-510 135"
+    offsetXY = "-476 120"
   elseif item.boxsize == "small" then
-    hWindow = 510
+    hWindow = 560
     hArt = 300
-    offsetXY = "-510 135"
+    offsetXY = "-476 120"
   elseif item.boxsize == "wide" then
-    hWindow = 360
+    hWindow = 410
     hArt = 150
-    offsetXY = "-510 210"
+    offsetXY = "-476 195"
   end
 
   UI.setAttributes("previewArtMask", maskData)
@@ -780,28 +815,10 @@ function onMouseEnter_item(player, param)
   })
 
   -- show the window
+  xmlVisibility.previewWindow = true
   UI.show("previewWindow")
 end
 
--- parses the identification key (contentToShow_index) and returns the result
-function parseKey(unparsedStr)
-  local contentToShow, index
-  for str in string.gmatch(unparsedStr, "([^_]+)") do
-    if not contentToShow then
-      -- grab the first part to know the content type
-      contentToShow = str
-    else
-      -- get the index
-      index = tonumber(str)
-      break
-    end
-  end
-  return {
-    contentToShow = contentToShow,
-    index = index
-  }
-end
-
 -- formats the json response from the webrequest into a key-value lua table
 -- strips the prefix from the community content items
 function formatLibrary(json_response)
@@ -852,31 +869,27 @@ function update_list(contentToShow)
   UI.setValue("title", "Downloadable Content: " .. cleanName[contentToShow])
 
   -- addition of list items according to library file
-  local childrenTable = {}
+  local ui = UI.getXmlTable()
+  local update_point = find_tag_with_id(ui, 'ui_update_point')
+  update_point.children = {}
   for i, v in ipairs(library[contentToShow]) do
-    local key = contentToShow .. "_" .. i
+    table.insert(update_point.children,
-    table.insert(childrenTable,
       {
+        tag = "Panel",
+        attributes = { id = "panel" .. i },
+        children = {
           tag = 'Text',
           value = v.name,
           attributes = {
-          onClick = 'onClick_select(' .. key .. ')',
+            id = contentToShow .. "_" .. i,
-          onMouseEnter = "onMouseEnter_item(" .. key .. ")",
+            onClick = 'onClick_select',
             alignment = 'MiddleLeft'
           }
+        }
       })
   end
 
-  local ui = UI.getXmlTable()
+  update_point.attributes.height = #update_point.children * 25
-  local update_point = find_tag_with_id(ui, 'ui_update_point')
-  update_point.children = {
-      tag = 'VerticalLayout',
-      attributes = {
-        padding = "10 10 0 0"
-      },
-      children = childrenTable
-    }
-  update_point.attributes.height = #childrenTable * 24
   UI.setXmlTable(ui)
 end
 
@@ -920,7 +933,7 @@ function complete_obj_download(request, param)
 end
 
 -- the download button on the placeholder objects calls this to directly initiate a download
----@param param Table contains url and guid of replacement object, which happens to match what onClick_select wants
+---@param param Table contains url and guid of replacement object
 function placeholder_download(param)
   startContentDownload(param)
 end
@@ -1287,12 +1300,12 @@ end
 
 -- triggered by clicking on the Finn Icon
 function onClick_FinnIcon()
-  if notificationVisible then
+  if xmlVisibility.updateNotification then
     UI.hide("updateNotification")
-    notificationVisible = false
+    xmlVisibility.updateNotification = false
   else
     UI.show("updateNotification")
-    notificationVisible = true
+    xmlVisibility.updateNotification = true
   end
 end
 

xml/Global/DownloadWindow.xml

@@ -3,6 +3,7 @@
   <Button class="downloadTab"
     hoverClass="hover"
     pressClass="press"
+    onClick="onClick_tab"
     color="#888888"
     fontSize="24"
     font="font_teutonic-arkham"/>
@@ -10,7 +11,8 @@
     color="grey"/>
   <Button class="press"
     color="white"/>
-
+  <Button class="select"
+    color="white"/>
   <Button class="activeTab"
     color="#ffffff"/>
 </Defaults>
@@ -21,8 +23,8 @@
   color="black"
   active="false"
   onMouseExit="onMouseExit_window"
-  width="700"
+  width="650"
-  height="780"
+  height="800"
   outlineSize="1 1"
   outline="#303030">
 
@@ -50,42 +52,30 @@
     padding="5"
     spacing="5">
     <Button class="downloadTab activeTab"
-      id="tab1"
+      id="tab1">Official Campaigns</Button>
-      onClick="onClick_tab(campaigns)">Official Campaigns</Button>
     <Button class="downloadTab"
-      id="tab2"
+      id="tab2">Official Scenarios</Button>
-      onClick="onClick_tab(scenarios)">Official Scenarios</Button>
     <Button class="downloadTab"
-      id="tab3"
+      id="tab3">Fan-Made Campaigns</Button>
-      onClick="onClick_tab(fanmadeCampaigns)">Fan-Made Campaigns</Button>
     <Button class="downloadTab"
-      id="tab4"
+      id="tab4">Fan-Made Scenarios</Button>
-      onClick="onClick_tab(fanmadeScenarios)">Fan-Made Scenarios</Button>
     <Button class="downloadTab"
-      id="tab5"
+      id="tab5">Fan-Made Player Cards</Button>
-      onClick="onClick_tab(fanmadePlayerCards)">Fan-Made Player Cards</Button>
   </HorizontalLayout>
 
   <!-- content list -->
   <VerticalScrollView color="transparent"
     minHeight="100"
     flexibleHeight="100"
-    scrollSensitivity="24">
+    scrollSensitivity="25"
-    <Panel id="ui_update_point">
+    scrollbarColors="grey|grey|#C8C8C8|rgba(0.78,0.78,0.78,0.5)"
+    horizontalScrollbarVisibility="AutohideAndExpandViewport">
+    <VerticalLayout id="ui_update_point"
+      padding="10 25 0 0"
+      spacing="1">
       <!-- this will be filled via scripting -->
-    </Panel>
+    </VerticalLayout>
   </VerticalScrollView>
-
-  <!-- download progress bar -->
-  <Panel preferredHeight="50"
-    padding="5">
-    <ProgressBar id="download_progress"
-      height="40"
-      percentage="0"
-      color="#111111"
-      textColor="#aaaaaa"
-      fillImageColor="#333333"/>
-  </Panel>
 </VerticalLayout>
 
 <!-- content preview window (displayed on hover of list items) -->
@@ -94,11 +84,11 @@
   color="black"
   active="false"
   width="300"
-  height="510"
+  height="560"
   padding="15 15 5 5"
   outlineSize="1 1"
   outline="#303030"
-  offsetXY="-510 135">
+  offsetXY="-476 120">
 
   <!-- header -->
   <VerticalLayout preferredHeight="100">
@@ -142,4 +132,28 @@
       fontSize="20"
       font="font_teutonic-arkham">PreviewDescription</Text>
   </Panel>
+
+  <!-- download button / progress bar (visibility handled by lua code)-->
+  <Panel preferredHeight="50"
+    padding="5">
+    <!-- download progress bar -->
+    <ProgressBar id="download_progress"
+      active="false"
+      height="40"
+      percentage="0"
+      color="#111111"
+      textColor="#aaaaaa"
+      fillImageColor="#333333"/>
+    <!-- download button -->
+    <Button id="download_button"
+      hoverClass="hover"
+      pressClass="press"
+      selectClass="select"
+      onClick="onClick_download"
+      color="#888888"
+      height="40"
+      width="250"
+      fontSize="24"
+      font="font_teutonic-arkham">Download</Button>
+  </Panel>
 </VerticalLayout>