mirror of
https://github.com/arnaucube/decentralized-blogging-platform.git
synced 2026-02-06 19:06:45 +01:00
user profile
This commit is contained in:
@@ -12,7 +12,7 @@ angular.module('app', [
|
||||
'app.login',
|
||||
'app.main',
|
||||
'app.newmodel',
|
||||
'app.profile'
|
||||
'app.user'
|
||||
]).
|
||||
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
|
||||
$locationProvider.hashPrefix('!');
|
||||
|
||||
@@ -1,5 +1,40 @@
|
||||
.o_nav {
|
||||
background: #ffffff!important;
|
||||
color: #000000!important;
|
||||
/*border-bottom: 2px solid #4DD0E1!important;*/
|
||||
background: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
/*border-bottom: 2px solid #4DD0E1!important;*/
|
||||
}
|
||||
|
||||
body {
|
||||
background: #f5f8fa;
|
||||
}
|
||||
|
||||
.o_userProfileBackground {
|
||||
min-height: 30% !important;
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-position: center;
|
||||
background-image: url('../img/background01.png');
|
||||
text-align: center;
|
||||
/*color: white;*/
|
||||
/* Create the parallax scrolling effect */
|
||||
/*background-attachment: fixed;*/
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.o_userImgCircular {
|
||||
margin-top: -100px;
|
||||
margin-left: 25%;
|
||||
background: #ffffff;
|
||||
width: 50%;
|
||||
border: 4px #ffffff solid;
|
||||
border-radius: 150px;
|
||||
-webkit-border-radius: 150px;
|
||||
-moz-border-radius: 150px;
|
||||
}
|
||||
|
||||
BIN
webapp/img/background01.png
Executable file
BIN
webapp/img/background01.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 245 KiB |
@@ -24,7 +24,7 @@
|
||||
|
||||
<body ng-app="webapp">
|
||||
<div ng-include="'views/navbar.html'"></div>
|
||||
<br><br><br><br>
|
||||
<br>
|
||||
<div ng-view></div>
|
||||
|
||||
|
||||
@@ -61,7 +61,7 @@ Works for both browser and electron with the same code -->
|
||||
<script src="views/login/login.js"></script>
|
||||
<script src="views/main/main.js"></script>
|
||||
<script src="views/newmodel/newmodel.js"></script>
|
||||
<script src="views/profile/profile.js"></script>
|
||||
<script src="views/user/user.js"></script>
|
||||
|
||||
|
||||
<!-- ELECTRON
|
||||
|
||||
@@ -2,7 +2,9 @@
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="card" style="width: 18rem;">
|
||||
<img class="card-img-top" ng-src="http://localhost:8080/ipfs/QmUE6hhNsyUA5emj2dviVDNYK7mSbPeZmRKeCYthmtemeA" alt="Card image cap">
|
||||
<a ng-href="#!/user">
|
||||
<img class="card-img-top" ng-src="http://localhost:8080/ipfs/QmUE6hhNsyUA5emj2dviVDNYK7mSbPeZmRKeCYthmtemeA" alt="Card image cap">
|
||||
</a>
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Post1</h5>
|
||||
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div ng-controller="NavbarCtrl">
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<nav class="navbar navbar-expand-lg navbar-dark c_blue500">
|
||||
<a class="navbar-brand" href="#">
|
||||
<i title="Server" class="fa fa-cube fa-1x"></i> decentralized-blogging-platform
|
||||
</a>
|
||||
@@ -18,7 +18,6 @@
|
||||
</ul>
|
||||
<form class="form-inline my-2 my-lg-0">
|
||||
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
|
||||
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
|
||||
</form>
|
||||
<ul class="navbar-nav" ng-show="user">
|
||||
<li class="nav-item">
|
||||
|
||||
@@ -1,31 +0,0 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<div ng-include="'views/user_template.html'"></div>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<div class="card">
|
||||
<table class="table table-striped table-hover ">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Title</th>
|
||||
<th>Description</th>
|
||||
<th>Accuracy</th>
|
||||
<th>Rating</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="model in user.models">
|
||||
<td>1</td>
|
||||
<td>{{model.title}}</td>
|
||||
<td>{{model.description}}</td>
|
||||
<td>{{model.accuracy}}</td>
|
||||
<td>{{model.rating}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,24 +0,0 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('app.profile', ['ngRoute'])
|
||||
|
||||
.config(['$routeProvider', function($routeProvider) {
|
||||
$routeProvider.when('/profile', {
|
||||
templateUrl: 'views/profile/profile.html',
|
||||
controller: 'ProfileCtrl'
|
||||
});
|
||||
}])
|
||||
|
||||
.controller('ProfileCtrl', function($scope, $rootScope, $http) {
|
||||
|
||||
$http.get(clienturl + 'user')
|
||||
.then(function(data) {
|
||||
console.log('data success');
|
||||
console.log(data);
|
||||
$scope.user = data.data;
|
||||
localStorage.setItem("ai_user", JSON.stringify($scope.user));
|
||||
|
||||
}, function(data) {
|
||||
console.log('no user');
|
||||
});
|
||||
});
|
||||
85
webapp/views/user/user.html
Normal file
85
webapp/views/user/user.html
Normal file
@@ -0,0 +1,85 @@
|
||||
<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" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" />
|
||||
<h4>
|
||||
{{user.name}} {{user.lastname}}
|
||||
</h4>
|
||||
<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-6">
|
||||
<div ng-repeat="post in user.posts">
|
||||
<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>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<b>Discover</b>
|
||||
<p>
|
||||
bla bla bla bla bla
|
||||
</p>
|
||||
<p>
|
||||
bla bla bla bla bla
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<b>Featured posts</b>
|
||||
</div>
|
||||
<div ng-repeat="post in featured_posts">
|
||||
<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>
|
||||
<hr>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
59
webapp/views/user/user.js
Normal file
59
webapp/views/user/user.js
Normal file
@@ -0,0 +1,59 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('app.user', ['ngRoute'])
|
||||
|
||||
.config(['$routeProvider', function($routeProvider) {
|
||||
$routeProvider.when('/user', {
|
||||
templateUrl: 'views/user/user.html',
|
||||
controller: 'UserCtrl'
|
||||
});
|
||||
}])
|
||||
|
||||
.controller('UserCtrl', 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 = {
|
||||
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."
|
||||
}
|
||||
]
|
||||
};
|
||||
$scope.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."
|
||||
}
|
||||
]
|
||||
});
|
||||
Reference in New Issue
Block a user