@@ -10,10 +10,12 @@ async function loadQueries() {
1010function addToQueries ( item , index ) {
1111 var container = document . createElement ( "div" )
1212 container . id = "query" + index
13- container . className = "vFlexContainer queryElement"
13+ container . className = "hFlexContainer queryElement"
1414
15- var parameters = document . createElement ( "div" )
16- parameters . className = "hFlexContainer"
15+
16+ var span = document . createElement ( "span" )
17+ span . innerHTML = item . name
18+ container . appendChild ( span )
1719
1820 item . parameters . forEach ( ( param , index ) => {
1921 if ( item . types [ index ] == "jakarta.data.Sort" ) {
@@ -23,103 +25,115 @@ function addToQueries(item, index) {
2325 input . placeholder = param
2426 }
2527 input . setAttribute ( "jtype" , item . types [ index ] )
26- parameters . appendChild ( input )
28+ container . appendChild ( input )
2729 } )
2830
29- container . appendChild ( parameters )
30-
3131 var button = document . createElement ( "button" )
32- button . setAttribute ( "onclick" , "callQuery(" + index + ")" )
33- button . innerHTML = item . name
32+ button . setAttribute ( "onclick" , "callQuery(" + index + ")" )
33+ button . alt = "Run the " + item . name + "query"
34+ button . innerHTML = "➜"
3435
3536 container . appendChild ( button )
3637
3738 var node = document . getElementById ( "querySection" )
3839 node . appendChild ( container )
39-
40- }
40+
41+ }
4142
4243async function callQuery ( index ) {
4344 var node = document . getElementById ( "query" + index )
44-
45+
4546 var query = { }
46- query . method = node . getElementsByTagName ( "button" ) [ 0 ] . innerHTML
47- var inputs = node . getElementsByTagName ( "div" ) [ 0 ]
47+ query . method = node . querySelector ( "span" ) . innerHTML
4848
4949 //Process Inputs
5050 var params = [ ]
5151 var types = [ ]
52- console . log ( inputs . children )
53- console . log ( Array . from ( inputs . children ) )
54- Array . from ( inputs . children ) . forEach ( input => {
52+ console . log ( node )
53+
54+ console . log ( node . children )
55+ console . log ( Array . from ( node . children ) )
56+ Array . from ( node . children ) . forEach ( input => {
5557 console . log ( input . tagName )
5658 if ( input . tagName == "INPUT" ) { //input
57- params . push ( input . value )
59+ params . push ( input . value )
60+ types . push ( input . getAttribute ( "jtype" ) )
5861 } else if ( input . tagName == "DIV" ) { //sort
5962 var text = ""
6063 input . childNodes . forEach ( select => {
61- if ( text == "" )
64+ if ( text == "" )
6265 text = select . options [ select . selectedIndex ] . text
6366 else text = text + " " + select . options [ select . selectedIndex ] . text
64- } )
67+ } )
6568 params . push ( text )
69+ types . push ( input . getAttribute ( "jtype" ) )
6670 }
67- types . push ( input . getAttribute ( "jtype" ) )
71+
6872 } )
6973
74+
7075 query . parameters = params
7176 query . types = types
77+ console . log ( query )
7278
7379 //Return json object
7480 const response = await fetch ( "shipping/packageQuery" , {
75- method : "POST" ,
76- headers : {
77- "Content-Type" : "application/json"
78- } ,
79- body : JSON . stringify ( query ) ,
80- } )
81+ method : "POST" ,
82+ headers : {
83+ "Content-Type" : "application/json"
84+ } ,
85+
86+ body : JSON . stringify ( query ) ,
87+ } )
8188
8289 processResponse ( response )
8390}
8491
8592
8693async function processResponse ( response ) {
87- if ( response . ok ) {
88- const body = await response . text ( ) ;
94+ if ( response . ok ) {
95+ const body = await response . text ( ) ;
8996 console . log ( body )
90- if ( body . length > 0 ) {
97+ if ( body . length > 0 ) {
9198 var node = document . getElementById ( "resultsSection" )
92- node . replaceChildren ( ) //clear the results section
99+ node . style = "" //Make the results section visible
93100
94101 try { //Return useful server exception to user
95102 var json = JSON . parse ( body )
103+ console . log ( json )
96104 } catch ( error ) {
97105 var div = document . createElement ( "div" )
98106 div . innerHTML = body
99107 node . appendChild ( div )
100108 }
101109
110+ var table = document . getElementById ( "tableBody" )
111+ var length = table . rows . length
112+ for ( let i = 0 ; i < length ; i ++ ) table . deleteRow ( 0 ) //clear table
113+
114+ console . log ( "removed table" )
102115 for ( m of json ) {
103- var div = document . createElement ( "div ")
104- div . innerHTML = "id = " + m . id ;
105- div . innerHTML += " length = " + m . length ;
106- div . innerHTML += " width = " + m . width ;
107- div . innerHTML += " height = " + m . height ;
108- div . innerHTML += " destination = " + m . destination ;
109- node . appendChild ( div )
116+ console . log ( "inserting row ")
117+ var row = table . insertRow ( )
118+ row . insertCell ( ) . innerHTML = m . id ;
119+ row . insertCell ( ) . innerHTML = m . length ;
120+ row . insertCell ( ) . innerHTML = m . width ;
121+ row . insertCell ( ) . innerHTML = m . height ;
122+ row . insertCell ( ) . innerHTML = m . destination ;
110123 }
111- }
112- } else {
113- toast ( "Error! TODO better message" , 0 )
114- }
124+ }
125+ } else {
126+ const message = await response . text ( ) ;
127+ toast ( message , 0 )
128+ }
115129
116130 console . log ( response ) ;
117131}
118132
119133function sortDropDown ( options ) {
120134 var div = document . createElement ( "div" )
121135 var params = document . createElement ( "select" )
122-
136+
123137 var options = [ "id" , "length" , "width" , "height" , "destination" ]
124138 options . forEach ( input => {
125139 var option = document . createElement ( "option" )
@@ -141,8 +155,8 @@ function sortDropDown(options) {
141155}
142156
143157function toast ( message , index ) {
144- var length = 3000 ;
145- var toast = document . getElementById ( "toast" ) ;
146- setTimeout ( function ( ) { toast . innerText = message ; toast . className = "show" ; } , length * index ) ;
147- setTimeout ( function ( ) { toast . className = toast . className . replace ( "show" , "" ) ; } , length + length * index ) ;
158+ var length = 6000 ;
159+ var toast = document . getElementById ( "toast" ) ;
160+ setTimeout ( function ( ) { toast . innerText = message ; toast . className = "show" ; } , length * index ) ;
161+ setTimeout ( function ( ) { toast . className = toast . className . replace ( "show" , "" ) ; } , length + length * index ) ;
148162}
0 commit comments