started work on noscript tags in pages (but blocked by template bug with block processing), allowed reverting of theme in ACP

introducing mixins css file
This commit is contained in:
Julian Lam
2013-06-06 15:34:12 -04:00
parent 49ea40f6ee
commit a09cfd9304
13 changed files with 216 additions and 148 deletions

4
app.js
View File

@@ -49,7 +49,9 @@ fs.readFile(path.join(__dirname, 'config.json'), function(err, data) {
templates.init([ templates.init([
'header', 'footer', 'logout', 'admin/header', 'admin/footer', 'admin/index', 'header', 'footer', 'logout', 'admin/header', 'admin/footer', 'admin/index',
'emails/reset', 'emails/reset_plaintext', 'emails/email_confirm', 'emails/email_confirm_plaintext', 'emails/reset', 'emails/reset_plaintext', 'emails/email_confirm', 'emails/email_confirm_plaintext',
'emails/header', 'emails/footer', 'install/header', 'install/footer', 'install/redis' 'emails/header', 'emails/footer', 'install/header', 'install/footer', 'install/redis',
'noscript/topic'
]); ]);
templates.ready(function() { templates.ready(function() {

View File

@@ -1,13 +1,4 @@
.inline-block { @import "mixins";
display: inline-block;
*display: inline;
zoom: 1;
}
.pointer {
cursor: pointer;
*cursor: hand;
}
.entry-row { .entry-row {
border-radius: 10px; border-radius: 10px;
@@ -58,7 +49,7 @@
li { li {
padding: 10px 16px; padding: 10px 16px;
margin: 0.25em 1em; margin: 0.25em 1em;
.inline-block; list-style-type: none;
.pointer; .pointer;
-webkit-border-radius: 10px; -webkit-border-radius: 10px;
-moz-border-radius: 10px; -moz-border-radius: 10px;
@@ -69,6 +60,19 @@
-o-transition: background-color 250ms linear; -o-transition: background-color 250ms linear;
transition: background-color 250ms linear; transition: background-color 250ms linear;
img {
max-width: 150px;
float: left;
}
h4, p {
margin-left: 170px;
}
p {
font-size: 0.9em;
}
&:hover { &:hover {
background-color: rgba(128, 128, 128, 0.2); background-color: rgba(128, 128, 128, 0.2);
} }

23
public/css/mixins.less Normal file
View File

@@ -0,0 +1,23 @@
.no-select {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.pointer {
cursor: pointer;
*cursor: hand;
}
.inline-block {
display: inline-block;
*display: inline;
zoom: 1;
}
.clear {
clear: both;
}

View File

@@ -1,22 +1,4 @@
.no-select { @import "mixins";
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.pointer {
cursor: pointer;
*cursor: hand;
}
.inline-block {
display: inline-block;
*display: inline;
zoom: 1;
}
body { body {
/*background: #fdfdfd;*/ // port to default theme when it is implemented. /*background: #fdfdfd;*/ // port to default theme when it is implemented.

View File

@@ -0,0 +1,64 @@
nodebb_admin.themes = {
render: function(bootswatch) {
var themeFrag = document.createDocumentFragment(),
themeEl = document.createElement('li'),
themeContainer = document.querySelector('#content .themes'),
numThemes = bootswatch.themes.length;
for(var x=0;x<numThemes;x++) {
var theme = bootswatch.themes[x];
themeEl.setAttribute('data-css', theme.cssMin);
themeEl.setAttribute('data-theme', theme.name);
themeEl.innerHTML = '<img src="' + theme.thumbnail + '" />' +
'<div>' +
'<div class="pull-right">' +
'<button class="btn btn-primary" data-action="use">Use</button> ' +
'<button class="btn" data-action="preview">Preview</button>' +
'</div>' +
'<h4>' + theme.name + '</h4>' +
'<p>' + theme.description + '</p>' +
'</div>' +
'<div class="clear">';
themeFrag.appendChild(themeEl.cloneNode(true));
}
themeContainer.innerHTML = '';
themeContainer.appendChild(themeFrag);
}
};
(function() {
var scriptEl = document.createElement('script');
scriptEl.src = 'http://api.bootswatch.com?callback=nodebb_admin.themes.render';
document.body.appendChild(scriptEl);
var themeContainer = document.querySelector('#content .themes');
themeContainer.addEventListener('click', function(e) {
if (e.target.hasAttribute('data-action')) {
switch(e.target.getAttribute('data-action')) {
case 'preview':
var cssSrc = $(e.target).parents('li').attr('data-css'),
cssEl = document.getElementById('base-theme');
cssEl.href = cssSrc;
break;
case 'use':
var parentEl = $(e.target).parents('li'),
cssSrc = parentEl.attr('data-css'),
cssName = parentEl.attr('data-theme');
socket.emit('api:config.set', {
key: 'theme:id', value: 'bootswatch:' + cssName
});
socket.emit('api:config.set', {
key: 'theme:src', value: cssSrc
});
break;
}
}
}, false);
var revertEl = document.getElementById('revert_theme');
revertEl.addEventListener('click', function() {
nodebb_admin.remove('theme:id');
nodebb_admin.remove('theme:src');
}, false);
})();

View File

@@ -70,6 +70,12 @@
socket.emit('api:config.set', { key: key, value: value }); socket.emit('api:config.set', { key: key, value: value });
} }
}); });
},
// save: function(key, value) {
// socket.emit('api:config.set', { key: key, value: value });
// },
remove: function(key) {
socket.emit('api:config.remove', key);
} }
}; };

View File

@@ -12,6 +12,13 @@
<script type="text/javascript" src="/src/app.js"></script> <script type="text/javascript" src="/src/app.js"></script>
<script type="text/javascript" src="/src/templates.js"></script> <script type="text/javascript" src="/src/templates.js"></script>
<script type="text/javascript" src="/src/ajaxify.js"></script> <script type="text/javascript" src="/src/ajaxify.js"></script>
<script src="/vendor/requirejs/require.js"></script>
<script>
require.config({
baseUrl: "/src/modules",
waitSeconds: 3
});
</script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="/css/style.css" /> <link rel="stylesheet" type="text/css" href="/css/style.css" />

View File

@@ -1,71 +1,18 @@
<h1>Themes</h1> <h1>Themes</h1>
<hr /> <hr />
<h3>Bootswatch Themes</h3>
<p> <p>
NodeBB Themes are powered by Bootswatch, a repository containing hundreds of themes built NodeBB Themes are powered by Bootswatch, a repository containing themes built
with Bootstrap as a base theme. with Bootstrap as a base theme.
</p> </p>
<ul class="themes"> <ul class="themes">
<li><i class="icon-refresh icon-spin"></i> Loading Themes</li> <li><i class="icon-refresh icon-spin"></i> Loading Themes</li>
</ul> </ul>
<script> <h3>Revert to Default</h3>
nodebb_admin.themes = { <p class="alert">
render: function(bootswatch) { <button class="btn btn-warning" id="revert_theme">Revert</button> This will remove any custom theme applied to your NodeBB, and restore the base theme.
console.log(bootswatch); </p>
var themeFrag = document.createDocumentFragment(),
themeEl = document.createElement('li'),
themeContainer = document.querySelector('#content .themes'),
numThemes = bootswatch.themes.length;
for(var x=0;x<numThemes;x++) { <script type="text/javascript" src="/src/forum/admin/themes.js"></script>
var theme = bootswatch.themes[x];
themeEl.setAttribute('data-css', theme.cssMin);
themeEl.setAttribute('data-theme', theme.name);
themeEl.innerHTML = '<img src="' + theme.thumbnail + '" />' +
'<div>' +
'<div class="pull-right">' +
'<button class="btn btn-primary" data-action="use">Use</button> ' +
'<button class="btn" data-action="preview">Preview</button>' +
'</div>' +
'<h4>' + theme.name + '</h4>' +
'<p>' + theme.description + '</p>' +
'</div>';
themeFrag.appendChild(themeEl.cloneNode(true));
}
themeContainer.innerHTML = '';
themeContainer.appendChild(themeFrag);
}
};
(function() {
var scriptEl = document.createElement('script');
scriptEl.src = 'http://api.bootswatch.com?callback=nodebb_admin.themes.render';
document.body.appendChild(scriptEl);
var themeContainer = document.querySelector('#content .themes');
themeContainer.addEventListener('click', function(e) {
if (e.target.hasAttribute('data-action')) {
switch(e.target.getAttribute('data-action')) {
case 'preview':
var cssSrc = $(e.target).parents('li').attr('data-css'),
cssEl = document.getElementById('base-theme');
cssEl.href = cssSrc;
break;
case 'use':
var parentEl = $(e.target).parents('li'),
cssSrc = parentEl.attr('data-css'),
cssName = parentEl.attr('data-theme');
socket.emit('api:config.set', {
key: 'theme:id', value: 'bootswatch:' + cssName
});
socket.emit('api:config.set', {
key: 'theme:src', value: cssSrc
});
break;
}
}
}, false);
})();
</script>

View File

@@ -0,0 +1,15 @@
<div class="alert alert-error">
<p>
Your browser does not seem to support javascript. As a result, your viewing experience will be diminished.
</p>
<p>
Please download a browser that supports javascript, or enable it, if it disabled (i.e. NoScript).
</p>
</div>
<ul>
<!-- BEGIN posts -->
<li>
</li>
<!-- END posts -->
</ul>

View File

@@ -37,6 +37,9 @@ var utils = require('./../public/src/utils.js'),
RDB.hset('config', field, value, function(err, res) { RDB.hset('config', field, value, function(err, res) {
callback(err); callback(err);
}); });
},
remove: function(field) {
RDB.hdel('config', field);
} }
} }
}(exports)); }(exports));

