mirror of
https://github.com/amark/gun.git
synced 2025-03-30 15:08:33 +00:00
85 lines
2.3 KiB
HTML
85 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html ng-app="admin">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<script src="https://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
|
|
<!--
|
|
-->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"></script>
|
|
<script src="../../gun.js"></script>
|
|
</head>
|
|
<body ng-controller="editor">
|
|
<style>
|
|
html, body {
|
|
font-family: Verdana, Geneva, sans-serif;
|
|
}
|
|
a {
|
|
color: skyblue;
|
|
text-decoration: none;
|
|
cursor: poiner;
|
|
}
|
|
ul, li {
|
|
list-style-type: none;
|
|
}
|
|
ul:hover, li:hover {
|
|
list-style-type: inherit;
|
|
}
|
|
input {
|
|
border: none;
|
|
border-bottom: dashed 1px gainsboro;
|
|
}
|
|
.none {
|
|
display: none;
|
|
}
|
|
</style>
|
|
<h3>Admin Data Editor</h3>
|
|
This is a live view of your JSON data, you can edit it in realtime or add new key/values.
|
|
<!--
|
|
<form method="post" action="http://localhost:8888/gun">
|
|
First name: <input type="text" name="firstname"><br>
|
|
Last name: <input type="text" name="lastname">
|
|
<input type="submit" value="Submit">
|
|
</form>
|
|
-->
|
|
<ul name="list">
|
|
<li ng-repeat="(key, val) in data">
|
|
<div ng-if="key != '_'">
|
|
<b>{{key}}</b>:
|
|
<span contenteditable="true" gun>{{val}}</span>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<form ng-submit="add()">
|
|
<label>
|
|
<input ng-model="field" placeholder="key" ng-submit="add()">
|
|
<a ng-click="add()">add</a>
|
|
<input type="submit" class="none"/>
|
|
</label>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
<script>
|
|
var gun = Gun([location.origin + '/gun']);
|
|
angular.module('admin', []).controller('editor', function($scope){
|
|
$scope.data = {};
|
|
$scope.$data = gun.load('blob/data').get(function(data){
|
|
Gun.obj.map(data, function(val, field){
|
|
if(val === $scope.data[field]){ return }
|
|
$scope.data[field] = val;
|
|
});
|
|
$scope.$apply();
|
|
});
|
|
$scope.add = function(a,b,c){
|
|
$scope.$data.path($scope.field).set( $scope.data[$scope.field] = 'value' );
|
|
$scope.field = '';
|
|
};
|
|
}).directive('gun', function(){
|
|
return function(scope, elem){
|
|
elem.on('keyup', function(){
|
|
scope.$data.path(scope.key).set( scope.data[scope.key] = elem.text() );
|
|
});
|
|
};
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |