Related links prop editor: first attempt at UI
This commit is contained in:
@@ -2,4 +2,32 @@
|
||||
.controller("Umbraco.Editors.RelatedLinksController",
|
||||
function ($rootScope, $scope, $routeParams, contentResource, contentTypeResource, editorContextService, notificationsService) {
|
||||
|
||||
$scope.newCaption = '';
|
||||
$scope.newLink = 'http://';
|
||||
$scope.newNewWindow = false;
|
||||
|
||||
$scope.relatedLinks = [
|
||||
{ caption: 'Google', link: "http://google.com", newWindow: false },
|
||||
{ caption: 'Umbraco', link: "http://umbraco.com", newWindow: false },
|
||||
{ caption: 'Nibble', link: "http://nibble.be", newWindow: false }
|
||||
];
|
||||
|
||||
$scope.delete = function (idx) {
|
||||
$scope.relatedLinks.splice($scope.relatedLinks[idx], 1);
|
||||
|
||||
};
|
||||
|
||||
$scope.add = function() {
|
||||
var newLink = new function() {
|
||||
this.caption = $scope.newCaption;
|
||||
this.link = $scope.newLink;
|
||||
this.newWindow = $scope.newNewWindow;
|
||||
};
|
||||
|
||||
$scope.newCaption = '';
|
||||
$scope.newLink = '';
|
||||
$scope.newNewWindow = false;
|
||||
|
||||
$scope.relatedLinks.push(newLink);
|
||||
};
|
||||
});
|
||||
@@ -1,3 +1,40 @@
|
||||
<div class="umb-editor umb-relatedlinks" ng-controller="Umbraco.Editors.RelatedLinksController">
|
||||
|
||||
<div class="row-fluid">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Caption</td>
|
||||
<td>Link</td>
|
||||
<td>Open in new window</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="link in relatedLinks">
|
||||
<td>{{link.caption}}</td>
|
||||
<td><a href="{{link.link}}" target="_blank">{{link.link}}</a></td>
|
||||
<td>{{link.newWindow}} {{$index}}</td>
|
||||
<td>
|
||||
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-default">Edit</button>
|
||||
<button type="button" class="btn btn-default" ng-click="delete($index)">Delete</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<form ng-submit="add()">
|
||||
<td><input type="text" ng-model="newCaption" placeholder="Enter a new caption" required/></td>
|
||||
<td><input type="text" ng-model="newLink" placeholder="Enter the link" required/></td>
|
||||
<td><input type="checkbox" ng-model="newNewWindow"/> </td>
|
||||
<td>
|
||||
<div class="btn-group">
|
||||
<input type="submit" class="btn btn-default" value="Add"/>
|
||||
</div>
|
||||
</td>
|
||||
</form>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user