Displaying values of an array using a html table

Post your FreeBASIC source, examples, tips and tricks here. Please don’t post code without including an explanation.
Post Reply
AGS
Posts: 1284
Joined: Sep 25, 2007 0:26
Location: the Netherlands

Displaying values of an array using a html table

Post by AGS »

We all have a web browser on our PC that can function as a (cross - platform) canvas.
The browser is very convenient for displaying data.
This example shows how to display the content of a 1D array (split into rows for 'easier' viewing purposes) using a simple html table.

It uses the 'title' attribute to get a mouse-over effect (when you move the mouse over a cell the array index of that cell will be shown).

Compile/run the program and open the resulting file (/test.html, make sure there is no file /test.html as it will get overwritten) in a browser.

When you rerun the program and press reload (F5?) in the browser you get an updated html table (values will have changed due to use of randomness for array values).

An example of what the output looks like can be found here.

Code: Select all

Function rnd_range (byval first As Double, byval last As Double) As Double
    Function = Rnd * (last - first) + first
End Function

function create_table_i cdecl(byval table as integer ptr, byval size as integer, byval slice as integer) as integer

  dim i as integer

  if (size = 0) then
    return -1
  end if
  
  if (table = 0) then
    return -1
  end if
  
  if (slice = 0 orelse slice > size - 1) then
    return -1
  end if
  
  dim fh as integer = freefile()
  ''change the name of the file!?
  open "/test.html" for output as #fh
  var err_ = err()
  if (err_ <> 0) then
    return -1
  end if
  print #fh, "<!DOCTYPE html>"
  print #fh, "<html>"
  print #fh, "<body>"
  print #fh, "<table border=""1"">"
  print #fh, !"<tr title = \"" & "0" & !"\"" & ">"
  print #fh, !"<td bgcolor=\"grey\" title = \"" & i & !"\">" & i & "</td>"
  while (i < size)
    if (i mod slice = 0 andalso i <> 0) then
      print #fh, "</tr>"
      print #fh, !"<tr title = \"" & i & !"\">"
      print #fh, !"<td bgcolor=\"grey\" title = \"" & i & !"\">" & i & "</td>"
    end if
    print #fh, !"<td title = \"" & i & !"\">" & table[i] & "</td>"
    i += 1
  wend
  print #fh, "</tr>"
  print #fh, "</table>"
  print #fh, "</body>"
  print #fh, "</html>"
  close #fh
  return 0

end function

function mymain() as integer

  const TABLE_SIZE = 100
  const SLICE_SIZE = 10

  dim integer_array as integer ptr = new integer[TABLE_SIZE-1]
  if (integer_array = 0) then
    return -1
  end if
  
  randomize()
  for i as integer = 0 to TABLE_SIZE - 1
    integer_array[i] = Int(rnd_range(69, 421))
  next i
  var error_ = create_table_i(integer_array,TABLE_SIZE,SLICE_SIZE)
  if (error_) then
    return -1
  end if
  delete[] integer_array

end function

var error_ = mymain()
if (error_) then
  print "something went wrong"
end if
Roland Chastain
Posts: 1002
Joined: Nov 24, 2011 19:49
Location: France
Contact:

Re: Displaying values of an array using a html table

Post by Roland Chastain »

Interesting idea and nice example. Thank you !

To run it, I had to make a small modification :

Code: Select all

  'open "/test.html" for output as #fh
  open "test.html" for output as #fh
Roland Chastain
Posts: 1002
Joined: Nov 24, 2011 19:49
Location: France
Contact:

Re: Displaying values of an array using a html table

Post by Roland Chastain »

Roland Chastain wrote: To run it, I had to make a small modification :

Code: Select all

  'open "/test.html" for output as #fh
  open "test.html" for output as #fh
I should have said : to find the file, I had to make a small modification. :-D
creek23
Posts: 261
Joined: Sep 09, 2007 1:57
Location: Philippines
Contact:

Re: Displaying values of an array using a html table

Post by creek23 »

instead of plain HTML, one can also take advantage on how modern browsers display XML data.

See samples:
* http://www.w3schools.com/xml/note.xml
* http://www.w3schools.com/xml/simple.xml

Notice how you can toggle hide/show an element? Or maybe the above HTML Table sample could be modified to include simple toggling of data.

~creek23
Post Reply