Web Pop-Up

I have a screen with a web-pop up. When I hit my back button to go back to my menu screen, it causes my animations to freeze on that screen and then none of the buttons work. What do I need in the code on my web-pop up screen to keep it from doing that?

[lua]module(…, package.seeall)

function new()
local localGroup = display.newGroup()
–> This is how we start every single file or “screen” in our folder, except for main.lua
– and director.lua
–> director.lua is NEVER modified, while only one line in main.lua changes, described in that file


local ui = require(“ui”)

local aboutbackground = display.newImage (“aboutbackground.png”)
localGroup:insert(aboutbackground)
–> This sets the background

local backbutton = display.newImage (“backbutton.png”)
backbutton.x = 160
backbutton.y = 425
backbutton.xScale = .5
backbutton.yScale = .5
localGroup:insert(backbutton)

local function touchedBackbutton (event)
if (“ended” == event.phase) then
– close the web popup
native.cancelWebPopup()
director:changeScene(“menu”)
media.playEventSound( “click_x.caf” )

end
end

backbutton:addEventListener (“touch”, touchedBackbutton)
–***************************************************

– showHelpPopup()

–***************************************************

local showHelpPopup = function()
local topLoc = 73

if system.getInfo(“model”) == “iPad” then
topLoc = 73 + 34
end

native.showWebPopup( 25, 100, 280, 305, “help.html”, {baseUrl=system.ResourceDirectory, hasBackground=false } )

end

local cleanUp = function()

backbutton:removeEventListener(“touch”, touchedBackbutton)

–***************************************************

– init()

–***************************************************

local init = function()

showHelpPopup() --> display local help.html file

end

init()

end

–>MUST return a display.newGroup()


–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua] [import]uid: 72372 topic_id: 14256 reply_id: 314256[/import]

Hey,

I am a little confused about your logic here - cleanUp and showHelpPopup are in one function?

Is init being called when the page loads? It’s within another function as well and I can’t see it being called.

I haven’t used web popups in a little while so I’m a bit rusty but I’m just not seeing the logic.

If you want to upload your project somewhere I’ll take a look, though.

Peach :slight_smile: [import]uid: 52491 topic_id: 14256 reply_id: 52641[/import]

Peach,

I was trying to follow Jon Beebe’s code he used but I changed the draw functions. This is Jon’s code below that I was trying to follow.

[lua]–
– Abstract: Tilt Monster sample project
– Designed and created by Jonathan and Biffy Beebe of Beebe Games exclusively for Ansca, Inc.
http://jonbeebe.net/

– Version: 2.0.1

– Sample code is MIT licensed, see http://developer.anscamobile.com/code/license
– Copyright © 2010 ANSCA Inc. All Rights Reserved.

module(…, package.seeall)

– Main function - MUST return a display.newGroup()
function new()
local helpGroup = display.newGroup()

local ui = require(“ui”)

– OPTIONS
–local soundsOn = true; local soundsData

– OBJECTS
local menuBtn

–***************************************************

– drawBackground()

–***************************************************

local drawBackground = function()
local helpBackground = display.newImageRect( “helpScreen.png”, 480, 320 )
helpBackground.x = 240; helpBackground.y = 160

helpGroup:insert( helpBackground )
end

–***************************************************

– drawButtons()

–***************************************************

local drawButtons = function()
– Setup “Menu” Button
local touchMenuBtn = function( event )
if event.phase == “release” then

– close the web popup
native.cancelWebPopup()

– main menu call
director:changeScene( “gotomainmenu” )
end
end

menuBtn = ui.newButton{
defaultSrc = “menubtn.png”,
defaultX = 125,
defaultY = 42,
overSrc = “menubtn-over.png”,
overX = 125,
overY = 42,
onEvent = touchMenuBtn,
id = “menuButton”,
text = “”,
font = “Helvetica”,
textColor = { 255, 255, 255, 255 },
size = 16,
emboss = false
}

menuBtn:setReferencePoint( display.BottomLeftReferencePoint )
menuBtn.xOrigin = 0; menuBtn.yOrigin = 450
menuBtn.isVisible = false

helpGroup:insert( menuBtn )

– Show “Menu” Button
menuBtn.isVisible = true
menuBtn:setReferencePoint( display.BottomLeftReferencePoint )
menuBtn.x = 0
transition.to( menuBtn, { time=1000, y=320, transition=easing.inOutExpo } )

end

–***************************************************

– showHelpPopup()

–***************************************************

local showHelpPopup = function()
local topLoc = 73

if system.getInfo(“model”) == “iPad” then
topLoc = 73 + 34
end

native.showWebPopup( 58, topLoc, 389, 223, “help.html”, {baseUrl=system.ResourceDirectory, hasBackground=false } )

end

–***************************************************

– init()

–***************************************************

local init = function()

drawBackground()
drawButtons()

showHelpPopup() --> display local help.html file

end

init()

– MUST return a display.newGroup()
return helpGroup
end[/lua] [import]uid: 72372 topic_id: 14256 reply_id: 52657[/import]

His init() isn’t within another function (beyond director stuff of course) and is called as soon as the scene loads.

