Merge lp:~knitzsche/qtcreator-plugin-ubuntu/qtcreator-plugin-ubuntu-bug234822 into lp:qtcreator-plugin-ubuntu

[Kyle Nitzsche]

Convert default SDK cordova app to use Ubuntu HTML5 per LP: #1234822

[lp:~knitzsche/qtcreator-plugin-ubuntu/qtcreator-plugin-ubuntu-bug234822]

50. By Kyle Nitzsche on 2013-10-03

revert leading spaces in license to 4

51. By Kyle Nitzsche on 2013-10-03

revert to two spaces after period in license text

52. By Kyle Nitzsche on 2013-10-03

reverting another two spaces after period

[PS Jenkins bot (ps-jenkins)]

PASSED: Continuous integration, rev:51
http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-ci/65/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-saucy-amd64-ci/65
    SUCCESS: http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-saucy-armhf-ci/65

Click here to trigger a rebuild:
http://s-jenkins:8080/job/qtcreator-plugin-ubuntu-ci/65/rebuild

review: Approve (continuous-integration)

[PS Jenkins bot (ps-jenkins)]

PASSED: Continuous integration, rev:52
http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-ci/66/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-saucy-amd64-ci/66
    SUCCESS: http://jenkins.qa.ubuntu.com/job/qtcreator-plugin-ubuntu-saucy-armhf-ci/66

Click here to trigger a rebuild:
http://s-jenkins:8080/job/qtcreator-plugin-ubuntu-ci/66/rebuild

review: Approve (continuous-integration)

[Alexandre Abreu (abreu-alexandre)]

review: Approve

=== added file 'share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/app.js'
--- share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/app.js	1970-01-01 00:00:00 +0000
+++ share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/app.js	2013-10-03 17:19:50 +0000
@@ -0,0 +1,27 @@
+/* Create UI instance */
+
+var UI = new UbuntuUI();
+
+/* Initializatino after window load */
+window.onload = function () {
+    /* REQUIRED: initialize UI */
+    UI.init();
+    
+    /* Start pagestack with main page */
+    UI.pagestack.push("main");
+
+    /* GUI intial state: show loading dialog (is removed on deviceready event) */
+    UI.dialog("loading").show();
+
+    /* Connect button to function */
+    UI.button("devicereadyOK").click(function() {
+        UI.dialog("deviceready").hide();
+    });
+
+};
+
+/* Respond to deviceready event */
+document.addEventListener("deviceready", function() {
+    UI.dialog("loading").hide();
+    UI.dialog("deviceready").show();
+    }, false);

=== modified file 'share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/css/index.css'
--- share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/css/index.css	2013-08-08 07:26:20 +0000
+++ share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/css/index.css	2013-10-03 17:19:50 +0000
@@ -44,59 +44,6 @@
     text-transform:uppercase;
     width:100%;
 }
-
-/* Portrait layout (default) */
-.app {
-    background:url(../img/logo.png) no-repeat center top; /* 170px x 200px */
-    position:absolute;             /* position in the center of the screen */
-    left:50%;
-    top:50%;
-    height:50px;                   /* text area height */
-    width:225px;                   /* text area width */
-    text-align:center;
-    padding:180px 0px 0px 0px;     /* image height is 200px (bottom 20px are overlapped with text) */
-    margin:-115px 0px 0px -112px;  /* offset vertical: half of image height and text area height */
-                                   /* offset horizontal: half of text area width */
-}
-
-/* Landscape layout (with min-width) */
-@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
-    .app {
-        background-position:left center;
-        padding:75px 0px 75px 170px;  /* padding-top + padding-bottom + text area = image height */
-        margin:-90px 0px 0px -198px;  /* offset vertical: half of image height */
-                                      /* offset horizontal: half of image width and text area width */
-    }
-}
-
-h1 {
-    font-size:24px;
-    font-weight:normal;
-    margin:0px;
-    overflow:visible;
-    padding:0px;
-    text-align:center;
-}
-
-.event {
-    border-radius:4px;
-    -webkit-border-radius:4px;
-    color:#FFFFFF;
-    font-size:12px;
-    margin:0px 30px;
-    padding:2px 0px;
-}
-
-.event.listening {
-    background-color:#333333;
-    display:block;
-}
-
-.event.received {
-    background-color:#4B946A;
-    display:none;
-}
-
 @keyframes fade {
     from { opacity: 1.0; }
     50% { opacity: 0.4; }
@@ -108,8 +55,3 @@
     50% { opacity: 0.4; }
     to { opacity: 1.0; }
 }
