luisgulo/gambas-source-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix WebTree selection, and how WebTextBox and WebTextArea changes are handled. Add server port to the session cookie.

Browse Source 
[GB.WEB.GUI]
* BUG: Session: Add the server port to the session cookie.
* BUG: WebTree: The Clear() method correctly triggers a refresh.
* OPT: WebTree: Don't trigger useless refreshes when selection changes.
* BUG: Accumulates WebTextBox and WebTextArea changes, and send them just before the next request.
This commit is contained in:
Benoît Minisini 2022-09-24 02:21:34 +02:00
parent ec937fcbd6
commit 86539be37f
10 changed files with 115 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
comp/src/gb.web.gui/.project
View File

@ -1,6 +1,6 @@
# Gambas Project File 3.0
Title=Web application development using processes as session
Startup=FTestDrawingArea
Startup=Webform1
Icon=.hidden/webform.png
Version=3.17.90
VersionFile=1

2
comp/src/gb.web.gui/.src/Session.module
View File

@ -46,7 +46,7 @@ Private Sub MakeSessionId() As String
If $sPrefix Then
sId = $sPrefix & ":" & sId
Else
sId = CGI["REMOTE_ADDR"] & ":" & sId
sId = CGI["REMOTE_ADDR"] & ":" & CGI["SERVER_PORT"] & ":" & sId
Endif
Return sId

6
comp/src/gb.web.gui/.src/Test/Webform1.class
View File

@ -347,3 +347,9 @@ Public Sub WebComboBox1_KeyPress()
WebForm.Print("WebComboBox1: keypress: " & Key.Shortcut)
End
Public Sub WebTree1_Activate()
lblTreeEvent.Text = "Activate: " & WebTree1.Item.Key
End

57
comp/src/gb.web.gui/.src/Test/Webform1.webform
View File

