villeilkkala

<div className={VSS(focus.styles, "todo")}>  
  <h1>Todo List</h1>
  <If test={!focus.user}>
    <div className="app">
      <input type="text" placeholder="Sign in with your nickname"
        onKeyPress={(e) => {
          if(e.which === 13) { focus.user = e.target.value }
        }}/>
    </div>
  </If>

villeilkkala

(providedTemplate) => {
  if (!providedTemplate) {
    console.error("LocalPartition instancer did not receive the template entity to instance");
    return null;
  }
 
  const localUserPartitionId = this[Resource.createDerivedId]("localUserPartition");
  const partitionURI = Valaa.Partition.createPartitionURI("valaa-local:", localUserPartitionId);
  const alreadyActive = Valaa.Partition.tryPartitionConnection(partitionURI);
  if (alreadyActive) {

villeilkkala

<ValaaScope focus={focus.createLocalPartition(focus.client)} lensName=”LENS” />

villeilkkala

<div className={VSS(focus.styles, "app")}>
  {focus.currentPage}
  <ul className="menu">
  <ForEach context={{origin: focus}}
    focus={focus[Relatable.getRelations]("page").sort( (a, b) => a.order - b.order)}>
    <li className={origin.currentPage === focus[Relation.target] ? "current" : null}
      onClick={() => origin.currentPage = focus[Relation.target]}>
      {focus[Relation.target][Valaa.name]}
    </li>
  </ForEach>

villeilkkala

.app {
    height: 100%;
    display: flex;
    overflow: hidden;
    background: white;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    flex-direction: column;
    color: #333331;
    line-height: 1.6em;
}

villeilkkala

.todo {
    width: 100%;
    margin: 0;
    height: 100%;
    padding: 1em;
    background: #fbfbfb;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 0.8em;
    color: #444452;
    overflow-y: scroll;