I created a simple chrome app which has only one text div element by id "sample". I'm testing on chromebook. The problem is this:
I typed few keys in text input.
I pressed the full screen button in Chromebook.
The focus on the text input element is lost.
This is the function i'm using to create the chrome app window
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('index.html',
{'bounds': {'width': 500, 'height': 309}});
});
I wrote a small javascript code to handle the full screen issue. But this is not working:
chrome.app.window.current().onFullscreened.addListener(function(){
var textbox = document.getElementById("sample");
textbox.focus();
});
Please help.
Put a call to console.log in your onFullscreened handler to verify that it's being called. The current() method returns an AppWindow object, which is certainly not what you want to attach the event handler to. Perhaps the contentWindow property of the AppWindow is what you want. Try that.
Related
I have a requirement that we should be able to copy an image displayed in our application, to Clipboard and paste it outside (Like on Excel).
I was trying the below code snippet (Inside a button Click).
Clipboard.generalClipboard.clear();
var dataLoaded:Boolean = Clipboard.generalClipboard.setData(ClipboardFormats.RICH_TEXT_FORMAT,
byteArray, false);
The dataLoaded object is true, however it does not paste anything when tried on Excel or MsPaint.
Do we have any way to achieve this?
Thanks.
The code you are showing is not enough in itself to get a successful transfer. Like many other operations within the security sandbox of a FP app (web) this code can only respond to a direct user interaction. So your code without any valid context cannot work of course but if called within a mouse down listener for example (a true user generated mouse event, creating a fake mouseevent would still not work) it should respond correctly:
private function handleMouseClick(event:MouseEvent):void
{
Clipboard.generalClipboard.clear();
var dataLoaded:Boolean = Clipboard.generalClipboard.setData(ClipboardFormats.RICH_TEXT_FORMAT, byteArray, false);
}
I am using kinetic-v4.3.0-beta2.js
I want to handle mobile touch event on group for ios & android.
I am binding event such as following
group.on('touchstart', function (evt) {
$('#onpopMenu').popup("open", { x: leftPosition, y: topPosition });
});
I tried 'touchend', 'touchstart' and 'tap'
Got partial success in "Tap" but in that case, shape is draggable so tap event is not properly fire because object will move from it's place.
but if shape is not draggable then it will work fine.
I tried 'touchend' and 'touchstart' event also but popup menu is close after event fire in iOs and android as I am opening Jquery Mobile Popup by Touching group!
The popup menu will only open for 2-3 seconds when the touchstart event fired.
Anyone faced the same problem with kinetic JS Mobile events? How to handle only "Click" or "Touch" event with it.
I checked this http://www.html5canvastutorials.com/kineticjs/html5-canvas-mobile-events/ for reference but had no luck!
I am developing application with Phonegap + JQM + Kinetics JS
Thanks in advance!
Keep in mind that your application is running inside a webview. This is why you've got these 2/3 seconds of delay on touch/click event.
This is why in all my PhoneGap dev, I use Fastclick.js. FastClick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers. The aim is to make your application feel less laggy and more responsive while avoiding any interference with your current logic.
You can find it here https://github.com/ftlabs/fastclick.
It's easy to use (if you're using jQuery) :
<script type='application/javascript' src='/path/to/fastclick.js'></script>
<script>
$(function() {
FastClick.attach(document.body);
});
</script>
I made a jsfiddle for you to test out the click/touch events.
From what I understand, you have a Kinetic.Group node that is draggable but you want to open up a popup using jquery mobile.
You are right that when you drag an object, the tap event does not fire. But you said otherwise the tap event works fine if the shape is not draggable. This leads me to believe:
You want a popup on "tap"
You want a popup on "dragend"
If so, all you need is to use both events like this:
group.on('tap dragend', function (evt) {
$('#onpopMenu').popup("open", { x: leftPosition, y: topPosition });
});
Please let me know if my assumptions are wrong, and I can work with you to get the right solution. I am guessing when you want to popup, so if you let me know exactly when you want a popup to occur that will help a lot.
You might want to also look into using evt.cancelBubble = true; http://www.html5canvastutorials.com/kineticjs/html5-canvas-cancel-event-bubble-propagation-with-kineticjs/
I have events working fine in Chrome and IE10 for Google Maps (APIv3) and RichMarkers. Problem is, the same code borks on Firefox19 with event undefined. So, this code works on Chrome and IE10...
google.maps.event.addListener( marker, 'mouseover', function(event) {
console.log(event);
});
But not on Firefox. Interestingly, attaching a CLICK event to the map object does work as you'd expect. The event object is visible within the called function in all browsers. So, does anyone have any idea as to how to fix this? I really need to pass the event object onwards as I have funcs that use it for positioning and so on.
Normally, I'd get around this using jQuery to attach the events, but this is not an option here.
Cheers
CT
There is no mouseover-event : http://google-maps-utility-library-v3.googlecode.com/svn/trunk/richmarker/docs/reference.html
Apply the mouseover-event to the content of the marker(the content must be a node)
I want to develop an extension that runs in the background and listens to keystrokes and stores them as a string in a variable. For example, if I have 5 tabs in a chrome browser window and I press a,b,c,d,e on each tab of the window; the final string should be abcde.
Could any please provide a sample code for this?
Help will be greatly appreciated.
You could add code like this to a content script:
var bodyElement = document.getElementsByTagName("body")[0];
bodyElement.addEventListener("keypress", function(e){
console.log(e);
console.log(String.fromCharCode(e.keyCode));
});
The body element must be loaded for this code to work, so use jQuery's $(document).ready(), or similar, or in the extension manifest set the run_at value for the script to document_end.
In Google Chrome's extension developer section, it says
The HTML pages inside an extension
have complete access to each other's
DOMs, and they can invoke functions on
each other. ... The popup's contents
are a web page defined by an HTML file
(popup.html). The popup doesn't need
to duplicate code that's in the
background page (background.html)
because the popup can invoke functions
on the background page
I've loaded and tested jQuery, and can access DOM elements in background.html with jQuery, but I cannot figure out how to get access to DOM elements in popup.html from background.html.
can you discuss why you would want to do that? A background page is a page that lives forever for the life time of your extension. While the popup page only lives when you click on the popup.
In my opinion, it should be refactored the other way around, your popup should request something from the background page. You just do this in the popup to access the background page:
chrome.extension.getBackgroundPage()
But if you insist, you can use simple communication with extension pages with sendRequest() and onRequest. Perhaps you can use chrome.extension.getViews
I understand why you want to do this as I have run into the problem myself.
The easiest thing I could think of was using Google's method of a callback - the sendRequest and onRequest methods work as well, but I find them to be clunky and less straightforward.
Popup.js
chrome.extension.getBackgroundPage().doMethod(function(params)
{
// Work with modified params
// Use local variables
});
Background.html
function doMethod(callback)
{
if(callback)
{
// Create/modify params if needed
var params;
// Invoke the callback
callback(params);
}
}
As other answers mention, you can call background.js functions from popup.js like so:
var _background = chrome.extension.getBackgroundPage();
_background.backgroundJsFunction();
But to access popup.js or popup.html from background.js, you're supposed to use the messages architecture like so:
// in background.js
chrome.runtime.sendMessage( { property: value } );
// in popup.js
chrome.runtime.onMessage.addListener(handleBackgroundMessages);
function handleBackgroundMessages(message)
{
if (message.property === value)
// do stuff
}
However, it seems that you can synchronously access popup.js from background.js, just like you can synchronously access the other way around. chrome.extension.getViews can get you the popup window object, and you can use that to call functions, access variables, and access the DOM.
var _popup = chrome.extension.getViews( { type: 'popup' } )[0];
_popup.popupJsFunction();
_popup.document.getElementById('element');
_popup.document.title = 'poop'
Note that getViews() will return [] if the popup is not open, so you have to handle that.
I'm not sure why no one else mentioned this. Perhaps there's some pitfalls or bad practices to this that I've overlooked? But in my limited testing in my own extension, it seems to work.