static void Init (Atom input, NumericOptions options=null)
{
if (input.HasAttribute ("autonumeric"))
return;
InitImp (input, options);
}
static void InitImp (Atom input, NumericOptions options=null)
{
input.SetAttribute ("autonumeric", true);
input.SetAttribute ("data-type", "numeric");
input.Style.CssText = "text-align:right;";
jQuery.FromElement (input).Execute ("autoNumeric", "init", options);
}
static NumericOptions GetSettings (Atom input)
{
if (!input.HasAttribute ("autonumeric"))
InitImp (input);
return jQuery.FromElement (input).Execute<NumericOptions> ("autoNumeric", "getSettings");
}
static void Update (Atom input, NumericOptions options)
{
if (!input.HasAttribute ("autonumeric"))
InitImp (input, options);
else
jQuery.FromElement (input).Execute ("autoNumeric", "update", options);
}
public static ButtonIcon ButtonIcon(string iconClass, Action<Atom> action, Atom parent)
{
var e = Button (null,"btn", "button",null, null).As<ButtonIcon> ();
e.SetToAtomProperty ("icon", new CssIcon (iconClass));
e.SetToAtomProperty ("get_iconClass", (Func<string>)(() => e.Icon.ClassName));
e.SetToAtomProperty ("set_iconClass", (Action<string>)((v) => e.Icon.ClassName = v));
e.Append (e.Icon);
if (action != null)
action (e);
if (parent != null)
parent.Append (e);
return e;
}
public static AutoNumeric AutoNumeric(Atom input, NumericOptions options=null)
{
Init (input, options);
dynamic methods = new {};
methods["get"]= (Func<bool, decimal?>)( (r)=> GetValue(input,false) );
methods["set"]= (Action< decimal?>)( (v)=> SetValue(input,v) );
methods["init"]= (Action<NumericOptions>)( o=> Init(input,o) );
methods["update"]= (Action<NumericOptions>)( o=> Update(input,o) );
methods["getSettings"]= (Func<NumericOptions>)( ()=> GetSettings(input) );
input.SetToAtomProperty ("autoNumeric",(object) methods);
return UI.Cast<AutoNumeric> (input);
}
public static Form Form (Atom parent=null, Action<Atom> action=null )
{
var e = Atom ("form", null, null, null, action, parent).As<Form>();
e._updated = (Action<Form, FormUpdatedAction>)( (f,a) => {});
e._validate = (Func<Input,bool>)((i)=>{
if(i.ErrorMessage==null && !i.Validity.Valid){
i.ErrorMessage= i.Popover( new PopoverOptions{Trigger="manual", Content="OK"});
i.ErrorMessage.Show();
}
if(i.CheckValidity()){
if(i.ErrorMessage!=null){
i.ErrorMessage.Destroy();
i.ErrorMessage=null;
}
return true;
}
else{
jQuery.Select(".popover-content", i.NextSibling).First().Html(i.ValidationMessage);
return false;
}
});
e._clear = (Action<Form>)(f=>{
f.Reset();
var inputs = f.Inputs;
foreach(var i in inputs)
{
if(i.ErrorMessage!=null) {
i.ErrorMessage.Destroy();
i.ErrorMessage=null;
}
}
});
e.SetAttribute ("novalidate", "novalidate");
e.SetToAtomProperty("clear", (Action)(()=>{
e._clear(e);
e.JQuery.Data("_source_", e.JQuery.Serialize());
e._updated(e, FormUpdatedAction.Clear);
}));
e.SetToAtomProperty("populateFrom", (Action<JsDictionary>)( d=>{
e._clear(e);
foreach(var p in d)
{
var o = jQuery.Select ("[name='{0}']".Fmt(p.Key), e);
o.Each ((index, element)=>{
var atom = element.As<Input<object>>();
var value = p.Value;
var type = atom.GetFromAtomProperty ("type").ToString();
if (type == "radio") {
if (Object.Equals (value, atom.Value))
atom.SetToAtomProperty("checked",true);
} else if (type == "checkbox") {
if (!value.IsArray ()) {
if (Object.Equals (value, true))
atom.SetToAtomProperty( "checked", true);
} else {
var a = Cast<List<object>> (value);
if (a.IndexOf (atom.Value) > 0)
atom.SetToAtomProperty( "checked", true);
}
} else if (type == "select-multiple" && value.IsArray ()) {
var a = Cast<List<object>> (value);
foreach (var item in a) {
var q = jQuery.Select ("option[value={0}]".Fmt (item), atom);
if (q.Length > 0) {
SetToProperty(q.GetElement(0), "selected", true);
}
}
} else if (atom.HasAttribute ("autonumeric")) {
jQuery.FromElement (atom).Execute ("autoNumeric", "set", value);
} else if (atom.HasAttribute ("datepicker")) {
jQuery.FromElement (atom).Execute ("datepicker", "setDate", value);
} else {
atom.SetToAtomProperty ( "value", value??"");
}
});
}
e.JQuery.Data("_source_", e.JQuery.Serialize());
e._updated(e,FormUpdatedAction.Populate);
}));
e.SetToAtomProperty ("populate", (Action<JsDictionary>)(d => {
foreach(var p in d)
{
var o = jQuery.Select ("[name='{0}']".Fmt(p.Key), e);
if (o.Length == 0)
continue;
var r = new List<object> ();
o.Each ((index,element)=>{
var input = element.As<Input<object>>();
var type =input.Type;
if(type=="radio"){
if (Object.Equals( input.GetFromAtomProperty("checked"),true)) r.Add( input.Value);
} else if(type=="checkbox"){
if (Object.Equals( input.Value,true)){
r.Add((Object.Equals( input.GetFromAtomProperty("checked"),true)) );
}
else if (Object.Equals( input.GetFromAtomProperty("checked"),true))
r.Add(input.Value);
} else if(type=="select-one" || type=="select-multiple"){
var q = jQuery.Select ("option:selected", element );
q.Each((i,el)=> r.Add(el.As<OptionAtom<object>>().Value) );
} else {
r.Add( input.Value);
}
});
if (!p.Value.IsArray ()) {
if (r.Count>0 )d[p.Key] = r [0];
} else {
d[p.Key] = r ;
}
}
}));
e.SetToAtomProperty ("get_inputs", (Func<Input[]>)(
() => Cast<Input[]> (jQuery.Select("input,select,textarea",e).GetElements())));
e.SetToAtomProperty ("checkValidity", (Func<bool>)(() => {
var inputs = e.Inputs;
foreach(var i in inputs){
if(!i.CheckValidity()) return false;
}
return true;
}));
e.SetToAtomProperty("hasChanges",(Func<bool>)(()=>e.JQuery.Serialize()!=e.JQuery.GetDataValue("_source_").ToString()));
e.SetToAtomProperty ("add_changed", (Action<jQueryEventHandler>)
(hdl => jQuery.FromElement (e).On ("change", hdl) ));
e.SetToAtomProperty ("remove_changed", (Action<jQueryEventHandler>)
(hdl => jQuery.FromElement (e).Off ("change", "", hdl)));
e.SetToAtomProperty ("add_updated", (Action<Action<Form,FormUpdatedAction>>)
(v => e._updated= Cast<Action<Form,FormUpdatedAction>>(Delegate.Combine (e._updated, v)) ));
e.SetToAtomProperty ("remove_updated", (Action<Action<Form,FormUpdatedAction>>)
(v => e._updated= Cast<Action<Form,FormUpdatedAction>>(Delegate.Remove (e._updated, v)) ));
jQuery.FromElement (e).On ("keyup", "input[type!=radio]input[type!=checkbox],select,textarea", ev => {
e._validate( ev.CurrentTarget.As<Input>());
});
jQuery.FromElement (e).On ("change", "input[type=radio],input[type=checkbox]", ev => {
var type = ev.CurrentTarget.As<Atom>().GetFromAtomProperty ("type").ToString();
e._validate(
jQuery.Select("input[type={0}][name={1}]".Fmt(type,ev.CurrentTarget.As<Input>().Name),e).Last().GetElement(0).As<Input>());
});
jQuery.FromElement (e).On ("change", "select", ev => {
e._validate( ev.CurrentTarget.As<Input>());
});
jQuery.FromElement (e).On ("submit", ev => {
ev.PreventDefault();
var inputs = e.Inputs;
var v = true;
foreach(var i in inputs)
{
var type = i.GetFromAtomProperty ("type").ToString();
if(type=="radio" || type=="checkbox")
{
v=e._validate(
jQuery.Select("input[type={0}][name={1}]".Fmt(type,i.Name),e).Last().GetElement(0).As<Input>())
&& v;
}
else
v= e._validate(i) && v;
}
if(v && e.SubmitHandler!=null) e.SubmitHandler(e);
});
e.JQuery.Data("_source_", e.JQuery.Serialize());
return e;
}
public SubmitButton(Atom parent, Action<Div> action=null){}
void ExecuteModule(Atom parent, string className){}
public static ResetButton ResetButton ( string text, Action<Atom> action, Atom parent )
{
return Button(text, "btn", "reset",action, parent).As<ResetButton>();
}
public static NavList NavList(Atom parent =null)
{
var e = new Div ("well sidebar-nav").As<NavList>();
e.Nav = Nav ("nav-list");
jQuery.FromElement (e).Append (e.Nav);
e.Nav.SetToAtomProperty ("get_header", (Func<string>)(() => e.GetFromAtomProperty ("$header").ToString () ?? ""));
e.Nav.SetToAtomProperty ("set_header", (Action<string>)((v) => {
e.SetToAtomProperty ("$header", v);
var fli= jQuery.Select ("li:first", e.Nav);
if (fli.Length == 0) {
jQuery.FromElement (e.Nav).Append (new HtmlListItem("nav-header", v));
} else if (fli.HasClass ("nav-header"))
fli.Html (BuildText (v));
else {
fli.Before (new HtmlListItem ("nav-header", v));
}
}));
e.SetToAtomProperty("get_text", (Func<string>)(()=> e.Header) );
e.SetToAtomProperty("set_text", (Action<string>)((v)=> e.Header=v) );
if (parent != null)
parent.Append (e);
return e;
}
public ButtonIcon(Atom parent, Action<ButtonIcon> action=null){}
public CssIcon (Atom parent,Action<CssIcon> action)
{
}
public CssIcon(Atom parent, string className){}
public ResetButton(Atom parent, Action<Div> action=null){}
public NavList(Atom parent=null){
}
public void AddElement(Atom element)
{
}
public Legend (Atom parent, string text=null)
{
}
public Fieldset(Atom parent, Action<Div> action=null){}
public ImgField(Atom parent, Action<ImgField> action=null){}
public static SubmitButton SubmitButton ( string text, Action<Atom> action, Atom parent )
{
return Button( text, "btn", "submit", action, parent).As<SubmitButton>();
}
public CssPicture (Atom parent, string src, string text)
{
}
public static Button Button (string text, string className, string type, Action<Atom> action=null, Atom parent=null )
{
return Atom("button", type??"button", className??"btn", text,action, parent).As<Button>();
}
public CssPicture (Atom parent,Action<CssPicture> action)
{
}
public static void Execute(Atom parent)
{
var form = new Form ();
new Fieldset (form, fs => {
new Legend (fs,"Legend");
new Label(fs, "LabelText");
new TextInput(fs, i=>{
i.Placeholder="type something";
i.Name="text";
});
new Span(fs, s=>{s.Text="Example block-level help text here"; s.ClassName="help-block";});
new CheckField(fs, cf=>{
cf.Name="allow";
cf.Input.Text="Check me";
cf.Input.Checked=true;
});
new SubmitButton(fs, b=>{
b.Text="Send";
b.Clicked+= (e) =>{
e.PreventDefault();
form.JQuery.Serialize().LogInfo();
};
});
form.Append(fs);
});
parent.JQuery.Append("Default styles".Header (3)).Append (form);
var sform = new Form ();
new TextInput (sform, i => {
i.Name="stext";
i.Placeholder="search for";
i.Required=true;
i.ClassName="input-medium search-query";
i.MaxLength=8;
i.MinLength=3;
});
new SubmitButton(sform, b=>{
b.Text="Search...";
b.Clicked+= (e) =>{
if(!sform.CheckValidity()) return ;
sform.JQuery.Serialize().LogInfo();
};
});
parent.JQuery.Append("Optional Layouts".Header (3)).Append("Search Form".Header(4)).Append (sform);
var lform = new Form ();
lform.SubmitHandler = f => f.JQuery.Serialize().LogInfo() ;
lform.ClassName = "form-inline";
new EmailInput (lform, i => {
i.Placeholder = "your email";
i.Required=true;
i.Name="email";
});
new PasswordInput (lform, i => {
i.Placeholder = "your password";
i.Required=true;
i.Name="password";
i.MinLength=4;
});
new CheckInput (lform,i =>{
i.Name="remember";
i.Text="Remember?";
i.Checked=true;
});
new SubmitButton (lform, b => b.Text = "submit");
parent.JQuery.Append("Inline Form".Header(4)).Append (lform);
new Form (f=>{
f.ClassName="form-horizontal";
new EmailField(f,i=>{
i.Text="Email";
i.Placeholder="your email";
i.Input.Required=true;
i.Name="email";
});
new PasswordField(f,i=>{
i.Text="Password";
i.Placeholder="your password";
i.Input.Required=true;
i.Input.MinLength=4;
i.Name="password";
});
new CheckField(f, i=>{
i.Input.Text="Remember";
i.Input.Checked=true;
i.Name="remember";
new SubmitButton(i.Controls, b=> b.Text="Login");
});
f.SubmitHandler= fr=> fr.JQuery.Serialize().LogInfo();
parent.JQuery.Append("Horizontal Form".Header(4)).Append (f);
});
var login = new Div ("span4 offset3 well");
login.Append (new Legend("Login Form"));
new Form (login, f => {
var nm = new TextField(f);
nm.Placeholder="user name";
nm.Name ="username";
nm.Input.ClassName="span12";
nm.Input.Required=true;
nm.Input.MinLength=8;
var pwd = new PasswordField(f);
pwd.Placeholder="password";
pwd.Name ="password";
pwd.Input.ClassName="span12";
pwd.Input.Required=true;
pwd.Input.MinLength=6;
pwd.Input.MaxLength=10;
var rmb = new CheckField(f);
rmb.Name="remember";
rmb.Input.Text="Remember";
var sb = new SubmitButton(f);
sb.Text="Login";
sb.AddClass("btn-info btn-block");
f.SubmitHandler= fr=>{
sb.Disabled=true;
Window.SetTimeout(()=>{
sb.Disabled=false;
"Welcome {0}".Fmt(nm.Value).LogSuccess();
f.Reset();
}, 1000);
};
});
parent.JQuery.Append ("Samples".Header(3)).Append ("Login Form".Header(4))
.Append (UI.CreateContainer(ct=> UI.CreateRow(ct, rw=> rw.Append(login))));
var contact = new Div ("container");
new Form (contact, f=>{
f.ClassName="well span8";
UI.CreateRowFluid(f, row=>{
new Div(row, p=>{
p.ClassName="span5";
new TextField(p, tf=>{tf.Name="firstname"; tf.Required=true; tf.Text="FirstName"; tf.Input.ClassName="span12"; });
new TextField(p, tf=>{tf.Name="lastname"; tf.Required=true; tf.Text="LastName"; tf.Input.ClassName="span12"; });
new EmailField(p, tf=>{tf.Name="email"; tf.Required=true; tf.Text="Email";tf.Input.ClassName="span12";});
new SelectField<string>(p, sf=>{
sf.Text="Subject";
sf.Name="subject";
sf.Input.ClassName="span12";
sf.Input.Add("", "Choose one...");
sf.Input.Add("1", "General Customer Service");
sf.Input.Add("2", "Suggestions");
sf.Input.Add("3", "Product suport");
sf.Input.Add("4", "Bug");
sf.Input.Required=true;
});
});
new Div(row, p=>{
p.ClassName="span7";
new TextAreaField(p, tf=>{tf.Name="message"; tf.Rows=11; tf.Text="Message";tf.Input.ClassName="span12";});
});
new SubmitButton(row, bt=>{
bt.AddClass("btn-primary pull-right");
bt.Text="Send";
});
});
f.SubmitHandler=fr=> AlertFn.Success(fr.FirstChild,"Message sent",true, 5000);
});
parent.JQuery.Append("Conctact Form".Header(4)).Append (contact);
parent.Append ("C# code".Header(3));
var rq =jQuery.GetData<string> ("code/demoform.html");
rq.Done (s=> {
var code=new Div();
code.InnerHTML= s;
parent.Append(code);
});
}
public Div(Atom parent, Action<Div> action=null){}
public Image (Atom parent, Action<Image> action=null)
{
}
public ImgPicture (Atom parent, string src, string text)
{
}
public Span(Atom parent, Action<Div> action=null){}
public ImgPicture (Atom parent,Action<ImgPicture> action)
{
}