Removing a Single Item from Local Storage

‹prev | My Chain | next›

I have another two chapters nearing readiness for 3D Game Programming for Kids. Before that happens, I need a few changes to my fork of Mr Doob code editor.

I have been testing some changes recently and most look good. The remaining issues are minor issues. The most pressing is that a few new templates (referenced in the chapters) are needed. There is also a nagging bug in which Ctrl-X no longer seems to copy cut text to the clipboard.

But before I deal with any of those, I would like to be able to delete projects. I have been coding in this editor for many months now and have accumulated a number of dead projects:



This is one of those things that has been outstanding for so long that I built it into a more significant problem than it really was. I need to a add a link to the projects dialog:

var projectsDialogRow = function(doc) {
  var row = document.createElement( 'p' );

  var link = document.createElement( 'a' );
  // More for the project link here...
  row.appendChild(link);
  row.appendChild(document.createTextNode(' '));

  var del = document.createElement( 'a' );
  del.href = '#';
  del.textContent = '[delete]';
  del.className = 'delete';
  del.addEventListener( 'click', function ( event ) {
    var message =
      'Once a project is deleted, there is no way to get it back. ' +
      'Are you sure that you want to delete "' + doc.filename + '"?';

    if (confirm(message)) {
      deleteProject(doc.filename);
      openProjectsDialog();
    }
    event.stopPropagation();
    event.preventDefault();

  }, false );
  row.appendChild(del);

  return row;
};

There is nothing fancy here at all. I have the usual "are you sure?" confirmation dialog surrounding the deleteProject() call. I really hate confirmation dialogs. Since the book is meant for kids, I think it best to leave this in there anyway.

As for the deleteProject() function, I iterate through all documents so that I can NOT add the target project the updated list of documents:

var deleteProject = function(filename) {
  var new_documents = [];

  var i = 0, found;
  while (i < documents.length) {
    if (documents[i].filename == filename) {
      found = documents[i];
    }
    else {
      new_documents.push(documents[i]);
    }
    i++;
  }

  if ( ! found ) return;

  documents = new_documents;
  syncStore();
};

In addition to the function, the syncStore() method is new as well. I consolidate a number of existing localStorage update calls into this function:

var syncStore = function() {
  localStorage.codeeditor = JSON.stringify( documents );
};

I knock off a few of the smaller GitHub issues while I am at it. Once I am ready, I update the application cache version date in editor.appcache:

CACHE MANIFEST
# 2013-03-03

CACHE:
...

I push the changes to ICE, ICE Beta and call it a night.


Day #679