I have a page that a user can arrive at from different parts of the application. Also from this landing page, a user can navigate to another page and come back to this landing page.
Using the default back button functionality would take the user back to that page. In short, I need to keep the url when the user first arrives at this page and than changePageto this url.
Any help is appreciated.
$.mobile.back()
It even handles the transition reverse direction. From the source :
$.mobile.back = function() {
var nav = window.navigator;
// if the setting is on and the navigator object is
// available use the phonegap navigation capability
if( this.phonegapNavigationEnabled &&
nav &&
nav.app &&
nav.app.backHistory ){
nav.app.backHistory();
} else {
window.history.back();
}
};
I am not sure if I got your point. Maybe you should use javascript and localStorage mechanism. When navigating from page A to B set localStorage("source", "a.html"), then on page B init, try this link:
window.location.href = ('file:///android_asset/path.../' + localStorage.getItem("source") );
This should do the trick.
Related
I came across this piece of code in a website I was asked to help with.
`
<script>
function removeLinks(links) {
if (!arguments[0]) return;
var a = arguments[0];
$(".WaGadgetMenuHorizontal a:not(.wa-authenticateLoginLink), .WaGadgetMenuVertical a:not(.wa-authenticateLoginLink),.WaGadgetMobilePanel a:not(.wa-authenticateLoginLink)").each(function() {
var curhref=$(this).attr('href').split("/")[3];
if (
(typeof(a)=='string' && a==curhref)||
(typeof(a)=='object' && ($.inArray(curhref, a)>-1))
) {
$(this).attr("href", "javascript:void(0)").css("cursor","context-menu");
}
});
}
removeLinks("Philanthropy");
</script>`
This makes the Philanthropy link unclickable but there are 2 issues to be resolved.
Clicking the Philanthropy link shows the words Javascript:void(0) in the bottom left of the screen
Clicking the Philanthropy link takes you to whatever page you were on previously which is confusing to users, especially on the mobile version of the website where you simply jump from the click on the link to whatever previous page you were on. AT least on the PC you are still on the link with the previous page in the background so to speak.
Is there a way to remove the message that shows at the bottom left of the screen and to click on the link and stay on the link unless you click away to another link?
I tried to modify the code with different things that I found online but nothing seems to work
I work on Jquery Mobile/Phonegap app for android.
I´d like my app to "remember" that(if) the user has visited one of my pages. For example if he once visits "page1.html", this action should be cached in the phone memory, so that when the user opens the app again there should be possibility to navigate to this "page2.html" directly from "index.thml".
Please, if you have a code suggestion, tell me also how/where do I use it, because sometimes for starters like me it is realy hard to understand what to do with a little piece code.
Thank you very much!
You can use HTML5 local storage for this purpose.
Each time when a page is shown you can save/update the current page URL to a local storage variable, say 'lastVisit', as below:
$(document).on('pageshow', function (event, data) {
var currentPage = $('.ui-page-active').data('url');
localStorage.setItem("lastVisit", currentPage);
});
If you are not getting $('.ui-page-active').data('url'), then you can use $.mobile.activePage.attr('id') which will give you the current page id.
So next time, when the user opens the app again, you can check whether this local storage variable is set and can action accordingly.
The code will look like as below:
$(document).on('mobileinit', function(){
var lastVisit = '';
if(localStorage.getItem("lastVisit") != null){
lastVisit = localStorage.getItem("lastVisit");
}
if(lastVisit){
document.location.href = lastVisit;
}
});
You can use these codes in the header section scripts.
Testing on the desktop with JQM doesn't produce this issue, so it's difficult to pinpoint.
Backstory: I have created server side code (php) to accept a query string and open a gallery straight to a picture. But if a user wants to share a link while surfing a gallery on a mobile device, and in particular a certain photo; most Mobile Browsers share the core link and not the actual photo. It's easy in the events when swiping to create a URL hashtag modifier for the URL with the photo id ( For example #photoID=987), but only if the gallery is originally started with no hashtags. It's then easy to share with a Phone's Native methods.
(function(window, $, PhotoSwipe){
$(document).ready(function(){
//More Code is here but not needed fro this question
$(photoSwipeInstance).bind(PhotoSwipe.EventTypes.onDisplayImage, function(e){
var pid = codeThatGetsPhotoIDFromDisplayedIMGURL();
window.location.hash = '&pid='+pid[0];
});
if(getUrlVars()["pid"]!=null || getUrlVars()["pid"]!=undefined)
{
console.log(getUrlVars()["pid"]);
var photopid= getPhoto(getUrlVars()["pid"]);
photoSwipeInstance.show(photopid);
}
});//End Documentstrong text
}(window, window.jQuery, window.Code.PhotoSwipe));
function getUrlVars()
{
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
}
Issue: If a gallery is loaded with a hashtag the gallery will pop up the proper image but then immediately closes the slide show. And every photo past this point performs in the same manner, slideshow opens then closes.
I have turned off all AJAX, and hashtag anchor functions JQM utilizes. This hashtag url functions works as intended when using a Desktop browser but not when using any Mobile browser.
Has someone else tried this functionality?
I probably made this much more confusing then it is in my description.
Answer: JQM's hashtag handlers did not need to be turned off instead. Photoswipe needed this handler added to the options: backButtonHideEnabled: false
JQM's hashtag handlers did not need to be turned off instead. Photoswipe needed this handler added to the options: backButtonHideEnabled: false
This is my first time with jQuery Mobile and I'm actually using it from a WP theme I got. I understand that this might be theme related but I just want to make sure.
So, it is a Wordpress jQuery Mobile theme, you plug it and it works a treat. The thing is, I've converted the Wordpress menu from an UL to a SELECT.
I have then added some jQuery to fire the select on change by getting the value of the selected option. That works, I get the loading thinggy and then the page changes with my desired effect.
But I can't get the Select menu to show the current selected item. It always reverts to the first one.
I have used:
$('#main_menu').selectmenu("refresh");
$('#main_menu').selectmenu("refresh", true);
But nothing...
You can have a look at the site here: http://avatarblog.fl1hosting.com/ and look at the source.
You will see that my mobile event are all before the jQuery Mobile include, which doesn't make much sense to me, but if I put them afterwards, nothing works.
Any help would be highly appreciated!
Thanks
You need to set which option to show in the select menu. Try this,
$("#main_menu")[0].selectedIndex = 2; // this will select the 3rd in the menu list
$("#main_menu").selectmenu("refresh");
You can add the following script your header.php:
$(document)
.unbind("pageshow.initMenuBtn")
.bind("pageshow.initMenuBtn",
function() {
$.mobile.activePage = $("div.ui-page-active");
$("#main_menu", $.mobile.activePage)
.unbind("change")
.bind("change", function() {
var page = $(this).val();
$.mobile.changePage(page);
});
var selectedIndex = 0;
$("#main_menu>option", $.mobile.activePage).each(function(index) {
if ($(this).hasClass("current-menu-item")) {
selectedIndex = index;
}
});
$("#main_menu", $.mobile.activePage)[0].selectedIndex = selectedIndex;
$("#main_menu", $.mobile.activePage).selectmenu("refresh");
});
I have a BrowserField in my app, which works great. It intercept NavigationRequests to links on my website which go to external sites, and brings up a new windows to display those in the regular Browser, which also works great.
The problem I have is that if a user clicks a link to say "www.google.com", my app opens that up in a new browser, but also logs it into the BrowserHistory. So if they click back, away from google, they arrive back at my app, but then if they hit back again, the BrowserHistory would land them on the same page they were on (Because going back from Google doesn't move back in the history) I've tried to find a way to edit the BrowserField's BrowserHistory, but this doesn't seem possible. Short of creating my own class for logging the browsing history, is there anything I can do?
If I didn't do a good job explaining the problem, don't hesitate for clarification.
Thanks
One possible solution to this problem would be to keep track of the last inner URL visited before the current NavigationRequest URL. You could then check to see whether the link clicked is an outside link, as you already do, and if it is call this method:
updateHistory(String url, boolean isRedirect)
with the last URL before the outside link. Using your example this should overwrite "www.google.com" with the last inner URL before the outside link was clicked.
Here is some half pseudocode/half Java to illustrate my solution:
BrowserFieldHistory history = browserField.getHistory():
String lastInnerURL = "";
if navigationRequest is an outside link {
history.updateHistory(lastInnerURL, true);
// Handle loading of outer website
} else {
lastInnerURL = navigationRequest;
// Visit inner navigation request as normal
}
http://www.blackberry.com/developers/docs/5.0.0api/net/rim/device/api/browser/field2/BrowserFieldHistory.html#updateHistory(java.lang.String, boolean)
I had a similar but a little bit different issue. Special links in html content like device:smth are used to open barcode scanner, logout etc and I wanted them not to be saved in BrowserFieldHistory. I found in WebWork source code interesting workaround for that. All that you need is throw exception at the end like below:
public void handleNavigationRequest( BrowserFieldRequest request ) throws Exception {
if scheme equals to device {
// perform logout, open barcode scanner, etc
throw new Exception(); // this exception prevent saving history
} else {
// standard behavior
}
}