Skip to content

Instantly share code, notes, and snippets.

View forcementor's full-sized avatar

Don Robins forcementor

44 followers · 5 following
View GitHub Profile
@forcementor
forcementor / PocketCRM_APP1_1.component.js
Created October 17, 2012 17:36
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Build a Visualforce Custom Component to host our JavaScript application.
<apex:component>
<script type="text/javascript">
//==============================================================================================
//APPLICATION
//The Application class is the entry point into your Sencha Touch application.
//==============================================================================================
Ext.application({
name: "PocketCRM",
//The application's startup routine once all components are loaded.
launch: function () {
@forcementor
forcementor / PocketCRM1_1.page
Created October 17, 2012 17:44
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 4: Build a Host Visualforce Page
<apex:page docType="html-5.0" showHeader="false" standardStylesheets="false" cache="false">
<head>
<meta charset="UTF-8" />
<title>Pocket CRM</title>
<!-- Use the Visualforce tags for scripts and stylesheets rather than their HTML counterparts -->
<apex:includeScript value="http://cdn.sencha.io/try/touch/2.0.1/sencha-touch-all.js" />
<apex:stylesheet value="http://cdn.sencha.io/try/touch/2.0.1/resources/css/sencha-touch.css" />
@forcementor
forcementor / PocketCRM_CSS1.component
Created October 17, 2012 17:49
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 5: Build a Visualforce Custom Component to host our Application Specific Styles.
<apex:component>
<style type="text/css">
/**
* Example of an initial loading indicator.
* It is recommended to keep this as minimal as possible to provide instant feedback
* while other resources are still being loaded for the first time
*/
html, body {
height: 100%;
background-color: #1985D0
@forcementor
forcementor / PocketCRM_APP1.1.component
Created October 17, 2012 18:05
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 5: Build a Visualforce Custom Component to host our Application Specific Styles - add CSS component to VF Page
...
<c:PocketCRM_Css />
<c:PocketCRM_App />
</head>
@forcementor
forcementor / PocketCRM_APP1.store.component
Created October 17, 2012 18:08
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Add a Data Store
//==============================================================================================
//STORES
//Stored serve as the client-side cache of your data; they loading data into your app's views.
//==============================================================================================
//The Lead Store, this version will simply load with mock JSON data.
Ext.define("PocketCRM.store.Leads", {
extend: "Ext.data.Store",
requires: "Ext.data.proxy.LocalStorage",
config: {
@forcementor
forcementor / PocketCRM_APP1.model.component
Created October 17, 2012 18:17
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Add a Data Model
//==============================================================================================
//MODELS
//Models are the objects on your application.
//==============================================================================================
//The Lead model will include whatever fields are necssary to manage.
Ext.define("PocketCRM.model.Lead", {
extend: "Ext.data.Model",
config: {
@forcementor
forcementor / pocketCRM_APP1.controller.component
Created October 17, 2012 18:19
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Add a Controller
//==============================================================================================
//CONTROLLERS
//Controllers manage the communication of your application and the coordination between the
//views and the model; they listen for the events emitted by the views and react accordingly.
//==============================================================================================
//The controller for the Leads list view
Ext.define("PocketCRM.controller.Leads", {
extend: "Ext.app.Controller",
config: {},
@forcementor
forcementor / PocketCRM_APP1.listview.component
Created October 17, 2012 18:21
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Add a View for the List
//==============================================================================================
//VIEWS
//Views display data to your users and gather input from them;
//they also emit events about your user interaction.
//==============================================================================================
//The Lead list view.
Ext.define("PocketCRM.view.LeadsList", {
extend: "Ext.Container",
//It uses the base list class.
@forcementor
forcementor / PocketCRM_APP1.finishedApp.component
Created October 17, 2012 18:23
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Complete the Application
Ext.application({
name: "PocketCRM",
//Load the various MVC components into memory.
models: ["Lead"],
stores: ["Leads"],
controllers: ["Leads"],
views: ["LeadsList"],
//The application's startup routine once all components are loaded.
@forcementor
forcementor / pocketCRM_APP1.JSON.component
Created October 17, 2012 18:31
Developing Mobile Applications with Force.com and Sencha Touch - Part 1, Step 6: Build Out The Sencha Touch Application - Generate Some Lead JSON
//Run this code in an APEX Execute Anonymous window:
List<Lead> leadList = [SELECT FirstName ,LastName ,Company ,Title ,Phone ,Email ,Status FROM Lead LIMIT 5];
system.debug(JSON.serializePretty(leadList));
/*Your results will be as follows in the DEBUG LOG.
*Find the USER_DEBUG line and copy all the JSON
*starting with the '[' delimiter thru the ending ']' delimiter
*and paste into your data store as the data content.
*The 'attributes' content is not used by Sencha, but you
*don't have to remove them as they will simply be ignored.