Goal: From a website having a lot of links, I will usually middle click the ones I want. Firefox will open them in background new tabs on the side. Now I want to do the same from my Android tablet where middle click is not available.
1) Best: Is there an easy way to middle click on a tablet ?
2) Otherwise something better than a long press to simulate right click then open in new tab ?
3) I'm currently trying a TamperMonkey solution based on other questions found here:
link.addEventListener('click', function(event){event.preventDefault();return newBackgroundTab(this);}, false);
function newBackgroundTab(node) {
var newWindow = window.open("about:blank", "_blank");
newWindow.blur();
window.focus();
newWindow.location.href = node.href;
return false;
}
It also need to set the dom.disable_window_flip option to false in Firefox.
This works on desktop, but not on Android, focus stays on the new tab even though the disable option was already on false by default.
Related
Im using Gluon to develop javafx applications to Android, Iphone (and to desktop). When I export a test application to my Android phone (Marshmallow 6.0) - I cannot hold down onto text to access the menu from where you can copy text (the context menu)
(Which is an example of what you can do with a context menu - and is not a question of how to copy text on long hold specifically in Android).
This was possible on iphone 6 when testing it there.
How can I detected wether the device/operating system has a default context menu or not in java?
On Desktop there is a default ContextMenu that is created and installed in TextFieldBehavior (private API). If you don't set your own custom context menu, that will be the one used when a ContextMenuEvent is fired (with a right click event for instance).
On mobile, both Android and iOS have a ContextMenu as well.
On iOS, it uses a native TextField (UITextField). When the long press event happens, it triggers the default context menu (on my iPad I can see a small magnifying glass, and after that the context menu shows up).
On Android, the JavaFX TextField has a custom skin, but shares the same private TextFieldBehavior as the desktop version. The problem in this case is the missing right click event that would trigger the ContextMenuEvent event.
That's why you have to fire manually a ContextMenuEvent event, as it was described in this question.
Conclusion: so far, this is basically required only on Android:
TextField textField = new TextField();
addPressAndHoldHandler(textField, Duration.seconds(1), event -> {
Bounds bounds = textField.localToScreen(textField.getBoundsInLocal());
textField.fireEvent(new ContextMenuEvent(ContextMenuEvent.CONTEXT_MENU_REQUESTED,
0, 0, bounds.getMinX() + 10, bounds.getMaxY() + 10, false, null));
});
I will try to explain this as clearly as possible. I have an android app using web view to basically load a webpage as my app. I have everything working great, however the back button seems to be an issue. I have set this page up all on one html page, it will load in a div when certain buttons are clicked to give the feel of a new page without actually having one. I basically want the back button (on the android tablet or smartphone) to load the previously loaded div, but I have no idea where to start with this. Here is what the content switching jquery looks like -
function contentSwitcher(settings){
var settings = {
contentClass : '.contentToLoad',
navigationId : '#sideMenu',
servFront : '#clickHomeHome'
};
//Hide all of the content except the first one on the nav
$(settings.contentClass).not(':first').hide();
$(settings.navigationId).find('li:first').addClass('active');
//onClick set the active state,
//hide the content panels and show the correct one
$(settings.navigationId).find('a').click(function(e){
var contentToShow = $(this).attr('href');
contentToShow = $(contentToShow);
//dissable normal link behaviour
e.preventDefault();
//set the proper active class for active state css
$(settings.navigationId).find('li').removeClass('active');
$(this).parent('li').addClass('active');
//hide the old content and show the new
$(settings.contentClass).hide();
contentToShow.show("slow");
});
}
contentSwitcher();
});
note: I've cropped out a bunch of it just to show how it works on a basic level.
Does anyone have any suggestions as to where to begin. I'd just like the back button function to be able to maybe check a started previous div name stored somewhere and load that.
thanks!
You can try using the History API. There are numerous tutorials on the web e.g. this one is quite good:
http://diveintohtml5.info/history.html
Basically this is how it works. When the user clicks the link for the div to show you push the state to the history stack.
history.pushState({<object with any information about state>}, pageTitle, newUrl);
This will push the state to the history stack meaning that when the user presses the back button on any modern browser like webkit it will take that state into consideration. When back action is taken it will then pop the state from the history stack. This action you have to listen to and handle in any way you see fit:
window.addEventListener("popstate", function(event) {
// event object contains the information from the pushed state
// do whatever needed to load the previous page here
});
The History API requires you to structure your code in a certain way for it to work well. For this I would recommend to use some existing framework that handle the back events for you e.g. Backbone.js. Hope this helps.
I am using titanium appecelerator to build an app in both ios and android.
I use the following code to create a tab group and add a tab to it.
var localTabGroup = Ti.UI.createTabGroup();
var planTab = Ti.UI.createTab({
title : NYC.Common.StringConstant.TAB_TITLE_PLAN,
icon : NYC.Common.ResourcePathConstant.IMG_TAB_PLAN,
window : planTabWin
});
localTabGroup.open();
And call the following function to create a window and add it to the tab
addWindowToTabGroup : function(window) {
tabGroup.activeTab.open(window, {
animated : true
});
},
Now, I often have to remove window from the stack of the tab ( eg: on android back button or ios navigation bar back)
Till now, I use window.close() to remove the window from the stack . But, it always shows warnings like.
[ERROR][TiBaseActivity( 378)] (main) [3320,4640528] Layout cleanup.
[WARN][InputManagerService( 62)] Window already focused, ignoring focus gain of: com.android.internal.view.IInputMethodClient$Stub$Proxy#406e4258
I was just wondering if I am following the correct approach? Or is there a better way to remove a window from the tab?
Thanks.
Tabs behave a lot differently on iOS and Android, On Android, the tab does not maintain a stack of windows. Calling open opens a new, heavyweight window, which by default covers the tab group entirely.This is very different from iOS, but it is for Android applications. Users always use the Back button to close the window and return to the tab group.
This may be happening because you are trying to remove the window even though natively Android already removes it. Check out the Android Implementation Notes of the docs here
To completely eliminate this problem, I would just open up a modal window without using the TabGroup, this would be more cross platform:
addWindowToTabGroup : function(window) {
window.open({
modal : true,
animated : true
});
}
This will open a modal window which behaves the same on both platforms, and can be handled easily by the native back button functionality.
So, I've drunk the web-app kool-aid, and I'm switching from building Android native apps to building web apps.
But I'm having really bad problems on Android browsers with the address bar (update: specifically, my HTC Desire Z running Android 2.3.3, I'm not sure how many other versions it affects):
Problem 1: While the page is loading, the address bar hides
the top ~30px of content. (Why on earth does it do this?!)
Problem 2:
In some situations, the address bar won't go away - this occurs for
me in portrait when the connection speed is slow.
So on some occasions, the address bar hides the top 30px of content permanently. This is seriously broken.
I borrowed some code from another StackOverflow question to try to fix this:
if (navigator.userAgent.match(/Android/i)) {
window.scrollTo(0,0); // reset in case prev not scrolled
var nPageH = $(document).height();
var nViewH = window.outerHeight;
if (nViewH > nPageH) {
nViewH = nViewH / window.devicePixelRatio;
$('BODY').css('height',nViewH + 'px');
}
window.scrollTo(0,1);
}
But it doesn't seem to work reliably - not to mention that it's a horrible solution. What can I do?
What's your phone and your phones android version? Im having a galaxy s2 - the address bar is not implemented as an overlay there, the real content is below, not behind the address bar. If you scroll down the addressbar will go up and it's not visible anymore. Anyway, that is NOT a bug, it's a feature! The user could not go away if he entered your site once, if you would do that. If you don't want this 'annoying' addressbar, create a 'normal' android app with an WebView and load your desired site within there.
Here's the NON-jQuery solution that instantly removes the address bar without scrolling. Also, it works when you rotate the browser's orientation.
function hideAddressBar(){
if(document.documentElement.scrollHeight<window.outerHeight/window.devicePixelRatio)
document.documentElement.style.height=(window.outerHeight/window.devicePixelRatio)+'px';
setTimeout(window.scrollTo(1,1),0);
}
window.addEventListener("load",function(){hideAddressBar();});
window.addEventListener("orientationchange",hideAddressBar());
It should work with the iPhone also, but I couldn't test this.
I'm new to web applications for Android..
How can you add a bookmark on the home screen from a web page using Javascript from the click of a button?
If we make an easy way for users to bookmark pages, they will show some interest in bookmarking them. This is one of the requirement for my projects.
How can this be done?
Some of the people answering here seem to not understand that you want something for mobile, not IE, Firefox, etc. They also don't seem to read very well where you said "website", not "mobile app". However, I believe I have read your question properly.
There's extremely high odds that you'll probably also want this for iPhone, so I'll answer this for iPhone and Android as well.
For iPhone, it's as simple as using this script:
http://code.google.com/p/mobile-bookmark-bubble/
For Android, it's not so pretty, unfortunately. You'll have to make a button or hyperlink that redirects to an instructions page on your site. The instructions will tell web visitors to do "Settings > More > Add Shortcut to Home" and hope they "get it".
One option for Android is that you can fork mobile-bookmark-bubble, make it load at the bottom of the page without the bottom triangle, and make it read, "Click the Settings button > More > Add Shortcut to Home". As well, you might want to put the 2 bars icon of what the Settings button looks like right next to "Settings button".
As for how to customize the icon that gets created, I'm still researching that and will update this answer when I find out.
Here is a possible workaround, and while it isn't exactly what you want, I think it is the easiest solution as I'm highly skeptical that android allows web pages to automatically issue intents to a device, as this would be a potential security problem. Someone please correct me if I'm wrong
I recommend that you create an app that is simply a wrapper around a bookmark. When the user clicks on your app, your app creates an intent that simply opens the device's default web browser to your page. While this will require the users install a app it has a few advantages over a plain bookmark. You will be able to track how many people have your app/bookmark installed, how often they use it etc. You can also provide a nice looking icon instead of using the stock "bookmark" icon.
Upload the app to the market as a free app and place a "bookmark this" link on your webpage that simply directs the user to download your free app.
You can create a web page shortcut on home screen using this code. Provide the necessary info like url, title etc..
final Intent in = new Intent();
final Intent shortcutIntent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
long urlHash = url.hashCode();
long uniqueId = (urlHash << 32) | shortcutIntent.hashCode();
shortcutIntent.putExtra(Browser.EXTRA_APPLICATION_ID, Long.toString(uniqueId));
in.putExtra(Intent.EXTRA_SHORTCUT_INTENT, shortcutIntent);
in.putExtra(Intent.EXTRA_SHORTCUT_NAME, title);
in.putExtra(Intent.EXTRA_SHORTCUT_ICON_RESOURCE,
Intent.ShortcutIconResource.fromContext(
BrowserBookmarksPage.this,
R.drawable.ic_launcher_shortcut_browser_bookmark));
in.setAction("com.android.launcher.action.INSTALL_SHORTCUT");
//or in.setAction(Intent.ACTION_CREATE_SHORTCUT);
sendBroadcast(in);
Update
The browser does not recognise the intent scheme, so there is no way you can add a shortcut to your webpage from your webpage.
This can help
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("a.jQueryBookmark").click(function(e){
e.preventDefault(); // this will prevent the anchor tag from going the user off to the link
var bookmarkUrl = this.href;
var bookmarkTitle = this.title;
if (window.sidebar) { // For Mozilla Firefox Bookmark
window.sidebar.addPanel(bookmarkTitle, bookmarkUrl,"");
} else if( window.external || document.all) { // For IE Favorite
window.external.AddFavorite( bookmarkUrl, bookmarkTitle);
} else if(window.opera) { // For Opera Browsers
$("a.jQueryBookmark").attr("href",bookmarkUrl);
$("a.jQueryBookmark").attr("title",bookmarkTitle);
$("a.jQueryBookmark").attr("rel","sidebar");
} else { // for other browsers which does not support
alert('Your browser does not support this bookmark action');
return false;
}
});
});
</script>
<h2>Click on the respective links below to bookmark the same</h2>
DeveloperSnippets, Tech Video Bytes, Witty Sparks, Snehah.com
For more info, go to this link ( http://www.developersnippets.com/2009/05/10/simple-bookmark-script-using-jquery/)