@ -1,7 +1,7 @@
# Gambas Form File 3.0
{ WebForm WebForm
#MoveScaled(0,0,138,91)
#MoveScaled(0,0,133,91)
Height = "100%"
Arrangement = Arrange.Vertical
Shortcuts = ["F11"]
@ -67,7 +67,7 @@
}
}
{ WebTabPanel1 WebTabPanel
#MoveScaled(1,1,136,72)
#MoveScaled(1,1,131,72)
Expand = True
Arrangement = Arrange.Vertical
Margin = True
@ -76,7 +76,7 @@
Index = 0
Text = ("Tab 1")
{ WebHBox1 WebHBox
#MoveScaled(1,1,133.75,6)
#MoveScaled(1,1,128.75,6)
Spacing = True
{ WebButton1 WebButton
#MoveScaled(1,1,11,4)
@ -95,32 +95,32 @@
#MoveScaled(32,1,10,4)
}
{ lblSpinBox WebLabel
#MoveScaled(43,1,17,4)
#MoveScaled(43,1,11,4)
Border = True
}
{ WebButton6 WebButton
#MoveScaled(61,1,16,4)
#MoveScaled(55,1,16,4)
Text = ("Remove tab 2")
}
{ WebButton2 WebButton
#MoveScaled(78,1,11,4)
#MoveScaled(72,1,11,4)
Text = ("Logout")
}
{ WebButton9 WebButton
#MoveScaled(90,1,16,4)
#MoveScaled(84,1,16,4)
Text = ("Select first")
}
{ WebButton10 WebButton
#MoveScaled(107,1,10,4)
#MoveScaled(101,1,10,4)
Text = ("Bip")
}
{ btnCheck WebButton
#MoveScaled(118,1,11,4)
#MoveScaled(112,1,11,4)
Text = ("Check")
}
}
{ WebHBox3 WebHBox
#MoveScaled(1,8,133.75,6)
#MoveScaled(1,8,128.75,6)
Font = "serif,bold"
Spacing = True
{ WebComboBox1 WebComboBox
@ -153,12 +153,12 @@
}
}
{ WebLabel2 WebLabel
#MoveScaled(1,15,133.75,4)
#MoveScaled(1,15,128.75,4)
Text = ("Test label alignment")
Alignment = Align.Center
}
{ WebTable1 WebTable
#MoveScaled(1,20,133.75,40)
#MoveScaled(1,20,128.75,40)
Expand = True
Mode = Select.Multiple
Header = WebTable.Both
@ -176,34 +176,34 @@
Index = 1
Text = ("Tab 2")
{ WebVBox1 WebVBox
#MoveScaled(1,1,133.75,12)
#MoveScaled(1,1,128.75,12)
{ WebRadioButton1 WebRadioButton
#MoveScaled(1,1,131.75,3)
#MoveScaled(1,1,126.75,3)
Text = ("Alpha")
}
{ WebRadioButton2 WebRadioButton
#MoveScaled(1,4,131.75,3)
#MoveScaled(1,4,126.75,3)
Text = ("Beta")
}
{ WebRadioButton3 WebRadioButton
#MoveScaled(1,7,131.75,3)
#MoveScaled(1,7,126.75,3)
Text = ("Gamma")
}
}
{ WebListBox1 WebListBox
#MoveScaled(1,14,133.75,31)
#MoveScaled(1,14,128.75,31)
Height = "14em"
List = [("Élément 1"), ("Élément 2"), ("Élément 3"), ("Élément 4"), ("<i>Élément 5</i>"), ("Élément 6"), ("Élément 7"), ("Élément 8"), ("<span style=\"color:red;\">Élément 9</span>"), ("Élément 10"), ("Élément 11"), ("Élément 12")]
UseHTML = True
}
{ WebTextArea1 WebTextArea
#MoveScaled(1,46,133.75,16)
#MoveScaled(1,46,128.75,16)
Height = "8em"
}
Index = 2
Text = ("Tab 3")
{ WebHBox2 WebHBox
#MoveScaled(1,1,133.75,6)
#MoveScaled(1,1,128.75,6)
Spacing = True
{ WebCheckBox1 WebCheckBox
#MoveScaled(1,1,18,4)
@ -231,13 +231,27 @@
}
}
{ WebImage1 WebImage
#MoveScaled(1,8,133.75,6)
#MoveScaled(1,8,128.75,6)
Image = "message/question.png"
}
{ lblTime WebLabel
#MoveScaled(1,15,133.75,4)
#MoveScaled(1,15,128.75,4)
Font = "4em"
}
{ WebHBox5 WebHBox
#MoveScaled(1,20,128.75,22)
{ WebVBox2 WebVBox
#MoveScaled(1,1,8,20)
Width = "5em"
Margin = True
Border = True
{ WebButton12 WebButton
#MoveScaled(1,1,6,4)
Height = "4em"
Image = "icon:/large/add"
}
}
}
Index = 3
Text = ("Tab 4")
{ WebHBox4 WebHBox
@ -256,7 +270,6 @@
{ WebTree1 WebTree
#MoveScaled(1,8,133.75,49)
Expand = True
Mode = Select.Multiple
ShowHeader = True
}
Index = 0

18
comp/src/gb.web.gui/.src/Tree/WebTree.class
View File

@ -157,8 +157,8 @@ Public Sub Clear()
$sKey = ""
$hSelection.UnSelectAll()
$sCursor = ""
$sLastKey = ""
$hRoot = New _WebTreeItem("", "") As "Item"
_RefreshView
End
@ -938,17 +938,17 @@ Public Sub _IsSelected(sKey As String) As Boolean
End
Public Sub _SetSelected(sKey As String, bSelected As Boolean)
Public Sub _SetSelected(sKey As String, bSelected As Boolean, Optional bNoRefresh As Boolean)
If $iMode = Select.Single Then
If bSelected Then
$sKey = sKey
Me.Refresh
If Not bNoRefresh Then Me.Refresh
Raise Select
Else
If $sKey = sKey Then
$sKey = ""
Me.Refresh
If Not bNoRefresh Then Me.Refresh
Endif
Endif
Return
@ -1485,9 +1485,7 @@ Public Sub _UpdateProperty(sProp As String, vValue As Variant)
Endif
Else
aProp = Split(Mid$(sProp, 2), ":")
Inc Me._NoRefresh
Try _SetSelected(FromBase64(aProp[0]), vValue)
Dec Me._NoRefresh
Try _SetSelected(FromBase64(aProp[0]), vValue, True)
Endif
Else If Left(sProp) = "?" Then
@ -1496,14 +1494,12 @@ Public Sub _UpdateProperty(sProp As String, vValue As Variant)
Else If Left(sProp) = "$" Then
Inc Me._NoRefresh
sKey = FromBase64(Mid$(sProp, 2))
If _IsSelected(sKey) Then
If $iMode = Select.Multiple Then _SetSelected(sKey, False)
If $iMode = Select.Multiple Then _SetSelected(sKey, False, True)
Else
_SetSelected(sKey, True)
_SetSelected(sKey, True, True)
Endif
Dec Me._NoRefresh
Else If sProp Begins "%" Then

2
comp/src/gb.web.gui/.src/WebLabel.class
View File

@ -29,7 +29,7 @@ End
Private Sub GetRenderText() As String
If Not $sText Then
Return "&nbsp;"
'Return "&nbsp;"
Else
Return Replace(Replace(Html($sText), "\n", "<br>"), " ", "&nbsp;")
Endif

17
comp/src/gb.web.gui/.src/WebTextArea.class
View File

@ -58,8 +58,13 @@ End
Public Sub _BeforeRender()
Print "<textarea"; Me._GetClassId(); " autocomplete=\"off\"";
If Object.CanRaise(Me, "Change") Then Print " oninput=\"gw.textarea.onChange("; JS(Me.Name); ");\"";
Print Me._GetUpdateJS("onblur", "text", "this.value");
If Object.CanRaise(Me, "Change") Then
Print " oninput=\"gw.textarea.onChange("; JS(Me.Name); ");\"";
Else
Print " oninput=\"gw.textarea.onUpdate("; JS(Me.Name); ");\"";
Endif
'If Object.CanRaise(Me, "Change") Then Print " oninput=\"gw.textarea.onChange("; JS(Me.Name); ");\"";
'Print Me._GetUpdateJS("onblur", "text", "this.value");
If Not Me.Enabled Then Print " disabled";
If $bReadOnly Then Print " readonly";
If $sPlaceHolder Then Print " placeholder=\""; Html($sPlaceHolder); "\"";
@ -74,7 +79,6 @@ Public Sub _Render()
End
Public Sub _AfterRender()
Print "</textarea>"
@ -97,15 +101,10 @@ End
Public Sub _UpdateProperty(sProp As String, vValue As Variant)
If sProp = "text" Then
SetText(vValue, False)
Else If sProp = "change" Then
SetText(vValue, True)
Endif
If sProp = "text" Then SetText(vValue, True)
End
Private Function Wrap_Read() As Boolean
Return $bWrap

15
comp/src/gb.web.gui/.src/WebTextBox.class
View File

@ -53,7 +53,6 @@ Private Sub SetText(Value As String, Optional bNoRefresh As Boolean)
End
Private Sub Text_Write(Value As String)
SetText(Value)
@ -84,8 +83,12 @@ Public Sub _Render()
Print "<input id=\""; Me.Name; ":entry\"";
If $bShowClear Then Print " style=\"padding-right:2.25em;\"";
Print " type=\""; If($bPassword, "password", "text"); "\""; Me._GetUpdateJS("onblur", "text", "this.value"); 'Me._GetUpdateJS("oninput", "text", "this.value"); '
If Object.CanRaise(Me, "Change") Then Print " oninput=\"gw.textbox.onChange("; JS(Me.Name); ");\"";
Print " type=\""; If($bPassword, "password", "text"); "\"";
If Object.CanRaise(Me, "Change") Then
Print " oninput=\"gw.textbox.onChange("; JS(Me.Name); ");\"";
Else
Print " oninput=\"gw.textbox.onUpdate("; JS(Me.Name); ");\"";
Endif
If Object.CanRaise(Me, "Activate") Then Print " onkeydown=\"gw.textbox.onActivate("; JS(Me.Name); ",event);\"";
'WebForm._AddJavascript("gw.textbox.onActivate(" & JS(Me.Name) & ")")
'Print Me._GetKeyPressHandler();
@ -117,11 +120,7 @@ End
Public Sub _UpdateProperty(sProp As String, vValue As Variant)
If sProp = "text" Then
SetText(vValue)
Else If sProp = "change"
SetText(vValue, True)
Endif
If sProp = "text" Then SetText(vValue, True)
End

38
comp/src/gb.web.gui/lib.js
View File

@ -71,6 +71,7 @@ gw = {
needKeyPress: {},
drawingContext: [],
images: {},
updates: {},
log: function(msg)
{
@ -166,7 +167,7 @@ gw = {
elt.id = id;
pelt.appendChild(elt);
},
setVisible: function(id, visible)
{
var elt = $_(id);
@ -343,6 +344,15 @@ gw = {
send: function(command, after)
{
if (Object.keys(gw.updates).length)
{
var updates = gw.updates;
gw.updates = {};
for (const [key, value] of Object.entries(updates))
value(key);
}
gw.log('gw.send: ' + command + ' ' + JSON.stringify(gw.commands));
gw.commands.push(command);
@ -1563,16 +1573,26 @@ gw = {
textbox:
{
updateText: function(id)
{
gw.update(id, 'text', $_(id + ':entry').value);
},
onActivate: function(id, e)
{
if (e.keyCode == 13)
setTimeout(function() { gw.update(id, 'text', $_(id + ':entry').value); gw.raise(id, 'activate', [], false); }, 20);
setTimeout(function() { gw.textbox.updateText(id); gw.raise(id, 'activate', [], false); }, 20);
},
onUpdate: function(id)
{
gw.updates[id] = gw.textbox.updateText;
},
onChange: function(id)
{
if ($_(id).gw_timer) clearTimeout($_(id).gw_timer);
$_(id).gw_timer = setTimeout(function() { gw.update(id, 'change', $_(id + ':entry').value, null); }, 20);
$_(id).gw_timer = setTimeout(gw.textbox.updateText, 20);
},
getText: function(id)
@ -1609,10 +1629,20 @@ gw = {
textarea:
{
updateText: function(id)
{
gw.update(id, 'text', $_(id).value);
},
onUpdate: function(id)
{
gw.updates[id] = gw.textarea.updateText;
},
onChange: function(id)
{
if ($_(id).gw_timer) clearTimeout($_(id).gw_timer);
$_(id).gw_timer = setTimeout(function() { gw.update(id, 'change', $_(id).value, null); }, 50);
$_(id).gw_timer = setTimeout(gw.textarea.updateText, 20);
},
copy: function(id)

18
comp/src/gb.web.gui/style.css
View File

@ -4,6 +4,7 @@ HTML, BODY {
height: 100%;
width: 100%;
font-family: sans-serif;
overflow: hidden;
}
HTML,BODY,DIV,INPUT,TEXTAREA,SELECT,CANVAS {
@ -74,7 +75,7 @@ P:first-child,UL:first-child,OL:first-child {
justify-content: center;
padding: 0;
font: inherit;
padding: 0.125em 0.5em;
padding: 0.25em;
height: 2em;
border: solid 1px gray;
cursor: default;
@ -93,7 +94,6 @@ P:first-child,UL:first-child,OL:first-child {
.gw-button.gw-noborder {
border: solid 1px transparent;
background: none;
/*padding: 0;*/
}
.gw-button.gw-noborder:hover {
@ -101,17 +101,29 @@ P:first-child,UL:first-child,OL:first-child {
}
.gw-button-image {
margin-left: 0.5em;
margin-right: 0.5em;
object-fit: contain;
}
.gw-button-text {
margin-right: 0.5em;
white-space: pre;
}
.gw-button-image:last-child {
margin-right: 0;
margin: 0;
flex-grow: 1;
}
.gw-button-text {
align-self: center;
}
.gw-button-text:first-child {
margin-left: 0.5em;
}
.gw-button-arrow {
display: inline-block;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAI0lEQVQYlWNgoAZoYGBg+I8DN+BT1MCABhrwSSIrwilJHgAAbCcP9dwIQGIAAAAASUVORK5CYII=');