TodoList Web Assembly Apps by TeaVM

Client.java

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package org.teavm.flavour;

import org.teavm.flavour.templates.Templates;

/**
 *
 * @author lab-student
 */
public class Client {
    public static void main(String[] args) {
        Templates.bind(new TodoApps(), "application-content");
    }
}

TodoApps.html

<div id="myDIV" class="header">
  <h2>My To Do List</h2>
  <input type="text" id="myInput" placeholder="Title..." html:value="inputValue" html:change="inputValue"/>
  <span event:click="createList()" class="addBtn">Add</span>
</div>

<ul id="myUL">
    <std:foreach index="index" var="item" in="myList">
        <li event:click="check(index)">
          <html:text value="item"/>
          <span class="close" event:click="remove(index)">×</span>
        </li>
    </std:foreach>
</ul>

TodoApps.java

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package org.teavm.flavour;


import java.util.ArrayList;
import java.util.List;
import org.teavm.flavour.templates.BindTemplate;
import org.teavm.flavour.widgets.ApplicationTemplate;
import org.teavm.jso.JSBody;
import org.teavm.jso.dom.events.Event;
import org.teavm.jso.dom.events.EventListener;
import org.teavm.jso.dom.html.HTMLDocument;
import org.teavm.jso.dom.html.HTMLElement;
import org.teavm.jso.dom.html.HTMLInputElement;
import org.teavm.jso.dom.xml.Element;
import org.teavm.jso.dom.xml.NodeList;

/**
 *
 * @author lab-student
 */
@BindTemplate("templates/TodoApps.html")
public class TodoApps extends ApplicationTemplate {
    final HTMLDocument document = HTMLDocument.current();
    private List<String> myList = new ArrayList<>();
    public String inputValue;
    
    public TodoApps(){
        this.myList.add("sda;lds");
        this.myList.add("sda;ldsasdas");
        this.myList.add("sda;ldadsadass");
    }
    
    public List<String> getMyList(){
        return this.myList;
    }
    
    public String getInputValue(){
        return this.inputValue;
    }
    
    public void setInputValue(String inputValue){
        System.out.println(inputValue);
        this.inputValue = inputValue;
    }
        
    public void createList(){
        myList.add(this.inputValue);
        setInputValue("");
    }
            
    public void remove(int index){
        myList.remove(index);
    }
            
    public void check(int index){
        HTMLElement e = (HTMLElement)document.getElementsByTagName("li").get(index);
        String attr = e.getAttribute("class");        
        if(attr == null || attr.indexOf("checked") == -1){
            attr += " checked";
            attr = attr.replaceAll("null ", "");
            e.setAttribute("class", attr);
        }else{
            attr = attr.replaceAll("checked", "");
            e.setAttribute("class", attr);
        }
        
    }
        
}