Browse Source

upload thumb image of the article, some stuff fixed

master
arnaucode 6 years ago
parent
commit
f917eedace
10 changed files with 158 additions and 84 deletions
  1. +14
    -0
      RESTfunctions.go
  2. +3
    -2
      webapp/app.js
  3. +5
    -5
      webapp/views/main/main.html
  4. +1
    -1
      webapp/views/main/main.js
  5. +7
    -3
      webapp/views/post/post.html
  6. +21
    -10
      webapp/views/templates/post-thumb-template.html
  7. +1
    -1
      webapp/views/templates/user-thumb-template.html
  8. +3
    -3
      webapp/views/user/user.html
  9. +5
    -0
      webapp/views/write/write.html
  10. +98
    -59
      webapp/views/write/write.js

+ 14
- 0
RESTfunctions.go

@ -138,6 +138,13 @@ func GetUser(w http.ResponseWriter, r *http.Request) {
err = postCollection.Find(bson.M{"user._id": bson.ObjectIdHex(userid)}).Limit(50).All(&user.Posts) err = postCollection.Find(bson.M{"user._id": bson.ObjectIdHex(userid)}).Limit(50).All(&user.Posts)
check(err) check(err)
//for each post, get the user
for i, _ := range user.Posts {
err = userCollection.Find(bson.M{"_id": user.Posts[i].User.ID}).One(&user.Posts[i].User)
check(err)
//TODO don't return the user.Token, password, etc only the Name, LastName, Username, img
}
jResp, err := json.Marshal(user) jResp, err := json.Marshal(user)
check(err) check(err)
fmt.Fprintln(w, string(jResp)) fmt.Fprintln(w, string(jResp))
@ -198,6 +205,13 @@ func GetPosts(w http.ResponseWriter, r *http.Request) {
err := postCollection.Find(bson.M{}).Limit(50).All(&posts) err := postCollection.Find(bson.M{}).Limit(50).All(&posts)
check(err) check(err)
//for each post, get the user
for i, _ := range posts {
fmt.Println(posts[i].User.ID)
err = userCollection.Find(bson.M{"_id": posts[i].User.ID}).One(&posts[i].User)
check(err)
//TODO don't return the user.Token, password, etc only the Name, LastName, Username, img
}
jResp, err := json.Marshal(posts) jResp, err := json.Marshal(posts)
check(err) check(err)
fmt.Fprintln(w, string(jResp)) fmt.Fprintln(w, string(jResp))

+ 3
- 2
webapp/app.js

@ -1,6 +1,7 @@
'use strict'; 'use strict';
var apiurl = "http://127.0.0.1:3000/"; var apiurl = "http://127.0.0.1:3000/";
var ipfsurl = "http://127.0.0.1:5001/api/v0/";
angular.module('app', [ angular.module('app', [
'ngRoute', 'ngRoute',
@ -77,12 +78,12 @@ console.log("window", window.location.hash);
.factory('api', function($http) { .factory('api', function($http) {
return { return {
init: function() { init: function() {
console.log("http", $http.options);
/*console.log("http", $http.options);
var dblog_user = JSON.parse(localStorage.getItem('dblog_user')); var dblog_user = JSON.parse(localStorage.getItem('dblog_user'));
if (dblog_user) { if (dblog_user) {
$http.defaults.headers.common['Authorization'] = dblog_user.token; $http.defaults.headers.common['Authorization'] = dblog_user.token;
$http.defaults.headers.post['Authorization'] = dblog_user.token; $http.defaults.headers.post['Authorization'] = dblog_user.token;
}
}*/
} }
}; };
}) })

+ 5
- 5
webapp/views/main/main.html

@ -1,7 +1,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-sm-4"> <div class="col-sm-4">
<div ng-repeat="post in posts" ng-if="$index % 3 == 0">
<div ng-repeat="post in posts | orderBy: '-date'" ng-if="$index % 3 == 0">
<a ng-href="#!/post/{{post.id}}"> <a ng-href="#!/post/{{post.id}}">
<div ng-include="'views/templates/post-thumb-template.html'"></div> <div ng-include="'views/templates/post-thumb-template.html'"></div>
</a> </a>
@ -9,7 +9,7 @@
</div> </div>
</div> </div>
<div class="col-sm-4"> <div class="col-sm-4">
<div ng-repeat="post in posts" ng-if="$index % 3 == 1">
<div ng-repeat="post in posts | orderBy: '-date'" ng-if="$index % 3 == 1">
<a ng-href="#!/post/{{post.id}}"> <a ng-href="#!/post/{{post.id}}">
<div ng-include="'views/templates/post-thumb-template.html'"></div> <div ng-include="'views/templates/post-thumb-template.html'"></div>
</a> </a>
@ -17,7 +17,7 @@
</div> </div>
</div> </div>
<div class="col-sm-4"> <div class="col-sm-4">
<div ng-repeat="post in posts" ng-if="$index % 3 == 2">
<div ng-repeat="post in posts | orderBy: '-date'" ng-if="$index % 3 == 2">
<a ng-href="#!/post/{{post.id}}"> <a ng-href="#!/post/{{post.id}}">
<div ng-include="'views/templates/post-thumb-template.html'"></div> <div ng-include="'views/templates/post-thumb-template.html'"></div>
</a> </a>
@ -25,7 +25,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row">
<!--<div class="row">
<div class="col-sm-3"> <div class="col-sm-3">
<div class="card" style="width: 18rem;"> <div class="card" style="width: 18rem;">
<a ng-href="#!/user"> <a ng-href="#!/user">
@ -38,5 +38,5 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>-->
</div> </div>

+ 1
- 1
webapp/views/main/main.js

@ -12,7 +12,7 @@ angular.module('app.main', ['ngRoute'])
.controller('MainCtrl', function($scope, $rootScope, $http) { .controller('MainCtrl', function($scope, $rootScope, $http) {
$scope.posts = {};
$scope.posts = [];
$http.get(apiurl + 'posts') $http.get(apiurl + 'posts')
.then(function(data) { .then(function(data) {
console.log('data success'); console.log('data success');

+ 7
- 3
webapp/views/post/post.html

@ -30,9 +30,13 @@
</div> </div>
</span> </span>
</div> </div>
<h5 class="card-title">{{post.title}}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{post.summary}}</h6>
<img ng-src="{{post.img}}" class="img-fluid" />
<div class="col-sm-10">
<h5 class="card-title">{{post.title}}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{post.summary}}</h6>
</div>
<br>
<img ng-show="post.thumbimg" ng-src="http://localhost:8080/ipfs/{{post.thumbimg}}" class="img-fluid" />
<div ng-include="'http://localhost:8080/ipfs/'+post.content"></div> <div ng-include="'http://localhost:8080/ipfs/'+post.content"></div>

+ 21
- 10
webapp/views/templates/post-thumb-template.html

@ -1,23 +1,34 @@
<div class="card"> <div class="card">
<div class="o_card-body"> <div class="o_card-body">
<a ng-href="#!/user/{{post.user.id}}"> <a ng-href="#!/user/{{post.user.id}}">
<div class="row">
<div style="display:block;margin-left:10px;margin-right:10px;">
<img class="o_userImgCircular" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" />
<div class="pull-right text-secondary">
<span class="row">
<div class="text-right">
{{post.date | date: "MMM d, y"}}
</div>
</span>
<span class="row">
<div class="text-right">
{{post.date | date: "HH:mm"}}h
</div>
</span>
</div> </div>
<div style="display:block; font-size:90%;">
<b>{{user.name}} {{user.lastname}}</b>
<div class="mb-2 text-muted">@{{user.username}}</div>
<div class="row">
<div style="display:block;margin-left:10px;margin-right:10px;">
<img class="o_userImgCircular" ng-src="img/z.png" />
</div>
<div style="display:block; font-size:90%;">
<b>{{post.user.name}} {{post.user.lastname}}</b>
<div class="mb-2 text-muted">@{{post.user.username}}</div>
</div>
</div> </div>
</div>
</a> </a>
</div> </div>
<a ng-href="#!/post/{{post.id}}" class="o_card-body"> <a ng-href="#!/post/{{post.id}}" class="o_card-body">
<img ng-src="{{post.img}}" class="img-fluid" />
<img ng-show="post.thumbimg" ng-src="http://localhost:8080/ipfs/{{post.thumbimg}}" class="img-fluid" />
<br><br> <br><br>
<h5 class="card-title">{{post.title}}</h5> <h5 class="card-title">{{post.title}}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{post.subtitle}}</h6>
<p class="card-text">{{post.content}}</p>
<h6 class="card-subtitle mb-2 text-muted">{{post.summary}}</h6>
<div class="pull-right"> <div class="pull-right">
<i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37 <i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37
</div> </div>

+ 1
- 1
webapp/views/templates/user-thumb-template.html

@ -3,7 +3,7 @@
<div class="o_userProfileBackground"> <div class="o_userProfileBackground">
</div> </div>
<div class="card-body"> <div class="card-body">
<img class="o_userImgCircular o_profilePageImage" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" />
<img class="o_userImgCircular o_profilePageImage" ng-src="img/z.png" />
<h4> <h4>
{{user.name}} {{user.lastname}} {{user.name}} {{user.lastname}}
</h4> </h4>

+ 3
- 3
webapp/views/user/user.html

@ -17,7 +17,7 @@
</div> </div>
<div class="col-sm-6"> <div class="col-sm-6">
<div ng-repeat="post in user.posts">
<div ng-repeat="post in user.posts | orderBy: '-date'">
<div ng-include="'views/templates/post-thumb-template.html'"></div> <div ng-include="'views/templates/post-thumb-template.html'"></div>
<br> <br>
</div> </div>
@ -42,10 +42,10 @@
<br> <br>
<div class=""> <div class="">
<h5>Featured posts</h5> <h5>Featured posts</h5>
<div ng-repeat="post in featured_posts">
<!--<div ng-repeat="post in featured_posts">
<div ng-include="'views/templates/post-thumb-template.html'"></div> <div ng-include="'views/templates/post-thumb-template.html'"></div>
<br> <br>
</div>
</div>-->
</div> </div>
</div> </div>
</div> </div>

+ 5
- 0
webapp/views/write/write.html

@ -35,6 +35,11 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row">
<div class="col-sm-12">
<input type="file" file-model="file"/>
</div>
</div>
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<div class="editable" style="min-height: 500px; padding: 10px;"></div> <div class="editable" style="min-height: 500px; padding: 10px;"></div>

+ 98
- 59
webapp/views/write/write.js

@ -2,66 +2,105 @@
angular.module('app.write', ['ngRoute']) angular.module('app.write', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/write', {
templateUrl: 'views/write/write.html',
controller: 'WriteCtrl'
});
}])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/write', {
templateUrl: 'views/write/write.html',
controller: 'WriteCtrl'
});
}])
.controller('WriteCtrl', function($scope, $rootScope, $http) {
$scope.post = {
title: "",
content: "",
summary: ""
};
var editor = new MediumEditor('.editable', {
toolbar: {
/* These are the default options for the toolbar,
if nothing is passed this is what is used */
allowMultiParagraphSelection: true,
buttons: ['bold', 'italic', 'underline', 'anchor', 'h2', 'h3', 'quote'],
diffLeft: 0,
diffTop: -10,
firstButtonClass: 'medium-editor-button-first',
lastButtonClass: 'medium-editor-button-last',
relativeContainer: null,
standardizeSelectionStart: false,
static: false,
/* options which only apply when static is true */
align: 'center',
sticky: false,
updateOnEmptySelection: false
},
autoLink: true,
placeholder: {
text: 'Start to writting your decentralized blog post...'
}
}).subscribe('editableInput', function (event, editable) {
// Do some work
$scope.post.content = editable.innerHTML;
console.log($scope.post.content);
});
.controller('WriteCtrl', function($scope, $rootScope, $http, toastr) {
$scope.post = {
title: "",
content: "",
summary: ""
};
var editor = new MediumEditor('.editable', {
toolbar: {
/* These are the default options for the toolbar,
if nothing is passed this is what is used */
allowMultiParagraphSelection: true,
buttons: ['bold', 'italic', 'underline', 'anchor', 'h2', 'h3', 'quote'],
diffLeft: 0,
diffTop: -10,
firstButtonClass: 'medium-editor-button-first',
lastButtonClass: 'medium-editor-button-last',
relativeContainer: null,
standardizeSelectionStart: false,
static: false,
/* options which only apply when static is true */
align: 'center',
sticky: false,
updateOnEmptySelection: false
},
autoLink: true,
placeholder: {
text: 'Start to writting your decentralized blog post...'
}
}).subscribe('editableInput', function(event, editable) {
// Do some work
$scope.post.content = editable.innerHTML;
});
$scope.publicate = function() {
console.log("post", $scope.post);
$http({
url: apiurl + 'post',
method: "POST",
headers: {
"Content-Type": undefined
},
data: $scope.post
})
.then(function(data) {
console.log("data: ");
console.log(data.data);
window.location = "#!/user/" + $scope.user.id;
},
function(data) {
console.log(data);
});
$scope.publicate = function() {
//add the thumbimg to ipfs
var formdata = new FormData();
formdata.append("file", $scope.file);
$http({
url: ipfsurl + 'add',
method: "POST",
headers: {
"Content-Type": undefined
},
data: formdata
})
.then(function(data) {
console.log("data: ");
console.log(data.data);
$scope.post.thumbimg = data.data.Hash;
toastr.success("Thumb image added to IPFS");
$scope.publicate2();
},
function(data) {
console.log(data);
toastr.error("Error adding Model to IPFS");
});
};
$scope.publicate2 = function() {
//$scope.post.thumbimg = hash;
//send the post content to the Go api, that will add the html content to ipfs
console.log("post", $scope.post);
$http({
url: apiurl + 'post',
method: "POST",
headers: {
"Content-Type": undefined
},
data: $scope.post
})
.then(function(data) {
console.log("data: ");
console.log(data.data);
window.location = "#!/main";
},
function(data) {
console.log(data);
});
};
});
};
}).directive('fileModel', ['$parse', function($parse) {
//directive code from https://www.tutorialspoint.com/angularjs/angularjs_upload_file.htm
return {
restrict: 'A',
link: function(scope, element, attrs) {
var model = $parse(attrs.fileModel);
var modelSetter = model.assign;
element.bind('change', function() {
scope.$apply(function() {
modelSetter(scope, element[0].files[0]);
});
});
}
};
}]);

Loading…
Cancel
Save