Skip to content

Commit 0ee7a70

Browse files
author
Joe Hanley
committed
Web inspector working
1 parent 398f1d3 commit 0ee7a70

File tree

3 files changed

+446
-0
lines changed

3 files changed

+446
-0
lines changed

‎web-inspector.css

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
.selected {
2+
border: 7px solid red;
3+
}
4+
5+
.inspector {
6+
width: 100%;
7+
position: absolute;
8+
top: 0px;
9+
left: 0px;
10+
height: 315px;
11+
background-color: white;
12+
z-index: 1000;
13+
padding: 0;
14+
}
15+
16+
.inspector .tray {
17+
width: 100%;
18+
}
19+
20+
.inspector .handle {
21+
height: 15px;
22+
position: relative;
23+
top: 300px;
24+
background-color: #A2122F;
25+
}
26+
27+
.inspector .text-editor {
28+
margin-left: 2%;
29+
width: 58%;
30+
border: 2px solid #2C3B63;
31+
margin: 20px 1% 20px 1%;
32+
height: 250px;
33+
float: left;
34+
}
35+
36+
.inspector .property-editor {
37+
width: 34%;
38+
margin: 20px 1% 20px 1%;
39+
height: 250px;
40+
border: 2px solid #2C3B63;
41+
float: right;
42+
}
43+
44+
.inspector .property-editor .node-lookup {
45+
border-bottom: 1px solid #2C3B63;
46+
}
47+
48+
.inspector .property-editor .node-lookup .selector:before {
49+
content: "Selector: ";
50+
}
51+
52+
.inspector .property-editor .node-lookup .selector {
53+
width: 150px;
54+
margin-left: 10px;
55+
}
56+
57+
.inspector .property-editor .node-lookup .nth:before {
58+
content: "Index: ";
59+
}
60+
61+
.inspector .property-editor .node-lookup .nth {
62+
width: 50px;
63+
margin-left: 10px;
64+
}
65+
66+
.inspector .property-editor .node-lookup button {
67+
float: right;
68+
}
69+
70+
.inspector .property-editor .property-list {
71+
height: 100%;
72+
font-size: 12pt;
73+
color: black;
74+
}
75+
76+
table tr td{
77+
padding-left: 10px;
78+
color: black;
79+
}

