HTML5 based Drag And Drop File
Initially i gave though to use visualforce remoting however challenge was how to show progress bar and same challenge was with custom controller or extension also. So, i decided to create one simple Apex REST API to upload attachment.
In this article we will see how to use Camera and Audio recorder of mobile device in Visualforce and upload as chatter file. It may look that it is very tricky to access device camera and audio control in Visualforce however you may be right if there were no HTML5. Thanks to HTML5 for magic.
Visualforce Camera Access – Front Page
Visualforce Camera Access – Use Camera Prompt
What is Bower
What can be done from Bower
Web sites are made of lots of things — frameworks, libraries, assets, utilities, and rainbows. Bower manages all these things for you.
# registered package
$ bower install jquery
# GitHub shorthand – download repository SOQLBuilder from user Jitendra on Git
$ bower install JitendraZaa/SOQLBuilder
# Git endpoint
$ bower install git://github.com/user/package.git
$ bower install http://somewebsiteURL.com/script.js
I have written many articles on Node.js and AngularJs. In this article, I will demonstrate how to use PostgreSQL with Node.js and deploy on Heroku. I think you already smelled that this is one of starting article which will finally merged with Salesforce to create some cool application.
To connect PostgreSQL, we need “pg” module.
PostgreSQL in Node.js
Node.js is used as a primary language and hosted on Heroku. If you want to directly deploy to your Heroku Account, You can use Heroku Button on this Git Repository.
We have many tools available online for Query builder, However none of them were satisfying me so though to create my own tool.
This Node.js application is used for building SOQL with following features :
- Toggle between API name and Label Name
- Search Objects or Fileds needs to build SOQL (In my case, it was primitive. I had more than 70 Objects and many of those objects has 300+ fields)
- Checkboxes to select fields (No need to hold control button to select multiple fields)
- Automatic Query Builder at Right side of page
- Shows API count used by application
- Search returned records
- Sorting on Table Headers
Note : You will need to create “Connected App” in Salesforce to allow OAuth as explained in this post.
Live Demo of application
Prerequisite Libraries :
- Bootstrap CSS
This post used “Custom Service”, so please read this article to understand Dependency Injection in AngularJs.
Searching Sorting and Pagination in Table using AngularJS
In this series, we have gone through many articles on AngularJs. This time I will discuss about Dependency Injection in AngularJs .
Dependency injection is a software design pattern that allows the removal of hard-coded dependencies and makes it possible to change them, whether at run-time or compile-time.
Before going to DI first we have to know about Service.
What is Service , factory or Provider in AngularJs?
They all are same, with different way of writing. This (Singleton design pattern) defines dependency between your controller and View through application.
We can Inject a service in Controller, which will watch over changes automatically and change its View as per required.
We have many inbuilt standard service available like $scope, $filter. All inbuilt services in AngularJS starts with this sign $. In same way we can create our own custom service and then inject in Controller. Continue reading
I hope, from last article you got basic information about AngularJS. This time, I will demonstrate how to add basic Searching and Sorting capability to data table using AngularJs.
Output will look something like this :
Searching and Sorting in Table using AngularJS
Prerequisite Libraries :
- Bootstrap CSS
One of many features of HTML5 is capability to store data on client machine with the help of “Indexed Database API“. Using this technique web developers can add offline capabilities to their application. Currently almost every modern browser supports “IndexedDB”.
Lets start with Example on Indexed DB :
Very first step in IndexedDB is opening database. Below Code Sample will explain the process.
AngularJS by Google
So what is so special about this framework, other than its developed by Google ?
- Unlike Backbone and Ember, You don’t have to spend time on Event Handling (Bind, UnBind Events etc).
- It Works on principal of Dirty Checking.
- Automatically fires event if something gets changed.
What ? Dirty checking ? wouldn’t it be performance impact on my web application?
You are correct. But Google team has answer for this.
- AngularJS performance mainly linked to your computer (Client’s Computer) performance.
- Ergonomical point of view, an HTML page should not have more than 200 fields. More fields will just distract users.
In this article, I will demonstrate how to use AngularJs framework to create simple application. Continue reading