function Note(vnode_init){
const {note} = vnode_init.attrs;
let is_editing = false;
let temp_text = note.text;
const edit_handler = function(){
  is_editing = true;
  };
const cancel_handler = function(){
  is_editing = false;
  };
const text_change_handler = function(e){
  temp_text = e.target.value;
  // prevent redraw, because the temp text is anyway contained in the textarea:
  // also, the "Save" button is going to cause its own redraw; otherwise clicking it would cause two redraws (and it is noticeable, that's how I knew two redraws were happening)
  e.redraw = false;
  };
const save_handler = function(){
  note.text = temp_text;
  is_editing = false;
  };
return {
view: function(){
if(is_editing){
  return m('.note', [
    m('textarea', {key: 'textarea', onchange: text_change_handler}, note.text),
    m('.buttons', {key: 'editing-buttons'}, [
      m('button', {key: 'cancel-button', onclick: cancel_handler}, 'Cancel'),
      m('button', {key: 'save-button', onclick: save_handler}, 'Save')
      ])
    ]);
  }
else{
  return m('.note', [
    m('.text', {key: 'text'}, note.text),
    m('.buttons', {key: 'viewing-buttons'}, [
      m('button', {key: 'edit-button', onclick: edit_handler}, 'Edit')
      ])
    ]);
  }
}
};  
}

export default Note;