mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-05 08:35:26 +00:00
Fix 43119 -- make the Page Info dialog pretty, and 49187 -- allow copy/drag in view source. r=ben
This commit is contained in:
parent
0ef9800d53
commit
91337793fb
@ -20,25 +20,33 @@
|
||||
* Contributor(s): smorrison@gte.com
|
||||
*/
|
||||
|
||||
function onLoadPageInfo() {
|
||||
function onLoadPageInfo()
|
||||
{
|
||||
var page = window.opener.frames[0].document;
|
||||
//var page = window.frames.content.document;
|
||||
var root = document.getElementById("cont");
|
||||
|
||||
makeDocument(page, root);
|
||||
var hasimages = makeImageTree(page, root);
|
||||
makeFormTree(page, root);
|
||||
|
||||
if(hasimages) {
|
||||
var iframe = document.createElement("iframe");
|
||||
iframe.setAttribute("name", "view");
|
||||
iframe.setAttribute("src", "about:blank");
|
||||
iframe.setAttribute("flex", "4");
|
||||
root.appendChild(iframe);
|
||||
var formTreeHolder = document.getElementById("formtreecontainer");
|
||||
var hasForm = makeFormTree(page, formTreeHolder);
|
||||
if (hasForm)
|
||||
{
|
||||
var formBox = document.getElementById("formtreecontainer");
|
||||
formBox.removeAttribute("collapsed");
|
||||
}
|
||||
|
||||
var imageTreeHolder = document.getElementById("imagetreecontainer");
|
||||
var hasimages = makeImageTree(page, imageTreeHolder);
|
||||
if (hasimages)
|
||||
{
|
||||
var imageBox = document.getElementById("image_items");
|
||||
imageBox.removeAttribute("collapsed");
|
||||
}
|
||||
}
|
||||
|
||||
function makeDocument(page, root) {
|
||||
function makeDocument(page, root)
|
||||
{
|
||||
var title = page.title;
|
||||
var url = page.URL;
|
||||
var lastmodified;
|
||||
@ -50,41 +58,21 @@ function makeDocument(page, root) {
|
||||
lastmodified = lastmod;
|
||||
}
|
||||
|
||||
document.getElementById("titletext").appendChild(document.createTextNode(title));
|
||||
document.getElementById("urltext").appendChild(document.createTextNode(url));
|
||||
document.getElementById("lastmodifiedtext").appendChild(document.createTextNode(lastmodified));
|
||||
document.getElementById("titletext").setAttribute("value", title);
|
||||
document.getElementById("urltext").setAttribute("value", url);
|
||||
document.getElementById("lastmodifiedtext").setAttribute("value", lastmodified);
|
||||
}
|
||||
|
||||
function makeFormTree(page, root) {
|
||||
function makeFormTree(page, root)
|
||||
{
|
||||
var form_list = page.forms;
|
||||
for(i=0; i < form_list.length; i++) {
|
||||
if(i == 0) {
|
||||
var tree = document.createElement("tree");
|
||||
tree.setAttribute("flex", "4");
|
||||
var treehead = tree.appendChild(document.createElement("treehead"));
|
||||
var treerow = treehead.appendChild(document.createElement("treerow"));
|
||||
if (form_list.length == 0) return false;
|
||||
|
||||
var treecolgroup = tree.appendChild(document.createElement("treecolgroup"));
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "2");
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "1");
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "1");
|
||||
var treechildren = document.getElementById("formchildren");
|
||||
|
||||
var treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Form Action");
|
||||
treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Method");
|
||||
treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Name");
|
||||
|
||||
var treechildren = document.createElement("treechildren");
|
||||
tree.appendChild(treechildren);
|
||||
|
||||
root.appendChild(tree);
|
||||
}
|
||||
var treeitem = treechildren.appendChild(document.createElement("treeitem"));
|
||||
for (var i = 0; i < form_list.length; i++)
|
||||
{
|
||||
var treeitem = document.createElement("treeitem");
|
||||
var treerow_elem = treeitem.appendChild(document.createElement("treerow"));
|
||||
|
||||
var treecell_elem = treerow_elem.appendChild(document.createElement("treecell"));
|
||||
@ -95,53 +83,30 @@ function makeFormTree(page, root) {
|
||||
|
||||
treecell_elem = treerow_elem.appendChild(document.createElement("treecell"));
|
||||
treecell_elem.setAttribute("value", form_list[i].name);
|
||||
tree.appendChild(treechildren);
|
||||
|
||||
treechildren.appendChild(treeitem);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
function makeImageTree(page, root) {
|
||||
function makeImageTree(page, root)
|
||||
{
|
||||
var img_list = page.images;
|
||||
var ret = false;
|
||||
if (img_list.length == 0) return false;
|
||||
|
||||
for(i=0; i < img_list.length; i++) {
|
||||
if(i == 0) {
|
||||
var tree = document.createElement("tree");
|
||||
tree.setAttribute("flex", "1");
|
||||
var treechildren = document.getElementById("imageschildren");
|
||||
|
||||
var treehead = tree.appendChild(document.createElement("treehead"));
|
||||
var treerow = treehead.appendChild(document.createElement("treerow"));
|
||||
for (var i = 0; i < img_list.length; i++)
|
||||
{
|
||||
var treeitem = document.createElement("treeitem");
|
||||
treeitem.setAttribute("container", "true");
|
||||
treeitem.setAttribute("parent", "true");
|
||||
|
||||
var treecolgroup = tree.appendChild(document.createElement("treecolgroup"));
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "8");
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "2");
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "2");
|
||||
var treecol = treecolgroup.appendChild(document.createElement("treecol"));
|
||||
treecol.setAttribute("width", "4");
|
||||
|
||||
var treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Image URLs");
|
||||
treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Width");
|
||||
treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Height");
|
||||
treecell = treerow.appendChild(document.createElement("treecell"));
|
||||
treecell.setAttribute("value", "Alt Text");
|
||||
|
||||
var treechildren = document.createElement("treechildren");
|
||||
tree.appendChild(treechildren);
|
||||
|
||||
root.appendChild(tree);
|
||||
}
|
||||
var treeitem = treechildren.appendChild(document.createElement("treeitem"));
|
||||
var treerow_elem = treeitem.appendChild(document.createElement("treerow"));
|
||||
|
||||
var treecell_elem = treerow_elem.appendChild(document.createElement("treecell"));
|
||||
treecell_elem.setAttribute("value", img_list[i].src);
|
||||
treecell_elem.addEventListener("click", openImage, true);
|
||||
|
||||
treecell_elem = treerow_elem.appendChild(document.createElement("treecell"));
|
||||
treecell_elem.setAttribute("value", img_list[i].width);
|
||||
@ -152,13 +117,28 @@ function makeImageTree(page, root) {
|
||||
treecell_elem = treerow_elem.appendChild(document.createElement("treecell"));
|
||||
treecell_elem.setAttribute("value", img_list[i].alt);
|
||||
|
||||
tree.appendChild(treechildren);
|
||||
ret = true;
|
||||
treechildren.appendChild(treeitem);
|
||||
}
|
||||
|
||||
return ret;
|
||||
return true;
|
||||
}
|
||||
|
||||
function openImage(e) { window.frames.view.document.location.href = e.target.getAttribute("value"); }
|
||||
function onImageSelect()
|
||||
{
|
||||
var tree = document.getElementById("images_tree");
|
||||
var imageFrame = document.getElementById("image_frame");
|
||||
|
||||
if (tree.selectedItems.length == 1)
|
||||
{
|
||||
var clickedRow = tree.selectedItems[0].firstChild;
|
||||
var firstCell = clickedRow.firstChild;
|
||||
var imageUrl = firstCell.getAttribute("value");
|
||||
imageFrame.setAttribute("src", imageUrl);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function BrowserClose()
|
||||
{
|
||||
window.close();
|
||||
}
|
||||
|
@ -27,29 +27,114 @@
|
||||
<?xml-stylesheet href="chrome://navigator/skin/" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://navigator/skin/pageInfo.css" type="text/css"?>
|
||||
|
||||
<!DOCTYPE window SYSTEM "chrome://navigator/locale/viewSource.dtd" >
|
||||
<?xul-overlay href="chrome://navigator/content/navigatorOverlay.xul"?>
|
||||
|
||||
<!DOCTYPE window SYSTEM "chrome://navigator/locale/pageInfo.dtd">
|
||||
|
||||
<window id="main-window" xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
||||
title="&mainWindow.title;"
|
||||
title="&pageInfo.title;"
|
||||
titlemodifier="&mainWindow.titlemodifier;"
|
||||
titlepreface="&mainWindow.preface;"
|
||||
titlemenuseparator ="&mainWindow.titlemodifierseperator;"
|
||||
windowtype="Browser:view-source"
|
||||
windowtype="Browser:page-info"
|
||||
onload="onLoadPageInfo()"
|
||||
align="vertical" width="600" height="480">
|
||||
align="vertical" class="dialog"
|
||||
width="400" height="320"
|
||||
screenX="10" screenY="10"
|
||||
persist="screenX screenY width height sizemode">
|
||||
|
||||
<html:script src="chrome://navigator/content/pageInfo.js"></html:script>
|
||||
<script src="chrome://navigator/content/pageInfo.js"></script>
|
||||
|
||||
<box id="cont" orient="vertical" flex="1" style="margin: 1em; min-width: 1px; min-height: 1px;">
|
||||
<html:div class="title">The document has the following structure:</html:div>
|
||||
<box orient="vertical" id="documentinfo">
|
||||
<html:div id="titletext">Title: </html:div>
|
||||
<html:div id="urltext">URL: </html:div>
|
||||
<html:div id="lastmodifiedtext">Last Modified: </html:div>
|
||||
<broadcasterset id="broadcasterset"/>
|
||||
|
||||
<commands id="commands">
|
||||
<commandset id="globalEditMenuItems"/>
|
||||
<commandset id="selectEditMenuItems"/>
|
||||
<commandset id="undoEditMenuItems"/>
|
||||
<commandset id="clipboardEditMenuItems"/>
|
||||
</commands>
|
||||
|
||||
<!-- keys are appended from the overlay -->
|
||||
<keyset id="keyset"/>
|
||||
|
||||
<box id="cont" orient="vertical" flex="1">
|
||||
|
||||
<text class="header label" value="&pageInfo.description;"/>
|
||||
<box class="inset" orient="vertical" id="documentinfo">
|
||||
<grid>
|
||||
<columns>
|
||||
<column flex="1"/>
|
||||
<column flex="3"/>
|
||||
</columns>
|
||||
|
||||
<rows>
|
||||
<row>
|
||||
<text class="label" value="&pageInfo.pageTitle;"/> <text class="label" id="titletext" value=""/>
|
||||
</row>
|
||||
<row>
|
||||
<text class="label" value="&pageInfo.URL;"/> <text class="label" id="urltext" value=""/>
|
||||
</row>
|
||||
<row>
|
||||
<text class="label" value="&pageInfo.lastModified;"/> <text class="label" id="lastmodifiedtext" value=""/>
|
||||
</row>
|
||||
|
||||
</rows>
|
||||
</grid>
|
||||
</box>
|
||||
<!-- trees are appended here -->
|
||||
|
||||
<box id="formtreecontainer" flex="1" orient="vertical" collapsed="true">
|
||||
<text class="header label" value="Forms on this page"/>
|
||||
<tree id="forms_tree" class="inset" flex="1">
|
||||
<treecolgroup>
|
||||
<treecol flex="2"/>
|
||||
<treecol flex="1"/>
|
||||
<treecol flex="1"/>
|
||||
</treecolgroup>
|
||||
<treehead>
|
||||
<treerow>
|
||||
<treecell value="&pageInfo.formAction;" class="treecell-header treecell-inset-header"/>
|
||||
<treecell value="&pageInfo.formMethod;" class="treecell-header treecell-inset-header"/>
|
||||
<treecell value="&pageInfo.formName;" class="treecell-header treecell-inset-header"/>
|
||||
</treerow>
|
||||
</treehead>
|
||||
<treechildren id="formchildren" flex="1">
|
||||
</treechildren>
|
||||
</tree>
|
||||
|
||||
</box>
|
||||
<!-- for testing, use this iframe, and change the page access point in pageInfo.js
|
||||
<html:iframe src="file:///tmp/so.html" name="content" width="0" height="0"/>
|
||||
-->
|
||||
|
||||
<box id="image_items" orient="vertical" flex="1" collapsed="true">
|
||||
<box id="imagetreecontainer" flex="1" orient="vertical">
|
||||
<text class="header label" value="Images on this page"/>
|
||||
<tree id="images_tree" class="inset" onselect="onImageSelect()" flex="1">
|
||||
<treecolgroup>
|
||||
<treecol flex="8"/>
|
||||
<treecol flex="2"/>
|
||||
<treecol flex="2"/>
|
||||
<treecol flex="4"/>
|
||||
</treecolgroup>
|
||||
<treehead>
|
||||
<treerow>
|
||||
<treecell value="&pageInfo.imageURL;" class="treecell-header treecell-inset-header"/>
|
||||
<treecell value="&pageInfo.imageWidth;" class="treecell-header treecell-inset-header"/>
|
||||
<treecell value="&pageInfo.imageHeight;" class="treecell-header treecell-inset-header"/>
|
||||
<treecell value="&pageInfo.imageAltText;" class="treecell-header treecell-inset-header"/>
|
||||
</treerow>
|
||||
</treehead>
|
||||
<treechildren id="imageschildren" flex="1">
|
||||
</treechildren>
|
||||
</tree>
|
||||
</box>
|
||||
|
||||
<splitter orient="vertical" collapse="after">
|
||||
<grippy/>
|
||||
</splitter>
|
||||
|
||||
<box id="imagepreviewcontainer">
|
||||
<iframe id="image_frame" class="inset" src="about:blank" flex="1"/>
|
||||
</box>
|
||||
</box>
|
||||
</box>
|
||||
|
||||
</window>
|
||||
|
@ -1,6 +1,9 @@
|
||||
<?xml version="1.0"?>
|
||||
<?xml-stylesheet href="chrome://navigator/skin/" type="text/css"?>
|
||||
|
||||
<?xul-overlay href="chrome://navigator/content/navigatorOverlay.xul"?>
|
||||
<?xul-overlay href="chrome://communicator/content/tasksOverlay.xul"?>
|
||||
|
||||
<!DOCTYPE window SYSTEM "chrome://navigator/locale/viewSource.dtd" >
|
||||
<window id="main-window" xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
||||
@ -10,36 +13,39 @@
|
||||
titlepreface="&mainWindow.preface;"
|
||||
titlemenuseparator ="&mainWindow.titlemodifierseperator;"
|
||||
windowtype="Browser:view-source"
|
||||
align="vertical" width="640" height="480">
|
||||
align="vertical" width="640" height="480"
|
||||
screenX="10" screenY="10"
|
||||
persist="screenX screenY width height sizemode">
|
||||
|
||||
<html:script src="chrome://navigator/content/viewsource.js"></html:script>
|
||||
|
||||
<script language="javascript" src="chrome://global/content/nsJSSupportsUtils.js"></script>
|
||||
<script language="javascript" src="chrome://global/content/nsJSComponentManager.js"></script>
|
||||
<script language="javascript" src="chrome://global/content/nsTransferable.js"></script>
|
||||
<script language="javascript" src="chrome://global/content/nsDragAndDrop.js"></script>
|
||||
|
||||
<script language="javascript" src="chrome://navigator/content/viewSourceDD.js"></script>
|
||||
<script language="javascript" src="chrome://navigator/content/viewsource.js"></script>
|
||||
|
||||
<broadcasterset id="broadcasterset"/>
|
||||
|
||||
<commands id="commands">
|
||||
<commandset id="globalEditMenuItems"/>
|
||||
<commandset id="selectEditMenuItems"/>
|
||||
<commandset id="undoEditMenuItems"/>
|
||||
<commandset id="clipboardEditMenuItems"/>
|
||||
</commands>
|
||||
|
||||
<!-- keys are appended from the overlay -->
|
||||
<keyset id="keyset"/>
|
||||
|
||||
<!-- Menu -->
|
||||
|
||||
<iframe id="content-frame" type="content-primary" name="content" src="about:blank" flex="100%"/>
|
||||
<box id="appcontent" align="vertical" flex="1"
|
||||
ondragover="nsDragAndDrop.dragOver(event, contentAreaDNDObserver);"
|
||||
ondraggesture="nsDragAndDrop.startDrag(event, contentAreaDNDObserver);">
|
||||
|
||||
<!--
|
||||
<box align="horizontal" id="status-bar">
|
||||
<iframe id="content-frame" type="content-primary" name="content" src="about:blank" flex="1"/>
|
||||
|
||||
<box id="security-box" class="insecure" align="horizontal" flex="100%">
|
||||
<box align="vertical" style="width:100px">
|
||||
<spring flex="100%"/>
|
||||
<progressmeter id="statusbar-icon" mode="normal" value="0" onclick="dumpProgress()">
|
||||
<observes element="Browser:LoadingProgress" attribute="mode"/>
|
||||
<observes element="Browser:Throbber" attribute="busy" onbroadcast="onProgress()"/>
|
||||
</progressmeter>
|
||||
<spring flex="100%"/>
|
||||
</box>
|
||||
|
||||
<titledbutton id="statusText" align="right" flex="100%" value="Document: Done" style="font-family:sans-serif;font-size:2.5mm">
|
||||
<observes element="Browser:Status" attribute="value" onbroadcast="onStatus()"/>
|
||||
</titledbutton>
|
||||
|
||||
<spring flex="100%"/>
|
||||
|
||||
<titledbutton align="right" value="Build ID: 2000020608" style="font-family:sans-serif;font-size:2.5mm;"/>
|
||||
</box>
|
||||
</box>
|
||||
-->
|
||||
|
||||
</window>
|
||||
|
@ -59,7 +59,39 @@ function createBrowserInstance()
|
||||
.classes[ "component://netscape/appshell/component/browser/instance" ]
|
||||
.createInstance( Components.interfaces.nsIBrowserInstance );
|
||||
if ( !appCore ) {
|
||||
alert( "Error creating browser instance\n" );
|
||||
dump("Error creating browser instance\n");
|
||||
}
|
||||
}
|
||||
|
||||
function BrowserClose()
|
||||
{
|
||||
window.close();
|
||||
}
|
||||
|
||||
function BrowserFind()
|
||||
{
|
||||
if (appCore) {
|
||||
appCore.find();
|
||||
} else {
|
||||
dump("BrowserAppCore has not been created!\n");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function BrowserFindAgain()
|
||||
{
|
||||
if (appCore) {
|
||||
appCore.findNext();
|
||||
} else {
|
||||
dump("BrowserAppCore has not been created!\n");
|
||||
}
|
||||
}
|
||||
|
||||
function BrowserSelectAll() {
|
||||
if (appCore != null) {
|
||||
appCore.selectAll();
|
||||
} else {
|
||||
dump("BrowserAppCore has not been created!\n");
|
||||
}
|
||||
}
|
||||
|
||||
|
23
suite/locales/en-US/chrome/browser/pageInfo.dtd
Normal file
23
suite/locales/en-US/chrome/browser/pageInfo.dtd
Normal file
@ -0,0 +1,23 @@
|
||||
<!-- LOCALIZATION NOTE (mainWindow.title) : DONT_TRANSLATE -->
|
||||
<!ENTITY mainWindow.title "Mozilla">
|
||||
<!-- LOCALIZATION NOTE (mainWindow.titlemodifier) : DONT_TRANSLATE -->
|
||||
<!ENTITY mainWindow.titlemodifier "Mozilla">
|
||||
<!-- LOCALIZATION NOTE (mainWindow.titlemodifierseperator) : DONT_TRANSLATE -->
|
||||
<!ENTITY mainWindow.titlemodifierseperator " - ">
|
||||
<!ENTITY mainWindow.preface "Info for: ">
|
||||
|
||||
<!ENTITY pageInfo.title "Page Info">
|
||||
<!ENTITY pageInfo.description "Information about the current page">
|
||||
|
||||
<!ENTITY pageInfo.pageTitle "Title:">
|
||||
<!ENTITY pageInfo.URL "URL:">
|
||||
<!ENTITY pageInfo.lastModified "Last Modified:">
|
||||
|
||||
<!ENTITY pageInfo.formAction "Form Action">
|
||||
<!ENTITY pageInfo.formMethod "Method">
|
||||
<!ENTITY pageInfo.formName "Name">
|
||||
|
||||
<!ENTITY pageInfo.imageURL "Image URL">
|
||||
<!ENTITY pageInfo.imageWidth "Width">
|
||||
<!ENTITY pageInfo.imageHeight "Height">
|
||||
<!ENTITY pageInfo.imageAltText "Alt Text">
|
Loading…
Reference in New Issue
Block a user