Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Wagon: Deploying sitegen to repository
- Loading branch information
FuseSource CI
committed
Jul 25, 2013
1 parent
cddb058
commit c8e469d
Showing
5 changed files
with
521 additions
and
22 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,265 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8" /> | ||
<title>hawtio forms plugin</title> | ||
<meta content="width=device-width, initial-scale=1.0" name="viewport" /> | ||
<meta content="A HTML5 web console for managing Java services with support for JMX, OSGi, Apache ActiveMQ, Apache Camel and Fuse Fabric. Open source, modular and extensible" name="description" /> | ||
<!-- | ||
<link href="/blog/atom.xml" rel="alternate" title="hawtio blog Atom feed" type="application/atom+xml" /> | ||
--> | ||
<link href="/stylesheets/screen.css" rel="stylesheet" /> | ||
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> | ||
<!--[if lt IE 9]> | ||
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.js"></script> | ||
<![endif]--> | ||
<link href="/favicon.ico" rel="shortcut icon" /> | ||
</head> | ||
<body class="home"> | ||
<header class="navbar navbar-fixed-top" id="banner" role="banner"> | ||
<div class="navbar-inner"> | ||
<div class="container"> | ||
<a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse"> | ||
<span class="icon-bar"></span> | ||
<span class="icon-bar"></span> | ||
<span class="icon-bar"></span> | ||
</a> | ||
<div class="g-plusone-slot"> | ||
<div class="g-plusone" data-annotation="none"></div> | ||
</div> | ||
<a class="brand" href="/"> | ||
<span class="name"> | ||
<img src="/images/logo.png" /> | ||
hawtio | ||
</span> | ||
</a> | ||
<nav class="nav-collapse" role="navigation"> | ||
<ul class="nav"> | ||
<li><a href="/faq/index.html">FAQ</a></li> | ||
<li><a href="/getstarted/index.html">Getting Started</a></li> | ||
<li><a href="/community/index.html">Community</a></li> | ||
<li><a href="/plugins/index.html">Plugins</a></li> | ||
<li><a href="/developers/index.html">Developers</a></li> | ||
<li><a href="https://github.com/hawtio/hawtio">github</a></li> | ||
<!-- | ||
<li><a href="/blog/">Blog</a></li> | ||
--> | ||
</ul> | ||
</nav> | ||
</div> | ||
</div> | ||
</header> | ||
<div id="main"> | ||
<p><div id="content-header"> | ||
<div class="container"></p> | ||
|
||
<h3 id = "Forms">Forms</h3> | ||
|
||
<p>This plugin provides an easy way, given a <a href="http://json-schema.org/">JSON Schema</a> model of generating a form with 2 way binding to some JSON data.</p> | ||
|
||
<p>For an example of it in action, see the <a href="https://github.com/hawtio/hawtio/blob/master/hawtio-web/src/main/webapp/app/forms/html/test.html">test.html</a> or run it via <a href="http://localhost:8080/hawtio/#/forms/test">http://localhost:8080/hawtio/#/forms/test</a>.</p> | ||
|
||
<h2 id = "Customizing_the_UI_with_tabs">Customizing the UI with tabs</h2> | ||
|
||
<p>The easiest way to customise the generated form is to specify which order you want the fields to appear; or to move different fields onto different tabs using the <strong>tabs</strong> object on a json schema type. | ||
e.g.</p> | ||
|
||
<pre><code> tabs: { | ||
'Tab One': ['key', 'value'], | ||
'Tab Two': ['*'], | ||
'Tab Three': ['booleanArg'], | ||
'Tab Four': ['foo\\..*'] | ||
}</code></pre> | ||
|
||
<p>You can use “*" to refer to all the other properties not explicitly configured.</p> | ||
|
||
<p>In addition you can use regular expressions to bind properties to a particular tab (e.g. so we match foo.* nested properties to Tab Four above). </p> | ||
|
||
<h2 id = "Hiding_fields">Hiding fields</h2> | ||
|
||
<p>You can add a <strong>hidden</strong> flag on a property in a JSON schema to hide it from the auto-generated forms. Or you can set its type to be <strong>hidden</strong>.</p> | ||
|
||
<p>e.g.</p> | ||
|
||
<pre><code>properties: { | ||
foo: { | ||
type: "string", | ||
label: "My Foo Thingy" | ||
}, | ||
bar: { | ||
type: "string", | ||
hidden: true | ||
}</code></pre> | ||
|
||
<p> }</p> | ||
|
||
<p>in the above, the <em>bar</em> property will be hidden from the generated form</p> | ||
|
||
<h2 id = "Customizing_the_labels">Customizing the labels</h2> | ||
|
||
<p>If you wish to specify a custom label for a property (as by default it will just humanize the id of the property), you can just specify the 'label' property inside the JSON Schema as follows:</p> | ||
|
||
<pre><code>properties: { | ||
foo: { | ||
type: "string", | ||
label: "My Foo Thingy" | ||
}</code></pre> | ||
|
||
<p> }</p> | ||
|
||
<p>The <strong>label</strong> is not a JSON Schema property; but an extension like the <strong>tabs</strong> property above.</p> | ||
|
||
<h3 id = "Ignoring_prefix_of_deeply_nested_properties">Ignoring prefix of deeply nested properties</h3> | ||
|
||
<p>If you use nested properties, the labels may include an unnecessary prefix if you use sub-tabs to show related nested properties.</p> | ||
|
||
<p>To avoid this add a flag called <strong>ignorePrefixInLabel</strong> to the type which contains the <strong>properties</strong> you wish to ignore the prefixes of.</p> | ||
|
||
<p>e.g.</p> | ||
|
||
<pre><code>var myType = { | ||
"type" : "object", | ||
"properties" : { | ||
"foo" : { | ||
"properties" : { | ||
"value" : { | ||
"type" : "string" | ||
} | ||
} | ||
}, | ||
"bar" : { | ||
... | ||
} | ||
}, | ||
ignorePrefixInLabel: true | ||
}</code></pre> | ||
|
||
<p>In the aboe the label for <strong>foo.value</strong> would jsut show <em>value</em> rather than <em>foo value</em> as the label.</p> | ||
|
||
<h2 id = "Using_custom_controls">Using custom controls</h2> | ||
|
||
<p>To use a custom control use the <strong>formTemplate</strong> entry on a property to define the AngularJS partial to be used to render the form control. This lets you use any AngularJS directive or widget.</p> | ||
|
||
<p>For example if you search for <strong>formTemplate</strong> in the <a href="https://github.com/hawtio/hawtio/blob/master/hawtio-web/src/main/webapp/app/camel/js/camelModel.js#L120">code generated Camel json schema file</a> you will see how the <strong>description</strong> property uses a <em>textarea</em> | ||
</div> | ||
</div></p> | ||
</div> | ||
<footer> | ||
<div class="container"> | ||
<div class="project"> | ||
<img src="/images/footer-logo.png" /> | ||
<p class="bottom"> | ||
© | ||
Copyright 2012-2013 Red Hat, Inc. | ||
<br /> | ||
<i class="icon-fire"></i> | ||
Mixed with <a href="http://twitter.github.com/bootstrap">Bootstrap</a>. Baked by <a href="http://scalate.fusesource.org">Scalate</a>. | ||
<br /> | ||
<i class="icon-share-alt"></i> | ||
Website and docs licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>. | ||
<br /> | ||
Code released under <a href="http://www.apache.org/licenses/LICENSE-2.0.html">Apache License, v2.0</a>. | ||
</p> | ||
</div> | ||
<div class="footer-nav"> | ||
<h4>Learn</h4> | ||
<ul> | ||
<li> | ||
<a href="/index.html">Get Started</a> | ||
</li> | ||
<li> | ||
<a href="/developers/index.html">Developers</a> | ||
</li> | ||
<li> | ||
<a href="/building/index.html">Building</a> | ||
</li> | ||
</ul> | ||
</div> | ||
<div class="footer-nav"> | ||
<h4>Get Involved</h4> | ||
<ul> | ||
<!-- | ||
<li> | ||
<a href="http://community.jboss.org/en/hawtio?view=discussions">Forums</a> | ||
</li> | ||
--> | ||
<li> | ||
<a href="/contributing/index.html">Contributing</a> | ||
</li> | ||
<li> | ||
<a href="/community/index.html">Community</a> | ||
</li> | ||
<li> | ||
<a href="https://github.com/hawtio/hawtio/issues?state=open">Issue Tracker</a> | ||
</li> | ||
<li> | ||
<a href="https://github.com/hawtio/hawtio">Source Code</a> | ||
</li> | ||
<!-- | ||
<li> | ||
<a href="/community/contributors">Contributors</a> | ||
</li> | ||
--> | ||
</ul> | ||
</div> | ||
<div class="sponser"> | ||
<div class="follow-us"> | ||
<h4>Stay Informed</h4> | ||
<ul> | ||
<!-- | ||
<li> | ||
<a href="https://plus.google.com/100660127586085393031"><img alt="Google+" src="/images/social/googleplus-16.png" title="Follow hawtio on Google+" /></a> | ||
</li> | ||
--> | ||
<li> | ||
<a href="https://twitter.com/#!/search/%23hawtio"><img alt="Twitter" src="/images/social/twitter-16.png" title="Browse the #hawtio hashtag on Twitter" /></a> | ||
</li> | ||
<!-- | ||
<li> | ||
<a href="http://www.linkedin.com/groups?gid=3120340"><img alt="LinkedIn" src="/images/social/linkedin-16.png" title="Join the hawtio group on LinkedIn" /></a> | ||
</li> | ||
<li> | ||
<a href="http://vimeo.com/channels/hawtio"><img alt="Vimeo" src="/images/social/vimeo-16.png" title="Follow the hawtio channel on Vimeo" /></a> | ||
</li> | ||
--> | ||
</ul> | ||
</div> | ||
<p>This website is open source! If you want to improve it, <a href="http://github.com/hawtio/hawtio">fork the project</a>, hack on it, then send a pull request. You can also view the <a href="http://www.seethestats.com/site/hawtio">visitor stats</a>.</p> | ||
<p class="image"><a href="http://jboss.org"><img src="/images/jboss_redhat_branding.png" class="branding" title="Red Hat, Inc." alt="Red Hat, Inc." /></a></p> | ||
<p>hawtio is a <a href="http://jboss.org">JBoss Community</a> project and development is sponsored by Red Hat, Inc.</p> | ||
<p class="bottom"><a href="http://www.redhat.com/legal/legal_statement.html">Terms of Use</a> | <a href="http://www.redhat.com/legal/privacy_statement.html">Privacy Policy</a></p> | ||
</div> | ||
<a class="visible-desktop" href="#" id="toTop">Top</a> | ||
</div> | ||
</footer> | ||
<script> | ||
$(function() { | ||
$('html').addClass('ready'); | ||
prettify(); | ||
activateFooterGravity(); | ||
activateTooltips(); | ||
activateToTopControl(); | ||
}); | ||
</script> | ||
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.0.2/bootstrap.min.js"></script> | ||
<script src="/javascripts/prettify.js"></script> | ||
<script src="/javascripts/site.js"></script> | ||
<script> | ||
(function() { | ||
var po = document.createElement('script'); po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; | ||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); | ||
})(); | ||
</script> | ||
<script type="text/javascript"> | ||
var _gaq = _gaq || []; | ||
_gaq.push(['_setAccount', 'UA-36899203-1']); | ||
_gaq.push(['_trackPageview']); | ||
|
||
(function() { | ||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; | ||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; | ||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); | ||
})(); | ||
</script> | ||
</body> | ||
</html> |
Oops, something went wrong.