Add page URL auto change

assets/css/common/global.css

@@ -0,0 +1,12 @@
+/**
+ * Global CSS rules
+ *
+ * @author Pierre HUBERT
+ */
+
+/**
+ * <a> elements
+ */
+a {
+    cursor: pointer;
+}

assets/css/common/page/waitSplashScreen.css

@@ -4,8 +4,27 @@
  * @author Pierre HUBERT
  */
 
+/**
+ * Full splash screen
+ */
 .waitSplashScreen {
     background-color: rgba(128, 128, 128, 0.06);
     padding-top: 10%;
     text-align: center;
+}
+
+
+/**
+ * Transparent wait splash screen
+ */
+.transparentWaitSplashScreen {
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 0px;
+    background-color: #0C0C0C;
+    z-index: 500;
+    text-align: center;
+    opacity: 0.5;
+    padding-top: 30%;
 }

assets/js/common/functionsSchema.js

@@ -88,6 +88,11 @@ var ComunicWeb = {
              * Return current URL opened on the website
              */
             getCurrentWebsiteURL: function(){},
+
+            /**
+             * Change the current website URI
+             */
+            changeURI: function(newTitle, newURI){},
         },
 
         /**
@@ -104,6 +109,11 @@ var ComunicWeb = {
              */
             showWaitSplashScreen: function(){},
 
+            /**
+             * Show a transparent wait splash screen
+             */
+            showTransparentWaitSplashScreen: function(){},
+
             /**
              * Open a page
              */
@@ -301,6 +311,11 @@ var ComunicWeb = {
             * Open login page
             */
             openLoginPage: function(additionnalData, targetElement){},
+
+            /**
+             * Perform user login
+             */
+            loginSubmit: function(){},
         }
 
     },

assets/js/common/page.js

@@ -57,6 +57,28 @@ ComunicWeb.common.page = {
 
     },
 
+    /**
+     * Show a transparent wait splash screen
+     * 
+     * @returns {elem} The splash screen element to let it being deleted
+     */
+    showTransparentWaitSplashScreen: function(){
+        //Create the element
+        var waitSplashScreen = document.createElement("div");
+        waitSplashScreen.className = "transparentWaitSplashScreen";
+
+        //Populate it
+        var imgElem = document.createElement("img");
+        imgElem.src = ComunicWeb.__config.assetsURL+"img/barProgress.gif";
+        waitSplashScreen.appendChild(imgElem);
+
+        //Apply splash screen
+        document.body.appendChild(waitSplashScreen);
+
+        //Return wait splash screen element
+        return waitSplashScreen;
+    },
+
     /**
      * Open a page
      * 
@@ -68,7 +90,7 @@ ComunicWeb.common.page = {
         ComunicWeb.debug.logMessage("Open the following page: " + pageURI);
 
         //Extract the first part of the URL
-        var firstPartURI = pageURI;
+        var firstPartURI = pageURI.toString();
         
         //Check if pageURI is empty
         if(firstPartURI == ""){
@@ -93,6 +115,9 @@ ComunicWeb.common.page = {
         //Change page title
         document.title =  pageInfos.pageTitle;
 
+        //Change page URL
+        ComunicWeb.common.url.changeURI(document.title, pageURI);
+
         //Get the main contener of the page
         //var mainContenerElem = document.getElementById("wrapper");
 
@@ -160,6 +185,26 @@ ComunicWeb.common.page = {
             //Apply template source
             targetElem.innerHTML = templateContent;
 
+            //Make a link live
+            var aElems = targetElem.getElementsByTagName("a");
+            for(num in aElems){
+
+                //Export current element
+                var currentElement =  aElems[num];
+                
+                //Check if it is a real html elements and if it contains a "target" attribute
+                if(currentElement.attributes){
+                    if(currentElement.attributes.target){
+
+                        //Change the onclick behavior of the elements
+                        currentElement.onclick = (function() {
+                            ComunicWeb.common.page.openPage(this.getAttribute("target"));
+                        });
+
+                    }
+                }
+            }
+
             //Perform next action (if there is)
             if(afterParsingHTMLtemplate)
                 afterParsingHTMLtemplate();

assets/js/common/url.js

@@ -20,4 +20,23 @@ ComunicWeb.common.url = {
         //Return result
         return uripage;
     },
+
+    /**
+	 * Change the current website URI
+	 *
+	 * @param {String} newTitle New title for the page
+	 * @param {String} newURI The new URI
+     * @return {Boolean} False if it fails
+	 */
+	changeURI: function(newTitle, newURI){
+
+        //Determine the new URL
+        var newURL = ComunicWeb.__config.siteURL + newURI;
+
+        //Apply it
+		window.history.pushState("object or string", newTitle, newURI);
+
+        //Everything is OK 
+        return true;
+	},
 };

assets/js/pages/login.js

@@ -41,9 +41,28 @@ ComunicWeb.pages.login = {
                 increaseArea: '20%' // optional
                 });
             });
+
+            //Get login form element
+            var loginBody = document.getElementById("loginForm");
+
+            //Get login button
+            var loginButton = loginBody.getElementsByClassName("btn-login")[0];
+
+            loginButton.onclick=ComunicWeb.pages.login.loginSubmit;
         };
 
         //Apply template
         ComunicWeb.common.page.getAndShowTemplate(targetElement, additionalData, "pages/login/loginPage.tpl", afterParsingTemplate, true);
-    }
+    },
+
+    /**
+     * Perform user login
+     * 
+     * @return {Boolean} False if it fails
+     */
+    loginSubmit: function(){
+        alert("Login");
+        
+        //var overlay = ComunicWeb.common.page.showTransparentWaitSplashScreen();
+    },
 };

assets/templates/pages/login/loginPage.tpl

@@ -1,12 +1,14 @@
+<!-- Login form -->
 <div class="login-box">
   <div class="login-logo">
-    <a href="../../index2.html"><b>Comunic</b></a>
+    <a target="home"><b>Comunic</b></a>
   </div>
-  <!-- /.login-logo -->
   <div class="login-box-body">
+
+    <!-- Login message -->
     <p class="login-box-msg">Login to your Comunic account.</p>
 
-    <form>
+    <div id="loginForm">
       <div class="form-group has-feedback">
         <input type="email" class="form-control" placeholder="Email" />
         <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
@@ -25,13 +27,11 @@
         </div>
         <!-- /.col -->
         <div class="col-xs-4">
-          <button type="submit" class="btn btn-primary btn-block btn-flat">Sign In</button>
+          <button type="submit" class="btn btn-primary btn-block btn-flat btn-login">Sign In</button>
         </div>
         <!-- /.col -->
       </div>
-    </form>
+    </div>
   </div>
   <!-- /.login-box-body -->
 </div>
-<!-- /.login-box -->
-

corePage/config/dev.config.php

@@ -19,6 +19,7 @@ $config['CSSfiles'] = array(
     "%PATH_ASSETS%adminLTE/dist/css/skins/_all-skins.min.css",
 
     //App stylesheets
+    "%PATH_ASSETS%css/common/global.css",
     "%PATH_ASSETS%css/common/page/waitSplashScreen.css",
 );