vaadin-framework/WebContent/index.html

282 lines
10 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IT Mill Toolkit 5</title>
<link rel="stylesheet" type="text/css" href="demo/css/styles.css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="demo/css/ie.css" />
<![endif]-->
<script type="text/javascript">
window.onload = function() {
itmill.init();
}
var itmill = function() {
var isIE = /MSIE/.test(navigator.userAgent) && !window.opera;
var packageContent;
var package;
var demoArea;
var demos;
var additionalDemos;
var additionalDemosContent;
return {
init : function() {
// Fetch references
packageContent = document.getElementById("package-contents-content");
package = document.getElementById("package-contents");
demoArea = document.getElementById("demo-buttons");
demos = demoArea.getElementsByTagName("li");
additionalDemos = document.getElementById("additional-demos");
additionalDemosContent = document.getElementById("additional-demos-content");
// Hide panel initially
packageContent.style.display = "none";
package.style.cssFloat = "right";
package.style.styleFloat = "right";
package.style.clear = "right";
package.style.marginTop = "-37px";
package.style.marginRight = "1px";
package.style.display = "inline";
additionalDemosContent.style.display = "none";
additionalDemos._smallHeight = additionalDemos.offsetHeight;
// Enable additional demos panel hiding/showing
var toggle = additionalDemos.getElementsByTagName("h3")[0];
toggle.style.cursor = "pointer";
toggle.title = "Show/hide additional demos";
// Use the quick-n-dirty way to attach event listeners
toggle.onclick = function() {itmill.togglePanel(additionalDemosContent)};
// Enable package contents panel hiding/showing
toggle = package.getElementsByTagName("h3")[0];
toggle.style.cursor = "pointer";
toggle.title = "Show/hide package contents";
// Use the quick-n-dirty way to attach event listeners
toggle.onclick = function() {itmill.togglePanel(packageContent)};
// enable demo button hovers
for(var i=0; i < demos.length; i++) {
demos[i].onmouseover = this.focusDemo;
}
demoArea.onmouseout = this.blurDemos;
// feedback popup
var fb = document.getElementById("feedback").getElementsByTagName("textarea")[0];
fb._originalValue = fb.value;
fb.style.height = "14px";
fb.className = "blur";
fb.onfocus = function() {
fb.className = "";
fb.style.height = "50px";
if(fb.value == fb._originalValue)
fb.value = "";
}
},
togglePanel : function(which) {
if(which._open) {
which.style.display = "none";
which._open = false;
} else {
which.style.display = "block";
which._open = true;
}
// Dirty fix to reposition package-content panel
if(which == additionalDemosContent) {
if(which._open) {
package.style.marginTop = "8px";
} else {
package.style.marginTop = "-37px";
}
}
},
focusDemo : function(e) {
var evt = e ? e : window.event;
var target = evt.target ? evt.target.parentNode : evt.srcElement.parentNode; // Should be the LI element
if(target.nodeType != 1 || target.nodeName != "LI")
return;
for(var i=0; i < demos.length; i++) {
var demo = demos[i];
if(demo != target) {
if(isIE)
demo.style.filter = "alpha(opacity=60)";
else
demo.style.opacity = "0.6";
} else {
if(isIE)
demo.style.filter = "";
else
demo.style.opacity = "1";
}
}
},
blurDemos : function(e) {
var evt = e ? e : window.event;
var target = evt.toElement || evt.relatedTarget;
if(target == demoArea || target.parentNode == demoArea || target.parentNode.parentNode == demoArea)
return;
for(var i=0; i < demos.length; i++) {
if(isIE)
demos[i].style.filter = "";
else
demos[i].style.opacity = "1";
}
}
};
}();
</script>
</head>
<body id="index">
<div id="container">
<div class="header">
<h1>Introducing IT Mill Toolkit 5</h1>
<strong>Beta</strong>
<em>Effortless web application development for Java-programmers.</em>
<div id="header-links">
<a href="http://dev.itmill.com" title="Open dev.itmill.com">Visit developer site dev.itmill.com</a><br/>
<a href="http://forum.itmill.com" title="Open forum.itmill.com">Visit support site forum.itmill.com</a>
</div>
</div> <!-- /Header -->
<div class="content">
<div id="demos">
<h2>Demos</h2>
<ul id="demo-buttons">
<li id="feature-browser"><a href="FeatureBrowser/">Feature browser</a></li>
<li id="notifications"><a href="NotificationDemo/">Notifications</a></li>
<li id="reservr"><a href="Reservr/">Reservation application</a></li>
<li id="windowed-demos"><a href="WindowedDemos">Windowed demos</a></li>
<li class="clearer"></li> <!-- // simplifies things in JavaScipt -->
</ul>
<div class="clearer"></div>
<div id="additional-demos" class="panel">
<div class="top"></div>
<h3>&raquo; Additional demos</h3>
<div id="additional-demos-content"> <!-- For JavaScript hooking -->
<ul>
<li><a href="HelloWorld/">Hello world</a> (<a href="doc/example-source/com/itmill/toolkit/demo/HelloWorld.java.html">sources</a>)</li>
<li><a href="Calc/">Calculator</a> (<a href="doc/example-source/com/itmill/toolkit/demo/Calc.java.html">sources</a>)</li>
<li><a href="colorpicker/">How to make widgets demo</a> (<a href="doc/example-source/com/itmill/toolkit/demo/colorpicker">sources</a>)</li>
<li><a href="CachingDemo/">Widget caching demo</a> (<a href="doc/example-source/com/itmill/toolkit/demo/CachingDemo.java.html">sources</a>)</li>
<li><a href="KeyboardShortcut/">Keyboard shortcuts</a> (<a href="doc/example-source/com/itmill/toolkit/demo/KeyboardShortcut.java.html">sources</a>)</li>
<li><a href="BufferedComponents/">Buffered components</a> (<a href="doc/example-source/com/itmill/toolkit/demo/BufferedComponents.java.html">sources</a>)</li>
</ul>
</div>
<div class="bottom"></div>
</div> <!-- /additional-demos -->
</div> <!-- /demos -->
<div id="getting-started">
<h2>Getting started</h2>
<h4>Eclipse IDE QuickStart</h4>
<p>The easiest way to start working with IT Mill Toolkit is to
use Eclipse IDE with the Toolkit QuickStart project.
<a href="doc/manual/ch01s05.html" class="more">Instant Toolkit workspace for Eclipse</a></p>
</div> <!-- /getting-started -->
<div id="support-licensing">
<h2>Support and Licensing</h2>
<h4>Documentation</h4>
<p>Need help using IT Mill Toolkit? Look no further. Everything you need to know is here.</p>
<ul class="links">
<li><a href="doc/manual/index.html">Manual</a> <a href="doc/manual.pdf" class="more"><span>(</span>PDF<span>)</span></a></li>
<li><a href="doc/api/index.html" class="more">JavaDoc API</a></li>
<li><a href="http://forum.itmill.com" class="more">Support forum</a></li>
</ul>
<h4>Open Source Development &amp; Licenses</h4>
<p>IT Mill Toolkit is developed as an Open Source software and its core is licensed under
the liberal Apache 2.0 License. Commercial licenses that include support are also available.</p>
<ul class="links">
<li><a href="http://dev.itmill.com" title="Open dev.itmill.com" class="more">Developer website</a></li>
<li><a href="license/licensing-guidelines.html" class="more">Licensing Guidelines</a></li>
</ul>
</div> <!-- /support-licensing -->
<div id="package-contents" class="panel">
<div class="top"></div>
<h3>&raquo; Package contents</h3>
<em>Version <version></version> (beta)</em>
<div id="package-contents-content"> <!-- For JavaScript hooking -->
<div class="library">
<h5>Library</h5>
<p>Contains all you need to start a new Toolkit project (binaries, sources, default
themes and widgetsets). <a href="itmill-toolkit-<version></version>.jar">Toolkit JAR</a></p>
</div>
<div class="documentation">
<h5>Documentation</h5>
<ul>
<li><a href="release-notes.html">Release Notes</a></li>
<li><a href="doc/manual/index.html">Manual</a> &nbsp; (<a href="doc/manual.pdf">view as PDF</a>)</li>
<li><a href="doc/api/index.html">JavaDoc API</a></li>
</ul>
</div>
<div class="support">
<h5>Support &amp; Licensing</h5>
<ul>
<li><a href="http://forum.itmill.com">Support forum</a></li>
<li><a href="license/licensing-guidelines.html">Licensing Guidelines</a></li>
<li>Commercial support and prices from <a href="mailto:sales@itmill.com">sales@itmill.com</a></li>
</ul>
</div>
</div>
<div class="bottom"></div>
</div> <!-- /package-contents -->
<div id="feedback" class="panel">
<div class="top"></div>
<h4>Instant Feedback</h4>
<form action="http://www.itmill.com/formmail.app" enctype="multipart/form-data" method="post">
<input name="SuccessUrl"type="hidden" value="http://www.itmill.com/developers/feedback_ok.htm">
<input name="FormType" type="hidden" value="7" />
Send a quick message to Toolkit R&D team:<br />
<textarea name="feedback" cols="38" rows="3" multiline="true">Comments, suggestions, bug reports - anything.</textarea><br />
<input type="submit" value="Send" />
</form>
<div class="bottom"></div>
</div>
<div class="clearer"></div>
</div> <!-- /content-->
<div class="footer">
<a href="http://www.itmill.com">IT Mill Ltd.</a>
<em>Interfacing IT</em>
</div> <!-- /footer -->
</div> <!-- /container -->
</body>
</html>