Tabulator Array JS

Just starting out? Need help? Post your questions and find answers here.
skinkairewalker
Posts: 125
Joined: Tue Jun 14, 2016 7:17 pm

Re: Tabulator Array JS

Post by skinkairewalker »

all show : undefined

screenshot - https://prnt.sc/r70pqu

fullcode>

Code: Select all

XIncludeFile "Tabulator.sbi"

ExamineDesktops()
Global deskwidth.i = DesktopWidth(0)
Global deskheight.i = DesktopHeight(0)

Enumeration
  #HWindow
  #myWindow
  #myTabulatorGadget
EndEnumeration

Structure sItem
  id.s
  partida.s
  xdata.s
  hora.s
  casa.s
  emp.s
  fora.s
  amb.s
  plusonefive.s
  plus.s
  gender.s
EndStructure

Global NewList Items.sItem()

Procedure TabulatorEvents(o)
  
  Select EventType()
    Case Tabulator::#EventType_RowClick
      Debug "#EventType_RowClick"
      Protected SelectedRow.sItem
      Protected Items.s
      ! v_selectedrow = v_o.row.row.data;
      
     Debug SelectedRow\id
      Debug SelectedRow\partida
      Debug SelectedRow\xdata
      Debug SelectedRow\hora
      Debug SelectedRow\casa
      Debug SelectedRow\emp
      Debug SelectedRow\fora
      Debug SelectedRow\amb
      Debug SelectedRow\plusonefive
      Debug SelectedRow\plus
      Debug SelectedRow\gender
      
    Case Tabulator::#EventType_RowDblClick
      Debug "#EventType_RowDblClick"
    Case Tabulator::#EventType_RowContext
      Debug "#EventType_RowContext"
    Default
      Debug "EventType(): " + EventType()
  EndSelect
  
  Debug "---------------------------"
  
EndProcedure

