2017-06-18 23:50:22 +00:00
|
|
|
using System;
|
2017-06-24 20:34:47 +00:00
|
|
|
using System.Collections.Generic;
|
2017-06-24 23:25:14 +00:00
|
|
|
using System.Linq;
|
2017-06-18 23:50:22 +00:00
|
|
|
using Ooui;
|
|
|
|
|
|
|
|
namespace Samples
|
|
|
|
{
|
2017-11-10 06:35:47 +00:00
|
|
|
public class TodoSample : ISample
|
2017-06-18 23:50:22 +00:00
|
|
|
{
|
2017-11-16 04:32:17 +00:00
|
|
|
public string Title => "Todo List";
|
2017-11-10 06:35:47 +00:00
|
|
|
|
2017-06-24 23:25:14 +00:00
|
|
|
List items = new List () {
|
|
|
|
ClassName = "list-group",
|
|
|
|
};
|
|
|
|
|
|
|
|
public TodoSample ()
|
|
|
|
{
|
|
|
|
items.Style.MarginTop = "1em";
|
|
|
|
}
|
2017-06-24 20:34:47 +00:00
|
|
|
|
2017-06-24 22:21:48 +00:00
|
|
|
class Item : ListItem
|
2017-06-18 23:50:22 +00:00
|
|
|
{
|
2017-06-24 23:25:14 +00:00
|
|
|
Element label = new Div ();
|
|
|
|
|
|
|
|
bool isDone;
|
|
|
|
public bool IsDone {
|
|
|
|
get => isDone;
|
|
|
|
set {
|
|
|
|
isDone = value;
|
|
|
|
label.Style.TextDecoration =
|
|
|
|
isDone ? "line-through" : "none";
|
|
|
|
label.Style.FontWeight =
|
|
|
|
isDone ? "normal" : "bold";
|
|
|
|
label.Style.Color =
|
|
|
|
isDone ? "#999" : "#000";
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-06-24 22:21:48 +00:00
|
|
|
public Item (string text)
|
|
|
|
{
|
2017-06-24 23:25:14 +00:00
|
|
|
ClassName = "list-group-item";
|
|
|
|
Style.Cursor = "pointer";
|
|
|
|
label.Text = text;
|
|
|
|
label.Style.FontWeight = "bold";
|
2017-06-24 22:21:48 +00:00
|
|
|
AppendChild (label);
|
|
|
|
}
|
2017-06-24 21:52:34 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
Element MakeTodo ()
|
2017-06-24 23:25:14 +00:00
|
|
|
{
|
|
|
|
var heading = new Heading ("Todo List");
|
|
|
|
var subtitle = new Paragraph ("This is the shared todo list of the world.");
|
|
|
|
var inputForm = new Form {
|
|
|
|
ClassName = "form-inline"
|
|
|
|
};
|
|
|
|
var input = new Input {
|
|
|
|
ClassName = "form-control"
|
|
|
|
};
|
|
|
|
var addbtn = new Button ("Add") {
|
|
|
|
Type = ButtonType.Submit,
|
|
|
|
ClassName = "btn btn-primary",
|
|
|
|
};
|
|
|
|
addbtn.Style.MarginLeft = "1em";
|
|
|
|
var clearbtn = new Button ("Clear Completed") {
|
|
|
|
Type = ButtonType.Submit,
|
|
|
|
ClassName = "btn btn-danger",
|
|
|
|
};
|
|
|
|
void AddItem ()
|
|
|
|
{
|
2017-06-24 21:52:34 +00:00
|
|
|
if (string.IsNullOrWhiteSpace (input.Value))
|
|
|
|
return;
|
2017-06-24 22:21:48 +00:00
|
|
|
var item = new Item (input.Value);
|
2017-06-24 23:25:14 +00:00
|
|
|
item.Clicked += (s, e) => {
|
|
|
|
item.IsDone = !item.IsDone;
|
|
|
|
};
|
|
|
|
items.InsertBefore (item, items.FirstChild);
|
2017-06-24 21:52:34 +00:00
|
|
|
input.Value = "";
|
2017-06-24 23:25:14 +00:00
|
|
|
}
|
|
|
|
addbtn.Clicked += (s, e) => {
|
|
|
|
AddItem ();
|
|
|
|
};
|
|
|
|
inputForm.Submitted += (s, e) => {
|
|
|
|
AddItem ();
|
|
|
|
};
|
|
|
|
clearbtn.Clicked += (s, e) => {
|
|
|
|
var toremove = new List<Node> ();
|
|
|
|
foreach (Item i in items.Children) {
|
|
|
|
if (i.IsDone) toremove.Add (i);
|
|
|
|
}
|
|
|
|
foreach (var i in toremove) {
|
|
|
|
items.RemoveChild (i);
|
|
|
|
}
|
2017-06-18 23:50:22 +00:00
|
|
|
};
|
2017-06-24 20:34:47 +00:00
|
|
|
var app = new Div ();
|
2017-06-24 23:25:14 +00:00
|
|
|
app.AppendChild (heading);
|
|
|
|
app.AppendChild (subtitle);
|
|
|
|
inputForm.AppendChild (input);
|
|
|
|
inputForm.AppendChild (addbtn);
|
|
|
|
app.AppendChild (inputForm);
|
2017-06-24 20:34:47 +00:00
|
|
|
app.AppendChild (items);
|
2017-06-24 23:25:14 +00:00
|
|
|
app.AppendChild (clearbtn);
|
2017-06-24 20:34:47 +00:00
|
|
|
return app;
|
2017-06-18 23:50:22 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
public void Publish ()
|
|
|
|
{
|
|
|
|
var b = MakeTodo ();
|
|
|
|
|
|
|
|
UI.Publish ("/todo", MakeTodo);
|
|
|
|
}
|
2017-11-10 06:35:47 +00:00
|
|
|
|
|
|
|
public Element CreateElement ()
|
|
|
|
{
|
|
|
|
return MakeTodo ();
|
|
|
|
}
|
2017-06-18 23:50:22 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|