Opened 10 years ago

Closed 8 years ago

Last modified 8 years ago

#13875 closed defect (fixed)

joAdding hrefTarget="_self" breaks page animation

Reported by: Paul Christopher Owned by: Patrick Ruzand
Priority: high Milestone: 1.9.1
Component: DojoX Mobile Version: 1.7.0b1
Keywords: Cc:
Blocked By: Blocking:

Description

Steps to reproduce:

  • Take dojox/mobile/tests/test_iPhone-Icon.html
  • Click on the fifth icon to see a working page transition of type slide.
  • Now add hreftTarget="_self" to the fifth IconItem in the source code like so:

<li dojoType="dojox.mobile.IconItem" label="href" icon="images/icon-1.png" href="test_iPhone-RoundRectList.html" hrefTarget="_self" transition="slide"></li>

  • Reload the page: The animation will be broken, i.e. the is no anomation at all.

The same is not only true for IconItem but ListItem. Appending hrefTarget="_self" to the list item breaks the animation, too.

Example:

<li dojoType="dojox.mobile.ListItem" rightText="AcmePhone" href="test_iPhone-RoundRectList.html" hrefTarget="_self" transition="slide">

Why do I add hrefTarget="_self"?

I add hrefTarget since I develop my apps on the desktop pc. My index.html file just constains an iframe in iPad size (1024*768). All the pages of the app are run inside this iframe so as to simulate the screen resolution of the target device.

[As of today 9/9/2011, the mentioned test does not work at all since all images are reported as corrupted/truncated by the browser. You need to replace the images first to get the test working]

Attachments (4)

ticket13875.patch (2.8 KB) - added by Sebastien Brunot 8 years ago.
Apply transition to element with href and hrefTarget defined if hrefTarget is _self (IBM CCLA)
test2.html (1.1 KB) - added by Sebastien Brunot 8 years ago.
Test file that tries to reproduce the issue observed on Android.
_ItemBase.js (14.0 KB) - added by jmg157 8 years ago.
My patched _ItemBase.js file
ViewController.js (8.6 KB) - added by jmg157 8 years ago.
My patched _ViewController.js file

Download all attachments as: .zip

Change History (16)

comment:1 Changed 8 years ago by ykami

Owner: changed from ykami to Eric Durocher
Status: newassigned

Changed 8 years ago by Sebastien Brunot

Attachment: ticket13875.patch added

Apply transition to element with href and hrefTarget defined if hrefTarget is _self (IBM CCLA)

comment:2 Changed 8 years ago by Sebastien Brunot

I've attached a patch that fix the problem for dojo 1.9

comment:3 in reply to:  2 Changed 8 years ago by jmg157

I've tried this patch on both Dojo 1.9 and Dojo 1.8 but still seem to have no luck. I tested it using Phone Gap on Android Jellybean and Gingerbread.

After making the modifications mentioned in the patch, the animations still do not seem to work.

Here is how I am attempting to implement the transition:

<span data-dojo-type="dojox/mobile/ToolBarButton"
                    href="prevpage.html" hrefTarget="_self"
                    data-dojo-props='arrow:"left",
                    transition:"slide"'>Prev</span>

I'm not sure if I am doing something wrong or if there is an issue with the patch.

Thank you.

Best,

--Josh

Replying to sbrunot:

I've attached a patch that fix the problem for dojo 1.9

Version 1, edited 8 years ago by jmg157 (previous) (next) (diff)

comment:4 Changed 8 years ago by Sebastien Brunot

I tried to reproduce on Android 2.3.3 and 4.1.2 emulators with the patch on 1.9, using the test case dojox/mobile/tests/test_IconContainer.html (clicking the "hrefTarget" icon), but I can't (works with the original swirl transition and the slide transition).

Could you attach a complete HTML test page that fails on your devices with the patch on 1.9 ?

Thanks for your help.

comment:5 Changed 8 years ago by jmg157

The problem I'm having is actually with ToolBarButton?. The slide transition works fine with the dojox/mobile/tests/test_IconContainer.html case. But when I try to implement a slide transition for the toolbar buttons as above, the animation does not work. The page transitions, but without animation.

comment:6 Changed 8 years ago by Adrian Vasiliu

Milestone: tbd1.9.1

comment:7 Changed 8 years ago by Sebastien Brunot

I unfortunately do not reproduce the issue with the attached test2.html file when running in the android stock browser. Before I test by embedding the test file in a PhoneGap? / Apache cordova application, can you tell me if test2.html reproduce the issue when embedded in your application ?

Changed 8 years ago by Sebastien Brunot

Attachment: test2.html added

Test file that tries to reproduce the issue observed on Android.

comment:8 Changed 8 years ago by jmg157

Hmmm...I must be doing something wrong. This is my entire HTML file:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
	href="../../libs/dojo/dojox/mobile/themes/android/android.css"
	type="text/css" media="screen" title="notitle" charset="utf-8">
<script type="text/javascript" src="../../libs/dojo/dojo/dojo.js"
	djConfig="parseOnLoad:true"></script>
<script type="text/javascript">
	dojo.require("dojox.mobile.parser");
	dojo.require("dojox.mobile");
	dojo.require("dojox.mobile.ContentPane");
	dojo.require("dojox.mobile.ToolBarButton");
	dojo.require("dojox.mobile.Heading");
	dojo.requireIf(!dojo.isWebKit, "dojox.mobile.compat");
</script>
</head>
<body>
	<div data-dojo-type="dojox/mobile/View">
		<div id="header" data-dojo-type="dojox/mobile/Heading">
			<span data-dojo-type="dojox/mobile/ToolBarButton"
				href="../../index.html" hrefTarget="_self"
				data-dojo-props='arrow:"left", transition:"slide"'>Home</span>
		</div>
	</div>
</body>
</html>

I'm also attaching my _ItemBase.js and ViewController?.js files where I applied the patch.

Oh, and yes, when I tried your test file, I had the same problem.

Thank you again for all the help!

Last edited 8 years ago by jmg157 (previous) (diff)

Changed 8 years ago by jmg157

Attachment: _ItemBase.js added

My patched _ItemBase.js file

Changed 8 years ago by jmg157

Attachment: ViewController.js added

My patched _ViewController.js file

comment:9 Changed 8 years ago by Sebastien Brunot

Thanks for sending your example. Unfortunately, I tested it both on the Android 4.1.2 stock browser and in a cordova 2.7 application, using your version _ItemBase.js and ViewController?.js on the dojo 1.9 branch source code, and it works perfectly.

I'm affraid you have a build, cache od deployment issue at this point :(

comment:10 Changed 8 years ago by Patrick Ruzand

Owner: changed from Eric Durocher to Patrick Ruzand

comment:11 Changed 8 years ago by Patrick Ruzand <[email protected]…>

Resolution: fixed
Status: assignedclosed

In dd7a76c32f46df3160222a126bf05a5be890afed/dojox:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

comment:12 Changed 8 years ago by Patrick Ruzand <[email protected]…>

In 699ff816ee8c5e9abd3557ae639f9c797fcbd53b/dojox:

Error: Processor CommitTicketReference failed
Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 
Note: See TracTickets for help on using tickets.