roller-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From snoopd...@apache.org
Subject [2/2] roller git commit: Add Bootstrap to Create Weblog page, also fix validation logic on Profile page.
Date Sun, 26 Jun 2016 20:13:15 GMT
Add Bootstrap to Create Weblog page, also fix validation logic on Profile page.


Project: http://git-wip-us.apache.org/repos/asf/roller/repo
Commit: http://git-wip-us.apache.org/repos/asf/roller/commit/2f4b2b3e
Tree: http://git-wip-us.apache.org/repos/asf/roller/tree/2f4b2b3e
Diff: http://git-wip-us.apache.org/repos/asf/roller/diff/2f4b2b3e

Branch: refs/heads/bootstrap-ui
Commit: 2f4b2b3e12ba122deb840797932e56eca8a8ff12
Parents: 8913513
Author: Dave Johnson <snoopdave@gmail.com>
Authored: Sun Jun 26 16:05:56 2016 -0400
Committer: Dave Johnson <snoopdave@gmail.com>
Committed: Sun Jun 26 16:05:56 2016 -0400

----------------------------------------------------------------------
 .../webapp/WEB-INF/jsps/core/CreateWeblog.jsp   | 207 +++++++++++--------
 .../main/webapp/WEB-INF/jsps/core/Profile.jsp   |   4 +-
 2 files changed, 123 insertions(+), 88 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/roller/blob/2f4b2b3e/app/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp b/app/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp
index 578c302..2be53cb 100644
--- a/app/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/core/CreateWeblog.jsp
@@ -19,106 +19,141 @@
 <script src="<s:url value="/roller-ui/scripts/jquery-2.1.1.min.js" />"></script>
 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
 
-<script>
-function handlePreview(handle) {
-    previewSpan = document.getElementById("handlePreview");
-    var n1 = previewSpan.childNodes[0];
-    var n2 = document.createTextNode(handle.value);
-    if (handle.value == null) {
-	    previewSpan.appendChild(n2);
-    } else {
-	    previewSpan.replaceChild(n2, n1);
-    }
-}
-</script>
 
-<p class="subtitle"><s:text name="createWebsite.prompt" /></p>
+<p class="subtitle"><s:text name="createWebsite.prompt"/></p>
 
-<br />
+<br/>
 
-<s:form action="createWeblog!save">
-<s:hidden name="salt" />
+<s:form action="createWeblog!save" theme="bootstrap" cssClass="form-horizontal">
 
-<table class="formtable">
+    <s:hidden name="salt"/>
 
-<tr>
-    <td class="label"><label for="name" /><s:text name="generic.name" /></label></td>
-    <td class="field"><s:textfield name="bean.name" size="30" maxlength="30" /></td>
-    <td class="description"><s:text name="createWebsite.tip.name" /></td>
-</tr>
+    <s:textfield label="%{getText('generic.name')}"
+                 tooltip="%{getText('createWebsite.tip.name')}" onkeyup="formChanged()"
+                 name="bean.name" size="30" maxlength="30"/>
 
-<tr>
-        <td class="label"><label for="description" /><s:text name="generic.tagline"
/></td>
-    <td class="field"><s:textfield name="bean.description" size="40" maxlength="255"
/></td>
-    <td class="description"><s:text name="createWebsite.tip.description" /></td>
-</tr>
+    <s:textfield label="%{getText('createWebsite.handle')}"
+                 tooltip="%{getText('createWebsite.tip.handle')}"
+                 name="bean.handle" size="30" maxlength="30"
+                 onkeyup="handlePreview(this)"/>
 
-<tr>
-    <td class="label"><label for="handle" /><s:text name="createWebsite.handle"
/></label></td>
-    <td class="field">
-        <s:textfield name="bean.handle" size="30" maxlength="30" onkeyup="handlePreview(this)"
/><br />
-        <span style="text-size:70%">
+    <div class="form-group">
+        <label class="col-sm-3"></label>
+        <div class="col-sm-9 controls">
             <s:text name="createWebsite.weblogUrl" />:&nbsp;
