Scripting: HTML GUI Tips & Tricks

Please check the FAQ (https://www.xyplorer.com/faq.php) before posting a question...
Post Reply
Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Scripting: HTML GUI Tips & Tricks

Post by Stefan »

Question:

Can anybody tell me an easy way how i can
execute an script via link from HTML file:

echo(html('<html><body><a href="xys: " "load <xypath>\scripts\A.xys","two" " ">Load Two</a></body></html>'));

If i click on "Load Two" link i wanna execute label 'two' of A.xys
A.xys:

Code: Select all

"One : one"
 msg "One";
"Two : two"
 msg "Two";
"Three : three"
 msg "Three";

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

Question:

Is there already an easy way to determine which inputs are checked / entered in HTML
to store them in XY vars to work further with this user inputs?


I mean f.ex. for this:

<input type=radio name="dienst" value="news">News<br>
<input type=checkbox name=flavor value=vanilla>Vanilla<br>
<INPUT TYPE=TEXT NAME="x" SIZE=70 VALUE="Vorgabe">

<TEXTAREA NAME="address" ROWS=6 COLS=64>example text</TEXTAREA>

<SELECT NAME="flavor">
<OPTION>Vanilla
<OPTION>Strawberry
<OPTION value="RumRasin">Rum and Raisin
<OPTION selected>Peach and Orange
</SELECT>

<select name="os" size=3 multiple>


---

Code: Select all

echo(html('<html><body><a href="xys: " "load <xypath>\scripts\html.xys","two" " ">Load Two</a>
  <br>
  <form method=post action="irgendwas">
  <pre>
  Name         : <input type=text name="name" size=40 maxlength=80><br>
  Anschrift    : <input type=text name="an1" size=40 maxlength=80><br>
  Passwort     : <input type=password name="pwd"  size=8  maxlength=8><br>
  </pre>
  
  <input type=radio name="dienst" value="news">News &nbsp; &nbsp; &nbsp; 
  <input type=checkbox name=flavor value=vanilla>Vanilla &nbsp; &nbsp; &nbsp; 
  <INPUT TYPE=TEXT NAME="x" SIZE=30 VALUE="Vorgabe"><br>
  <br>
  <TEXTAREA NAME="address" ROWS=3 COLS=64>
  example 
  text
  </TEXTAREA>
  <br><br>
  <SELECT NAME="flavor">
    <OPTION>Vanilla
    <OPTION>Strawberry
    <OPTION value="RumRasin">Rum and Raisin
    <OPTION selected>Peach and Orange
  </SELECT>
   &nbsp; &nbsp; &nbsp; 
  <select name="cpu" size=3 multiple>
    <option value="cpu0"> 8086
    <option value="cpu1"> 80186
    <option value="cpu2" selected> 80286
    <option value="cpu3"> 80386
    <option value="cpu4"> 80486
    <option value="cpu5"> Pentium
    <option value="cpu6"> anderer
  </select>
  </form>
  </body></html>'));

jacky
XYwiki Master
Posts: 3106
Joined: 23 Aug 2005 22:25
Location: France
Contact:

Re: Scripting: HTML GUI Tips & Tricks

Post by jacky »

Stefan wrote:Can anybody tell me an easy way how i can
execute an script via link from HTML file:
Whatever you put after xys: in a link is what will be returned by the function html -- so to do what you want, you could do this:

Code: Select all

load 'A', html('<html><body><a href="xys:two">Load Two</a></body></html>');
Although it might be better to store whatever html() returns in a variable and make sure there's something, in case the user just clicked "Ok" and closed the window without clicking on any link, etc
Stefan wrote:Is there already an easy way to determine which inputs are checked / entered in HTML
to store them in XY vars to work further with this user inputs?
You can simply point the form to an xys: link, e.g. <form method=get action="xys:">
Then, html() will return something like ?name=toto&an1=foobar&pwd=secret&flavor=vanilla&x=Vorgabe&address=example+text&flavor=Peach+and+Orange&cpu=cpu2

(I could also add, if you look into common-jacky there's a script _ShowHTML which you could call, that can deal with this for you, e.g. i would set global variables such as $CJ_HTML_name, $CJ_HTML_pwd, etc)
Proud XYplorer Fanatic

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

jacky wrote: Whatever you put after xys: in a link is what will be returned by the function html -- so to do what you want, you could do this:

Code: Select all

load 'A', html('<html><body><a href="xys:two">Load Two</a></body></html>');
Oh, just "load name". No path, no ext. Good to know.

>Whatever you put after xys: is what will be returned by the function html
Aha, that's how it's working, OK, thanks.

This works now for me:
htmlTest.xys:

Code: Select all

//$a = html('<html><body><a href="xys:two">Load Two</a></body></html>');
// load Ascript, $a

load Ascript, html('<html><body>
  <a href="xys:one">Load One</a> &nbsp; &nbsp; <a href="xys:two">Load Two</a><BR>
  <a href="xys:three">Load Three</a>
  </body></html>');
Ascript.xys

Code: Select all

"One : one"
  msg "A.xys: One"
"Two : two"
  msg "A.xys: Two"
"Three : three"
  msg "A.xys: Three"
Explanations:
The command html can show an HTML-file and return the result of html actions coded behind "xys:"
So (in my example) if i click on HTML-link "Load One" the xys: returns 'one'
and this 'one' is taken as second parameter for the "load script, label" command ( load script 'Ascript.xys', execute label 'one' )

;------------------------------------------------
Although it might be better to store whatever html() returns in a variable and make sure there's something, in case the user just clicked "Ok" and closed the window without clicking on any link, etc
Yes that's right. But i just need to know the syntax of this html command first. (i had read other scripts but there are too many other stuff to recognize just the syntax alone.)
You can simply point the form to an xys: link, e.g. <form method=get action="xys:">
Then, html() will return something like ?name=toto&an1=foobar&pwd=secret&flavor=vanilla&x=Vorgabe&address=example+text&flavor=Peach+and+Orange&cpu=cpu2

(I could also add, if you look into common-jacky there's a script _ShowHTML which you could call, that can deal with this for you, e.g. i would set global variables such as $CJ_HTML_name, $CJ_HTML_pwd, etc)
comes next to learn this evening....
the next question/challenge is now how to catch more then one returned value...

Thank you jacky.

jacky
XYwiki Master
Posts: 3106
Joined: 23 Aug 2005 22:25
Location: France
Contact:

Re: Scripting: HTML GUI Tips & Tricks

Post by jacky »

Stefan wrote:But i just need to know the syntax of this html command first. (i had read other scripts but there are too many other stuff to recognize just the syntax alone.)
You do know that XY comes with an help file, which contains help/syntax for all supported commands/functions, don't you? Just click on Help|Scripting Commands and have a read... ;)
(There's also the wiki, sadly behind lately, but the html function is in there!)
Proud XYplorer Fanatic

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

No need to remember me, of course i had read both.
But there are only complicated examples and no simple
explanation for my question above.

I expect generally simple explanation for every command, like:

$a = html('<html><body><a href="xys:Monday">Click here for monday</a></body></html>');
msg $a;

Shows an dialog with an clickable link called "Click here for monday"
If link is clicked an message box appears showing "Monday"
And an sentence like yours above "Whatever you put after xys: in a link is what will be returned by the function html"

After that you can add more complex examples. But first keep it simple. not all have an coder background.

jacky
XYwiki Master
Posts: 3106
Joined: 23 Aug 2005 22:25
Location: France
Contact:

Re: Scripting: HTML GUI Tips & Tricks

Post by jacky »

Stefan wrote:And an sentence like yours above "Whatever you put after xys: in a link is what will be returned by the function html"
Well, it isn't said that exact same way, but the wiki says this:
XYwiki wrote:As you'll have noted, this is a function and not a command. When showing HTML content through XY, whenever a link starting with prefix xys: is opened, the window will be closed and whatever what specified next will be what the function returns to your script. As a result, you can use HTML page to generate different actions by your script.

For instance, if on your page you put a link pointing to "xys:Yes" then the function will return "Yes"
Sounds about the same to me ;) And I think it does start with simple example.

Looking at the help file, one example is this:
XYhelp wrote:Shows a message box "Yes!" or "No!" depending on the link you click:
echo(html('<html><body><a href="xys:Yes!">Say "Yes!"</a><br><a href="xys:No!">Say "No!"</a></body></html>'));
Sounds to me that what you were asking for is exactly what is already found on the help ;)
Proud XYplorer Fanatic

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

And exactly this was not clear to me :roll:

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

jacky wrote:
Stefan wrote:Is there already an easy way to determine which inputs are checked / entered in HTML
to store them in XY vars to work further with this user inputs?
You can simply point the form to an xys: link,
Oh, the answer is already there! Thanks.

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

:roll: Oh man, it takes some time:
html()
return
On Close button or ESC, an empty string is returned.
Then i get it,i have to add an submit button.


Now i have an working code to provide an own GUI and get the user results:

Code: Select all

$a = urldecode(html('<html><body><form method="get" action="xys:">
  Name: <input type=text name="name" size=40 maxlength=80><br>
  <input type=radio name="delAll" value="Yes">Delete all &nbsp; &nbsp; &nbsp;
  <input type=checkbox name="Backup" value="Yes">Backup 
  <BR><BR><BR><INPUT type="submit" name="mysubmit" value=" OK "> 
  </form></body></html>'));
       // ------------ get the results -----------
       // remove leading '?' 
       substr $a, $a, 1; 
       // take an look on the whole result string:
       msg 'Debug: ' .$a;
       // split the resultstring into single name=value tokens:
       $name = gettoken($a, "1", "&");
       $delAll = gettoken($a, "2", "&");
       $Backup = gettoken($a, "3", "&");
             msg $name;
             msg $delAll;
             msg $Backup;
              msg gettoken($name,2,"=");
              msg gettoken($delAll,2,"=");
              msg gettoken($Backup,2,"=");
use <form method="get" action="xys:"> to redirect the result to XY

use <INPUT type="submit" name="mysubmit" value=" OK "> to start redirecting (don't use the dialog close-button)

Stefan
Posts: 1360
Joined: 18 Nov 2008 21:47
Location: Europe

Re: Scripting: HTML GUI Tips & Tricks

Post by Stefan »

I though i had posted an HTML Framework already but can't find it.
Anyway, here is my current one.

I will use this for little tools that need an simple GUI.
Example use: >> http://www.xyplorer.com/xyfc/viewtopic. ... 856#p49856




Explanation:

If you need an list you can use $TextAreaDefault.
Fill it with something or the clipboard content:

Code: Select all

$TextAreaDefault = "my textareacontent";  
//$TextAreaDefault = "<clipboard>";
In the Description secition you can type in an description for the options.
Type your descriptions behind &nbsp;

Code: Select all

<TR><TD>Option5:</TD>                     <TD>&nbsp;                </TD></TR>
The user can check one of the radio buttons
and can fill in some text into the Options-fields.
Or he edit or paste in something into the TextArea.

For your script you get back this var:
Content of the textarea in var $TextArea
Option 1 or 2 or3 or 4 into var $myOption
Option5 in var $Option5
Option6 in var $Option6
Option7 in var $Option7
Option8 in var $Option8

Now you can start working with this vars.

Image

Code: Select all

//Example Framework for the XYplorer-script HTML() function
	
$TextAreaDefault = "my textareacontent (delete this)";  
//$TextAreaDefault = "<clipboard>";

    $GETResult = utf8decode(html('<HTML>
    <BODY bgcolor="antiquewhite">
    <FORM method="GET" action="xys:">
    <TABLE width="99%" border="1" bgcolor="aquamarine">
    <TR><TD width="15%"><B>Description</B></TD><TD>&nbsp;                </TD></TR>
    <TR><TD>TextArea:</TD>                    <TD>&nbsp;                </TD></TR>
    <TR><TD>option 1-4:</TD>                  <TD>1:     2:      3:       4:&nbsp;</TD></TR>
    <TR><TD>Option5:</TD>                     <TD>&nbsp;                </TD></TR>
    <TR><TD>Option6:</TD>                     <TD>&nbsp;                </TD></TR>
    <TR><TD>Option7:</TD>                     <TD>&nbsp;                </TD></TR>
    <TR><TD>Option8:</TD>                     <TD>&nbsp;                </TD></TR>
    <TR><TD>Do it:</TD>                       <TD>&nbsp;                </TD></TR></TABLE>
    
    <TEXTAREA name="FormResult" rows=6 cols=75>' . $TextAreaDefault . '</TEXTAREA><BR>
    
    <INPUT type="radio" name="myOption" value="Option1" checked>  Option 1 &nbsp; 
    <INPUT type="radio" name="myOption" value="Option2"        >  Option 2 &nbsp;
    <INPUT type="radio" name="myOption" value="Option3"        >  Option 3 &nbsp;
    <INPUT type="radio" name="myOption" value="Option4"        >  Option 4 <BR>
    
     Option5: <input type="text" name="Option5" size="80" Value="FIVE (delete this)"> <BR> 
     Option6: <input type="text" name="Option6" size="80" Value="SIX (delete this)"> <BR>
     Option7: <input type="text" name="Option7" size="80" Value="SEVEN (delete this)"> <BR>
     Option8: <input type="text" name="Option8" size="80" Value="EIGHT (delete this)"> <BR>
    
    <P align="right"><INPUT type="submit" name="Submit" value="Do it"> </P>
    </FORM>
    </BODY>
    </HTML>',"700", "630", "myWindowsTitle"));

   //get the results: 

   // IF you press the [Close]-button of the dialog 
   // instead of the [Submit]-button of the form or on an link,
   // then the result of HTML() is empty/nothing:
     IF ("$GETResult"=="") {sub "_Cancel";}

   // remove leading '?' from $GETResult content   
     substr $GETResult, $GETResult, 1; 

   //split the result into parts:
   //   split $GETResult into parts at the '&' sign and give me part N0. 1
   //   for example 'FormResult=textareacontent&myOption=Opt2&fname=J'...etc.
   //   becomes 'FormResult=textareacontent'
     $FormResult = gettoken($GETResult, "1", "&");

   // Then:
   // split $FormResult into parts at the '=' sign and give me part N0. 2
   // for example 'FormResult=textareacontent'
   // becomes 'textareacontent'
     $TextArea = urldecode(gettoken($FormResult, 2, "="));

   //now do the same for all other parts:
     $myOption = gettoken($GETResult, "2", "&");
     $myOption = urldecode(gettoken($myOption, 2, "="));
   //----
     $Option5 = gettoken($GETResult, "3", "&");
     $Option5 = urldecode(gettoken($Option5, 2, "="));
   //----
     $Option6 = gettoken($GETResult, "4", "&");
     $Option6 = urldecode(gettoken($Option6, 2, "="));
   //----
     $Option7 = gettoken($GETResult, "5", "&");
     $Option7 = urldecode(gettoken($Option7, 2, "="));
   //----
     $Option8 = gettoken($GETResult, "6", "&");
     $Option8 = urldecode(gettoken($Option8, 2, "="));


   //  
   //now do what you want with this results:
     Text "Content of the textarea is: $TextArea <crlf>
           Option 1-4 is: $myOption <crlf>
           Option5: $Option5 <crlf>
           Option6: $Option6 <crlf>
           Option7: $Option7 <crlf>
           Option8: $Option8 <crlf>";

  // YOUR script goes here:
  
  

////////////////////////////////////////////////////////////////   
"_Cancel"
  msg "Cancled by user";   
	sub "_EOF";  
"_EOF"
	END 1==1;
//EOF

Post Reply