From c7b4cfd3750728e9ddfb9aa7d35466498ad4b1c0 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Tue, 16 Jul 2013 12:58:57 +1000
Subject: [PATCH] Creates umb-content-name to share amongst editors so we have
 less html duplication.

---
 .../directives/umbcontentname.directive.js    | 22 ++++++++++
 .../src/views/content/edit.html               | 41 +++++++++----------
 .../views/directives/umb-content-name.html    |  6 +++
 .../src/views/media/edit.html                 | 39 +++++++++---------
 4 files changed, 66 insertions(+), 42 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/umbcontentname.directive.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/directives/umb-content-name.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/umbcontentname.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/umbcontentname.directive.js
new file mode 100644
index 0000000000..c34a146c6f
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/umbcontentname.directive.js
@@ -0,0 +1,22 @@
+/**
+* @ngdoc object 
+* @name umbraco.directive:umbContentName 
+* @restrict E
+* @description 
+* Used by editors that require naming an entity. Shows a textbox/headline with a required validator within it's own form.
+**/
+angular.module("umbraco.directives")
+	.directive('umbContentName', function () {
+	    return {
+	        require: "ngModel",
+			restrict: 'E',
+			replace: true,
+			templateUrl: 'views/directives/umb-content-name.html',
+			scope: {
+			    placeholder: '@placeholder',
+			    model: '=ngModel'
+			},
+			link: function(scope, element, attrs, modelCtrl) {
+			}
+	    };
+	});
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/views/content/edit.html b/src/Umbraco.Web.UI.Client/src/views/content/edit.html
index 9fb6e677a6..28e59c0c6d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/edit.html
+++ b/src/Umbraco.Web.UI.Client/src/views/content/edit.html
@@ -2,33 +2,30 @@
     <umb-panel ng-controller="Umbraco.Editors.ContentEditController" val-show-validation>
         <umb-header tabs="content.tabs">
             
-                <div class="span4 control-group" ng-class="{error: contentForm.name.$invalid}">
-                    <input name="name" type="text" placeholder="Enter a page title" headline ng-model="content.name" required="Name is required" />
-                    <span class="help-inline" val-msg-for="name" val-toggle-msg="required">Required</span>
-                </div>
+            <umb-content-name ng-model="content.name" placeholder="Enter a page title"></umb-content-name>
 
-                <div class="span8">
-                    <div class="btn-toolbar pull-right umb-btn-toolbar">
-                        <div class="btn-group">
-                            <a class="btn" ng-click="preview(content)" 
-                            data-shortcut="ctrl+s">Preview page</a>
-                        </div>
+            <div class="span8">
+                <div class="btn-toolbar pull-right umb-btn-toolbar">
+                    <div class="btn-group">
+                        <a class="btn" ng-click="preview(content)" 
+                           data-shortcut="ctrl+s">Preview page</a>
+                    </div>
 
-                        <div class="btn-group">
-                            <a class="btn btn-success" href="#" ng-click="saveAndPublish(content)"
-                               prevent-default data-shortcut="ctrl+p">Publish</a>
+                    <div class="btn-group">
+                        <a class="btn btn-success" href="#" ng-click="saveAndPublish(content)"
+                           prevent-default data-shortcut="ctrl+p">Publish</a>
 
-                            <a class="btn btn-success dropdown-toggle" data-toggle="dropdown">
-                                <span class="caret"></span>
-                            </a>
+                        <a class="btn btn-success dropdown-toggle" data-toggle="dropdown">
+                            <span class="caret"></span>
+                        </a>
 
-                            <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                                <li><a href="#" ng-click="save(content)"
-                                       prevent-default data-shortcut="ctrl+s">Save draft</a></li>
-                            </ul>
-                        </div>
+                        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+                            <li><a href="#" ng-click="save(content)"
+                                   prevent-default data-shortcut="ctrl+s">Save draft</a></li>
+                        </ul>
                     </div>
                 </div>
+            </div>
         </umb-header>
 
         <umb-tab-view>
@@ -43,4 +40,4 @@
             </umb-tab>
         </umb-tab-view>
     </umb-panel>
-</ng-form>
\ No newline at end of file
+</ng-form>
diff --git a/src/Umbraco.Web.UI.Client/src/views/directives/umb-content-name.html b/src/Umbraco.Web.UI.Client/src/views/directives/umb-content-name.html
new file mode 100644
index 0000000000..6602e76e18
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/directives/umb-content-name.html
@@ -0,0 +1,6 @@
+<ng-form name="contentNameForm">
+    <div class="span4 control-group" ng-class="{error: contentNameForm.name.$invalid}">
+        <input name="name" type="text" placeholder="{{placeholder}}" headline ng-model="model" required />
+        <span class="help-inline" val-msg-for="name" val-toggle-msg="required">Required</span>
+    </div>
+</ng-form>
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/views/media/edit.html b/src/Umbraco.Web.UI.Client/src/views/media/edit.html
index 1dda59ff89..8ff21f8015 100644
--- a/src/Umbraco.Web.UI.Client/src/views/media/edit.html
+++ b/src/Umbraco.Web.UI.Client/src/views/media/edit.html
@@ -1,32 +1,31 @@
 <ng-form name="contentForm" ng-show="contentLoaded">
     <umb-panel ng-controller="Umbraco.Editors.MediaEditController" val-show-validation>  
         <umb-header tabs="content.tabs">
-                <div class="span4">
-                    <input type="text" placeholder="Enter a page title" headline ng-model="content.name" />
-                </div>
+            
+            <umb-content-name ng-model="content.name" placeholder="Enter a page title"></umb-content-name>
 
-                <div class="span8">
-                    <div class="btn-toolbar pull-right umb-btn-toolbar">
-                        <div class="btn-group">
-                            <a class="btn" ng-click="preview(content)" 
-                            data-shortcut="ctrl+s">Preview page</a>
-                        </div>
+            <div class="span8">
+                <div class="btn-toolbar pull-right umb-btn-toolbar">
+                    <div class="btn-group">
+                        <a class="btn" ng-click="preview(content)" 
+                           data-shortcut="ctrl+s">Preview page</a>
+                    </div>
 
-                        <div class="btn-group">
-                            <a class="btn btn-success" href="#" ng-click="saveAndPublish(content)"
-                               prevent-default>Publish</a>
+                    <div class="btn-group">
+                        <a class="btn btn-success" href="#" ng-click="saveAndPublish(content)"
+                           prevent-default>Publish</a>
 
-                            <a class="btn btn-success dropdown-toggle" data-toggle="dropdown">
-                                <span class="caret"></span>
-                            </a>
+                        <a class="btn btn-success dropdown-toggle" data-toggle="dropdown">
+                            <span class="caret"></span>
+                        </a>
 
-                            <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                                <li><a href="#" ng-click="save(content)"
-                                       prevent-default data-shortcut="ctrl+s">Save draft</a></li>
-                            </ul>
-                        </div>
+                        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+                            <li><a href="#" ng-click="save(content)"
+                                   prevent-default data-shortcut="ctrl+s">Save draft</a></li>
+                        </ul>
                     </div>
                 </div>
+            </div>
         </umb-header>
 
         <umb-tab-view>