Is there a reason you’ve done yours differently? (As in, putting the init inside another function rather than calling it immediately?) [import]uid: 52491 topic_id: 14256 reply_id: 52723[/import]

I didn’t notice I did that. LEt me take another look. [import]uid: 72372 topic_id: 14256 reply_id: 52727[/import]

I’m looking at it but I don’t know what you mean. It looks the same to me with the exception I took the draw functions out.

This is mine

[lua] --***************************************************

– init()

–***************************************************
local init = function()
showHelpPopup() --> display local help.html file

end

init()

end

–>MUST return a display.newGroup()


–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua]

This is his

[lua]–***************************************************

– init()

–***************************************************

local init = function()

drawBackground()
drawButtons()

showHelpPopup() --> display local help.html file
end

init()

– MUST return a display.newGroup()
return helpGroup
end[/lua] [import]uid: 72372 topic_id: 14256 reply_id: 52737[/import]

[lua]module(…, package.seeall)

function new()
local localGroup = display.newGroup()
–> This is how we start every single file or “screen” in our folder, except for main.lua
– and director.lua
–> director.lua is NEVER modified, while only one line in main.lua changes, described in that file


local ui = require(“ui”)

local aboutbackground = display.newImage (“aboutbackground.png”)
localGroup:insert(aboutbackground)
–> This sets the background

local backbutton = display.newImage (“backbutton.png”)
backbutton.x = 160
backbutton.y = 425
backbutton.xScale = .5
backbutton.yScale = .5
localGroup:insert(backbutton)

local function touchedBackbutton (event)
if (“ended” == event.phase) then
– close the web popup
native.cancelWebPopup()
–director:changeScene(“menu”)
– media.playEventSound( “click_x.caf” )

end
end

backbutton:addEventListener (“touch”, touchedBackbutton)

–***************************************************

– showHelpPopup()

–***************************************************

local showHelpPopup = function()
local topLoc = 73

if system.getInfo(“model”) == “iPad” then
topLoc = 73 + 34
end

native.showWebPopup( 25, 100, 280, 305, “help.html”, {baseUrl=system.ResourceDirectory, hasBackground=false } )

end

local cleanUp = function()

backbutton:removeEventListener(“touch”, touchedBackbutton)
end
–***************************************************

– init()

–***************************************************

local init = function()

showHelpPopup() --> display local help.html file

end

init()

–>MUST return a display.newGroup()


–> This is how we end every file except for director and main, as mentioned in my first comment

return localGroup

end[/lua]
I moved the [lua]end[/lua] that was putting the init function within the cleanup.

Try that and tell me what errors you get, if any. (Including what file they’re in - this one or menu.lua or whatever.) [import]uid: 52491 topic_id: 14256 reply_id: 52848[/import]

PS - I commented out the sound and scene change because I don’t have your scenes/sound file - but the logic is the same. Init still needs to be called. [import]uid: 52491 topic_id: 14256 reply_id: 52849[/import]

Peach,

It worked great! I just have one question. When you look at Beebe’s it just scrolls up and down. Mine does that also but I can also shift it a little to the right and left. How do I keep the movement where it is only up and down. And please understand it is not shifting a lot left and right but I can move it that way a little bit.

Michelle [import]uid: 72372 topic_id: 14256 reply_id: 52895[/import]

Well Beebe was doing a landscape app and he set his width to 389, so none was hidden off screen on the left or the right.

You’re using landscape so at most your width could be 320.

SO - whatever html doc you’re displaying, make sure the width wont go over the width of your screen and set it to 320. (or 310 if you want a little space at the edge, which is best.)

Peach :slight_smile: [import]uid: 52491 topic_id: 14256 reply_id: 53020[/import]

Peach,

Yes the width was 320 and I moved it to 300 and the same thing still occurs. I basically have a scroll bar down the side and one across the bottom and I don’t want the bottom one. I thought it might be the topLoc code he is using but it’s not. I can’t figure it out. Everything is working fine though. I need that bottom scroll removed though because it looks funny to be able to shift it a little left to right because it can go off the screen a little bit.

Michelle [import]uid: 72372 topic_id: 14256 reply_id: 53038[/import]

What I meant was, I believe the HTML file you are using is too wide for your 320 - check. It should be smaller than Jon’s because he was doing landscape so could set the width to around 390 and not have any sideways scrolling. You’d want your width to be more like 300 for a portrait app. [import]uid: 52491 topic_id: 14256 reply_id: 53179[/import]

Yes I understood you perfectly. I only see one number that can be changed in the html and I adjusted that and nothing happened. I will look closer because maybe I missed something :slight_smile: [import]uid: 72372 topic_id: 14256 reply_id: 53188[/import]

Peach,

I don’t know what the magic number is but I moved the 320 to 250 and that fixed it completely. Thanks for all your help!

Michelle [import]uid: 72372 topic_id: 14256 reply_id: 53234[/import]

Sorry I wasn’t here sooner - am very happy you got it sorted :slight_smile:

For HTML docs (if memory serves) the width and height are usually specified up top.

Anyway, glad it’s sorted :slight_smile: [import]uid: 52491 topic_id: 14256 reply_id: 53341[/import]