mirror of
https://github.com/twisterarmy/cloud-server.git
synced 2025-03-13 05:51:46 +00:00
refactor to support modular structure
This commit is contained in:
ghost
parent
724e93447e
commit
d2fd2f114f
3
src/application/controller/common/module/feed.php
Normal file
3
src/application/controller/common/module/feed.php
Normal file
@ -0,0 +1,3 @@
|
||||
<?php
|
||||
|
||||
require(PROJECT_DIR . '/application/view/common/module/feed.phtml');
|
||||
@ -11,7 +11,11 @@
|
||||
<link rel="stylesheet" type="text/css" href="css/app.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/module/menu.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/module/post.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/module/feed.css" />
|
||||
<script src="js/jquery.js"></script>
|
||||
<script src="js/module/menu.js"></script>
|
||||
<script src="js/module/post.js"></script>
|
||||
<script src="js/module/feed.js"></script>
|
||||
<script src="js/home.js"></script>
|
||||
</head>
|
||||
<body class="bg-c-1 bg-img-1 c-0">
|
||||
|
||||
1
src/application/view/common/module/feed.phtml
Normal file
1
src/application/view/common/module/feed.phtml
Normal file
@ -0,0 +1 @@
|
||||
<div class="moduleFeed" id="moduleFeed"></div>
|
||||
@ -1,13 +1,13 @@
|
||||
<div class="modulePost">
|
||||
<div class="modulePost" id="modulePost">
|
||||
<form action="/" method="POST" name="post">
|
||||
<div class="avatar">
|
||||
<img src="<?php echo PROJECT_HOST ?>/api/image?hash=<?php echo $_SESSION['userName'] ?>" alt="" />
|
||||
</div>
|
||||
<div class="message">
|
||||
<textarea name="post" placeholder="<?php echo _('Enter your post...') ?>" id="message"></textarea>
|
||||
<textarea name="post" placeholder="<?php echo _('Enter your post...') ?>"></textarea>
|
||||
</div>
|
||||
<div class="action">
|
||||
<div class="button" onclick="Home.post.add('#feed', '#message')"><?php echo _('Send') ?></div>
|
||||
<div class="button" onclick="ModulePost.add()"><?php echo _('Send') ?></div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -5,6 +5,6 @@
|
||||
</div>
|
||||
<div class="right">
|
||||
<?php include(PROJECT_DIR . '/application/controller/common/module/post.php') ?>
|
||||
<div class="feed" id="feed"></div>
|
||||
<?php include(PROJECT_DIR . '/application/controller/common/module/feed.php') ?>
|
||||
</div>
|
||||
</div>
|
||||
@ -31,51 +31,4 @@ a:active {
|
||||
|
||||
.container {
|
||||
margin-bottom: 64px
|
||||
}
|
||||
|
||||
.container .feed .item {
|
||||
padding: 16px;
|
||||
margin-bottom: 2px;
|
||||
color: #1c1d1e;
|
||||
background: rgb(238, 238, 238);
|
||||
border-radius: 3px;
|
||||
min-height: 84px;
|
||||
}
|
||||
|
||||
.container .feed .item .avatar {
|
||||
position: absolute;
|
||||
top: 19px;
|
||||
left: 19px;
|
||||
}
|
||||
|
||||
.container .feed .item .avatar img {
|
||||
border-radius: 50%;
|
||||
border: 2px #fff solid;
|
||||
}
|
||||
|
||||
.container .feed .item .message {
|
||||
padding-left: 73px;
|
||||
letter-spacing: 0.2px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.container .feed .item .message .retwist {
|
||||
border: 1px #ccc solid;
|
||||
padding: 8px;
|
||||
border-radius: 3px;
|
||||
background: #e6e6e6;
|
||||
margin-top: 8px
|
||||
}
|
||||
|
||||
.container .feed .item .message .quote {
|
||||
margin-top: 8px
|
||||
}
|
||||
|
||||
.container .item .message .info {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.container .item .message .info .time {
|
||||
float: right;
|
||||
font-weight: normal;
|
||||
}
|
||||
46
src/public/css/module/feed.css
Normal file
46
src/public/css/module/feed.css
Normal file
@ -0,0 +1,46 @@
|
||||
.moduleFeed .item {
|
||||
padding: 16px;
|
||||
margin-bottom: 2px;
|
||||
color: #1c1d1e;
|
||||
background: rgb(238, 238, 238);
|
||||
border-radius: 3px;
|
||||
min-height: 84px;
|
||||
}
|
||||
|
||||
.moduleFeed .item .avatar {
|
||||
position: absolute;
|
||||
top: 19px;
|
||||
left: 19px;
|
||||
}
|
||||
|
||||
.moduleFeed .item .avatar img {
|
||||
border-radius: 50%;
|
||||
border: 2px #fff solid;
|
||||
}
|
||||
|
||||
.moduleFeed .item .message {
|
||||
padding-left: 73px;
|
||||
letter-spacing: 0.2px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.moduleFeed .item .message .retwist {
|
||||
border: 1px #ccc solid;
|
||||
padding: 8px;
|
||||
border-radius: 3px;
|
||||
background: #e6e6e6;
|
||||
margin-top: 8px
|
||||
}
|
||||
|
||||
.moduleFeed .item .message .quote {
|
||||
margin-top: 8px
|
||||
}
|
||||
|
||||
.moduleFeed .item .message .info {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.moduleFeed .item .message .info .time {
|
||||
float: right;
|
||||
font-weight: normal;
|
||||
}
|
||||
@ -1,127 +1,12 @@
|
||||
var Home = {
|
||||
template: {
|
||||
feed: {
|
||||
item: {
|
||||
append: function(feed, userName, time, message, reTwist) {
|
||||
|
||||
if (reTwist === undefined || reTwist.length == 0) {
|
||||
var rt = false;
|
||||
} else {
|
||||
var rt = $(
|
||||
$('<div/>', {
|
||||
'class': 'retwist'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'info'
|
||||
}).append(
|
||||
reTwist.userName
|
||||
).append(
|
||||
$('<span/>', {
|
||||
'class': 'time'
|
||||
}).append(
|
||||
reTwist.time
|
||||
)
|
||||
)
|
||||
).append(reTwist.message)
|
||||
);
|
||||
}
|
||||
|
||||
$(feed).append(
|
||||
$('<div/>', {
|
||||
'class': 'item'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'avatar'
|
||||
}).append(
|
||||
$('<img/>', {
|
||||
'src': '/api/image?hash=' + userName,
|
||||
'alt': '',
|
||||
})
|
||||
)
|
||||
).append(
|
||||
$('<div/>', {
|
||||
'class': 'message'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'info'
|
||||
}).append(
|
||||
userName
|
||||
).append(
|
||||
$('<span/>', {
|
||||
'class': 'time'
|
||||
}).append(
|
||||
time
|
||||
)
|
||||
)
|
||||
).append(rt).append(
|
||||
$('<div/>', {
|
||||
'class': (message != '' ? 'quote' : '')
|
||||
}).append(message)
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
post: {
|
||||
add: function(feed, input) {
|
||||
$.ajax({
|
||||
url: 'api/post/add',
|
||||
type: 'POST',
|
||||
data: {
|
||||
message: $(input).val()
|
||||
},
|
||||
success: function (response) {
|
||||
|
||||
if (response.success) {
|
||||
|
||||
$(input).val('');
|
||||
|
||||
Home.post.get(feed, true);
|
||||
|
||||
} else {
|
||||
alert(response.message);
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
console.log(textStatus, errorThrown);
|
||||
}
|
||||
});
|
||||
},
|
||||
get: function(feed, reFresh) {
|
||||
$.ajax({
|
||||
url: 'api/post/get',
|
||||
type: 'POST',
|
||||
data: {},
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
|
||||
if (reFresh) {
|
||||
$(feed).html('');
|
||||
}
|
||||
|
||||
$(response.posts).each(function() {
|
||||
Home.template.feed.item.append(feed, this.userName, this.time, this.message, this.reTwist);
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
alert(response.message);
|
||||
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
console.log(textStatus, errorThrown);
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
Home.post.get('#feed', true);
|
||||
// Init modules
|
||||
ModuleMenu.init('/');
|
||||
ModuleFeed.load('#moduleFeed', true);
|
||||
|
||||
// Event listeners
|
||||
$(document).on('modulePost.add:success', function(/*event, response*/) {
|
||||
ModuleFeed.load('#moduleFeed', true);
|
||||
});
|
||||
|
||||
$('#moduleMenu > a[href="/"]').addClass('active');
|
||||
});
|
||||
92
src/public/js/module/feed.js
Normal file
92
src/public/js/module/feed.js
Normal file
@ -0,0 +1,92 @@
|
||||
var ModuleFeed = {
|
||||
template: {
|
||||
feed: {
|
||||
item: {
|
||||
append: function(feed, userName, time, message, reTwist) {
|
||||
if (reTwist === undefined || reTwist.length == 0) {
|
||||
var rt = false;
|
||||
} else {
|
||||
var rt = $(
|
||||
$('<div/>', {
|
||||
'class': 'retwist'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'info'
|
||||
}).append(
|
||||
reTwist.userName
|
||||
).append(
|
||||
$('<span/>', {
|
||||
'class': 'time'
|
||||
}).append(
|
||||
reTwist.time
|
||||
)
|
||||
)
|
||||
).append(reTwist.message)
|
||||
);
|
||||
}
|
||||
$(feed).append(
|
||||
$('<div/>', {
|
||||
'class': 'item'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'avatar'
|
||||
}).append(
|
||||
$('<img/>', {
|
||||
'src': '/api/image?hash=' + userName,
|
||||
'alt': '',
|
||||
})
|
||||
)
|
||||
).append(
|
||||
$('<div/>', {
|
||||
'class': 'message'
|
||||
}).append(
|
||||
$('<div/>', {
|
||||
'class': 'info'
|
||||
}).append(
|
||||
userName
|
||||
).append(
|
||||
$('<span/>', {
|
||||
'class': 'time'
|
||||
}).append(
|
||||
time
|
||||
)
|
||||
)
|
||||
).append(rt).append(
|
||||
$('<div/>', {
|
||||
'class': (message != '' ? 'quote' : '')
|
||||
}).append(message)
|
||||
)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
load: function(feed, reFresh) {
|
||||
$.ajax({
|
||||
url: 'api/post/get',
|
||||
type: 'POST',
|
||||
data: {},
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
|
||||
if (reFresh) {
|
||||
$(feed).html('');
|
||||
}
|
||||
|
||||
$(response.posts).each(function() {
|
||||
ModuleFeed.template.feed.item.append(feed, this.userName, this.time, this.message, this.reTwist);
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
alert(response.message);
|
||||
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
console.log(textStatus, errorThrown);
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
5
src/public/js/module/menu.js
Normal file
5
src/public/js/module/menu.js
Normal file
@ -0,0 +1,5 @@
|
||||
var ModuleMenu = {
|
||||
init: function(href) {
|
||||
$('#moduleMenu a[href="' + href + '"]').addClass('active');
|
||||
}
|
||||
}
|
||||
30
src/public/js/module/post.js
Normal file
30
src/public/js/module/post.js
Normal file
@ -0,0 +1,30 @@
|
||||
var ModulePost = {
|
||||
add: function() {
|
||||
|
||||
var input = $('#modulePost textarea');
|
||||
|
||||
$.ajax({
|
||||
url: 'api/post/add',
|
||||
type: 'POST',
|
||||
data: {
|
||||
message: input.val()
|
||||
},
|
||||
success: function (response) {
|
||||
|
||||
if (response.success) {
|
||||
|
||||
input.val('');
|
||||
|
||||
$(document).trigger('modulePost.add:success', [response]);
|
||||
|
||||
} else {
|
||||
|
||||
alert(response.message);
|
||||
}
|
||||
},
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
console.log(textStatus, errorThrown);
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user