Start of examples refactor

This is the general reorg of the examples directory structure, plus additional
guidelines.

calculator, animations and accessibility have been updated to the new standards
and tested, as an example.

Task-number: QTBUG-24133
Change-Id: I76c3b86751d3195ba2a5474ff23afb875765e9a4
Reviewed-by: Alan Alpert <alan.alpert@nokia.com>

12 files changed, 743 insertions, 0 deletions

diff --git a/examples/demos/samegame/content/BoomBlock.qml b/examples/demos/samegame/content/BoomBlock.qml
new file mode 100644
index 0000000000..47f86bd81b
--- /dev/null
+++ b/examples/demos/samegame/content/BoomBlock.qml
@@ -0,0 +1,112 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the QtDeclarative module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** GNU Lesser General Public License Usage
+** This file may be used under the terms of the GNU Lesser General Public
+** License version 2.1 as published by the Free Software Foundation and
+** appearing in the file LICENSE.LGPL included in the packaging of this
+** file. Please review the following information to ensure the GNU Lesser
+** General Public License version 2.1 requirements will be met:
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights. These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU General
+** Public License version 3.0 as published by the Free Software Foundation
+** and appearing in the file LICENSE.GPL included in the packaging of this
+** file. Please review the following information to ensure the GNU General
+** Public License version 3.0 requirements will be met:
+** http://www.gnu.org/copyleft/gpl.html.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms and
+** conditions contained in a signed written agreement between you and Nokia.
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import QtQuick.Particles 2.0
+
+Item {
+    id: block
+    property bool dying: false
+    property bool spawned: false
+    property int type: 0
+    property ParticleSystem particleSystem
+
+    Behavior on x {
+        enabled: spawned;
+        SpringAnimation{ spring: 2; damping: 0.2 }
+    }
+    Behavior on y {
+        SpringAnimation{ spring: 2; damping: 0.2 }
+    }
+
+    Image {
+        id: img
+        source: {
+            if(type == 0){
+                "pics/redStone.png";
+            } else if(type == 1) {
+                "pics/blueStone.png";
+            } else {
+                "pics/greenStone.png";
+            }
+        }
+        opacity: 0
+        Behavior on opacity { NumberAnimation { duration: 200 } }
+        anchors.fill: parent
+    }
+    Emitter {
+        id: particles
+        system: particleSystem
+        group: { 
+            if(type == 0){
+                "red";
+            } else if (type == 1) {
+                "blue";
+            } else {
+                "green";
+            }
+        }
+        anchors.fill: parent
+
+        speed: TargetDirection{targetX: block.width/2; targetY: block.height/2; magnitude: -60; magnitudeVariation: 60}
+        shape: EllipseShape{fill:true}
+        enabled: false;
+        lifeSpan: 700; lifeSpanVariation: 100
+        emitRate: 1000
+        maximumEmitted: 100 //only fires 0.1s bursts (still 2x old number)
+        size: 28
+        endSize: 14
+    }
+
+    states: [
+        State {
+            name: "AliveState"; when: spawned == true && dying == false
+            PropertyChanges { target: img; opacity: 1 }
+        },
+
+        State {
+            name: "DeathState"; when: dying == true
+            StateChangeScript { script: {particleSystem.paused = false; particles.pulse(100);} }
+            PropertyChanges { target: img; opacity: 0 }
+            StateChangeScript { script: block.destroy(1000); }
+        }
+    ]
+}
diff --git a/examples/demos/samegame/content/Button.qml b/examples/demos/samegame/content/Button.qml
new file mode 100644
index 0000000000..b305455c92
--- /dev/null
+++ b/examples/demos/samegame/content/Button.qml
@@ -0,0 +1,75 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the QtDeclarative module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** GNU Lesser General Public License Usage
+** This file may be used under the terms of the GNU Lesser General Public
+** License version 2.1 as published by the Free Software Foundation and
+** appearing in the file LICENSE.LGPL included in the packaging of this
+** file. Please review the following information to ensure the GNU Lesser
+** General Public License version 2.1 requirements will be met:
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights. These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU General
+** Public License version 3.0 as published by the Free Software Foundation
+** and appearing in the file LICENSE.GPL included in the packaging of this
+** file. Please review the following information to ensure the GNU General
+** Public License version 3.0 requirements will be met:
+** http://www.gnu.org/copyleft/gpl.html.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms and
+** conditions contained in a signed written agreement between you and Nokia.
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Rectangle {
+    id: container
+
+    property string text: "Button"
+
+    signal clicked
+
+    width: buttonLabel.width + 20; height: buttonLabel.height + 20
+    smooth: true
+    border { width: 1; color: Qt.darker(activePalette.button) }
+    radius: 8
+    color: activePalette.button
+
+    gradient: Gradient {
+        GradientStop {
+            position: 0.0
+            color: {
+                if (mouseArea.pressed)
+                    return activePalette.dark
+                else
+                    return activePalette.light
+            }
+        }
+        GradientStop { position: 1.0; color: activePalette.button }
+    }
+
+    MouseArea { id: mouseArea; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: buttonLabel; text: container.text; anchors.centerIn: container; color: activePalette.buttonText; font.pixelSize: 24
+    }
+}
diff --git a/examples/demos/samegame/content/Dialog.qml b/examples/demos/samegame/content/Dialog.qml
new file mode 100644
index 0000000000..80e5984bfe
--- /dev/null
+++ b/examples/demos/samegame/content/Dialog.qml
@@ -0,0 +1,81 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the QtDeclarative module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** GNU Lesser General Public License Usage
+** This file may be used under the terms of the GNU Lesser General Public
+** License version 2.1 as published by the Free Software Foundation and
+** appearing in the file LICENSE.LGPL included in the packaging of this
+** file. Please review the following information to ensure the GNU Lesser
+** General Public License version 2.1 requirements will be met:
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights. These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU General
+** Public License version 3.0 as published by the Free Software Foundation
+** and appearing in the file LICENSE.GPL included in the packaging of this
+** file. Please review the following information to ensure the GNU General
+** Public License version 3.0 requirements will be met:
+** http://www.gnu.org/copyleft/gpl.html.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms and
+** conditions contained in a signed written agreement between you and Nokia.
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+
+Rectangle {
+    id: page
+    anchors.centerIn: parent
+
+    property Item text: dialogText
+    property bool open: false
+
+    signal closed
+    signal opened
+    function forceClose() {
+        if(!open)
+            return; //already closed
+        page.open = false;
+        page.closed();
+        page.opacity = 0;
+    }
+
+    function show(txt) {
+        page.open = true;
+        page.opened();
+        dialogText.text = txt;
+        page.opacity = 1;
+    }
+
+    width: dialogText.width + 20; height: dialogText.height + 20
+    color: "white"
+    border.width: 1
+    opacity: 0
+    visible: opacity > 0
+    Behavior on opacity {
+        NumberAnimation { duration: 1000 }
+    }
+
+    Text { id: dialogText; anchors.centerIn: parent; text: "Hello World!" }
+
+    MouseArea { anchors.fill: parent; onClicked: forceClose(); }
+}
+
diff --git a/examples/demos/samegame/content/GameArea.qml b/examples/demos/samegame/content/GameArea.qml
new file mode 100644
index 0000000000..a43d55117a
--- /dev/null
+++ b/examples/demos/samegame/content/GameArea.qml
@@ -0,0 +1,92 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the QtDeclarative module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** GNU Lesser General Public License Usage
+** This file may be used under the terms of the GNU Lesser General Public
+** License version 2.1 as published by the Free Software Foundation and
+** appearing in the file LICENSE.LGPL included in the packaging of this
+** file. Please review the following information to ensure the GNU Lesser
+** General Public License version 2.1 requirements will be met:
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights. These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU General
+** Public License version 3.0 as published by the Free Software Foundation
+** and appearing in the file LICENSE.GPL included in the packaging of this
+** file. Please review the following information to ensure the GNU General
+** Public License version 3.0 requirements will be met:
+** http://www.gnu.org/copyleft/gpl.html.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms and
+** conditions contained in a signed written agreement between you and Nokia.
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+
+import QtQuick 2.0
+import QtQuick.Particles 2.0
+import "samegame.js" as Logic
+
+Item {
+    id: gameCanvas
+    property int score: 0
+    property int blockSize: 40
+    property ParticleSystem ps: particleSystem
+    Image {
+        id: background
+        anchors.fill: parent
+        z: -1
+        source: "pics/background.png"
+        fillMode: Image.PreserveAspectCrop
+    }
+
+    width: 480
+    height: 800
+    MouseArea {
+        anchors.fill: parent; onClicked: Logic.handleClick(mouse.x,mouse.y);
+    }
+    ParticleSystem{ 
+        id: particleSystem;
+        onEmptyChanged: if (empty) paused = true;
+        z:2
+        ImageParticle {
+            groups: ["red"]
+            color: Qt.darker("red");//Actually want desaturated...
+            source: "pics/particle.png"
+            colorVariation: 0.4
+            alpha: 0.1
+        }
+        ImageParticle {
+            groups: ["green"]
+            color: Qt.darker("green");//Actually want desaturated...
+            source: "pics/particle.png"
+            colorVariation: 0.4
+            alpha: 0.1
+        }
+        ImageParticle {
+            groups: ["blue"]
+            color: Qt.darker("blue");//Actually want desaturated...
+            source: "pics/particle.png"
+            colorVariation: 0.4
+            alpha: 0.1
+        }
+        anchors.fill: parent
+    }
+}
+
diff --git a/examples/demos/samegame/content/NameInputDialog.qml b/examples/demos/samegame/content/NameInputDialog.qml
new file mode 100644
index 0000000000..602e69789a
--- /dev/null
+++ b/examples/demos/samegame/content/NameInputDialog.qml
@@ -0,0 +1,93 @@
+/****************************************************************************
+**
+** Copyright (C) 2012 Nokia Corporation and/or its subsidiary(-ies).
+** Contact: http://www.qt-project.org/
+**
+** This file is part of the QtDeclarative module of the Qt Toolkit.
+**
+** $QT_BEGIN_LICENSE:LGPL$
+** GNU Lesser General Public License Usage
+** This file may be used under the terms of the GNU Lesser General Public
+** License version 2.1 as published by the Free Software Foundation and
+** appearing in the file LICENSE.LGPL included in the packaging of this
+** file. Please review the following information to ensure the GNU Lesser
+** General Public License version 2.1 requirements will be met:
+** http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
+**
+** In addition, as a special exception, Nokia gives you certain additional
+** rights. These rights are described in the Nokia Qt LGPL Exception
+** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
+**
+** GNU General Public License Usage
+** Alternatively, this file may be used under the terms of the GNU General
+** Public License version 3.0 as published by the Free Software Foundation
+** and appearing in the file LICENSE.GPL included in the packaging of this
+** file. Please review the following information to ensure the GNU General
+** Public License version 3.0 requirements will be met:
+** http://www.gnu.org/copyleft/gpl.html.
+**
+** Other Usage
+** Alternatively, this file may be used in accordance with the terms and
+** conditions contained in a signed written agreement between you and Nokia.
+**
+**
+**
+**
+**
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+import QtQuick 2.0
+
+Dialog {
+    id: nameInputDialog
+
+    property int initialWidth: 0
+    property alias name: nameInputText.text
+
+    anchors.centerIn: parent
+    z: 22;
+
+    Behavior on width {
+        NumberAnimation {} 
+        enabled: nameInputDialog.initialWidth != 0
+    }
+
+    signal accepted(string name)
+    onClosed: {
+        if (nameInputText.text != "")
+            accepted(name);
+    }
+    Text {
+        id: dialogText
+        anchors { left: nameInputDialog.left; leftMargin: 20; verticalCenter: parent.verticalCenter }
+        text: "You won! Please enter your name: "
+    }
+    MouseArea {
+        anchors.fill: parent
+        onClicked: {
+            if (nameInputText.text == "")
+                nameInputText.openSoftwareInputPanel();
+            else
+                nameInputDialog.forceClose();
+        }
+    }
+
+    TextInput {
+        id: nameInputText
+        anchors { verticalCenter: parent.verticalCenter; left: dialogText.right }
+        focus: visible
+        autoScroll: false
+        maximumLength: 24
+        onTextChanged: {
+            var newWidth = nameInputText.width + dialogText.width + 40;
+            if ( (newWidth > nameInputDialog.width && newWidth < screen.width) 
+                    || (nameInputDialog.width > nameInputDialog.initialWidth) )
+                nameInputDialog.width = newWidth;
+        }
+        onAccepted: {
+            nameInputDialog.forceClose();
+        }
+    }
+}
diff --git a/examples/demos/samegame/content/pics/background.png b/examples/demos/samegame/content/pics/background.png
new file mode 100644
index 0000000000..3734a27744
--- /dev/null
+++ b/examples/demos/samegame/content/pics/background.png
diff --git a/examples/demos/samegame/content/pics/blueStone.png b/examples/demos/samegame/content/pics/blueStone.png
new file mode 100644
index 0000000000..20e43c75b6
--- /dev/null
+++ b/examples/demos/samegame/content/pics/blueStone.png
diff --git a/examples/demos/samegame/content/pics/greenStone.png b/examples/demos/samegame/content/pics/greenStone.png
new file mode 100644
index 0000000000..b568a1900c
--- /dev/null
+++ b/examples/demos/samegame/content/pics/greenStone.png
diff --git a/examples/demos/samegame/content/pics/particle.png b/examples/demos/samegame/content/pics/particle.png
new file mode 100644
index 0000000000..5c83896d22
--- /dev/null
+++ b/examples/demos/samegame/content/pics/particle.png
diff --git a/examples/demos/samegame/content/pics/redStone.png b/examples/demos/samegame/content/pics/redStone.png
new file mode 100644
index 0000000000..36b09a2686
--- /dev/null
+++ b/examples/demos/samegame/content/pics/redStone.png
diff --git a/examples/demos/samegame/content/pics/yellowStone.png b/examples/demos/samegame/content/pics/yellowStone.png
new file mode 100644
index 0000000000..b1ce76212c
--- /dev/null
+++ b/examples/demos/samegame/content/pics/yellowStone.png
diff --git a/examples/demos/samegame/content/samegame.js b/examples/demos/samegame/content/samegame.js
new file mode 100755
index 0000000000..611767584b
--- /dev/null
+++ b/examples/demos/samegame/content/samegame.js
@@ -0,0 +1,290 @@
+/* This script file handles the game logic */
+.pragma library
+.import QtQuick.LocalStorage 2.0 as Sql
+
+var maxColumn = 10;
+var maxRow = 15;
+var maxIndex = maxColumn*maxRow;
+var board = new Array(maxIndex);
+var blockSrc = "BoomBlock.qml";
+var scoresURL = "";
+var gameDuration;
+var component = Qt.createComponent(blockSrc);
+var highScoreBar = -1;
+var gameCanvas;
+var nameInputDialog = null;
+var dialog = null;
+
+// Index function used instead of a 2D array
+function index(column, row)
+{
+    return column + row * maxColumn;
+}
+
+function timeStr(msecs)
+{
+    var secs = Math.floor(msecs/1000);
+    var m = Math.floor(secs/60);
+    var ret = "" + m + "m " + (secs%60) + "s";
+    return ret;
+}
+
+function startNewGame(gc)
+{
+    gameCanvas = gc;
+    // Delete blocks from previous game
+    for (var i = 0; i < maxIndex; i++) {
+        if (board[i] != null)
+            board[i].destroy();
+    }
+
+    // Calculate board size
+    maxColumn = Math.floor(gameCanvas.width/gameCanvas.blockSize);
+    maxRow = Math.floor(gameCanvas.height/gameCanvas.blockSize);
+    maxIndex = maxRow * maxColumn;
+
+    // Close dialogs
+    if(nameInputDialog != null)
+        nameInputDialog.forceClose();
+    if(dialog != null)
+        dialog.forceClose();
+
+    // Initialize Board
+    board = new Array(maxIndex);
+    gameCanvas.score = 0;
+    for (var column = 0; column < maxColumn; column++) {
+        for (var row = 0; row < maxRow; row++) {
+            board[index(column, row)] = null;
+            createBlock(column, row);
+        }
+    }
+    gameDuration = new Date();
+}
+
+var fillFound;  // Set after a floodFill call to the number of blocks found
+var floodBoard; // Set to 1 if the floodFill reaches off that node
+
+// NOTE: Be careful with vars named x,y, as the calling object's x,y are still in scope
+function handleClick(x,y)
+{
+    if(gameCanvas == undefined){
+        console.log("But the game hasn't started yet!");
+        return;
+    }
+    var column = Math.floor(x/gameCanvas.blockSize);
+    var row = Math.floor(y/gameCanvas.blockSize);
+    if (column >= maxColumn || column < 0 || row >= maxRow || row < 0)
+        return;
+    if (board[index(column, row)] == null)
+        return;
+    // If it's a valid block, remove it and all connected (does nothing if it's not connected)
+    floodFill(column,row, -1);
+    if (fillFound <= 0)
+        return;
+    gameCanvas.score += (fillFound - 1) * (fillFound - 1);
+    shuffleDown();
+    victoryCheck();
+}
+
+function floodFill(column,row,type)
+{
+    if (board[index(column, row)] == null)
+        return;
+    var first = false;
+    if (type == -1) {
+        first = true;
+        type = board[index(column,row)].type;
+
+        // Flood fill initialization
+        fillFound = 0;
+        floodBoard = new Array(maxIndex);
+    }
+    if (column >= maxColumn || column < 0 || row >= maxRow || row < 0)
+        return;
+    if (floodBoard[index(column, row)] == 1 || (!first && type != board[index(column, row)].type))
+        return;
+    floodBoard[index(column, row)] = 1;
+    floodFill(column + 1, row, type);
+    floodFill(column - 1, row, type);
+    floodFill(column, row + 1, type);
+    floodFill(column, row - 1, type);
+    if (first == true && fillFound == 0)
+        return; // Can't remove single blocks
+    board[index(column, row)].dying = true;
+    board[index(column, row)] = null;
+    fillFound += 1;
+}
+
+function shuffleDown()
+{
+    // Fall down
+    for (var column = 0; column < maxColumn; column++) {
+        var fallDist = 0;
+        for (var row = maxRow - 1; row >= 0; row--) {
+            if (board[index(column,row)] == null) {
+                fallDist += 1;
+            } else {
+                if (fallDist > 0) {
+                    var obj = board[index(column, row)];
+                    obj.y = (row + fallDist) * gameCanvas.blockSize;
+                    board[index(column, row + fallDist)] = obj;
+                    board[index(column, row)] = null;
+                }
+            }
+        }
+    }
+    // Fall to the left
+    fallDist = 0;
+    for (column = 0; column < maxColumn; column++) {
+        if (board[index(column, maxRow - 1)] == null) {
+            fallDist += 1;
+        } else {
+            if (fallDist > 0) {
+                for (row = 0; row < maxRow; row++) {
+                    obj = board[index(column, row)];
+                    if (obj == null)
+                        continue;
+                    obj.x = (column - fallDist) * gameCanvas.blockSize;
+                    board[index(column - fallDist,row)] = obj;
+                    board[index(column, row)] = null;
+                }
+            }
+        }
+    }
+}
+
+function victoryCheck()
+{
+    // Awards bonuses for no blocks left
+    var deservesBonus = true;
+    for (var column = maxColumn - 1; column >= 0; column--)
+        if (board[index(column, maxRow - 1)] != null)
+            deservesBonus = false;
+    if (deservesBonus)
+        gameCanvas.score += 500;
+    // Checks for game over
+    if (deservesBonus || !(floodMoveCheck(0, maxRow - 1, -1))) {
+        gameDuration = new Date() - gameDuration;
+        if(nameInputDialog == null){
+            nameInputDialog = Qt.createQmlObject('import "."; import "samegame.js" as Logic; NameInputDialog{onAccepted: Logic.saveHighScore(name)}', gameCanvas, "highscoredialog.qml");
+        }
+        if(dialog == null){
+            dialog = Qt.createComponent("Dialog.qml").createObject(gameCanvas);
+        }
+        initHighScoreBar();
+        if(gameCanvas.score > highScoreBar){
+            nameInputDialog.show("You won! Please enter your name:                 ");
+            nameInputDialog.initialWidth = nameInputDialog.text.width + 20;
+            if (nameInputDialog.name == "")
+               nameInputDialog.width = nameInputDialog.initialWidth;
+            nameInputDialog.text.opacity = 0; // Just a spacer
+        }else{
+            dialog.show("You won!");
+        }
+    }
+}
+
+// Only floods up and right, to see if it can find adjacent same-typed blocks
+function floodMoveCheck(column, row, type)
+{
+    if (column >= maxColumn || column < 0 || row >= maxRow || row < 0)
+        return false;
+    if (board[index(column, row)] == null)
+        return false;
+    var myType = board[index(column, row)].type;
+    if (type == myType)
+        return true;
+    return floodMoveCheck(column + 1, row, myType) ||
+           floodMoveCheck(column, row - 1, board[index(column, row)].type);
+}
+
+function createBlock(column,row)
+{
+    // Note that we don't wait for the component to become ready. This will
+    // only work if the block QML is a local file. Otherwise the component will
+    // not be ready immediately. There is a statusChanged signal on the
+    // component you could use if you want to wait to load remote files.
+    if(component.status == 1){
+        var dynamicObject = component.createObject(gameCanvas,
+                {"type": Math.floor(Math.random() * 3),
+                "x": column*gameCanvas.blockSize,
+                "width": gameCanvas.blockSize,
+                "height": gameCanvas.blockSize,
+                "particleSystem": gameCanvas.ps});
+        if(dynamicObject == null){
+            console.log("error creating block");
+            console.log(component.errorString());
+            return false;
+        }
+        dynamicObject.y = row*gameCanvas.blockSize;
+        dynamicObject.spawned = true;
+
+        board[index(column,row)] = dynamicObject;
+    }else{
+        console.log("error loading block component");
+        console.log(component.errorString());
+        return false;
+    }
+    return true;
+}
+
+function initHighScoreBar()
+{
+    var db = Sql.openDatabaseSync(
+        "SameGameScores",
+        "1.0",
+        "Local SameGame High Scores",
+        100
+    );
+    db.transaction(
+        function(tx) {
+            tx.executeSql('CREATE TABLE IF NOT EXISTS Scores(name TEXT, score NUMBER, gridSize TEXT, time NUMBER)');
+            // Only show results for the current grid size
+            var rs = tx.executeSql('SELECT * FROM Scores WHERE gridSize = "'
+                + maxColumn + "x" + maxRow + '" ORDER BY score desc LIMIT 10');
+            if(rs.rows.length < 10)
+                highScoreBar = 0;
+            else 
+                highScoreBar = rs.rows.item(rs.rows.length - 1).score;
+        }
+    );
+}
+
+function saveHighScore(name)
+{
+    if (scoresURL != "")
+        sendHighScore(name);
+    // Offline storage
+    var db = Sql.openDatabaseSync(
+        "SameGameScores",
+        "1.0",
+        "Local SameGame High Scores",
+        100
+    );
+    var dataStr = "INSERT INTO Scores VALUES(?, ?, ?, ?)";
+    var data = [
+        name,
+        gameCanvas.score,
+        maxColumn + "x" + maxRow,
+        Math.floor(gameDuration / 1000)
+    ];
+    db.transaction(
+        function(tx) {
+            tx.executeSql('CREATE TABLE IF NOT EXISTS Scores(name TEXT, score NUMBER, gridSize TEXT, time NUMBER)');
+            tx.executeSql(dataStr, data);
+
+            // Only show results for the current grid size
+            var rs = tx.executeSql('SELECT * FROM Scores WHERE gridSize = "'
+                + maxColumn + "x" + maxRow + '" ORDER BY score desc LIMIT 10');
+            var r = "\nHIGH SCORES for this grid size\n\n"
+            for (var i = 0; i < rs.rows.length; i++) {
+                r += (i+1) + ". " + rs.rows.item(i).name + ' got '
+                    + rs.rows.item(i).score + ' points in '
+                    + rs.rows.item(i).time + ' seconds.\n';
+            }
+            if(rs.rows.length == 10)
+                highScoreBar = rs.rows.item(9).score;
+            dialog.show(r);
+        }
+    );
+}