View File

@@ -184,6 +184,16 @@ marked.setOptions({
}); });
} }
Topics.get_posts_noscript = function(tid, current_user, callback) {
// Topics.get_topic(tid, current_user, function() {
callback([
{
foo: 'bar'
}
]);
// });
}
Topics.get_cid_by_tid = function(tid, callback) { Topics.get_cid_by_tid = function(tid, callback) {
RDB.get(schema.topics(tid).cid, function(err, cid) { RDB.get(schema.topics(tid).cid, function(err, cid) {
if (cid && parseInt(cid) > 0) { if (cid && parseInt(cid) > 0) {

View File

@@ -114,10 +114,11 @@ var express = require('express'),
var topic_url = tid + (req.params.slug ? '/' + req.params.slug : ''); var topic_url = tid + (req.params.slug ? '/' + req.params.slug : '');
topics.get_cid_by_tid(tid, function(cid) { topics.get_posts_noscript(tid, ((req.user) ? req.user.uid : 0), function(posts) {
res.send( res.send(
build_header() + build_header() +
'<script>templates.ready(function(){ajaxify.go("topic/' + topic_url + '");});</script>' + '\n\t<noscript>\n\t\t' + templates['noscript/topic'] + '\n\t</noscript>' +
'\n\t<script>templates.ready(function(){ajaxify.go("topic/' + topic_url + '");});</script>' +
templates['footer'] templates['footer']
); );
}); });

View File

@@ -307,6 +307,10 @@ var SocketIO = require('socket.io').listen(global.server, { log:false }),
}); });
}); });
socket.on('api:config.remove', function(key) {
meta.config.remove(key);
});
socket.on('api:composer.push', function(data) { socket.on('api:composer.push', function(data) {
if (uid > 0) { if (uid > 0) {
if (parseInt(data.tid) > 0) { if (parseInt(data.tid) > 0) {