css card transition

http://css3playground.com/3d-flip-cards/
http://davidwalsh.name/css-flip
http://desandro.github.io/3dtransforms/docs/card-flip.html

GeoLocation no Windows Phone 8

Geolocator geolocator = new Geolocator();
geolocator.DesiredAccuracyInMeters = 50;
try   {
Geoposition geoposition = await geolocator.GetGeopositionAsync( maximumAge: TimeSpan.FromMinutes(5), timeout: TimeSpan.FromSeconds(10) );

LatitudeTextBlock.Text = geoposition.Coordinate.Latitude.ToString("0.000");
LongitudeTextBlock.Text = geoposition.Coordinate.Longitude.ToString("0.000");

}
catch (Exception ex) {
if ((uint)ex.HResult == 0x80004004)
   { // the application does not have the right capability or the location master     switch is off StatusTextBlock.Text = "location is disabled in phone settings."; }
//else
{ // something else happened acquring the location }



Mais em http://www.developer.com/ws/using-the-location-api-in-your-windows-phone-8-applications.html


Testar este também

        navigator.geolocation.getCurrentPosition(
          function(pos) {
            $("#lat_field").val(pos.coords.latitude);
            $("#long_field").val(pos.coords.longitude);
          }
        );

CellSpanning

http://msdn.microsoft.com/en-us/library/windows/apps/jj657974.aspx

O listview


<div id="myListView"
    data-win-control="WinJS.UI.ListView"
    data-win-options="{
        itemDataSource: DataExamples.myCellSpanningData.dataSource,
        itemTemplate:  Templates.myCellSpanningJSTemplate
        layout: { 
            groupInfo: DataExamples.groupInfo,
            itemInfo: DataExamples.itemInfo,
            type: WinJS.UI.CellSpanningLayout
        }
    }"
></div>

O segredo é:  groupInfo, itemInfo e itemTemplate.
Os 3 elementos você deve expor via namespace e os 3 você também tem que usar o comando
WinJS.Utilities.markSupportedForProcessing(nome da função);



O grouInfo é uma função. Só tem que configurar o tamanho menor da célula...

// Enable cell spanning and specify // the cellWidth and cellHeight for the items
var groupInfo = function groupInfo() {
     return { enableCellSpanning: true, cellWidth: 310, cellHeight: 80 };
    };

WinJS.Utilities.markSupportedForProcessing(groupInfo);



O itemInfo é uma função que retorna o tamanho do item


// Item info function that returns the size of a cell spanning item
var itemInfo = WinJS.Utilities.markSupportedForProcessing(function itemInfo(itemIndex) {
    var size = { width: 310, height: 80 };

    // Get the item from the data source
    var item = DataExamples.myCellSpanningData.getAt(itemIndex);
    if (item) {

        // Get the size based on the item type
        switch (item.type) {
            case "smallListIconTextItem":
                size = { width: 310, height: 80 };
                break;
                   
            case "mediumListIconTextItem":
                size = { width: 310, height: 170 };
                break;
                   
            case "largeListIconTextItem":
                size = { width: 310, height: 260 };
                break;

            default:
        }
    }
    return size;
});

O o template é uma função que retorna o HTML do item.. praticamente você monta item a item na mão

var myCellSpanningJSTemplate = function myCellSpanningJSTemplate(itemPromise) {
    return itemPromise.then(function (currentItem) {
        var result = document.createElement("div");

        // Use source data to decide what size to make the
        // ListView item
        result.className = currentItem.data.type;
        result.style.overflow = "hidden";

        // Display image
        var image = document.createElement("img");
        image.className = "regularListIconTextItem-Image";
        image.src = currentItem.data.picture;
        result.appendChild(image);

        var body = document.createElement("div");
        body.className = "regularListIconTextItem-Detail";
        body.style.overflow = "hidden";
        result.appendChild(body);

        // Display title
        var title = document.createElement("h4");
        title.innerText = currentItem.data.title;
        body.appendChild(title);

        // Display text
        var fulltext = document.createElement("h6");
        fulltext.innerText = currentItem.data.text;
        body.appendChild(fulltext);

        return result;
    });
};

windows store apps - Dar um post em uma página usando WinJs.xhr

Bem interessante e útil isso. Para chamar uma página passando algums parâmetros com POST. Também serve para GET

var oMyFormData = new FormData();

oMyFormData.append("Parameter1", Parameter1);
oMyFormData.append("Category", Parameter2);

WinJS.xhr({ url: "http://sua_url", type: "POST", data: oMyFormData }).then(LoadComplete, LoadError, LoadProgress);

windows store apps - como simular um iframe

http://stackoverflow.com/questions/13389076/correct-way-of-embedding-an-iframe-with-a-remote-website-in-a-metro-app

http://www.codeproject.com/Articles/506739/How-to-use-the-Google-Maps-API-on-Windows-8


HTML---
<div id="container"></div>
---JS---
WinJS.xhr({
url: 'http://yourwebsitehere'
}).done(function (result) {
     var domContainer = document.getElementById("container");
     domContainer.innerHTML = toStaticHTML(result.response);
});
But it will not act like an iframe overall, but you can still use it, if you just want to show a page from other domains.

windows store apps - Templates dinâmicos

Para usar templates dinâmicos em Apps da Windows Store
Um exemplo:

No html defina o ListView

<section aria-label="Main content" role="main">

<div data-win-control="WinJS.UI.ListView" id="TwGridView" data-win-options="{ layout:{type:WinJS.UI.GridLayout}}"></div>

</section>