Can we have multiple web pages?

Agent Code
1

So far I have only seen examples that have one page. Can we have more than that ?
Can I have say …/page1 and …/page2 ?
I have seen how to add the HTML code in the examples, but if this is possible would someone give me a hint how to do that please.

2

Yep, you can. The path is there in the request for you to parse, see https://www.electricimp.com/docs/api/httphandler/

3

Took awhile for me to figure out as you have to create all your css / html code for all pages within the agent. The way I implemented multiple web pages was to put the html code in functions and then use path or post/get criteria to call the page. I also include parameters within the function to allow me to dynamically transfer information and security keys to the html page to be included in html page when called by browser… this is really a nice to have feature for checking when data is posted back to agent from the web page.

`
function IndexPage (AuthKey, message)
{
local html = @"



…
… if needed …



…



“;
return html;
}
function Page2 (AuthKey, message)
{
local html = @”



…
… if needed …



…



";
return html;
}

function httpHandler(request,response) {
try
{
local method = request.method.toupper();
local pgpath = request.path.tolower();

   if (pgpath == "/page2" ) {
      if (method == "POST") {  .... }
      else {
          local mynewKey = "def";
          local mynewMsg = "";
          response.send(200, Page2( mynewKey, mynewMsg ));
      }
   }
   else {
      if (method == "POST") {  .... }
      else {
         local mynewKey = "abc";
         local mynewMsg = "";
         response.send(200, IndexPage( mynewKey, mynewMsg ));
      }
   }
}
catch(error)
{
    response.send(500, "Internal Server Error: " + error);
}

}
`

4

I’m eating a little humble pie for being too hasty in my earlier response as I messed up with my earlier explanation. Unless someone else knows, I should have clarified by saying that as far as I am aware the path option only works with POST / GET / etc. methods and not with handling html pages…

The function method shown above does work but instead of using <a> tags with “href” paths, which you would find in menu bars etc. I use the button and post function method to switch pages by switching function which contains the page when handling the post method in http.onrequest(httpHandler) method. In this case all html pages are within the root path. Note that no html names are shown… in essence what is happening (or at least this is the way I like to see it) is that through code you get the imp agent to dynamically change the content of the single html page.

The bootstrap template handles the button method as a menu or link option fairly well with a few little css tweaks. If passwords are used you have to use session cookies to manage page switches etc.

Hope that makes sense.

5

@gerriko, thank you for taking the time to write that out for me. It was extremely helpful!