Closed

Reuse Firebug JavaScript library to visualize HTML source code

Firefox extension Firebug ([url removed, login to view]) has a very nice HTML inspecting library. The code is reused in Firebug Lite ([url removed, login to view]) tool, which can inject HTML inspecting console (html+js) into any web page on any web browser.

I want you to reuse the same code and make a new JavaScript library that would have the following capabilities:

1) it can be loaded into a web page as JavasScript files

2) given an ID of <div> element in a web page and HTML code as a string it would format the HTML code, place it into the <div> element, and let to browser the code exactly as it is done in Firebug Lite HTML inspecting window.

3) browsing the HTML code inside <div> should look like and behave exactly as it is while browsing code in Firebug Lite

4) there would be an option to hook on click and right click events

5) once clicked inside HTML inspecting DIV, the selected code would appear in a separate <textarea> tag.

6) every line of reused code must be marked( commented) as reused with reference to original source files in firebuglite library

7) if needed the jQuery library can be used.

an initialization of the library could look anything similar to:

###########

var myInspector = new FireBugLiteInspector (id_of_a_div, "<html><body><div>my page to be inspected</div></body><html>");

[url removed, login to view](function(selected_code,lineNumber) {

$('#textarea').val(selected_code);

});

###########

I have attached a screenshot depicting how the div with HTML code should look like ([url removed, login to view])

Skills: CSS, Firefox, HTML, Javascript, jQuery / Prototype

See more: string library, javascript tool, javascript code library, val , screenshot div, inject javascript firefox, javascript click tag, css html tag, jquery html format, firefox hook, png library, source code tool, html screenshot, string html, web browser source, firefox javascript inject, div css html, element css, tag code, textarea function javascript, jquery screenshot, html code css, jquery tag, png div css, html source code

About the Employer:
( 0 reviews ) Lithuania

Project ID: #5159694

1 freelancer is bidding on average $206 for this job

chinbochen

Hello, I'm a Java, J2EE web application developer with over 10 years experience. I'm very happy to work for you. Thanks.

$206 USD in 3 days
(3 Reviews)
3.4