Merge branch 'master' of github.com:psychobunny/node-forum

Conflicts:
	public/templates/header.tpl
v1.18.x
Julian Lam 12 years ago
commit 9ca749d62f

@ -41,6 +41,10 @@ body {
}
}
button, a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.none {
display: none !important;
}
@ -583,15 +587,15 @@ body .navbar .nodebb-inline-block {
}
#mobile-menu {
#mobile-menu-btn {
button {
color: #eee;
padding: 10px;
text-shadow: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
}
#mobile-menu-overlay {
display: none;
background: rgba(0, 0, 0, 0.85);
position: fixed;
@ -608,9 +612,9 @@ body .navbar .nodebb-inline-block {
-ms-transition: opacity 150ms ease;
-o-transition: opacity 150ms ease;
transition: opacity 150ms ease;
z-index: -1;
&.menu-visible {
display: block;
z-index: 99;
opacity: 1;
}
@ -643,4 +647,16 @@ body .navbar .nodebb-inline-block {
}
}
}
#mobile-sidebar {
height: 100%;
position: absolute;
left: 100%;
top: 0px;
overflow: hidden;
margin-top: 60px;
}

@ -48,6 +48,7 @@ var ajaxify = {};
jQuery('#footer, #content').fadeOut(100);
templates.flush();
templates.load_template(function() {
exec_body_scripts(content);

@ -191,9 +191,17 @@ var socket,
socket.emit('api:user.get_online_users', uids);
}
// here is where all modules' onNavigate should be called, I think.
require(['mobileMenu'], function(mobileMenu) {
mobileMenu.onNavigate();
});
populate_online_users();
setTimeout(function() {
window.scrollTo(0, 1); // rehide address bar on mobile after page load completes.
}, 100);
}
socket.on('api:user.get_online_users', function(users) {
@ -232,5 +240,64 @@ var socket,
}
}
}, false);
addTouchEvents();
});
function addTouchEvents() {
return; // later.
// click simulation just for testing/sanity purposes.
var el = jQuery("#content"),
sidebar = jQuery('#mobile-sidebar'),
width = el.width();
function onTouchMove(ev) {
var coordinates = window.event ? window.event.touches[0] : ev.touches[0];
el.css({
marginLeft: -parseInt(width - coordinates.pageX) + 'px',
paddingRight: parseInt(width - coordinates.pageX) + 'px'});
sidebar.css({
marginLeft: -parseInt(width - coordinates.pageX) + 'px',
width: parseInt(width - coordinates.pageX) + 'px'
});
}
function onMouseMove(ev) {
ev.touches = [{pageX: ev.pageX, pageY: ev.pageY}];
onTouchMove(ev);
}
function onTouchEnd() {
el.css({
marginLeft: '0px',
paddingRight: '0px'
});
sidebar.css({
marginLeft: '0px',
width: '0px'
});
}
el.on('touchmove', onTouchMove);
el.on('mousedown', function() {
el.on('mousemove', onMouseMove);
});
el.on('touchend', onTouchEnd);
el.on('mouseup', function() {
el.off('mousemove');
onTouchEnd();
});
}
}());

