Finish new web hook pages

6 files changed, 77 insertions, 139 deletions

diff --git a/templates/repo/create.tmpl b/templates/repo/create.tmpl
index a4b54fef2e..ea716e321a 100644
--- a/templates/repo/create.tmpl
+++ b/templates/repo/create.tmpl
@@ -71,8 +71,8 @@
                 <strong>{{.i18n.Tr "repo.init_readme"}}</strong>
             </div>
             <div class="field">
-                <label for="repo-create-submit"></label>
-                <button class="btn btn-large btn-blue btn-radius" id="repo-create-submit">{{.i18n.Tr "repo.create_repo"}}</button>
+                <label></label>
+                <button class="btn btn-large btn-blue btn-radius">{{.i18n.Tr "repo.create_repo"}}</button>
                 <a class="btn btn-small btn-gray btn-radius" id="repo-create-cancel" href="/"><strong>{{.i18n.Tr "cancel"}}</strong></a>
             </div>
         </div>
diff --git a/templates/repo/hook_add.tmpl b/templates/repo/hook_add.tmpl
deleted file mode 100644
index df3ff3bdf4..0000000000
--- a/templates/repo/hook_add.tmpl
+++ /dev/null
@@ -1,62 +0,0 @@
-{{template "base/head" .}}
-{{template "base/navbar" .}}
-{{template "repo/nav" .}}
-{{template "repo/toolbar" .}}
-<div id="body" class="container">
-    {{template "repo/setting_nav" .}}
-    <div id="repo-setting-container" class="col-md-10">
-        {{template "base/alert" .}}
-        <form id="repo-hooks-add-form" action="{{.RepoLink}}/settings/hooks/add" method="post">
-            {{.CsrfTokenHtml}}
-            <div class="panel panel-default">
-                <div class="panel-heading">
-                    Add Webhook
-                </div>
-
-                <div class="panel-body">
-                    <div class="col-md-7">
-                        <p>We’ll send a POST request to the URL below with details of any subscribed events.</p>
-                        <hr/>
-                        <div class="form-group">
-                            <label for="payload-url">Payload URL</label>
-                            <input id="payload-url" name="url" class="form-control" type="url" required="required"/>
-                        </div>
-
-                        <div class="form-group">
-                            <label for="content-type">Content type</label>
-                            <select id="content-type" name="content_type" class="form-control">
-                                <option value="1">application/json</option>
-                            </select>
-                        </div>
-
-                        <div class="form-group">
-                            <label for="payload-secret">Secret</label>
-                            <input id="payload-secret" name="secret" class="form-control" type="text"/>
-                        </div>
-                        <hr/>
-                        <div class="form-group">
-                            <label>Which events would you like to trigger this webhook?</label>
-                            <div class="radio">
-                                <label>
-                                    <input class="form-control" name="push_only" type="radio" checked name="trigger"/> Just the <i>push</i> event.
-                                </label>
-                            </div>
-                        </div>
-                        <hr/>
-                        <div class="form-group">
-                            <label>
-                                <input type="checkbox" name="active" checked/>&nbsp;&nbsp;Active
-                            </label>
-                            <p class="help-block">We will deliver event details when this hook is triggered.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="panel-footer">
-                    <button class="btn btn-success">Add Webhook</button>
-                </div>
-            </div>
-        </form>
-    </div>
-</div>
-{{template "base/footer" .}}
\ No newline at end of file
diff --git a/templates/repo/hook_edit.tmpl b/templates/repo/hook_edit.tmpl
deleted file mode 100644
index c3fe217e37..0000000000
--- a/templates/repo/hook_edit.tmpl
+++ /dev/null
@@ -1,72 +0,0 @@
-{{template "base/head" .}}
-{{template "base/navbar" .}}
-{{template "repo/nav" .}}
-{{template "repo/toolbar" .}}
-<div id="body" class="container">
-    {{template "repo/setting_nav" .}}
-    <div id="repo-setting-container" class="col-md-10">
-        {{template "base/alert" .}}
-        <form id="repo-hooks-edit-form" action="{{.RepoLink}}/settings/hooks/{{.Webhook.Id}}" method="post">
-            {{.CsrfTokenHtml}}
-            <div class="panel panel-default">
-                <div class="panel-heading">
-                    Manage Webhook
-                </div>
-
-                <div class="panel-body">
-                    <div class="col-md-7">
-                        <p>We’ll send a POST request to the URL below with details of any subscribed events.</p>
-                        <hr/>
-                        <div class="form-group">
-                            <label for="payload-url">Payload URL</label>
-                            <input id="payload-url" name="url" class="form-control" type="url" required="required" value="{{.Webhook.Url}}" />
-                        </div>
-
-                        <div class="form-group">
-                            <label for="payload-version">Content type</label>
-                            <select id="content-type" name="content_type" class="form-control">
-                                <option value="1">application/json</option>
-                            </select>
-                        </div>
-
-                        <div class="form-group">
-                            <label for="payload-secret">Secret</label>
-                            <input id="payload-secret" name="secret" class="form-control" type="text" value="{{.Webhook.Secret}}" />
-                        </div>
-                        <hr/>
-                        <div class="form-group">
-                            <label>Which events would you like to trigger this webhook?</label>
-                            <div class="radio">
-                                <label>
-                                    <input class="form-control" name="push_only" type="radio" {{if .Webhook.HookEvent.PushOnly}}checked {{end}}name="trigger"/> Just the <i>push</i> event.
-                                </label>
-                            </div>
-                        </div>
-                        <hr/>
-                        <div class="form-group">
-                            <label>
-                                <input type="checkbox" name="active" {{if .Webhook.IsActive}}checked{{end}}/>&nbsp;&nbsp;Active
-                            </label>
-                            <p class="help-block">We will deliver event details when this hook is triggered.</p>
-                        </div>
-                    </div>
-                </div>
-
-                <div class="panel-footer">
-                    <button class="btn btn-primary">Update Webhook</button>&nbsp;&nbsp;
-                    <a type="button" href="{{.RepoLink}}/settings/hooks?remove={{.Webhook.Id}}" class="btn btn-danger">Delete Webhook</a>
-                </div>
-            </div>
-        </form>
-        <div class="panel panel-default">
-        	  <div class="panel-heading">
-        			<h3 class="panel-title">Recent Deliveries</h3>
-        	  </div>
-              
-        	  <div class="panel-body">
-        			Coming soon
-        	  </div>
-        </div>
-    </div>
-</div>
-{{template "base/footer" .}}
\ No newline at end of file
diff --git a/templates/repo/settings/hook_new.tmpl b/templates/repo/settings/hook_new.tmpl
new file mode 100644
index 0000000000..917e6d1b72
--- /dev/null
+++ b/templates/repo/settings/hook_new.tmpl
@@ -0,0 +1,68 @@
+{{template "ng/base/head" .}}
+{{template "ng/base/header" .}}
+<div id="repo-wrapper">
+    {{template "repo/header" .}}
+	<div id="setting-wrapper" class="main-wrapper">
+	    <div id="repo-setting" class="container clear">
+	        {{template "repo/settings/nav" .}}
+	        <div class="grid-4-5 left">
+	            <div class="setting-content">
+	                {{template "ng/base/alert" .}}
+	                <div id="setting-content">
+	                    <div id="repo-hooks-panel" class="panel panel-radius">
+	                        <div class="panel-header">
+	                        	<strong>{{if .PageIsSettingsHooksNew}}{{.i18n.Tr "repo.settings.add_webhook"}}{{else}}{{.i18n.Tr "repo.settings.update_webhook"}}{{end}}</strong>
+	                        </div>
+	                        <form class="form form-align panel-body" id="repo-setting-form" action="{{.RepoLink}}/settings/hooks/{{if .PageIsSettingsHooksNew}}new{{else}}{{.Webhook.Id}}{{end}}" method="post">
+	                            {{.CsrfTokenHtml}}
+                        		<div class="text-center panel-desc">{{.i18n.Tr "repo.settings.add_webhook_desc" | Str2html}}</div>
+	                            <div class="field">
+	                                <label class="req" for="payload-url">{{.i18n.Tr "repo.settings.payload_url"}}</label>
+	                                <input class="ipt ipt-large ipt-radius {{if .Err_UserName}}ipt-error{{end}}" id="payload-url" name="payload_url" type="url" value="{{.Webhook.Url}}" required />
+	                            </div>
+					            <div class="field">
+					                <label class="req">{{.i18n.Tr "repo.settings.content_type"}}</label>
+					                <select name="content_type">
+                                		<option value="1" {{if or .PageIsSettingsHooksNew (eq .Webhook.ContentType 1)}}selected{{end}}>application/json</option>
+                                		<option value="2" {{if eq .Webhook.ContentType 2}}selected{{end}}>application/x-www-form-urlencoded</option>
+					                </select>
+					            </div>
+	                            <div class="field">
+	                                <label for="secret">{{.i18n.Tr "repo.settings.secret"}}</label>
+	                                <input class="ipt ipt-large ipt-radius {{if .Err_UserName}}ipt-error{{end}}" id="secret" name="secret" type="password" value="{{.Webhook.Secret}}" autocomplete="off" />
+	                            </div>
+								<div class="field">
+									<h4 class="text-center">{{.i18n.Tr "repo.settings.event_desc"}}</h4>
+									<label></label>
+	                                <input name="push_only" type="radio" {{if or .PageIsSettingsHooksNew .Webhook.PushOnly}}checked{{end}}> {{.i18n.Tr "repo.settings.event_push_only" | Str2html}}
+	                            </div>
+					            <div class="field">
+					                <label for="active">{{.i18n.Tr "repo.settings.active"}}</label>
+					                <input class="ipt-chk" id="active" name="active" type="checkbox" {{if or .PageIsSettingsHooksNew .Webhook.IsActive}}checked{{end}} />
+					                <span>{{.i18n.Tr "repo.settings.active_helper"}}</span>
+					            </div>
+	                            <div class="field">
+	                                <label></label>
+	                                <button class="btn btn-green btn-large btn-radius">{{if .PageIsSettingsHooksNew}}{{.i18n.Tr "repo.settings.add_webhook"}}{{else}}{{.i18n.Tr "repo.settings.update_webhook"}}{{end}}</button>
+	                                {{if .PageIsSettingsHooksEdit}}<a class="btn btn-red btn-large btn-link btn-radius" href="{{.RepoLink}}/settings/hooks?remove={{.Webhook.Id}}"><strong>{{.i18n.Tr "repo.settings.delete_webhook"}}</strong></a>{{end}}
+	                            </div>
+							</form>
+	                    </div>
+	                </div>
+		            <br>
+	                <div id="setting-content">
+	                    <div id="repo-hooks-history-panel" class="panel panel-radius">
+	                        <div class="panel-header">
+	                        	<strong>{{.i18n.Tr "repo.settings.recent_deliveries"}}</strong>
+	                        </div>
+	                        <ul class="panel-body setting-list">
+                            	<li>Coming soon!</li>
+	                        </ul>
+	                    </div>
+		            </div>
+	            </div>
+	        </div>
+		</div>
+	</div>
+</div>
+{{template "ng/base/footer" .}}
\ No newline at end of file
diff --git a/templates/repo/settings/hooks.tmpl b/templates/repo/settings/hooks.tmpl
index 7081e78f91..6efd8f0a6f 100644
--- a/templates/repo/settings/hooks.tmpl
+++ b/templates/repo/settings/hooks.tmpl
@@ -18,7 +18,11 @@
                             	<li>{{.i18n.Tr "repo.settings.hooks_desc" | Str2html}}</li>
                             	{{range .Webhooks}}
 								<li>
