How to add dialog box on webpage with Chrome Extension? - dialog

Does anyone know how to add a dialog box similar to the one used by Google's Voice extension (it's the one in the blue activated by clicking on the phone number)?
Thanks,
Joe Chin

Chrome doesn't come with any GUI API. Everything you see is made in plain javascript and css. You would need to either find some js library that helps with creating dialogs, or style them yourself (that's what that Google Voice extension looks like is doing).

Related

Desktop gadet/app for Windows

I want to make a desktop gadget like the Sticky notes that we have but just with some additional functionality.
Now that the gadgets have been discontinued in windows, i am not sure about what technology to use to create this app.
I want to create a custom UI like just a Add button on the side of the desktop and clicking on it would create notes.
I was trying to use node-webkit but seems that will appear like a web page and not what I want. Can anyone tell me what should i use to achieve the result.
A Node Webkit window doesn't have to look like a webpage. You can use a frameless window and then design the UI to look however you want with HTML and CSS.
Frameless Window

Floating icon on other applications

I am curious to know how emojidom is able to show this icon on top of other applications. What it actually is? Because this icon pops up on whatsapp, hangouts, facebook messenger and other chatting applications. And also I can move this icon all around the screen. How is it doing so?
They may be using
android.permission.SYSTEM_ALERT_WINDOW
refer this
You should take a look at source of HALO implemented by ParanoidAndroid
https://github.com/ParanoidAndroid/HALO

How to insert menu-item into YouTube context-item

I need to know how i can insert menu-item into YouTube context-item using Google chrome extension.
I searched for that a lot and i found similar question but no any persuasive answer.
I need the solution very much.
The chrome extension API includes a Context Menu feature, but since the YouTube player uses Flash, there is a completely separate context menu that Chrome does not have direct control over.
So it is not possible to customize the context menu with the Chrome API. However, you may be able to get by with a (somewhat hacky) solution, such as covering the video with a transparent HTML DOM element. The DOM element should trigger Chrome's context menu instead of the Flash context menu.

How is the panel displayed when launching Chrome Hangout extension made to be always on top and pinned?

When launching the Chrome Extension Google-Hangouts, a panel initially appears that lists members and a link/button to create a new Hangout.
This panel is initially pinned to the bottom right of the browser window. When pinned like this, it remains always on top as a browser navigation session continues: users can go to different URLs, change tabs, etc. and that panel stays at the bottom right and stays on top of all other windows (or at least on top of the main browser window).
Once it's unpinned, you can drag it around the window, but it no longer stays always on top.
My question is, how was that achieved - what code, or what functions, do i need to call to create that window/panel so that it stays initially pinned and always on top? Is there some binding to some native code that's involved? Some other approach?
If anyone know and can show or explain, i would be hugely grateful as this feature is key to an extension i'm trying to build.
Thanks a lot!
This may not be an answer but to get a clue of what is happening I extracted the crx file to view its content there are a few OS specific files : ace.dll , libace.so and ace. After researching a bit i found this. This is a plugin. Hangouts extension is using ace plugin which is actually running on your desktop(i'm not sure about this). You can check this article
I found this related post: How to build an chrome extension like Google Hangouts
ACE is actually not what makes the window, Chrome has that capability built in, apparently. Even if you don't enable panels, extensions from Google can still make them, provided your OS is capable.

is there a firefox addon that provides jsFiddle like features

I just saw jsFiddle today and am wondering that is there a FireFox addon that provides jsFiddle like features. Especially when you enter the html and css, jsFiddle shows you a layout of the page. Is there any addon that shows such layout for "offline viewing"? I use Firebug but there isn't such layout. Does somebody know about it?
Not a firefox add-on, only in the interest of self-promotion:
I have created a Vim script with similar (but at the moment very limited) functionality: vimfiddler. Vim integrates with selenium to drive a browser. Provides a jsfiddlerish experience running locally on your own computer.
In Google Chrome you can edit every element of the page. Just open a new tab, hit F-12 and edit to your heart's desire. Add some css or javascript to the head tags, put whatever HTML you want in the body, and you're good to go.
This add-on sounds like what you need : https://addons.mozilla.org/en-us/firefox/addon/devtools-prototyper/?src=ss
Just install it, open the devtools, then switch to the "Prototyper" tab.

Resources