- 
-.blink {
-    animation:fade 3000ms infinite;
-    -webkit-animation:fade 3000ms infinite;
-}

=== modified file 'share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/index.html'
--- share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/index.html	2013-08-08 07:26:20 +0000
+++ share/qtcreator/templates/wizards/ubuntu/cordovaubuntu/index.html	2013-10-03 17:19:50 +0000
@@ -13,7 +13,7 @@
     Unless required by applicable law or agreed to in writing,
     software distributed under the License is distributed on an
     "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-     KIND, either express or implied.  See the License for the
+    KIND, either express or implied.  See the License for the
     specific language governing permissions and limitations
     under the License.
 -->
@@ -23,29 +23,65 @@
         <meta name="format-detection" content="telephone=no" />
         <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
         <link rel="stylesheet" type="text/css" href="css/index.css" />
-        <title>Hello World</title>
+
+        <!-- Use Ubuntu Cordova -->
+        <script language="javascript" type="text/javascript" src="file:///usr/share/cordova-ubuntu-2.8/www/cordova-2.8.js"></script>
+
+        <!-- Ubuntu UI Style imports - Ambiance theme -->
+        <link href="/usr/share/ubuntu-html5-theme/0.1/ambiance/css/appTemplate.css" rel="stylesheet" type="text/css" />
+
+        <!-- Ubuntu UI javascript imports - Ambiance theme -->
+        <script src="/usr/share/ubuntu-html5-theme/0.1/ambiance/js/fast-buttons.js"></script>
+        <script src="/usr/share/ubuntu-html5-theme/0.1/ambiance/js/core.js"></script>
+        <script src="/usr/share/ubuntu-html5-theme/0.1/ambiance/js/buttons.js"></script>
+        <script src="/usr/share/ubuntu-html5-theme/0.1/ambiance/js/dialogs.js"></script>
+        <script src="/usr/share/ubuntu-html5-theme/0.1/ambiance/js/pagestacks.js"></script>
+
+        <!-- Application script -->
+        <script src="app.js"></script>
+
+        <title>Hello World Cordova</title>
     </head>
+
     <body>
-        <div class="app">
-            <h1>Apache Cordova</h1>
-            <div id="deviceready" class="blink">
-                <p class="event listening">Connecting to Device</p>
-                <p class="event received">Device is Ready</p>
+
+        <div data-role="page">
+
+            <header data-role="header">
+                <nav data-role="navbar" class="tabs" >
+                <div class="tabs-inner">
+                    <ul>
+                        <li class="active" role="tab">
+                            <a href="#item1" class="tab-item">HTML5/Cordova</a>
+                        </li>
+                    </ul>
+                </div>
+                </nav>
+            </header>
+
+            <div data-role="content">
+                <div data-role="pagestack">
+                    <div data-role="page" id="main">
+                        <h1>Apache Cordova Loaded</h1>
+                        <img src="img/logo.png"/>
+                    </div>
+                </div>
+            </div>
+
+            <div data-role="dialog" id="loading">
+                <section>
+                    <h1>Apache Cordova Loading</h1>
+                    <progress></progress>
+                </section>
+            </div>
+
+            <div data-role="dialog" id="deviceready">
+                <section>
+                    <h1>Deviceready event received</h1>
+                    <button data-role="button" id="devicereadyOK" class="success">OK</button>
+                </section>
             </div>
         </div>
-
-	<script language="javascript" type="text/javascript" src="file:///usr/share/cordova-ubuntu-2.8/www/cordova-2.8.js"></script>
-	<script language="javascript" type="text/javascript">
-	document.addEventListener("deviceready", function() {
-	        var parentElement = document.getElementById("deviceready");
-	        var listeningElement = parentElement.querySelector('.listening');
-	        var receivedElement = parentElement.querySelector('.received');
-
-	        listeningElement.setAttribute('style', 'display:none;');
-	        receivedElement.setAttribute('style', 'display:block;');
-	}, false);
-	</script>
-
     </body>
 </html>