@ -0,0 +1,72 @@ |
|||||
|
var user = { |
||||
|
username: "mark_zuckerberg", |
||||
|
name: "Mark", |
||||
|
lastname: "Zuckerberg", |
||||
|
description: "Hi all, I'm here to write decentralized blog posts.", |
||||
|
twitter: "arnaucode", |
||||
|
github: "arnaucode", |
||||
|
posts: [{ |
||||
|
title: "This is the second post", |
||||
|
subtitle: "this is the subtitle of the second post", |
||||
|
img: "https://cdn-images-1.medium.com/fit/t/800/240/1*4_E6m7J0112DBi1Lmdniiw.png", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "This is the first post", |
||||
|
subtitle: "this is the subtitle of the first post", |
||||
|
img: "https://bootstrap-themes.github.io/application/assets/img/unsplash_1.jpg", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "Thinking about python development", |
||||
|
subtitle: "this is the subtitle of the second post", |
||||
|
img: "https://cdn.static-economist.com/sites/default/files/images/2015/09/blogs/economist-explains/code2.png", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "Thinking about G", |
||||
|
subtitle: "this is the subtitle of the first post", |
||||
|
img: "https://cdn-images-1.medium.com/max/1600/1*RNkyx-Zq7w61eR74nMYgnA.jpeg", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
} |
||||
|
] |
||||
|
}; |
||||
|
var featured_posts = [{ |
||||
|
title: "Thinking about python development", |
||||
|
subtitle: "this is the subtitle of the second post", |
||||
|
img: "https://cdn.static-economist.com/sites/default/files/images/2015/09/blogs/economist-explains/code2.png", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "Thinking about G", |
||||
|
subtitle: "this is the subtitle of the first post", |
||||
|
img: "https://cdn-images-1.medium.com/max/1600/1*RNkyx-Zq7w61eR74nMYgnA.jpeg", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
} |
||||
|
]; |
||||
|
|
||||
|
var posts = [{ |
||||
|
title: "This is the second post", |
||||
|
subtitle: "this is the subtitle of the second post", |
||||
|
img: "https://cdn-images-1.medium.com/fit/t/800/240/1*4_E6m7J0112DBi1Lmdniiw.png", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "This is the first post", |
||||
|
subtitle: "this is the subtitle of the first post", |
||||
|
img: "https://bootstrap-themes.github.io/application/assets/img/unsplash_1.jpg", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "Thinking about python development", |
||||
|
subtitle: "this is the subtitle of the second post", |
||||
|
img: "https://cdn.static-economist.com/sites/default/files/images/2015/09/blogs/economist-explains/code2.png", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
}, |
||||
|
{ |
||||
|
title: "Thinking about G", |
||||
|
subtitle: "this is the subtitle of the first post", |
||||
|
img: "https://cdn-images-1.medium.com/max/1600/1*RNkyx-Zq7w61eR74nMYgnA.jpeg", |
||||
|
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
||||
|
} |
||||
|
]; |
@ -0,0 +1,52 @@ |
|||||
|
<div class="container"> |
||||
|
<div class="row"> |
||||
|
<div class="col-sm-3"> |
||||
|
<div class="card"> |
||||
|
<div class="o_userProfileBackground"> |
||||
|
</div> |
||||
|
<div class="card-body"> |
||||
|
<img class="o_userImgCircular o_profilePageImage" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" /> |
||||
|
<h4> |
||||
|
{{user.name}} {{user.lastname}} |
||||
|
</h4> |
||||
|
<h6 class="card-subtitle mb-2 text-muted">@{{user.username}}</h6> |
||||
|
<p>{{user.description}}</p> |
||||
|
<p> |
||||
|
<a ng-href="#!/userLikes/{{user._id}}"> |
||||
|
14 followers |
||||
|
</a> | |
||||
|
<a ng-href="#!/userLikes/{{user._id}}"> |
||||
|
20 following |
||||
|
</a> |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<br> |
||||
|
<div class="card"> |
||||
|
<div class="card-body"> |
||||
|
<b>About</b> |
||||
|
<p> |
||||
|
Twitter <a ng-href="https://twitter.com/{{user.twitter}}" target="_blank">{{user.twitter}}</a> |
||||
|
</p> |
||||
|
<p> |
||||
|
Github <a ng-href="https://github.com/{{user.github}}" target="_blank">{{user.github}}</a> |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-9"> |
||||
|
<div class="card"> |
||||
|
<div class="card-body"> |
||||
|
<h5 class="card-title">{{post.title}}</h5> |
||||
|
<h6 class="card-subtitle mb-2 text-muted">{{post.subtitle}}</h6> |
||||
|
<img ng-src="{{post.img}}" class="img-fluid" /> |
||||
|
<p class="card-text">{{post.content}}</p> |
||||
|
<div class="pull-right"> |
||||
|
<i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37 |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
@ -0,0 +1,25 @@ |
|||||
|
'use strict'; |
||||
|
|
||||
|
angular.module('app.post', ['ngRoute']) |
||||
|
|
||||
|
.config(['$routeProvider', function($routeProvider) { |
||||
|
$routeProvider.when('/post', { |
||||
|
templateUrl: 'views/post/post.html', |
||||
|
controller: 'PostCtrl' |
||||
|
}); |
||||
|
}]) |
||||
|
|
||||
|
.controller('PostCtrl', function($scope, $rootScope, $http) { |
||||
|
|
||||
|
/*$http.get(apiurl + 'user/' + ) |
||||
|
.then(function(data) { |
||||
|
console.log('data success'); |
||||
|
console.log(data); |
||||
|
$scope.user = data.data; |
||||
|
}, function(data) { |
||||
|
console.log('no user'); |
||||
|
});*/ |
||||
|
//fake data
|
||||
|
$scope.user = user; |
||||
|
$scope.post = user.posts[0]; |
||||
|
}); |
@ -0,0 +1,22 @@ |
|||||
|
<div class="card"> |
||||
|
<div class="card-body"> |
||||
|
<a ng-href="#!/user/{{user.id}}" class="row"> |
||||
|
<div class="col-sm-3"> |
||||
|
<img class="o_userImgCircular" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" /> |
||||
|
</div> |
||||
|
<div class="col-sm-8"> |
||||
|
<b>{{user.name}} {{user.lastname}}</b> |
||||
|
<div class="mb-2 text-muted">@{{user.username}}</div> |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
||||
|
<a ng-href="#!/post/{{post.id}}" class="card-body"> |
||||
|
<h5 class="card-title">{{post.title}}</h5> |
||||
|
<h6 class="card-subtitle mb-2 text-muted">{{post.subtitle}}</h6> |
||||
|
<img ng-src="{{post.img}}" class="img-fluid" /> |
||||
|
<p class="card-text">{{post.content}}</p> |
||||
|
<div class="pull-right"> |
||||
|
<i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37 |
||||
|
</div> |
||||
|
</a> |
||||
|
</div> |
@ -0,0 +1,55 @@ |
|||||
|
<div class="container"> |
||||
|
<div class="row"> |
||||
|
<div class="col-sm-3"> |
||||
|
<div class="card"> |
||||
|
<div class="o_userProfileBackground"> |
||||
|
</div> |
||||
|
<div class="card-body"> |
||||
|
<img class="o_userImgCircular o_profilePageImage" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" /> |
||||
|
<h4> |
||||
|
{{user.name}} {{user.lastname}} |
||||
|
</h4> |
||||
|
<h6 class="card-subtitle mb-2 text-muted">@{{user.username}}</h6> |
||||
|
<p>{{user.description}}</p> |
||||
|
<p> |
||||
|
<a ng-href="#!/userLikes/{{user._id}}"> |
||||
|
14 followers |
||||
|
</a> | |
||||
|
<a ng-href="#!/userLikes/{{user._id}}"> |
||||
|
20 following |
||||
|
</a> |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
<br> |
||||
|
<div class="card"> |
||||
|
<div class="card-body"> |
||||
|
<b>About</b> |
||||
|
<p> |
||||
|
Twitter <a ng-href="https://twitter.com/{{user.twitter}}" target="_blank">{{user.twitter}}</a> |
||||
|
</p> |
||||
|
<p> |
||||
|
Github <a ng-href="https://github.com/{{user.github}}" target="_blank">{{user.github}}</a> |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-9"> |
||||
|
<div class="row"> |
||||
|
<div class="col-sm-10"> |
||||
|
<div class="form-group"> |
||||
|
<input type="text" class="form-control" placeholder="Title of the article..." style="font-weight:bold;"> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-2"> |
||||
|
<div ng-click="save()" class="btn btn-raised btn-block c_o_blue300 pull-right">Publicate</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="card"> |
||||
|
<div class="card-body"> |
||||
|
<div class="editable" style="min-height: 500px; padding: 10px;"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
@ -0,0 +1,42 @@ |
|||||
|
'use strict'; |
||||
|
|
||||
|
angular.module('app.write', ['ngRoute']) |
||||
|
|
||||
|
.config(['$routeProvider', function($routeProvider) { |
||||
|
$routeProvider.when('/write', { |
||||
|
templateUrl: 'views/write/write.html', |
||||
|
controller: 'WriteCtrl' |
||||
|
}); |
||||
|
}]) |
||||
|
|
||||
|
.controller('WriteCtrl', function($scope, $rootScope, $http) { |
||||
|
$scope.content = ""; |
||||
|
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.content = editable.innerHTML; |
||||
|
console.log($scope.content); |
||||
|
}); |
||||
|
|
||||
|
}); |