-            <s:property value="absoluteSiteURL" />/<span id="handlePreview" style="color:red"><s:if
test="bean.handle != null"><s:property value="bean.handle"/></s:if><s:else>handle</s:else></span>
-        </span>
-    </td>
-    <td class="description"><s:text name="createWebsite.tip.handle" /></td>
-</tr>
-
-<tr>
-    <td class="label"><label for="emailAddress" /><s:text name="createWebsite.emailAddress"
/></label></td>
-    <td class="field"><s:textfield name="bean.emailAddress" size="40" maxlength="50"
/></td>
-    <td class="description"><s:text name="createWebsite.tip.email" /></td>
-</tr>
-
-<tr>
-    <td class="label"><label for="locale" /><s:text name="createWebsite.locale"
/></label></td>
-    <td class="field">
-       <s:select name="bean.locale" size="1" list="localesList" listValue="displayName"
/>
-    </td>
-    <td class="description"><s:text name="createWebsite.tip.locale" /></td>
-</tr>
-
-<tr>
-    <td class="label"><label for="timeZone" /><s:text name="createWebsite.timeZone"
/></label></td>
-    <td class="field">
-       <s:select name="bean.timeZone" size="1" list="timeZonesList" />
-    </td>
-    <td class="description"><s:text name="createWebsite.tip.timezone" /></td>
-</tr>
-
-<tr>
-    <td class="label"><label for="theme" /><s:text name="createWebsite.theme"
/></label></td>
-    <td class="field" ng-app="themeSelectModule" ng-controller="themeController">
-        <select id="themeSelector" name="bean.theme" size="1"
-        ng-model="selectedTheme" ng-options="theme as theme.name for theme in themes track
by theme.id"></select>
-        <br />
-        <br />
-        <p>{{ selectedTheme.description }}</p>
-        <br />
-        <img src="<s:property value='siteURL'/>{{ selectedTheme.previewPath }}"/>
-    </td>
-    <td class="description"><s:text name="createWebsite.tip.theme" /></td>
-</tr>
-
-</table>
-
-<br />
-
-<s:submit value="%{getText('createWebsite.button.save')}" />
-<input type="button" value="<s:text name="generic.cancel"/>" onclick="window.location='<s:url
action="menu"/>'" />
+            <s:property value="absoluteSiteURL" />/<span id="handlePreview" style="color:red">
+            <s:if test="bean.handle != null">
+                <s:property value="bean.handle"/>
+            </s:if>
+            <s:else>handle</s:else></span>
+            <br>
+        </div>
+    </div>
+
+    <s:textfield label="%{getText('createWebsite.emailAddress')}"
+                 tooltip="%{getText('createWebsite.tip.emailAddress')}" onkeyup="formChanged()"
+                 name="bean.emailAddress" size="40" maxlength="50"/>
+
+    <s:select label="%{getText('createWebsite.locale')}"
+              tooltip="%{getText('createWebsite.tip.locale')}"
+              name="bean.locale" size="1" list="localesList" listValue="displayName"/>
+
+    <s:select label="%{getText('createWebsite.timeZone')}"
+              tooltip="%{getText('createWebsite.tip.timeZone')}"
+              name="bean.timeZone" size="1" list="timeZonesList"/>
+
+    <div class="form-group" ng-app="themeSelectModule" ng-controller="themeController">
+        <label class="col-sm-3 control-label" for="createWeblog_bean_timeZone">Timezone</label>
+        <div class="col-sm-9 controls">
+            <select id="themeSelector" name="bean.theme" size="1"
+                    ng-model="selectedTheme"
+                    ng-options="theme as theme.name for theme in themes track by theme.id">
+            </select>
+            <br>
+            <br>
+            <p>{{ selectedTheme.description }}</p>
+            <img src="<s:property value='siteURL'/>{{ selectedTheme.previewPath
}}"/>
+        </div>
+    </div>
+
+    <s:submit cssClass="btn btn-default"
+              value="%{getText('createWebsite.button.save')}"/>
+
+    <input class="btn" type="button" value="<s:text name="generic.cancel"/>"
+           onclick="window.location='<s:url action="menu"/>'"/>
 
 </s:form>
 
 <script>
+
     document.forms[0].elements[0].focus();
 
     angular.module('themeSelectModule', [])
-        .controller('themeController', ['$scope', function($scope) {
-            $.ajax({ url: "<s:property value='siteURL' />/roller-ui/authoring/themedata",
async:false,
-                success: function(data) { $scope.themes = data; }
-            });
-            $scope.selectedTheme = $scope.themes[0];
-    }]);
+            .controller('themeController', ['$scope', function ($scope) {
+                $.ajax({
+                    url: "<s:property value='siteURL' />/roller-ui/authoring/themedata",
async: false,
+                    success: function (data) {
+                        $scope.themes = data;
+                    }
+                });
+                $scope.selectedTheme = $scope.themes[0];
+            }]);
+
+
+    var saveButton;
+
+    $( document ).ready(function() {
+        saveButton = $("#createWeblog_0");
+        formChanged();
+    });
+
+    function formChanged() {
+        var valid = false;
+
+        var name   = $("#createWeblog_bean_name:first").val();
+        var handle = $("#createWeblog_bean_handle:first").val();
+        var email  = $("#createWeblog_bean_emailAddress:first").val();
+
+        if (    name      && name.trim().length > 0
+                && handle && handle.trim().length > 0
+                && email  && email.trim().length > 0   && validateEmail(email)
) {
+            valid = true;
+
+        } else {
+            valid = false;
+        }
+
+        if ( valid ) {
+            saveButton.attr("disabled", false);
+            saveButton.removeClass("btn-danger");
+        } else {
+            saveButton.attr("disabled", true);
+            saveButton.addClass("btn-danger");
+        }
+
+    }
+
+    function validateEmail(email) {
+        var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        return re.test(email);
+    }
+
+    function handlePreview(handle) {
+        previewSpan = document.getElementById("handlePreview");
+        var n1 = previewSpan.childNodes[0];
+        var n2 = document.createTextNode(handle.value);
+        if (handle.value == null) {
+            previewSpan.appendChild(n2);
+        } else {
+            previewSpan.replaceChild(n2, n1);
+        }
+        formChanged();
+    }
+
+    formChanged();
+
+</script>
+
+
 </script>
 

http://git-wip-us.apache.org/repos/asf/roller/blob/2f4b2b3e/app/src/main/webapp/WEB-INF/jsps/core/Profile.jsp
----------------------------------------------------------------------
diff --git a/app/src/main/webapp/WEB-INF/jsps/core/Profile.jsp b/app/src/main/webapp/WEB-INF/jsps/core/Profile.jsp
index 7f7b110..ce7f13d 100644
--- a/app/src/main/webapp/WEB-INF/jsps/core/Profile.jsp
+++ b/app/src/main/webapp/WEB-INF/jsps/core/Profile.jsp
@@ -105,8 +105,8 @@
         var passwordConfirm = $("#profile_bean_passwordConfirm:first").val();
 
         if (    screenName && screenName.trim().length > 0
-             && fullName && fullName.trim().length > 0
-             && email && fullName.trim().length > 0 && validateEmail(email)
) {
+             && fullName   && fullName.trim().length > 0
+             && email      && email.trim().length > 0 && validateEmail(email)
) {
             valid = true;
 
         } else {


Mime
View raw message