Re: Build an UI for chrome extension to display the result from background script.

[Jude Osborn]

Sounds like you need to read over the docs in order to get a good overview of chrome extension development, but in a nutshell, here's what you need to do:

1. Create an HTML file that will contain the table, such as "index.html".

2. In your background code (code.js) load the HTML file when the user clicks the extension button. Something like this:

chrome.browserAction.onClicked.addListener(function() {

  chrome.tabs.create({url: 'index.html'});

});

3. Create a JavaScript file to handle the rendering of the data to the table, such as "render.js", and load that file in the HTML file in a script tag as usual.

4. Use Chrome's messaging system to pass data from the background page to "render.js". 

5. Render your table to index.html with JavaScript.

I'm not going to get into details about exactly how to render the table with JavaScript -- you'll need to know JavaScript in order to do that, but hopefully those steps point you in the right direction.

On Wednesday, November 7, 2012 6:40:12 PM UTC+11, Nitin Salunke wrote:

following is my manifest.json file

{
    "name": "Demo Extension",
    "version": "1.0.0",
    "manifest_version": 2,
    "browser_action": {
    "default_icon": "icon.png"
    },


    "background": {
    "scripts": ["jquery-1.7.2.js","code.js"]
    },

    "content_scripts": [
        {
            "matches": ["*://*/*"],
            "js": ["jquery-1.7.2.js","content.js"],
            "css": ["panel.css"],
            "run_at": "document_end"
        }
    ],

    "permissions": [
        "webRequest",
        "tabs",
        "http://*/*",
        "https://*/*",
    ]
}

My main extension logic is in the code.js file and even the results are available over there. Now i have to dsiplay those results in a table to the users. What will you suggest me to do.

I have no clue what to do. Just i know that i have to build a UI and display my table on to it.

Thanking you all in advance :)

[Nitin Salunke]

No u got me wrong.

I want to display that data in the current tab only.
I dont want to load that html in a new tab..........

I want to design a panel like firebug lite got at the bottom...........
and display that table in that panel.

[Jude Osborn]

LOL, sorry for the long, pointless post then. At least I got a bit of tutorial writing practice i guess. I've never created a few frame like that either, unfortunately. I know it's possible to augment the developer tools but have no idea if you can create your own frame entirely. I'd be curious to know, actually.

--
You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msg/chromium-extensions/-/8OAhCS4axAkJ.
To post to this group, send email to chromium-...@chromium.org.
To unsubscribe from this group, send email to chromium-extens...@chromium.org.
For more options, visit this group at http://groups.google.com/a/chromium.org/group/chromium-extensions/?hl=en.