Step by Step

Ajax loader with pure CSS3 instead GIF without additional HTML elements

HTML:

    <div id="container" class="innerLoader"></div>

    <button onclick="toogleClass();">Inner Loader</button>

JavaScript:

    function toogleClass() {
        var container = document.getElementById('container');
        var className = container.className;
        if (className === 'innerLoader')
            container.className = '';
        else 
            container.className = 'innerLoader';
        }
    }

CSS:

 div {
  border:1px orangered solid;
  height: 200px;
 }
 .innerLoader {
  position: relative;
 }

 .innerLoader::after
 {
  content:'';
  position: absolute;

  top:50%;
  left:50%;
  width: 30px;
  height: 30px;
  margin:-15px 0 0 -15px;
  border: 8px solid #000;
  border-right-color: rgba(128, 128, 128, 0.3);
  border-radius: 50%;
  box-shadow: 0 0 20px 2px rgba(128, 128, 128, 0.4), inset 0 0 10px 0px rgba(128, 128, 128, 0.4);
  
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 600ms;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: innerLoaderKeyframe;
 }
 @-webkit-keyframes innerLoaderKeyframe {
  from { -webkit-transform: rotate(0deg); }
  to { -webkit-transform: rotate(360deg); }
 }

If you want to use image use next CSS:

 .innerLoader::after
 {
  content:'';
  position: absolute;
  
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
  background-image: url(ajax_loader.png);
  background-repeat: no-repeat;
  background-position: center;
  /*background-size: 13px 13px; // retina display*/
  
  -webkit-animation-timing-function: linear;
  -webkit-animation-duration: 600ms;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: innerLoaderKeyframe;
 }

Use Cordova WP8 JsonHelper for deserialize json

In PhoneGap Documentation "Developing a Plugin on Windows Phone" explain how parse simple array of string:

cordova.exec(win, fail, "ServiceName", "MethodName", ["this is a string", "54", "{literal:'trouble'}"]) ;

string[] optValues = JsonHelper.Deserialize(options);

But if you have something more complexity like this:

var moreBtns = 
[
    {
        name  : 'fb button',
        target: 'EXTERNAL',
        url   : 'http://www.facebook.com'
    },
    {
        name  : 'twitter button',
        target: 'EXTERNAL',
        url   : 'http://www.twitter.com'
    }
];
cordova.exec(win, fail, "ServiceName", "MethodName", ["this is a string", "54", moreBtns]) ;

How to parse it? First of all create class for more button

public class moreButtonClass
{
    public string name { get; set; }
    public string target { get; set; }
    public string url { get; set; }
}

and then parse

string[] optValues = JsonHelper.Deserialize(options);

if (optValues.Length > 2)
{
    moreButtonClass[] moreBtns = JsonHelper.Deserialize(optValues[3]);

    for (int i = 0; i < moreBtns.Length; i++)
    {
        Debug.WriteLine("moreBtns[" + i + "][name]=" + moreBtns[i].name);
        Debug.WriteLine("moreBtns[" + i + "][target]=" + moreBtns[i].target);
        Debug.WriteLine("moreBtns[" + i + "][url]=" + moreBtns[i].url);
    }
}

WebViewCore:: Broken after finding a focusable Node

If you use WebView for your Android application and encounter a similar error message (and application is broken), probably you have this css property on html element:

-webkit-user-modify: read-write-plaintext-only;

just remove this property

TCP/IP Monitor for IBM Worklight

Add property -Dworklight.port=8085 to eclipse.ini
Open TCP/IP Monitor View
Go to properties under bottom arrow
Add new monitor
Ok
Select created monitor and click Start
Ok
Now you can see request/response of worklight

Remove click delay on mobile browser

mobileClick.js - jQuery plugin that create self event 'mobileclick', not invoke 'click' event, not interfering in propagate stack of events. You need just bind 'mobileclick' event to you html element:

$('you-element-selector').bind('mobileclick', function() {
    alert('test me');
})
// or
$(document).on('mobileclick', 'you-element-selector', function() {
    alert('test me');
})

github project: mobileClick

Objective C: UITableView: Detect which section header on top

static NSInteger currentTopVisibleSection = -1;

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section {
    NSIndexPath *topCellPath = [[tableView indexPathsForVisibleRows] objectAtIndex:0];
    if (currentTopVisibleSection != topCellPath.section) {
        currentTopVisibleSection = topCellPath.section;
        NSLog(@"current section on top is %d", currentTopVisibleSection);
    }

    NSString *header = [NSString stringWithFormat:@"Section %d", section];
    return header;
}

iOS PhoneGap / Cordova – Splash screen control

In Cordova from 1.6 version exist “AutoHideSplashScreen” attribute. If you need show splash screen until you get onDeviceReady event - change value to NO.

function onBodyLoad()
{  
 document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady()
{
 navigator.splashscreen.hide();
}

But if you have Cordova version until 1.8 it doesn't work. Use instead navigator object:

 cordova.exec(null, null, "SplashScreen", "hide", []);
 cordova.exec(null, null, "SplashScreen", "show", []);

But for iPad you need add to project two new images:

 Default-Portrait.png
 Default-Landscape.png