Warichu is a framework used to enrich web pages with user specified content. The framework can be extended with "Chews". Collaborative Chew is an extension allowing notes to be attached to web pages and exchanged between Warichu users.

More Information:

Following is the source for version 1.0 of Collaborative Chew

/*
Collaborative Chew
Released under the GPL
Created by John Beaven, January 2007
 
Warichu is a framework used to enrich web pages with user specified content.
The framework can be extended with "Chews". Collaborative Chew is an extension
allowing notes to be attached to web pages and exchanged between Warichu users.
*/
 
 
//this function is executed when the API has finished loading..
warichuapi.onload = function(warichuapi) {
 
  //define the type of the Chew..
  warichuapi.type = 'collaborative chew';
 
  var user_data = warichuapi.get_user_info();
  var remote_data = warichuapi.get_remote_data();
  
  var textAreaValue = remote_data.text;
  
  //if the data is new, enter a default message..
  if(remote_data.isNew) {
 
    remote_data.text = 'My new note for '+warichu_config['original_page']+'';
    remote_data.author_id = user_data.id;
    remote_data.author = user_data.name ? user_data.name : (user_data.email ? user_data.email : user_data.id);
 
    delete remote_data.isNew;
    
    textAreaValue = 'Edit this text and click the "Save Changes" button..';
    
    warichuapi.start_expanded = true;
  }
  
  if(remote_data.dataError) {
  
    remote_data.text = 'An error occured loading the data!';
    textAreaValue = 'Edit this text and click the "Save Changes" button..';
    delete remote_data.dataError;
  }
  
 
  //set the name of the Chew for the side bar..
  warichuapi.chew_name = 'Collaborative Note (by '+remote_data.author+')';
 
  //create unique ids for our controls.. These controls allow the user to
  //edit the content of the note..
  var myTextArea = 'myTextArea_'+remote_data.id;
  var mySaveButton = 'mySaveButton_'+remote_data.id;
 
  //write the controls to the page..
  warichuapi.write('"'+myTextArea+'" style="cpp-literal">"width: 100%;" dojoType="cpp-literal">"Editor2">loading.."'+mySaveButton+'" type="button" value="Save Changes" style="display: block; width: 100%">');
 
  //replace the id variables with pointers to the control objects..
  myTextArea = warichuapi.get_host_document().getElementById(myTextArea);
  mySaveButton = warichuapi.get_host_document().getElementById(mySaveButton);
 
  //this sets the value of a text area on the current page, allowing the user to change its value
  myTextArea.value = textAreaValue;
 
  //this adds an onclick handler to a button that the user clicks after making changes. the handler saves the data to our servers, then
  //updates the inline message display..
 
  mySaveButton.onclick = function() {
 
    var user_data = warichuapi.get_user_info();
    remote_data.author = user_data.name ? user_data.name : (user_data.email ? user_data.email : user_data.id);
    
    //try to extract the data from dojo - failing that, resort to vanila html control..
    try{remote_data.text = dojo.widget.byId(myTextArea.id).editNode.innerHTML;}
    catch(ex){remote_data.text = myTextArea.value;}
    
    //persist the data on the server..
    warichuapi.set_remote_data(remote_data);
 
    //update the inline message display..
    window.warichu_CollaborativeChew_update_note();
  }
 
  /*
 
  if(user.name && user.email)
    alert('id: '+user.id+', name: '+user.name+', email: '+user.email);
  else
    alert('id: '+user.id+', name and email unknown');
      */
      
  //update the display with the current value of the collaborative notes when all have loaded..
  warichuapi.add_loaded_handler(warichuapi.type, window.warichu_CollaborativeChew_update_note);
}
 
 
 
 
//the following function updates the display for notes that is embeded in
//the main document..
if(!window.warichu_CollaborativeChew_update_note) {
  window.warichu_CollaborativeChew_update_note = function() {
 
    //hijacking the last warichuapi instance created..
    var doc = warichuapi.get_host_document();
 
    var noteElem = doc.getElementById('warichu_collaborative_note');
 
    if(!noteElem) {
 
      noteElem = doc.createElement('div');
      noteElem.id = 'warichu_collaborative_note';
      noteElem.style.left = '5%';
      noteElem.style.width = '90%';
      noteElem.style.height = '20%';
      noteElem.style.backgroundColor = 'white';
      noteElem.style.border = '1px solid black';
      noteElem.style.overflow = 'auto';
      noteElem.style.padding = '3px';
      noteElem.style.zIndex = 999998;
 
      //insert scroll css..
      if(!self.innerHeight && document.createStyleSheet) {
 
        var ss = document.createStyleSheet();
        if(ss.addRule) {
          ss.addRule(".warichu_fix_collaborative_note","top:expression((eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop)+(documentElement.offsetHeight*.77));");
 
          noteElem.className = 'warichu_fix_collaborative_note';
          noteElem.style.position = 'absolute';
        } else {
 
          noteElem.style.display = 'none';
        }
      } else {
 
        noteElem.style.position = 'fixed';
        noteElem.style.top = '77%';
      }
 
      var placeholder = doc.getElementById('warichu_placeholder');
      
      if(placeholder)
        placeholder.appendChild(noteElem);
      else
        doc.body.appendChild(noteElem);
 
      //add 23% to the foot so there's always room to scroll to the end of the document..
      var spacer_elem = doc.createElement('div');
      spacer_elem.style.height = '25%';
      doc.body.appendChild(spacer_elem);
    }
 
    noteElem.innerHTML = '';
 
    for(var warichuid in warichuapis) {
 
      var chew = warichuapis[warichuid];
 
      if(chew.type == 'collaborative chew') {
 
        var data = chew.get_remote_data();
        var note = doc.createElement('div');
        note.style.backgroundColor = 'beige';
        note.style.border = '1px dotted black';
        note.style.padding = '3px';
        note.style.margin = '3px';
        note.innerHTML = data.author + ' wrote: ' + data.text;
        noteElem.appendChild(note);
 
        var note_edit = doc.createElement('span');
        note_edit.innerHTML = ' [edit]';
        note_edit.chew = chew;
        note_edit.onclick = function(){this.chew.show_ui();};
        note_edit.style.cursor = 'pointer';
        note_edit.style.color = 'blue';
        note.appendChild(note_edit);
      }
    }
  }
}