@ -4,7 +4,8 @@ define(function() {
var categories = null,
overlay = null,
menuBtn = null;
menuBtn = null,
postBtn = null;
function loadCategories(callback) {
@ -63,9 +64,37 @@ define(function() {
}
mobileMenu.onNavigate = function() {
var cid = templates.get('category_id'),
tid = templates.get('topic_id');
if (cid) {
postBtn.style.display = 'inline-block';
postBtn.onclick = function() {
require(['composer'], function(cmp) {
cmp.push(0, cid);
});
};
postBtn.children[0].className = 'icon-plus icon-2x';
} else if (tid) {
postBtn.style.display = 'inline-block';
postBtn.onclick = function() {
require(['composer'], function(cmp) {
cmp.push(tid);
});
};
postBtn.children[0].className = 'icon-reply icon-2x'
} else {
postBtn.style.display = 'none';
}
};
mobileMenu.init = function() {
overlay = overlay || document.getElementById('mobile-menu-overlay');
menuBtn = menuBtn || document.getElementById('mobile-menu-btn');
postBtn = postBtn || document.getElementById('mobile-post-btn');
menuBtn.onclick = function() {
animateIcons();
@ -73,9 +102,11 @@ define(function() {
loadCategories(displayCategories);
mobileMenu.onNavigate();
}
return {
init: mobileMenu.init
init: mobileMenu.init,
onNavigate: mobileMenu.onNavigate
}
});

@ -169,7 +169,7 @@
if (!templates[tpl_url] || !template_data) return;
document.getElementById('content').innerHTML = templates[tpl_url].parse(JSON.parse(template_data));
jQuery('#content [template-variable]').each(function(index, element) {
templates.set(element.getAttribute('template-variable'), element.value);
});
@ -181,6 +181,10 @@
}
templates.flush = function() {
parsed_variables = {};
}
templates.get = function(key) {
return parsed_variables[key];
}

@ -45,7 +45,7 @@
<hr />
<button id="new_post" class="btn btn-primary btn-large {show_category_features}">New Topic</button>
</div>
<div class="span3 {show_category_features} category-sidebar">
<div class="span3 {show_category_features} category-sidebar mobile-sidebar">
<div class="sidebar-block img-polaroid">
<div class="block-header">
<a target="_blank" href="../{category_id}.rss"><i class="icon-rss-sign icon-2x"></i></a>&nbsp;

@ -1,6 +1,10 @@
</div><!--END container -->
<div id="mobile-sidebar">
</div>
<!-- START Forum Info -->
<div id="footer" class="container hidden-phone" style="padding-top: 50px; display: none">
<div class="alert alert-info">
@ -13,6 +17,7 @@
<div id="mobile-menu">
<button id="mobile-menu-btn" type="button" class="btn btn-none"><i class="icon-th icon-2x"></i></button>
<button id="mobile-post-btn" type="button" class="btn btn-none"><i class="icon-plus icon-2x"></i></button>
</div>
<script type="text/javascript" src="/src/forum/footer.js"></script>
<!-- END Forum Info -->

@ -7,6 +7,7 @@
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<link href="{cssSrc}" rel="stylesheet" media="screen">
<link href="/vendor/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="/vendor/fontawesome/css/font-awesome.min.css">

@ -29,14 +29,14 @@
<hr />
<div class="topic-buttons pull-left">
<a href="/users/{main_posts.username}" class="username-field btn">{main_posts.username}</a>
<a target="_blank" class="btn" href="../{topic_id}.rss"><i class="icon-rss-sign"></i></a>
<a href="/users/{main_posts.username}" class="username-field btn hidden-phone">{main_posts.username}</a>
<a target="_blank" class="btn hidden-phone" href="../{topic_id}.rss"><i class="icon-rss-sign"></i></a>
<button id="ids_{main_posts.pid}_{main_posts.uid}" class="btn edit {main_posts.display_moderator_tools}" type="button"><i class="icon-pencil"></i></button>
<button id="ids_{main_posts.pid}_{main_posts.uid}" class="btn delete {main_posts.display_moderator_tools}" type="button"><i class="icon-trash"></i></button>
<button id="quote_{main_posts.pid}_{main_posts.uid}" class="btn quote" type="button"><i class="icon-quote-left"></i></button>
<button id="favs_{main_posts.pid}_{main_posts.uid}" class="favourite btn" type="button"><span class="post_rep_{main_posts.pid}">Favourite {main_posts.post_rep} </span><i class="{main_posts.fav_star_class}"></i></button>
<button id="post_reply" class="btn btn-primary btn post_reply" type="button">Reply <i class="icon-reply"></i></button>
<button id="post_reply" class="btn btn-primary btn post_reply hidden-phone" type="button">Reply <i class="icon-reply"></i></button>
</div>
<div style="clear:both; margin-bottom: 10px;"></div>
@ -46,6 +46,9 @@
<img class="hidden-desktop" src="{main_posts.gravatar}?s=10&default=identicon" align="left" /> posted by <strong><a class="" href="/users/{main_posts.username}">{main_posts.username}</a></strong> {main_posts.relativeTime} ago
<span class="{main_posts.edited-class} hidden-phone">| last edited by <strong><a href="/users/{main_posts.editor}">{main_posts.editor}</a></strong> {main_posts.relativeEditTime} ago</span>
<span class="{main_posts.edited-class}"><i class="icon-edit visible-phone" title="edited by {main_posts.editor} {main_posts.relativeEditTime} ago"></i></span>
<div class="post-buttons visible-phone">
<div class="post_reply"><i class="icon-reply"></i></div>
</div>
</div>
</div>
</div>

Loading…
Cancel
Save