Procedure SizeWindowEvent()
  
  ResizeGadget(#myTabulatorGadget, 0, 0, WindowWidth(#myWindow) - 20, WindowHeight(#myWindow) - 20)
  
EndProcedure

Procedure LineFormatter(cell, formatterParams)
  
  ! setTimeout(function() { // give cell enough time to be added to the DOM before calling sparkline formatter
  !   if (v_cell) {
  !     v_cell.getElement().sparkline(v_cell.getValue(), {width:"100%", type:"line", disableTooltips:false});
  !   }
  ! }, 10);
  
EndProcedure

Procedure HttpLoadPartidas(Success, Result$, UserData)
    If Success
      Debug "RESULTADO = "+Result$
      
      Protected amountPartidas.i = Val(StringField(Result$,1,"|"))
      
      Protected Options
  
  ! v_options = {
  !   progressiveRender:true, //enable progressive rendering
  !   groupBy: 'gender',
  !   // selectable: true, // see: http://olifolkerd.github.io/tabulator/docs/#selectable
  !   layout:'fitDataFill'
  ! }  
  
  Tabulator::BindGadget(#myTabulatorGadget, Options)
  
  Tabulator::BindTabulatorEvent(#myTabulatorGadget, @TabulatorEvents())
  
  Define *myColumn.Tabulator::sColumn
  
  NewList Columns.Tabulator::sColumn()
  
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title   = "Partida"
  *myColumn\field   = "partida"
  *myColumn\width   = 300
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "Data"
  *myColumn\field     = "xdata"
  ;*myColumn\width     = 100
  
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "Hora"
  *myColumn\field     = "hora"
 ;*myColumn\width     = 100
  ;*myColumn\formatter = Tabulator::#Formatter_Progress
  ;*myColumn\sorter    = Tabulator::#Sorter_Number
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title = "Casa"
  *myColumn\field = "casa"
 ; *myColumn\width     = 100
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title           = "Emp."
  *myColumn\field           = "emp"
; *myColumn\width     = 100
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "Fora"
  *myColumn\field     = "fora"
;*myColumn\width     = 100
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "Amb."
  *myColumn\field     = "amb"
 ;*myColumn\width     = 100
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "+1.5"
  *myColumn\field     = "plusonefive"
;*myColumn\width     = 100
  
  *myColumn = Tabulator::InitColumn(AddElement(Columns()))
  *myColumn\title     = "+"
  *myColumn\field     = "plus"
;*myColumn\width     = 100
  
  Tabulator::SetAttribute2(#myTabulatorGadget, Tabulator::#TabulatorColumns, Columns())
  
 Protected partidas.s = StringField(Result$,2,"|")

For i = 1 To amountPartidas  
  
  tnpPartida.s = StringField(partidas,i,";")
  
  AddElement(Items())
  Items()\id = StringField(tnpPartida,1,"*")
  Items()\partida = StringField(tnpPartida,2,"*") + " X " + StringField(tnpPartida,3,"*") 
  Items()\xdata = StringField(tnpPartida,4,"*")
  Items()\hora = StringField(tnpPartida,5,"*")
  Items()\casa = StringField(tnpPartida,10,"*")
  Items()\emp = StringField(tnpPartida,11,"*")
  Items()\fora = StringField(tnpPartida,12,"*")
  Items()\amb = StringField(tnpPartida,13,"*")
  Items()\plusonefive = StringField(tnpPartida,14,"*")
  Items()\plus = "Ver Mais"
  Items()\gender = StringField(tnpPartida,6,"*")+": "+StringField(tnpPartida,7,"*")

Next i

; ... and so on

Define SampleData2.s

CreateJSON(0)
InsertJSONList(JSONValue(0), Items())
SampleData2 = ComposeJSON(0)
FreeJSON(0)

Debug SampleData2
  
  Protected SampleData

  ! v_sampledata = v_sampledata2;  

  
  Tabulator::SetAttribute(#myTabulatorGadget, Tabulator::#TabulatorData, SampleData)
      
    Else
      Debug "HTTPLoadPartidas(): Error"
    EndIf
EndProcedure


Procedure Main()
  
  If OpenWindow(#HWindow, 0, 0, deskwidth, ImageHeight(0), "Goiás Fut", #PB_Window_BorderLess)
    ImageGadget(0,0,0,ImageWidth(0),ImageHeight(0),ImageID(0))
  EndIf
  
  OpenWindow(#myWindow, 0, WindowHeight(#HWindow), deskwidth, deskheight - WindowHeight(#HWindow), "TabulatorDemo", #PB_Window_BorderLess)
  
  BindEvent(#PB_Event_SizeWindow, @SizeWindowEvent(), #myWindow)
  
  ContainerGadget(#myTabulatorGadget, 0, 0, WindowWidth(#myWindow) - 20, WindowHeight(#myWindow) - 20) : CloseGadgetList()
  
  HTTPRequest(#PB_HTTP_Post, "/getdata.php", "", @HttpLoadPartidas())
  
EndProcedure


Procedure Loading(Type, Filename$)
  Static NbLoadedElements
  
  NbLoadedElements+1
  If NbLoadedElements = 1 ; Finished the loading of all images and sounds, we can start the applications
    Tabulator::Init(@Main()) ; using standard-style (#Style_Tabulator)
  EndIf
EndProcedure

Procedure.d Porcentagem(porcentagem.d,valor.d)
 ; Debug (Porcentagem*valor)/100
  ProcedureReturn (Porcentagem*valor)/100
EndProcedure  

Procedure LoadingError(Type, Filename$)
  Debug Filename$ + ": loading error"
EndProcedure  

LoadImage(0,"resources/logo.png")

BindEvent(#PB_Event_Loading, @Loading())
BindEvent(#PB_Event_LoadingError, @LoadingError())


User avatar
Peter
Posts: 1206
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1:9080
Contact:

Re: Tabulator Array JS

Post by Peter »

ok, we need a procedure to 'convert' the JavaScript-Structure to a SpiderBasic-Structure:

Code: Select all

Procedure JavaScriptStructureToSpiderBasicStructure(o)
  
! for (var property in v_o) {
!   if (v_o.hasOwnProperty(property)) {
!     if (typeof property != 'undefined') {
!       v_o["_" + property] = v_o[property];
!     }
!   }
! }  
  
EndProcedure


Procedure TabulatorEvents(o)
  
  Select EventType()
    Case Tabulator::#EventType_RowClick
      Debug "#EventType_RowClick"
      
      Protected SelectedRow.sItem
      
      ! v_selectedrow = v_o.row.row.data;
      
      JavaScriptStructureToSpiderBasicStructure(SelectedRow)
      
      Debug SelectedRow\id
      Debug SelectedRow\partida
      Debug SelectedRow\xdata
      Debug SelectedRow\hora
      Debug SelectedRow\casa
      Debug SelectedRow\emp
      Debug SelectedRow\fora
      Debug SelectedRow\amb
      Debug SelectedRow\plusonefive
      Debug SelectedRow\plus
      Debug SelectedRow\gender
      
    Case Tabulator::#EventType_RowDblClick
      Debug "#EventType_RowDblClick"
    Case Tabulator::#EventType_RowContext
      Debug "#EventType_RowContext"
    Default
      Debug "EventType(): " + EventType()
  EndSelect
  
  Debug "---------------------------"
  
EndProcedure
skinkairewalker
Posts: 125
Joined: Tue Jun 14, 2016 7:17 pm

Re: Tabulator Array JS

Post by skinkairewalker »

Peter wrote:ok, we need a procedure to 'convert' the JavaScript-Structure to a SpiderBasic-Structure:

Code: Select all

Procedure JavaScriptStructureToSpiderBasicStructure(o)
  
! for (var property in v_o) {
!   if (v_o.hasOwnProperty(property)) {
!     if (typeof property != 'undefined') {
!       v_o["_" + property] = v_o[property];
!     }
!   }
! }  
  
EndProcedure


Procedure TabulatorEvents(o)
  
  Select EventType()
    Case Tabulator::#EventType_RowClick
      Debug "#EventType_RowClick"
      
      Protected SelectedRow.sItem
      
      ! v_selectedrow = v_o.row.row.data;
      
      JavaScriptStructureToSpiderBasicStructure(SelectedRow)
      
      Debug SelectedRow\id
      Debug SelectedRow\partida
      Debug SelectedRow\xdata
      Debug SelectedRow\hora
      Debug SelectedRow\casa
      Debug SelectedRow\emp
      Debug SelectedRow\fora
      Debug SelectedRow\amb
      Debug SelectedRow\plusonefive
      Debug SelectedRow\plus
      Debug SelectedRow\gender
      
    Case Tabulator::#EventType_RowDblClick
      Debug "#EventType_RowDblClick"
    Case Tabulator::#EventType_RowContext
      Debug "#EventType_RowContext"
    Default
      Debug "EventType(): " + EventType()
  EndSelect
  
  Debug "---------------------------"
  
EndProcedure
thanks you very much !!!!
Post Reply