Add editors for CSS and JS

This commit is contained in:
calzoneman 2013-05-15 11:34:27 -04:00
parent b3cb87aab6
commit a8d8f346d4
11 changed files with 144 additions and 5 deletions

View File

@ -75,6 +75,9 @@ var Channel = function(name) {
time: "00:00"
};
this.css = "";
this.js = "";
Database.loadChannel(this);
if(this.registered) {
this.loadDump();
@ -152,6 +155,9 @@ Channel.prototype.loadDump = function() {
for(var i = 0; i < this.chatbuffer.length; i++) {
this.sendAll("chatMsg", this.chatbuffer[i]);
}
this.css = data.css || "";
this.js = data.js || "";
this.sendAll("channelCSSJS", {css: this.css, js: this.js});
setTimeout(function() { incrementalDump(this); }, 300000);
}
catch(e) {
@ -175,7 +181,9 @@ Channel.prototype.saveDump = function() {
motd: this.motd,
logins: this.logins,
openqueue: this.openqueue,
chatbuffer: this.chatbuffer
chatbuffer: this.chatbuffer,
css: this.css,
js: this.js
};
var text = JSON.stringify(dump);
fs.writeFileSync("chandump/" + this.name, text);
@ -378,6 +386,7 @@ Channel.prototype.userJoin = function(user) {
user.socket.emit("queueLock", {locked: !this.openqueue});
this.sendUserlist(user);
this.sendRecentChat(user);
user.socket.emit("channelCSSJS", {css: this.css, js: this.js});
if(this.poll) {
user.socket.emit("newPoll", this.poll.packUpdate());
}
@ -1225,6 +1234,38 @@ Channel.prototype.tryUpdateOptions = function(user, data) {
this.broadcastOpts();
}
Channel.prototype.trySetCSS = function(user, data) {
if(!Rank.hasPermission(user, "setcss")) {
return;
}
var css = data.css || "";
if(css.length > 20000) {
css = css.substring(0, 20000);
}
this.css = css;
this.sendAll("channelCSSJS", {
css: this.css,
js: this.js
});
}
Channel.prototype.trySetJS = function(user, data) {
if(!Rank.hasPermission(user, "setjs")) {
return;
}
var js = data.js || "";
if(js.length > 20000) {
js = js.substring(0, 20000);
}
this.js = js;
this.sendAll("channelCSSJS", {
css: this.css,
js: this.js
});
}
Channel.prototype.updateMotd = function(motd) {
var html = motd.replace(/\n/g, "<br>");
//html = this.filterMessage(html);

View File

@ -2,7 +2,7 @@
"author": "Calvin Montgomery",
"name": "CyTube",
"description": "Online media synchronizer and chat",
"version": "1.7.4",
"version": "1.7.5",
"repository": {
"url": "http://github.com/calzoneman/sync"
},

View File

@ -21,6 +21,8 @@ var permissions = {
registerChannel : exports.Owner,
acl : exports.Owner,
chatFilter : exports.Owner,
setcss : exports.Owner,
setjs : exports.Owner,
queue : exports.Moderator,
assignLeader : exports.Moderator,
kick : exports.Moderator,

View File

@ -9,7 +9,7 @@ The above copyright notice and this permission notice shall be included in all c
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
const VERSION = "1.7.4";
const VERSION = "1.7.5";
var fs = require("fs");
var Logger = require("./logger.js");

12
user.js
View File

@ -323,6 +323,18 @@ User.prototype.initCallbacks = function() {
}
}.bind(this));
this.socket.on("setChannelCSS", function(data) {
if(this.channel != null) {
this.channel.trySetCSS(this, data);
}
}.bind(this));
this.socket.on("setChannelJS", function(data) {
if(this.channel != null) {
this.channel.trySetJS(this, data);
}
}.bind(this));
this.socket.on("chatFilter", function(data) {
if(this.channel != null) {
this.channel.tryChangeFilter(this, data);

View File

@ -202,10 +202,14 @@ html, body {
text-align: center;
}
#motdtext {
#motdtext, #csstext, #jstext {
width: 100%;
}
#csstext, #jstext {
font-family: Monospace;
}
#queue_next, #queue_end, #library_search, #youtube_search {
width: 50%;
}

View File

@ -227,6 +227,29 @@ Callbacks = {
rebuildPlaylist();
},
channelCSSJS: function(data) {
console.log("recv cssjs", data);
$("#chancss").remove();
$("#chanjs").remove();
$("#csstext").val(data.css);
$("#jstext").val(data.js);
if(data.css) {
$("<style/>").attr("type", "text/css")
.attr("id", "chancss")
.text(data.css)
.appendTo($("head"));
}
if(data.js) {
$("<script/>").attr("type", "text/javascript")
.attr("id", "chanjs")
.text(data.js)
.appendTo($("body"));
}
},
banlist: function(data) {
var entries = data.entries;
var tbl = $("#banlist table");

View File

@ -413,6 +413,36 @@ $("#show_motdeditor").click(function() {
$("#motdeditor").show();
});
$("#show_csseditor").click(function() {
$("#modnav li").each(function() {
$(this).removeClass("active");
});
$(".modonly").hide();
$("#show_csseditor").parent().addClass("active");
$("#csseditor").show();
});
$("#updatecss").click(function() {
socket.emit("setChannelCSS", {
css: $("#csstext").val()
});
});
$("#show_jseditor").click(function() {
$("#modnav li").each(function() {
$(this).removeClass("active");
});
$(".modonly").hide();
$("#show_jseditor").parent().addClass("active");
$("#jseditor").show();
});
$("#updatejs").click(function() {
socket.emit("setChannelJS", {
js: $("#jstext").val()
});
});
$("#show_filtereditor").click(function() {
if(RANK >= Rank.Owner) {
$("#modnav li").each(function() {

View File

@ -654,6 +654,14 @@ function handleRankChange() {
$("#clearplaylist").css("display", "none");
$("#shuffleplaylist").css("display", "none");
}
if(RANK >= Rank.Owner) {
$("#show_jseditor").parent().css("display", "");
$("#show_csseditor").parent().css("display", "");
}
else {
$("#show_jseditor").parent().css("display", "none");
$("#show_csseditor").parent().css("display", "none");
}
if(RANK >= 10) {
$("#drop_channel").parent().css("display", "");
}

View File

@ -54,7 +54,6 @@ Media.prototype.nullPlayer = function() {
Media.prototype.initYouTube = function() {
this.removeOld();
console.log("init YouTube");
this.player = new YT.Player("ytapiplayer", {
height: VHEIGHT,
width: VWIDTH,

View File

@ -134,6 +134,12 @@
<li>
<a href="javascript:void(0)" id="show_motdeditor">MOTD</a>
</li>
<li style="display: none">
<a href="javascript:void(0)" id="show_csseditor">CSS Editor</a>
</li>
<li style="display: none">
<a href="javascript:void(0)" id="show_jseditor">JS Editor</a>
</li>
<li>
<a href="javascript:void(0)" id="show_filtereditor">Chat Filters</a>
</li>
@ -242,6 +248,20 @@
<button class="btn btn-primary" id="updatemotd">Update</button>
</div>
</div>
<div class="row modonly" id="csseditor" style="display: none;">
<div class="span12">
<p>Max 20KB. If you need more CSS, host the file somewhere and use the External CSS channel option</p>
<textarea rows="10" id="csstext"></textarea>
<button class="btn btn-primary" id="updatecss">Update</button>
</div>
</div>
<div class="row modonly" id="jseditor" style="display: none;">
<div class="span12">
<p>Max 20KB. If you need more JS, host the file somewhere and use the External JS channel option</p>
<textarea rows="10" id="jstext"></textarea>
<button class="btn btn-primary" id="updatejs">Update</button>
</div>
</div>
<div class="row modonly" id="filtereditor" style="display: none;">
<div class="span12">
<p><strong>Note:</strong> if you just want simple word replacement, like emoticons, put the word in the Regex field, use <code>ig</code> for the flags, and put the replacement in the Replacement field.</p>