keep filter at top, parse query

git-svn-id: http://svn.openlayers.org/trunk/openlayers@7125 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Tim Schaub
2008-05-09 15:02:31 +00:00
parent 447eaf2936
commit 92c092c598
+58 -16
View File
@@ -12,7 +12,7 @@
line-height: 1.25em; line-height: 1.25em;
} }
.ex_container{ .ex_container{
border-bottom: 1px solid grey; border-bottom: 1px solid #cccccc;
} }
.ex_container a { .ex_container a {
text-decoration: none; text-decoration: none;
@@ -44,10 +44,32 @@
#toc { #toc {
width: 30%; width: 30%;
height: 100%; height: 100%;
overflow: auto;
} }
#instructions { #filter {
padding: 0.5em 1em 0; top: 0px;
height: 50px;
padding: 10px 1em 10px 1em;
}
#examples {
border-top: 1px solid #cccccc;
position: absolute;
width: 30%;
top: 70px;
bottom: 0px;
overflow: auto;
list-style: none;
margin: 0;
padding: 0;
}
#examples ul {
list-style: none;
margin: 0;
padding: 0;
}
#examples ul li {
display: block;
margin: 0;
padding: 0;
} }
#exwin { #exwin {
position: absolute; position: absolute;
@@ -55,7 +77,8 @@
left: 30%; left: 30%;
width: 70%; width: 70%;
height: 100%; height: 100%;
border: 1px solid grey; border: none;
border-left: 1px solid #cccccc;
margin: 0; margin: 0;
} }
</style> </style>
@@ -148,29 +171,48 @@
document.getElementById("keywords").value = ""; document.getElementById("keywords").value = "";
listExamples(info.examples); listExamples(info.examples);
} }
function parseQuery() {
var params = {};
var list = window.location.search.substring(1).split("&");
for(var i=0; i<list.length; ++i) {
var pair = list[i].split("=");
if(pair.length == 2) {
params[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
}
}
if(params["q"]) {
var input = document.getElementById("keywords");
input.value = params["q"];
inputChange.call(input);
}
}
window.onload = function() { window.onload = function() {
template = new Jugl.Template("template"); template = new Jugl.Template("template");
target = document.getElementById("examples"); target = document.getElementById("examples");
listExamples(info.examples); listExamples(info.examples);
document.getElementById("exwin").src = "../examples/example.html"; document.getElementById("exwin").src = "../examples/example.html";
document.getElementById("keywords").onkeyup = inputChange document.getElementById("keywords").onkeyup = inputChange
parseQuery();
}; };
</script> </script>
</head> </head>
<body> <body>
<div id="toc"> <div id="toc">
<p id="instructions"> <div id="filter">
<label for="keywords">Filter by keywords</label><br /> <p>
<input type="text" id="keywords" /> <label for="keywords">Filter by keywords</label><br />
<span id="count"></span> <input type="text" id="keywords" />
<a href="javascript:void showAll();">show all</a> <span id="count"></span><br />
</p> <a href="javascript:void showAll();">show all</a>
</p>
</div>
<div id="examples"></div> <div id="examples"></div>
</div> </div>
<iframe id="exwin" name="exwin"></iframe> <iframe id="exwin" name="exwin" frameborder="0"></iframe>
<div style="display: none;"> <div style="display: none;">
<div id="template"> <ul id="template">
<div class="ex_container" jugl:repeat="example examples"> <li class="ex_container" jugl:repeat="example examples">
<a jugl:attributes="href example.link" target="exwin"> <a jugl:attributes="href example.link" target="exwin">
<h5 class="ex_title"> <h5 class="ex_title">
<span jugl:replace="example.title">title</span><br /> <span jugl:replace="example.title">title</span><br />
@@ -183,8 +225,8 @@
Related Classes go here Related Classes go here
</p> </p>
</a> </a>
</div> </li>
</div> </ul>
</div> </div>
</body> </body>
</html> </html>