Workshop 303, Final inline.js

inline.js

// add select Chatter functions to forcetk
// get feed-items
forcetk.Client.prototype.chatterFeed = function(id, callback, error) {
  this.ajax('/' + this.apiVersion + '/chatter/feeds/record/' + id + '/feed-items', callback, error);
}

// post feed item
forcetk.Client.prototype.postChatterItem = function(id, text, callback, error) {
  this.ajax('/' + this.apiVersion + '/chatter/feeds/record/' + id + '/feed-items', callback, error, "POST", '{ "body" : { "messageSegments" : [ { "type": "Text", "text" : "' + text + '" } ] } }');
}

// post feed comment
forcetk.Client.prototype.postChatterComment = function(id, text, callback, error) {
  this.ajax('/' + this.apiVersion + '/chatter/feed-items/' + id + '/comments', callback, error, "POST", '{ "body" : { "messageSegments" : [ { "type": "Text", "text" : "' + text + '" } ] } }');
}

function regLinkClickHandlers() {
  // avoid jQuery conflicts
  var $j = jQuery.noConflict();

  // standard logout function
  $j('#link_logout').click(function() {
    SFHybridApp.logToConsole("link_logout clicked");
    SalesforceOAuthPlugin.logout();
  });

  // handle clicks to Update on detailpage
  $j("#updateButton").click(function() {
    // update local information in the inventory array
    inventory[$j("#detailpage").attr("data-id")].Quantity__c = $j("#quantity").val();
    currentRecord = inventory[$j("#detailpage").attr("data-id")];

    // strip out ID before updating the database 
    var data = new Object();
    data.Quantity__c = currentRecord.Quantity__c;
    // update the database
    forcetkClient.update("Merchandise__c", currentRecord.Id, data, updateSuccess, onErrorSfdc);
  });

  // handle clicks to Collaborate on detailpage
  $j("#chatterButton").click(function() {
    // using the id of the current Merchandise record, get its Chatter feed items
    SFHybridApp.logToConsole("Getting Chatter");
    forcetkClient.chatterFeed($j("#detailpage").attr("data-id"), updateChatterList, onErrorSfdc);
  });


}

// handle successful retrieval of Merchandise records

function onSuccessSfdcMerchandise(response) {
  // avoid jQuery conflicts
  var $j = jQuery.noConflict();

  // debug info to console 
  SFHybridApp.logToConsole("onSuccessSfdcMerchandise: received " + response.totalSize + " merchandise records");

  // clear div_merchandise_list HTML
  $j("#div_merchandise_list").html("");

  // set the ul string var to a new UL
  var ul = $j('<ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="a"></ul>');

  // update div_merchandise_list with the UL
  $j("#div_merchandise_list").append(ul);

  // set the first li to display the number of records found, formatted using list-divider
  ul.append($j('<li data-role="list-divider">Merchandise records: ' + response.totalSize + '</li>'));

  // add an li for the merchandise being passed into the function via response
  // create an array to store record information for click listener creation below
  inventory = new Array();
  // loop through each record, using vars i and merchandise
  $j.each(response.records, function(i, merchandise) {
    // create an array element for each merchandise record, used below for listeners
    inventory[merchandise.Id] = merchandise;
    // create a new li with the record's Name; use the detailLink class and a record-specific data-id
    var newLi = $j("<li class='detailLink' data-id='" + merchandise.Id + "'><a href='#'>" + merchandise.Name + "</a></li>");
    ul.append(newLi);
  });

  // render (create) the list of Merchandise records
  $j("#div_merchandise_list").trigger("create");
  // send the rendered HTML to the log for debugging
  // SFHybridApp.logToConsole($j("#div_merchandise_list").html());
  // set up listeners for detailLink clicks
  $j(".detailLink").click(function() {
    // get the unique data-id of the record just clicked
    var id = $j(this).attr('data-id');
    //  using the id, get the record from the array created above
    var record = inventory[id];

    // use this info to set up various detail page information
    $j("#name").html(record.Name);
    $j("#quantity").val(record.Quantity__c);
    $j("#price").val(record.Price__c);
    $j("#detailpage").attr("data-id", record.Id);

    // change the view to the detailpage, tracking the location change
    $j.mobile.changePage('#detailpage', {
      changeHash: true
    });

  });

}

