supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #83 from xPaw/custom-css

Browse Source 
Add an ability to set custom css
This commit is contained in:
Max-P 2016-02-29 01:34:23 -05:00
commit 5242f4c8ee
2 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/index.html
View File

@ -15,6 +15,7 @@
<link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
<link id="theme" rel="stylesheet" href="<%= theme %>"> <link id="theme" rel="stylesheet" href="<%= theme %>">
<style id="user-specified-css"></style>
<link rel="shortcut icon" href="img/favicon.png" data-other="img/favicon-notification.png" data-toggled="false" id="favicon"> <link rel="shortcut icon" href="img/favicon.png" data-other="img/favicon-notification.png" data-toggled="false" id="favicon">
<link rel="apple-touch-icon" sizes="120x120" href="img/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" sizes="120x120" href="img/apple-touch-icon-120x120.png">
@ -289,6 +290,12 @@
</form> </form>
</div> </div>
<% } %> <% } %>
<div class="col-sm-12">
<h2>Custom Stylesheet</h2>
</div>
<div class="col-sm-12">
<textarea class="input" name="userStyles" id="user-specified-css-input" placeholder="You can override any style with CSS here"></textarea>
</div>
<div class="col-sm-12"> <div class="col-sm-12">
<h2>About The Lounge</h2> <h2>About The Lounge</h2>
</div> </div>

21
client/js/lounge.js
View File

@ -424,6 +424,7 @@ $(function() {
users.data("nicks", nicks); users.data("nicks", nicks);
}); });
var userStyles = $("#user-specified-css");
var settings = $("#settings"); var settings = $("#settings");
var options = $.extend({ var options = $.extend({
badge: false, badge: false,
@ -438,19 +439,34 @@ $(function() {
thumbnails: true, thumbnails: true,
quit: true, quit: true,
notifyAllMessages: false, notifyAllMessages: false,
userStyles: userStyles.text(),
}, JSON.parse(window.localStorage.getItem("settings"))); }, JSON.parse(window.localStorage.getItem("settings")));
for (var i in options) { for (var i in options) {
if (i === "userStyles") {
if (!/[\?&]nocss/.test(window.location.search)) {
$(document.head).find("#user-specified-css").html(options[i]);
}
settings.find("#user-specified-css-input").val(options[i]);
continue;
}
if (options[i]) { if (options[i]) {
settings.find("input[name=" + i + "]").prop("checked", true); settings.find("input[name=" + i + "]").prop("checked", true);
} }
} }
settings.on("change", "input", function() { settings.on("change", "input, textarea", function() {
var self = $(this); var self = $(this);
var name = self.attr("name"); var name = self.attr("name");
if (self.attr("type") === "checkbox") {
options[name] = self.prop("checked"); options[name] = self.prop("checked");
} else {
options[name] = self.val();
}
window.localStorage.setItem("settings", JSON.stringify(options)); window.localStorage.setItem("settings", JSON.stringify(options));
if ([ if ([
"join", "join",
"mode", "mode",
@ -465,6 +481,9 @@ $(function() {
if (name === "colors") { if (name === "colors") {
chat.toggleClass("no-colors", !self.prop("checked")); chat.toggleClass("no-colors", !self.prop("checked"));
} }
if (name === "userStyles") {
$(document.head).find("#user-specified-css").html(options[name]);
}
}).find("input") }).find("input")
.trigger("change"); .trigger("change");