-									{{if .IsActive}}<span class="left text-success"><i class="fa fa-check"></i></span>{{else}}<span class="pull-left status"><i class="fa fa-times"></i></span>{{end}}
+									{{if .IsActive}}
+									<span class="left text-success"><i class="octicon octicon-check"></i></span>
+									{{else}}
+									<span class="left text-grey"><i class="octicon octicon-primitive-dot"></i></span>
+									{{end}}
 									<a class="link" href="{{$.RepoLink}}/settings/hooks/{{.Id}}">{{.Url}}</a>
 									<a href="{{$.RepoLink}}/settings/hooks?remove={{.Id}}" class="text-red right"><i class="fa fa-times"></i></a>
                         			<a href="{{$.RepoLink}}/settings/hooks/{{.Id}}" class="text-blue right"><i class="fa fa-pencil"></i></a>
diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl
index ec0503e677..e6ebb9aa22 100644
--- a/templates/repo/settings/options.tmpl
+++ b/templates/repo/settings/options.tmpl
@@ -31,8 +31,8 @@
 	                            <hr>	
 	                            <br>
 					            <div class="field">
-					                <label for="lang">{{.i18n.Tr "repo.default_branch"}}</label>
-					                <select id="lang" name="gitignore">
+					                <label>{{.i18n.Tr "repo.default_branch"}}</label>
+					                <select name="branch">
 		                                {{if .Repository.DefaultBranch}}<option value="{{.Repository.DefaultBranch}}">{{.Repository.DefaultBranch}}</option>{{end}}
 		                                {{range .Branches}}
 		                                	{{if not (eq . $.Repository.DefaultBranch)}}<option value="{{.}}">{{.}}</option>{{end}}