--- /dev/null
+<!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 Demos</title>
+ <link rel="stylesheet" type="text/css" href="demo/css/demos.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 packageOpen = false;
+ var packageContent;
+ var package;
+ var demoArea;
+
+ return {
+
+ init : function() {
+ // Fetch references
+ packageContent = document.getElementById("additional-content");
+ package = document.getElementById("additional");
+ demoArea = document.getElementById("demos");
+
+ // Hide package contents initially
+ packageContent.style.display = "none";
+
+ // Enable package contents panel hiding/showing
+ var 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 = this.togglePackage;
+
+ // TODO enable demo button hovers
+ var demos = demoArea.getElementsByTagName("li");
+ for(var i=0; i < demos.length; i++) {
+ demos[i].onmouseover = this.focusDemo;
+ //demos[i].onmouseout = this.blurDemos;
+ }
+ demoArea.onmouseout = this.blurDemos;
+
+ },
+
+ togglePackage : function() {
+ if(packageOpen) {
+ packageContent.style.display = "none";
+ packageOpen = false;
+ } else {
+ packageContent.style.display = "block";
+ packageOpen = true;
+ }
+ },
+
+ 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;
+
+ var demos = document.getElementById("demos").getElementsByTagName("li");
+ 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) && target.nodeName != "H2")
+ return;
+ var demos = demoArea.getElementsByTagName("li");
+ for(var i=0; i < demos.length; i++) {
+ if(isIE)
+ demos[i].style.filter = "";
+ else
+ demos[i].style.opacity = "1";
+ }
+ }
+
+ };
+ }();
+
+ </script>
+ </head>
+ <body>
+
+ <div id="container">
+
+ <div class="header">
+ <h1>Introducing IT Mill Toolkit 5</h1>
+ <em>Effortless web application development for Java-programmers.</em>
+ <a href="http://www.itmill.com" title="Open www.itmill.com">Visit itmill.com</a>
+ </div> <!-- /Header -->
+
+ <div class="content">
+
+ <div id="demos">
+ <h2>Demos</h2>
+ <ul>
+ <li id="feature-browser"><a href="feature-browser">Feature browser</a></li>
+ <li id="notifications"><a href="notification-demo">Notifications</a></li>
+ <li id="reservr"><a href="reservr">Reservation application</a></li>
+ <li id="windowed-demos"><a href="windowed-demo">Windowed demos</a></li>
+ </ul>
+ <div class="clearer"></div>
+ </div> <!-- /demos -->
+
+ <div class="clearer"></div>
+
+ <div id="additional">
+ <div class="top"></div>
+
+ <h3>» Additional demos</h3>
+
+ <div id="additional-content"> <!-- For JavaScript hooking -->
+
+ <ul>
+ <li><a href="table-demo">Table Demo</a></li>
+ <li><a href="select-demo">Select Demo</a></li>
+ </ul>
+
+ </div>
+
+ <div class="bottom"></div>
+ </div> <!-- /package-contents -->
+
+ <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>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
-<head>
-<title>IT Mill Toolkit Demo</title>
-<link rel="stylesheet" type="text/css" href="styles/demos.css" />
-</head>
-<body>
-<div id="container">
-
-<div id="itmilllogo"><h1>IT Mill Toolkit</h1></div>
-
-<div id="toolkit"></div>
-
-
-
-<div class="feature-browser">
- <h4><a href="reservr.html">Reservr</a></h4>
- <div class="option">
- <span class="link"><a href="reservr.html">Reservr</a></span>
- <span class="desc">Example car reservation application. Uses Google Maps widget.</span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/reservation">browse source</a></span>
- </div>
-
- <div class="feature-browser">
- <h4><a href="TestBench/">Test Bench</a></h4>
- <div class="option">
- <span class="link"><a href="TestBench/">TestBench</a></span>
- <span class="desc">Internal test bench application for trying out different components and features of the IT Mill Toolkit</span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/tests/">browse TestBench folder</a></span>
- </div>
-
- <div class="feature-browser">
- <h4><a href="FeaturesApplication/">Feature Browser</a></h4>
- <div class="option">
- <span class="link"><a href="FeaturesApplication/">FeatureBrowser</a></span>
- <span class="desc">Test bench application for trying out different components and features of the IT Mill Toolkit</span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/features">browse features folder</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="NotificationDemo/">Notification Demo</a></h3>
- <div class="option">
- <p>
- Smaller application which demonstrates Rich Text Area widget and Window notification functionality.
- </p>
- </div>
- Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/NotificationDemo.java.html">NotificationDemo.java</a></span>
- </div>
-
-
- <div class="feature-browser">
- <h4><a href="colorpicker/">Colorpicker widget</a></h4>
- <div class="option">
- <span class="link"><a href="colorpicker/">Colorpicker widget</a></span>
- <span class="desc">Demonstrates how to make new widgets easily with Toolkit.
- See also documentation which is located <a href="/doc/manual/ch08s02.html">here</a>.</span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/colorpicker">browse source</a></span>
- </div>
-
- <div class="sample-code">
- <h3>Simple application demos</h3>
- <div class="option">
- <span class="link"><a href="HelloWorld/">HelloWorld</a></span>
- <span class="desc">Classic Hello World example.</span>
- </div>
- <div class="option">
- <span class="link"><a href="Calc/">Calc</a></span>
- <span class="desc">Simple Toolkit application where events are used.</span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/HelloWorld.java.html">HelloWorld.java</a></span> and
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/Calc.java.html">Calc.java</a></span>
- </div>
-
- <div class="sample-code">
- <h3>Client-side caching demo</h3>
- <div class="option">
- <span class="link"><a href="CachingDemo/">CachingDemo</a></span>
- <span class="desc">
- Simple demo of Toolkit cache feature. An Tabsheet contains two tabs where second tab contains heavy server-side content processing.
- For the first time you load tab2 it takes long time. Following request are lightning fast because
- Toolkit server instruct client-side to use already cached version (components within tab2 have not changed). </span>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/CachingDemo.java.html">CachingDemo.java</a></span>
- </div>
-
-
- <div class="sample-code">
- <h3><a href="UpgradingSample/">Long lifecycle of Toolkit applications</a></h3>
- <div class="option">
- <p>
- Demonstrates sample <a href="http://www.millstone.org/">Millstone</a> application that was ajaxified (upgraded to Toolkit 4.0.0)
- simply by changing three import namespaces and adding Toolkit libraries to classpath.
- Initial IT Mill Toolkit framework has existed since 2001 (see <a href="http://www.millstone.org/">Millstone</a>) and is
- ready for production use today.
- </p>
- <b>Note:</b> This sample application was created on year 2002.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/UpgradingSample.java.html">UpgradingSample.java</a></span>
- </div>
-
-
- <div class="feature-browser">
- <h3><a href="QueryContainerDemo/">Tree using QueryContainer demo</a></h3>
- <div class="option">
- <p>
- This example shows how Table, Select and Tree UI components can use Containers.
- QueryContainer is used to bind SQL table rows into Toolkit UI components.
- Table has few example actions added. Also embedding XHTML through Label components is used.
- </p>
- <p>
- Demonstrates how to create <em>com.itmill.toolkit.data.Container</em> and set it as
- data source to UI components <em>com.itmill.toolkit.ui.Component.Tree</em>, how to
- receive ExpandEvent and implement <em>com.itmill.toolkit.ui.Tree.ExpandListener</em>,
- how to use <em>com.itmill.toolkit.event.Action</em>.
- </p>
- </div>
- Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/QueryContainerDemo.java.html">QueryContainerDemo.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="TableDemo/">Table demo</a></h3>
- <div class="option">
- <p>
- Similar to <em>Tree using QueryContainer demo</em> but uses different style
- for handling events with Table component.
- </p>
- <p>
- Demonstrates another possibility how event framework may be used,
- in this example specific methods are registered for button click events.
- </p>
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/TableDemo.java.html">TableDemo.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="TreeFilesystemContainer/">Tree using FilesystemContainer demo</a></h3>
- <div class="option">
- <p>
- Browsable file explorer using Toolkit Tree component.
- </p>
- Demonstrates how to
- use <em>com.itmill.toolkit.ui.Component.Tree</em> data source container,
- how to create <em>com.itmill.toolkit.data.util.FilesystemContainer</em>,
- how to read <em>com.itmill.toolkit.ui.Component.Event</em> objects, how
- to receive and handle any event by implementing
- <em>com.itmill.toolkit.ui.Component.Listener</em>.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/TreeFilesystemContainer.java.html">TreeFilesystemContainer.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="TreeFilesystem/">Tree item handling demo</a></h3>
- <div class="option">
- <p>
- Browsable file explorer using Toolkit Tree component.
- </p>
- Demonstrates: how
- to add items hierarchially into
- <em>com.itmill.toolkit.ui.Component.Tree</em>, how to receive
- ExpandEvent and implement
- <em>com.itmill.toolkit.ui.Tree.ExpandListener</em>.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/TreeFilesystem.java.html">TreeFilesystem.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="SelectDemo/">Select demo</a></h3>
- <div class="option">
- <p>
- This example shows select component with default and lazy loading functionality enabled (a.k.a Google Suggest).
- Click to first select component and type few letters using your keyboard to see it in action.
- Second select component has default functionality.
- </p>
- </div>
- Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/SelectDemo.java.html">SelectDemo.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="FilterSelect/">FilterSelect demo</a></h3>
- <div class="option">
- <p>
- This example shows three select components with lazy loading functionality enabled.
- First select works like Google Suggest, second uses "Contains" filter and third uses custom "Ends with" filter.
- Click to select components and type few letters using your keyboard to see it in action.
- </p>
- </div>
- Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/FilterSelect.java.html">FilterSelect.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="KeyboardShortcut/">Keyboard events demo</a></h3>
- <div class="option">
- Contains few Toolkit UI components that can be interacted by pressing keys in keyboard.
- <b>Note</b>: This feature is under development and is considered as beta.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/KeyboardShortcut.java.html">KeyboardShortcut.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="Parameters/">URI and Parameter handling demo</a></h3>
- <div class="option">
- This is a demonstration of how URL parameters can be received and handled.
- Parameters and URL:s can be received trough the windows by registering
- URIHandler and ParameterHandler classes window.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/Parameters.java.html">Parameters.java</a></span>
- </div>
-
- <div class="feature-browser">
- <h3><a href="BufferedComponents/">Buffered UI components demo</a></h3>
- <div class="option">
- Explains how to use buffering with UI components, and how to perform commit and discard functions.
- With buffered UI components underlying data objects and UI objects have separate states.
- </div>
- <br />Source code:
- <span class="link"><a href="doc/demo-source/com/itmill/toolkit/demo/BufferedComponents.java.html">BufferedComponents.java</a></span>
- </div>
-
-
-</div><!-- // Container -->
-
-</body></html>
\ No newline at end of file
+ <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";
+ additionalDemosContent.style.display = "none";
+
+ // 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;
+
+
+ // TODO implement feedback popup
+ },
+
+ 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) {
+ var current = package.style.marginTop ? parseInt(package.style.marginTop) : -105;
+ if(which._open) {
+ if(!which._height)
+ which._height = additionalDemos.offsetHeight - package.offsetHeight;
+ package.style.marginTop = (current + which._height) + "px";
+ } else {
+ package.style.marginTop = (current - which._height) + "px";
+ }
+ }
+ },
+
+ 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>
+
+ <div id="container">
+
+ <div class="header">
+ <h1>Introducing IT Mill Toolkit 5</h1>
+ <em>Effortless web application development for Java-programmers.</em>
+ <a href="http://www.itmill.com" title="Open www.itmill.com">Visit itmill.com</a>
+ </div> <!-- /Header -->
+
+ <div class="content">
+
+ <div id="demos">
+ <h2>Demos</h2>
+ <ul id="demo-buttons">
+ <li id="feature-browser"><a href="FeaturesApplication/">Feature browser</a></li>
+ <li id="notifications"><a href="NotificationDemo/">Notifications</a></li>
+ <li id="reservr"><a href="reservr.html">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>» Additional demos</h3>
+
+ <div id="additional-demos-content"> <!-- For JavaScript hooking -->
+ <ul>
+ <li><a href="table-demo">Table Demo</a></li>
+ <li><a href="select-demo">Select Demo</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>
+
+ <h4>Manual Deployment</h4>
+ <p>If you do not use Eclipse, you can manually deploy the Toolkit
+ <a href="lib/itmill-toolkit.war">WAR-package</a> to your application server.
+ </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/manual.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>Licenses</h4>
+ <p>All of IT Mill Toolkit's core is licensed under liberal Open Source license. Commercial licenses are also available.
+ <a href="license/licensing-guidelines.html" class="more">Licensing Guidelines</a></p>
+
+ </div> <!-- /support-licensing -->
+
+ <div id="package-contents" class="panel">
+ <div class="top"></div>
+
+ <h3>» Package contents</h3>
+ <em>Version <version></version></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="WEB-INF/lib/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/manual.html">Manual</a> (<a href="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 & 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>Prices and purchase from <a href="mailto:sales@itmill.com">sales@itmill.com</a></li>
+ </ul>
+ </div>
+
+ </div>
+
+ <div class="bottom"></div>
+ </div> <!-- /package-contents -->
+
+ <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>
-version=5.0.0-alpha-18
+version=5.0.0-alpha-19
<filterchain>
<expandproperties />
<replacetokens begintoken="<" endtoken=">">
- <token key="body" value="${html.body.tag}${html.body.start1}${product-name}${html.body.start2}" />
- <token key="/body" value="${html.body.end}${html.body.endtag}" />
<token key="version" value="${version}" />
<token key="/version" value="" />
</replacetokens>
</fileset>
</copy>
- <!-- copy build/package/WebContent/* -->
- <copy todir="${output-dir}/WebContent">
- <fileset dir="build/package/WebContent">
- <exclude name="index.html" />
- </fileset>
- </copy>
- <copy todir="${output-dir}/WebContent">
- <filterchain>
- <expandproperties />
- <replacetokens begintoken="<" endtoken=">">
- <token key="version" value="${version}" />
- <token key="/version" value="" />
- </replacetokens>
- </filterchain>
- <fileset dir="build/package/WebContent">
- <filename name="index.html" />
- </fileset>
- </copy>
-
</target>
<target name="compile-fileupload">
+++ /dev/null
-html {
- font-size: 100%;
-}
-
-body {
- font-family: "Trebuchet MS", Tahoma, Geneva, Helvetica, Arial, sans-serif;
- font-size: 62.5%; /* Scale down to 10px */
- line-height: 1.8em;
- color: #5c666a;
- background: #e9eced url(../img/body-bg.gif) repeat-x;
-}
-
-.clearer {
- height: 0;
- overflow: hidden;
- clear: both;
-}
-
-h1, h2, h3, h4, h5, h6 {
- margin: 0;
- padding: 0;
- font-weight: normal;
- font-size: 1em;
-}
-
-a {
- text-decoration: none;
-}
-
-a:link {
- color: #4696d0;
-}
-
-a:visited {
- color: #7d9bb2;
-}
-
-a:hover {
- color: #59b6fa;
-}
-
-a:active {
- color: #ff581e;
-}
-
-a.more {
- padding-right: 10px;
- background: transparent url(../img/link-arrow.png) no-repeat center right;
-}
-
-a.more span {
- color: #5c666a;
-}
-
-
-/* page furniture */
-
-#container {
- width: 759px;
- margin: 60px auto;
-}
-
-#container .header {
- height: 81px;
- background: transparent url(../img/header.png);
-}
-
-#container .content {
- background: #fff url(../img/content-bg.png);
- padding: 10px 27px 10px 27px;
- width: 705px; /* for IE hasLayout, fixes beekaboo-bug */
-}
-
-#container .footer {
- height: 72px;
- background: transparent url(../img/footer.png) no-repeat;
- position: relative;
-}
-
-#container .footer a {
- display: block;
- width: 95px;
- height: 15px;
- text-indent: -90000px;
- position: absolute;
- left: 27px;
- bottom: 3px;
- background: transparent url(../img/itmill-logo.png);
- border: none;
- overflow: hidden; /* IE6 fix */
-}
-
-#container .footer em {
- display: block;
- width: 111px;
- height: 18px;
- text-indent: -90000px;
- position: absolute;
- right: 27px;
- bottom: 0;
- background: transparent url(../img/itmill-slogan.png);
-}
-
-#container .header h1,
-#container .header em {
- display: none;
-}
-
-#container .header a {
- color: #5c666a;
- float: right;
- padding-right: 10px;
- background: transparent url(../img/link-arrow2.png) no-repeat center right;
- margin: 30px 27px 0 0;
- border: none;
- font-size: 1.2em;
-}
-
-
-
-/* content area */
-
-.content h2 {
- font-size: 18px;
- color: #f14c1a;
- height: 18px;
- padding: 4px 0 6px 34px;
- letter-spacing: -0.02em;
-}
-
-#demos h2 {
- background: transparent url(../img/icon-eye.png) no-repeat;
-}
-
-#demos {
- font-size: 1.3em;
-}
-
-#demos {
- width: 705px;
- font-size: 1.2em;
-}
-
-#demos h4 {
- font-weight: bold;
- margin: 1em 0 0.2em 0;
-}
-
-
-/* demo icons */
-
-#demos ul {
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
-#demos li {
- float: left;
- width: 160px;
- height: 135px;
- margin: 14px 15px 0 0;
-}
-
-#demos li a {
- display: block;
- padding-top: 115px;
- height: 20px;
- width: 160px;
- text-align: center;
-}
-
-#demos #windowed-demos {
- background: #fff url(../img/demos/windowed.png) no-repeat;
-}
-
-#demos #reservr {
- background: #fff url(../img/demos/reservr.png) no-repeat;
-}
-
-#demos #feature-browser {
- background: #fff url(../img/demos/features.png) no-repeat;
-}
-
-#demos #notifications {
- background: #fff url(../img/demos/notifications.png) no-repeat;
-}
-
-
-/* additional demos */
-
-#additional {
- width: 300px;
- padding: 0 17px 0 17px;
- margin-top: 20px;
- background: #ecf0f3 url(../img/package-bg.png);
- overflow: hidden;
- font-size: 1.1em;
- clear: left;
-}
-
-#additional .top {
- height: 5px;
- width: 334px;
- margin: 0 -17px 0 -17px;
- background: transparent url(../img/package-top.png);
- overflow: hidden;
-}
-
-#additional .bottom {
- height: 5px;
- width: 334px;
- margin: 0 -17px 0 -17px;
- background: transparent url(../img/package-bottom.png);
- overflow: hidden;
-}
-
-#additional-content {
- margin: 13px 0 17px 0;
-}
-
-#additional ul {
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
-#additional h3 {
- font-size: 1.1em;
- margin: 4px 0 5px 0;
- color: #5b7b93;
-}
\ No newline at end of file
+++ /dev/null
-/* for IE hasLayout, fixes background not showing */
-* html a.more {
- zoom: 1;
-}
-*+html a.more {
- zoom: 1;
-}
-
-a.more span {
- color: #5c666a;
-}
-
-
-* html #additional-demos {
- margin-top: -3px;
-}
-
-*+html #additional-demos {
- margin-top: -3px;
-}
\ No newline at end of file
+++ /dev/null
-html {
- font-size: 100%;
-}
-
-body {
- font-family: "Trebuchet MS", Tahoma, Geneva, Helvetica, Arial, sans-serif;
- font-size: 62.5%; /* Scale down to 10px */
- line-height: 1.8em;
- color: #5c666a;
- background: #e9eced url(../img/body-bg.gif) repeat-x;
-}
-
-.clearer {
- height: 0;
- overflow: hidden;
- clear: both;
-}
-
-h1, h2, h3, h4, h5, h6 {
- margin: 0;
- padding: 0;
- font-weight: normal;
- font-size: 1em;
-}
-
-a {
- text-decoration: none;
-}
-
-a:link {
- color: #4696d0;
-}
-
-a:visited {
- color: #7d9bb2;
-}
-
-a:hover {
- color: #59b6fa;
-}
-
-a:active {
- color: #ff581e;
-}
-
-a.more {
- padding-right: 10px;
- background: transparent url(../img/link-arrow.png) no-repeat center right;
-}
-
-a.more span {
- color: #5c666a;
-}
-
-
-/* page furniture */
-
-#container {
- width: 759px;
- margin: 60px auto;
-}
-
-#container .header {
- height: 81px;
- background: transparent url(../img/header.png);
-}
-
-#container .content {
- background: #fff url(../img/content-bg.png);
- padding: 10px 27px 20px 27px;
- width: 705px; /* for IE hasLayout, fixes beekaboo-bug */
-}
-
-#container .footer {
- height: 72px;
- background: transparent url(../img/footer.png) no-repeat;
- position: relative;
-}
-
-#container .footer a {
- display: block;
- width: 95px;
- height: 15px;
- text-indent: -90000px;
- position: absolute;
- left: 27px;
- bottom: 3px;
- background: transparent url(../img/itmill-logo.png);
- border: none;
- overflow: hidden; /* IE6 fix */
-}
-
-#container .footer em {
- display: block;
- width: 111px;
- height: 18px;
- text-indent: -90000px;
- position: absolute;
- right: 27px;
- bottom: 0;
- background: transparent url(../img/itmill-slogan.png);
-}
-
-#container .header h1,
-#container .header em {
- display: none;
-}
-
-#container .header a {
- color: #5c666a;
- float: right;
- padding-right: 10px;
- background: transparent url(../img/link-arrow2.png) no-repeat center right;
- margin: 30px 27px 0 0;
- border: none;
- font-size: 1.2em;
-}
-
-
-
-/* content area */
-
-.content h2 {
- font-size: 18px;
- color: #f14c1a;
- height: 18px;
- padding: 4px 0 6px 34px;
- letter-spacing: -0.02em;
-}
-
-#getting-started h2 {
- background: transparent url(../img/icon-home.png) no-repeat;
- margin-bottom: 78px;
-}
-#demos h2 {
- background: transparent url(../img/icon-eye.png) no-repeat;
-}
-#support-licensing h2 {
- background: transparent url(../img/icon-doc.png) no-repeat;
-}
-
-#getting-started,
-#demos,
-#support-licensing {
- font-size: 1.3em;
-}
-
-#getting-started,
-#support-licensing {
- width: 340px;
-}
-
-#demos {
- width: 335px;
- float: right;
- font-size: 1.2em;
-}
-
-#getting-started h4,
-#demos h4,
-#support-licensing h4 {
- font-weight: bold;
- margin: 1em 0 0.2em 0;
-}
-
-#getting-started p,
-#support-licensing p {
- margin: 0 0 1em 0;
-}
-
-#support-licensing .links {
- list-style: none;
- padding: 0;
- margin: -1em 0 1em 0;
- height: 1.8em;
-}
-
-#support-licensing .links li {
- float: left;
- margin-right: 1.5em;
-}
-
-
-/* eclipse image */
-
-#getting-started {
- background: transparent url(../img/eclipse-quickstart.png) no-repeat 0 40px;
-}
-
-
-
-/* demo icons */
-
-#demo-buttons {
- list-style: none;
- margin: 0;
- padding: 0;
- width: 100%;
-}
-
-#demo-buttons li {
- float: left;
- width: 160px;
- height: 135px;
- margin-top: 14px;
-}
-
-#demo-buttons .clearer {
- float: none;
- height: 0;
- margin: 0;
-}
-
-#demo-buttons li a {
- display: block;
- padding-top: 115px;
- height: 20px;
- width: 160px;
- text-align: center;
-}
-
-#demo-buttons #windowed-demos {
- background: #fff url(../img/demos/windowed.png) no-repeat;
-}
-
-#demo-buttons #reservr {
- background: #fff url(../img/demos/reservr.png) no-repeat;
- margin-right: 15px;
-}
-
-#demo-buttons #feature-browser {
- background: #fff url(../img/demos/features.png) no-repeat;
- margin-right: 15px;
-}
-
-#demo-buttons #notifications {
- background: #fff url(../img/demos/notifications.png) no-repeat;
-}
-
-
-/* package contents */
-
-.panel {
- width: 300px;
- padding: 0 17px 0 17px;
- background: #ecf0f3 url(../img/package-bg.png);
- overflow: hidden;
- font-size: 1.1em;
-}
-
-.panel .top {
- height: 5px;
- width: 334px;
- margin: 0 -17px 0 -17px;
- background: transparent url(../img/package-top.png);
- overflow: hidden;
-}
-
-.panel .bottom {
- height: 5px;
- width: 334px;
- margin: 0 -17px 0 -17px;
- background: transparent url(../img/package-bottom.png);
- overflow: hidden;
-}
-
-#package-contents {
- float: right;
- margin: -105px 1px 0 0;
-}
-
-#package-contents-content {
- margin: 13px 0 17px 0;
-}
-
-#package-contents ul {
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
-#package-contents h3 {
- font-size: 1.1em;
- margin: 4px 0 5px 0;
- color: #5b7b93;
-}
-
-#package-contents em {
- font-size: 0.9em;
- font-style: normal;
- float: right;
- margin-top: -23px;
- color: #87a0b2
-}
-
-#package-contents h5 {
- font-weight: bold;
- margin: 0 0 0.2em 0;
- color: #3f5f77;
-}
-
-#package-contents p {
- margin: 0;
-}
-
-#package-contents .library {
- width: 143px;
- margin-right: 15px;
- float: left;
-}
-
-#package-contents .documentation {
- width: 134px;
- float: left;
-}
-
-#package-contents .support {
- clear: left;
- padding-top: 1.5em;
-}
-
-
-
-/* additional demos */
-
-#additional-demos {
- clear: left;
- font-size: 1em;
- margin-top: 10px;
-}
-
-#additional-demos h3 {
- font-size: 1.1em;
- margin: 4px 0 5px 0;
- color: #5b7b93;
-}
\ No newline at end of file
+++ /dev/null
-<!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 Demos</title>
- <link rel="stylesheet" type="text/css" href="demo/css/demos.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 packageOpen = false;
- var packageContent;
- var package;
- var demoArea;
-
- return {
-
- init : function() {
- // Fetch references
- packageContent = document.getElementById("additional-content");
- package = document.getElementById("additional");
- demoArea = document.getElementById("demos");
-
- // Hide package contents initially
- packageContent.style.display = "none";
-
- // Enable package contents panel hiding/showing
- var 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 = this.togglePackage;
-
- // TODO enable demo button hovers
- var demos = demoArea.getElementsByTagName("li");
- for(var i=0; i < demos.length; i++) {
- demos[i].onmouseover = this.focusDemo;
- //demos[i].onmouseout = this.blurDemos;
- }
- demoArea.onmouseout = this.blurDemos;
-
- },
-
- togglePackage : function() {
- if(packageOpen) {
- packageContent.style.display = "none";
- packageOpen = false;
- } else {
- packageContent.style.display = "block";
- packageOpen = true;
- }
- },
-
- 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;
-
- var demos = document.getElementById("demos").getElementsByTagName("li");
- 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) && target.nodeName != "H2")
- return;
- var demos = demoArea.getElementsByTagName("li");
- for(var i=0; i < demos.length; i++) {
- if(isIE)
- demos[i].style.filter = "";
- else
- demos[i].style.opacity = "1";
- }
- }
-
- };
- }();
-
- </script>
- </head>
- <body>
-
- <div id="container">
-
- <div class="header">
- <h1>Introducing IT Mill Toolkit 5</h1>
- <em>Effortless web application development for Java-programmers.</em>
- <a href="http://www.itmill.com" title="Open www.itmill.com">Visit itmill.com</a>
- </div> <!-- /Header -->
-
- <div class="content">
-
- <div id="demos">
- <h2>Demos</h2>
- <ul>
- <li id="feature-browser"><a href="feature-browser">Feature browser</a></li>
- <li id="notifications"><a href="notification-demo">Notifications</a></li>
- <li id="reservr"><a href="reservr">Reservation application</a></li>
- <li id="windowed-demos"><a href="windowed-demo">Windowed demos</a></li>
- </ul>
- <div class="clearer"></div>
- </div> <!-- /demos -->
-
- <div class="clearer"></div>
-
- <div id="additional">
- <div class="top"></div>
-
- <h3>» Additional demos</h3>
-
- <div id="additional-content"> <!-- For JavaScript hooking -->
-
- <ul>
- <li><a href="table-demo">Table Demo</a></li>
- <li><a href="select-demo">Select Demo</a></li>
- </ul>
-
- </div>
-
- <div class="bottom"></div>
- </div> <!-- /package-contents -->
-
- <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>
+++ /dev/null
-<!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";
- additionalDemosContent.style.display = "none";
-
- // 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;
-
-
- // TODO implement feedback popup
- },
-
- 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) {
- var current = package.style.marginTop ? parseInt(package.style.marginTop) : -105;
- if(which._open) {
- if(!which._height)
- which._height = additionalDemos.offsetHeight - package.offsetHeight;
- package.style.marginTop = (current + which._height) + "px";
- } else {
- package.style.marginTop = (current - which._height) + "px";
- }
- }
- },
-
- 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>
-
- <div id="container">
-
- <div class="header">
- <h1>Introducing IT Mill Toolkit 5</h1>
- <em>Effortless web application development for Java-programmers.</em>
- <a href="http://www.itmill.com" title="Open www.itmill.com">Visit itmill.com</a>
- </div> <!-- /Header -->
-
- <div class="content">
-
- <div id="demos">
- <h2>Demos</h2>
- <ul id="demo-buttons">
- <li id="feature-browser"><a href="FeaturesApplication/">Feature browser</a></li>
- <li id="notifications"><a href="NotificationDemo/">Notifications</a></li>
- <li id="reservr"><a href="reservr.html">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>» Additional demos</h3>
-
- <div id="additional-demos-content"> <!-- For JavaScript hooking -->
- <ul>
- <li><a href="table-demo">Table Demo</a></li>
- <li><a href="select-demo">Select Demo</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>
-
- <h4>Manual Deployment</h4>
- <p>If you do not use Eclipse, you can manually deploy the Toolkit
- <a href="lib/itmill-toolkit.war">WAR-package</a> to your application server.
- </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/manual.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>Licenses</h4>
- <p>All of IT Mill Toolkit's core is licensed under liberal Open Source license. Commercial licenses are also available.
- <a href="license/licensing-guidelines.html" class="more">Licensing Guidelines</a></p>
-
- </div> <!-- /support-licensing -->
-
- <div id="package-contents" class="panel">
- <div class="top"></div>
-
- <h3>» Package contents</h3>
- <em>Version <version></version></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="WEB-INF/lib/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/manual.html">Manual</a> (<a href="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 & 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>Prices and purchase from <a href="mailto:sales@itmill.com">sales@itmill.com</a></li>
- </ul>
- </div>
-
- </div>
-
- <div class="bottom"></div>
- </div> <!-- /package-contents -->
-
- <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>
projects / vaadin-framework.git / commitdiff
