The core for scrollbar system in CC

scrollbar.lua

--[[

Given the height of the associated work area, and the height of the viewport you can create a scrollbar where the entirety
of it's scope represents the entire document, where the size of the handle represents the viewport. The problem comes in when
the document is so long, that the linked scroll handle would be too small. The way to solve that problem is to simply have a
minimum length for the handle, The logic will still stay the same since the defines of the area is enclosed by the top of the
scroll handle. And when the handle reaches the very bottom, then you can adjust so that the bottom of the document is viewed.

]]

local workHeight = 100 --lets say 100 cc pixels
local viewPort = 19 --CC's constant
local scrollHandleLength = math.ceil((viewPort*viewPort)/workHeight) 
-- No min is required since it (theoretically) should never be 0, although if you're concerned about fpp then uncomment
-- scrollHandleLength = scrollHandleLength > 0 and scrollHandleLength or 1                             -- <<< this Line
-- Right now we're standing at 3.64^>[4] cc pixels, which sounds about right, (20/100 ish, so 1/5, and 1/5 of 19 is 3.8)

local docProgress = 0 --How many lines we are scrolled down

local XPos = 51 --Hardcoded for now

local theme = {
  bg = colors.lightGray,
  unsel = colors.white,
  sel = colors.cyan,
  intext = colors.gray,
  inhtext = colors.white
}

local buffer = {}
for i=1,viewPort do
  buffer[i] = true --Simple dirty buffer implementation
end

local function clamp(val, min, max)
  if val <= min then return min
  elseif val >= max then return max
  else return val end
end

local beingHeld = false
local function drawScrollbar()
  local barStart = clamp((docProgress/workHeight)*viewPort,1,viewPort)
  local barEnd = barStart + scrollHandleLength - 1
  term.setTextColor(theme.intext)
  for i=1,viewPort do
    if buffer[i] then
      local inside = (i >= barStart and i <= barEnd)
      local col = inside and (beingHeld and theme.sel or theme.unsel) or theme.bg
      term.setBackgroundColor(col)
      term.setCursorPos(XPos, i)
      term.write(inside and "=" or " ")
    end
  end
end

drawScrollbar()
os.pullEvent()

--TODO: Make it scroll :P