function refreshChatter(response) {
  forcetkClient.chatterFeed($j("#detailpage").attr("data-id"), updateChatterList, onErrorSfdc);
}

function updateChatterList(response) {
  // output debug information to the log
  SFHybridApp.logToConsole("Got Chatter");
  SFHybridApp.logToConsole(response.items.length);

  // clear div_chatter_list HTML
  $j("#div_chatter_list").html("");

  // loop through all items and display UI
  $j.each(response.items, function(i, chatter) {
    // open a new div
    var newItemDiv = $j("<div class='ui-body ui-body-b'>");
    // append the item author name
    newItemDiv.append($j("<h5>" + chatter.actor.name + " said ...</h5>"));
    // append the item text
    newItemDiv.append($j("<p>" + chatter.body.text + "</p>"));

    // display item comments
    var newCommentDiv;
    $j.each(chatter.comments.comments, function(i, comment) {
      // reset newCommentDiv to open the div
      newCommentDiv = $j("<div class='ui-body ui-body-c'>");
      // append the item author name
      newCommentDiv.append($j("<h5>" + comment.user.name + " commented ...</h5>"));
      // append the item text
      newCommentDiv.append($j("<p>" + comment.body.text + "</p>"));
      // append the closing inner div tag
      newCommentDiv.append($j("</div>"));
      // append newCommentDiv to newItemDiv
      newItemDiv.append(newCommentDiv);
    });

    // append a comment button to the item
    newItemDiv.append($j("<a href='#' data-role='button' data-min='true' class='comment' data-theme='b' data-inline='true' data-icon='plus' data-id='" + chatter.id + "'>Your Comment</a>"));

    // append the closing outer div tag
    newItemDiv.append($j("</div>"));

    // add the final item output to the div
    $j("#div_chatter_list").append(newItemDiv);

  });
  var newPostButtonDiv = $j("<a href='#' data-role='button' data-min='true' class='post' data-theme='b' data-icon='plus' data-inline='true' class='post'>New Post</a>")
  $j("#div_chatter_list").append(newPostButtonDiv);

  // set up listeners for chatterButton clicks
  $j("a.comment").click(function() {
    SFHybridApp.logToConsole("Commenting");

    var id = $j(this).attr('data-id');
    var post = prompt('Enter New Comment');
    if (post != null) {
      forcetkClient.postChatterComment(id, post, refreshChatter, onErrorSfdc);
    }

  });

  // set up listeners for chatterButton clicks
  $j("a.post").click(function() {
    SFHybridApp.logToConsole("Posting");

    var id = $j("#detailpage").attr("data-id");
    SFHybridApp.logToConsole('detailpage id.');
    SFHybridApp.logToConsole(id);
    var post = prompt('Enter New Post');
    if (post != null) {
      forcetkClient.postChatterItem(id, post, refreshChatter, onErrorSfdc);
    }

  });

  // render the final chatter list
  $j("#div_chatter_list").trigger("create");
  // log debug information
  SFHybridApp.logToConsole('Item output div.');
  SFHybridApp.logToConsole($j("#div_chatter_list").html());

  // change the view to the detailpage, tracking the location change
  $j.mobile.changePage('#chatterpage', {
    changeHash: true
  });

}

// simple handler for successful update

function updateSuccess(message) {
  alert("Item Updated");
}

// simple handler for SFDC access failure

function onErrorSfdc(error) {
  SFHybridApp.logToConsole("onErrorSfdc: " + JSON.stringify(error));
  alert('Error getting data!');
}