‎web-inspector.html

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,177 @@
1+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
5+
6+
7+
8+
9+
10+
<script src="web-inspector.js"></script>
11+
12+
13+
14+
15+
16+
17+
<title>MIT - Massachusetts Institute of Technology</title>
18+
<meta name="keywords" content="Massachusetts Institute of Technology, MIT" />
19+
<meta name="description" content="The mission of MIT is to advance knowledge and educate students in science, technology and other areas of scholarship that will best serve the nation and the world in the 21st century." />
20+
<meta name="robots" content="index,follow,noodp,noydir" />
21+
<meta name="allow-search" content="yes" />
22+
<meta name="language" content="en" />
23+
<meta name="distribution" content="global" />
24+
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
25+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
26+
<meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
27+
<meta http-equiv="Pragma" content="no-cache" />
28+
<meta http-equiv="cache-control" content="no-store" />
29+
30+
<!-- Twitter card -->
31+
<meta property="twitter:site:id" content="15460048" />
32+
<meta name="twitter:card" content="summary">
33+
<meta name="twitter:site" content="@mit">
34+
<meta name="twitter:title" content="The Massachusetts Institute of Technology (MIT)">
35+
36+
<!-- Open Graph -->
37+
<meta property="og:image" content="http://web.mit.edu/img/MIT_logo.gif" />
38+
<meta property="og:description" content="The mission of MIT is to advance knowledge and educate students in science, technology and other areas of scholarship that will best serve the nation and the world in the 21st century." />
39+
<meta property="og:type" content="website" />
40+
<meta property="og:url" content="http://web.mit.edu/" />
41+
<meta property="og:title" content="The Massachusetts Institute of Technology (MIT)" />
42+
43+
<meta property="fb:page_id" content="126533127390327" />
44+
<meta name="apple-itunes-app" content="app-id=353590319"/>
45+
46+
<link href="https://plus.google.com/104984516469461796485/" rel="publisher" />
47+
48+
49+
<link rel="canonical" href="http://web.mit.edu" />
50+
<link rel="image_src" href="http://web.mit.edu/img/MIT_logo.gif" />
51+
52+
<link rel="search" type="application/opensearchdescription+xml" href="http://web.mit.edu/opensearch.xml" title="MIT - Massachusetts Institute of Technology" />
53+
54+
55+
<!-- icons -->
56+
<link rel="shortcut icon" href="/favicon.ico" />
57+
58+
<!-- rss -->
59+
<link rel="alternate" type="application/rss+xml" title="MIT - Home Page News" href="http://feeds.feedburner.com/mit/news-homepage" />
60+
61+
<!-- style sheets - global -->
62+
<link href="http://web.mit.edu/styles/style3737.css" rel="stylesheet" type="text/css" media="all" />
63+
64+
<!--[if lte IE 9]><link href="styles/ie_style.css" rel="stylesheet" type="text/css" media="all" /><![endif]-->
65+
66+
</head>
67+
<body>
68+
<div id="wrapper">
69+
<div id="header">
70+
<h1><img src="http://web.mit.edu/img/MIT_logo.gif" alt="Massachusetts Institute of Technology" height="40" width="78" /></h1>
71+
<div class="title_date">Massachusetts Institute of Technology &nbsp; | &nbsp; <script type="text/javascript" src="http://www.mit.edu/js/date.js"></script></div>
72+
<div id="search">
73+
<form action="http://web.mit.edu/cgi-bin/search-route-new" method="post" id="quicksearch">
74+
<input type="radio" name="engine" id="google" tabindex="6" value="0" checked="checked" />
75+
<label for="google"><span class="caps">MIT Google</span></label>
76+
<input type="radio" name="engine" id="people" tabindex="7" value="1" />
77+
<label for="people"><span class="caps">People</span></label>
78+
<input type="radio" name="engine" id="offices" tabindex="8" value="7" />
79+
<label for="offices"><span class="caps">Offices</span></label>
80+
<input name="terms" type="text" id="searchBox" tabindex="10" alt="search terms" />
81+
<input type="submit" name="Submit" value="Search" id="gobut" tabindex="11" />
82+
</form>
83+
</div>
84+
<!-- CLOSES SEARCH -->
85+
</div>
86+
<!-- CLOSES HEADER -->
87+
<div id="content">
88+
<a href="http://web.mit.edu/newsoffice/2013/strange-rebels-christian-caryl-0613.html"><img src="http://web.mit.edu/img/BackImage.jpg" alt="MIT" width="980" height="561" /></a> <div id="left_nav">
89+
<ul id="main_nav_left">
90+
<li class="main_link"><h3><a href="http://web.mit.edu/aboutmit">about</a></h3></li>
91+
<li class="sub_link"><a href="http://web.mit.edu/institute-events/visitor/">visiting</a> | <a href="http://whereis.mit.edu">maps</a> | <a href="http://web.mit.edu/officesdir/">offices</a> | <a href="http://mitstory.mit.edu/">history</a></li>
92+
<li class="main_link"><h3><a href="http://web.mit.edu/admissions/">admissions</a></h3></li>
93+
<li class="sub_link"><a href="http://www.mitadmissions.org/">undergrad</a> | <a href="http://web.mit.edu/admissions/graduate/">graduate</a> | <a href="http://web.mit.edu/sfs/">financial aid</a></li>
94+
<li class="main_link"><h3><a href="http://web.mit.edu/education">education</a></h3></li>
95+
<li class="sub_link"><a href="http://web.mit.edu/education/">schools+courses</a>
96+
<div id="sub_link_second">
97+
<a href="http://ocw.mit.edu/">OpenCourseWare</a> | <a href="http://www.edx.org/university_profile/MITx"><i>MITx</i></a> | <a href="http://www.edx.org/">edX</a>
98+
</div></li>
99+
<li class="main_link"><h3><a href="http://web.mit.edu/research/">research</a></h3></li>
100+
<li class="sub_link"><a href="http://web.mit.edu/research/">labs+centers</a> | <a href="http://www.ll.mit.edu/">lincoln lab</a> | <a href="http://libraries.mit.edu/">libraries</a></li>
101+
<li class="main_link"><h3><a href="http://web.mit.edu/community/">community</a></h3></li>
102+
<li class="sub_link"><a href="http://web.mit.edu/student/">students</a> | <a href="http://web.mit.edu/faculty/">faculty</a> | <a href="http://web.mit.edu/staff/">staff</a> | <a href="http://alum.mit.edu/">alumni</a></li>
103+
<li class="main_link"><h3><a href="http://web.mit.edu/life">life@MIT</a></h3></li>
104+
<li class="sub_link"><a href="http://arts.mit.edu/">arts</a> | <a href="http://web.mit.edu/athletics/www/">athletics</a> | <a href="http://connect.mit.edu/">connect</a></li>
105+
<li class="main_link"><h3><a href="http://web.mit.edu/initiatives/">initiatives</a></h3></li>
106+
<li class="sub_link"><a href="http://mitei.mit.edu">energy</a> | <a href="http://ki.mit.edu">cancer</a> | <a href="http://diversity.mit.edu/">diversity</a> | <a href="http://global.mit.edu/">global</a></li>
107+
<li class="main_link"><h3><a href="http://web.mit.edu/impact/">impact</a></h3></li>
108+
<li class="sub_link"><a href="http://web.mit.edu/industry/">industry</a> | <a href="http://web.mit.edu/mitpsc/">public service</a></li>
109+
<!--<li class="main_link"><h3><a href="http://web.mit.edu/commencement/2013/">commencement</a></h3></li>-->
110+
</ul>
111+
<!-- CLOSES MAIN NAV LEFT -->
112+
</div>
113+
<!-- CLOSES LEFT NAV -->
114+
<div id="right_nav">
115+
116+
<ul id="newsAndevents">
117+
<li class="main_link"><h3><a href="http://web.mit.edu/newsoffice/">news</a></h3></li>
118+
<li class="sub_link"><a href="http://web.mit.edu/newsoffice/2013/faculty-profile-pierre-lermusiaux-0612.html">Pierre Lermusiaux boosts ocean simulations by cutting uncertainty</a></li><li class="sub_link"><a href="http://web.mit.edu/newsoffice/2013/3q-fiona-murray-on-female-entrepreneurship-0612.html">3Q: Fiona Murray on the challenges facing women entrepreneurs</a></li><li class="sub_link"><a href="http://web.mit.edu/newsoffice/2013/6002x-data-offer-insights-into-online-learning-0611.html">Data from edX&#39;s inaugural course offer insights into online learning</a></li><li class="sub_link"><a href="http://web.mit.edu/newsoffice/2013/algorithm-solves-homomorphic-encryption-problem-0610.html">Algorithm solves major problem with homomorphic encryption</a></li> <div class="remove">
119+
<li class="sub_news"><a href="http://web.mit.edu/newsoffice/">research</a> <span class="pipe">|</span> <a href="http://web.mit.edu/newsoffice/campus.html">campus</a> <span class="pipe">|</span> <a href="http://web.mit.edu/press/">press</a></li>
120+
121+
<li class="Rmain_link"><h3><a href="http://events.mit.edu">events</a></h3></li>
122+
<li class="sub_link"><a href="http://events.mit.edu/event.html?id=14998207&amp;date=2013/6/13">Auto-ID and Sensing Solutions Expo</a> (today)</li><li class="sub_link"><a href="http://web.mit.edu/newsoffice/#ofNote">Of Note - Errol Morris: A Rough Cut of His New Documentary</a></li> </div>
123+
</ul>
124+
<!-- CLOSES NEWSANDEVENTS-->
125+
</div>
126+
<!--CLOSES RIGHT NAV -->
127+
128+
<!-- OPEN IMGCREDIT -->
129+
<div id="ImgCredit">
130+
<p class="CredText">
131+
<a href="http://mit.edu/site/?ref=mithomepage"><i></i></a> <a href="http://mit.edu/site/?ref=mithomepage">Today's image</a>
132+
</p>
133+
</div>
134+
<!-- CLOSES IMGCREDIT -->
135+
136+
137+
<div id="spot_text">
138+
<h2>
139+
<span id="spot_title"><a href="http://mit.edu/site/?ref=mithomepage">today's spotlight</a></span><br />
140+
<span id="spot_hed">
141+
<a href="http://web.mit.edu/newsoffice/2013/strange-rebels-christian-caryl-0613.html">Spirit of &#8217;79</a> </span>
142+
</h2>
143+
<div id="spot_dek">
144+
<a href="http://web.mit.edu/newsoffice/2013/strange-rebels-christian-caryl-0613.html">New book traces the contours of today&#8217;s world to a cluster <br />
145+
of key political, religious and economic upheavals in 1979</a> </div>
146+
</div>
147+
148+
149+
150+
<!-- CLOSES SPOT_TEXT -->
151+
</div>
152+
<!-- CLOSES CONTENT -->
153+
<div id="footer">
154+
<div id="BotLinks">
155+
<p id="footlinks"><a href="http://jobs.mit.edu/">jobs</a><span class="pipeBot">|</span><a href="http://web.mit.edu/facts/">facts</a><span class="pipeBot">|</span><a href="http://web.mit.edu/officesdir/">offices and services</a><span class="pipeBot">|</span><a href="http://web.mit.edu/comment-form.html">contact</a><span class="pipeBot">|</span><a href="http://web.mit.edu/site/?ref=mithomepage">about the spotlight</a><br />
156+
<span class="vcard"><span class="org">MIT</span><span class="pipeBot">|</span><span class="street-address">77 Massachusetts Avenue</span><span class="pipeBot">|</span><span class="locality">Cambridge</span>, <span class="region">MA</span> <span class="postal-code">02139-4307</span><span class="pipeBot">|</span><span class="tel">617-253-1000</span><span class="pipeBot">|</span>TTY 617-258-9344<span class="pipeBot">|</span></span>
157+
Follow us on:
158+
<a href="http://www.facebook.com/MITnews" class="social-icons" title="Connect with us on Facebook" target="_blank"><img src="http://img.mit.edu/newsoffice/images/logos/fb.png" alt="MIT on Facebook" width="16" /></a>
159+
<a href="http://twitter.com/mit" class="social-icons" title="Follow us on Twitter" target="_blank"><img src="http://abs.twimg.com/a/1366855397/images/resources/twitter-bird-blue-on-white.png" alt="MIT on Twitter" width="16" /></a>
160+
<a href="https://plus.google.com/+mit" class="social-icons" title="Visit our Google+ page"><img src="https://ssl.gstatic.com/images/icons/gplus-16.png" width="16" height="16" alt="MIT News Google Plus page" /></a>
161+
<a href="http://www.youtube.com/mit" class="social-icons" title="Visit our YouTube channel" target="_blank"><img src="http://s.ytimg.com/yt/img/creators_corner/YouTube/youtube_32x32.png" width="16" alt="MIT on YouTube" /></a> </p>
162+
<div id="GiveBtn">
163+
<div id="button">
164+
<div id="innerBtn" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50">
165+
<div id="BtnTxt"><a href="http://giving.mit.edu/">Give to <strong>MIT</strong></a></div>
166+
<a class="hit" href="http://giving.mit.edu/"><img id="arrow" src="http://web.mit.edu/img/give.gif" alt="Giving to MIT" width="15" height="15" /></a> </div>
167+
</div>
168+
</div>
169+
</div>
170+
171+
</div>
172+
<!--CLOSES FOOTER -->
173+
</div>
174+
<!-- CLOSES WRAPPER -->
175+
</body>
176+
</html>
177+

0 commit comments

Comments
 (0)