Skip to content

Commit

Permalink
refactor client files adding
Browse files Browse the repository at this point in the history
  • Loading branch information
Shane Osbourne committed Jan 23, 2015
1 parent f6de440 commit c983e1f
Show file tree
Hide file tree
Showing 3 changed files with 102 additions and 66 deletions.
28 changes: 28 additions & 0 deletions lib/plugins/remote-debug/client-files.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
var css = {
"pesticide": {
type: "css",
id: "__browser-sync-pesticide__",
active: false,
file: __dirname + "/css/pesticide.min.css",
title: "CSS Outlining",
served: false,
name: "pesticide",
src: "/browser-sync/pesticide.css",
tagline: "Add simple CSS outlines to all elements. (powered by <a href=\"http://pesticide.io\">Pesticide.io</a>)",
hidden: ""
},
pesticideDepth: {
type: "css",
id: "__browser-sync-pesticidedepth__",
active: false,
file: __dirname + "/css/pesticide-depth.css",
title: "CSS Depth outlining",
served: false,
name: "pesticide-depth",
src: "/browser-sync/pesticide-depth.css",
tagline: "Add CSS box-shadows to all elements. (powered by <a href=\"http://pesticide.io\">Pesticide.io</a>)",
hidden: ""
}
};

module.exports.css = css;
22 changes: 14 additions & 8 deletions lib/plugins/remote-debug/remote-debug.client.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@
var ctrl = this;
ctrl.options = options;
ctrl.section = pagesConfig[SECTION_NAME];

ctrl.items = [
{
name: "weinre",
Expand All @@ -33,24 +32,31 @@
{
name: "pesticide",
title: "CSS Outlining",
item: ctrl.options["pesticide"],
item: ctrl.options["clientFiles"]["pesticide"],
tagline: "Add simple CSS outlines to all elements. (powered by <a href=\"http://pesticide.io\">Pesticide.io</a>)"
}
];

ctrl.toggleDebugger = function (item) {
if (item.name === "weinre") {
return ctrl.toggleWeinre(item);
}
if (item.active) {
return ctrl.enable(item.name);
return ctrl.enable(item);
}
return ctrl.disable(item.name);
return ctrl.disable(item);
};

ctrl.toggleWeinre = function (item) {
Socket.emit("cp:weinre:toggle", item.active);
};

ctrl.enable = function (name) {
Socket.emit("cp:%s:toggle".replace("%s", name), true);
ctrl.enable = function (item) {
Socket.emit("cp:clientfile:enable", item);
};

ctrl.disable = function (name) {
Socket.emit("cp:%s:toggle".replace("%s", name), false);
ctrl.disable = function (item) {
Socket.emit("cp:clientfile:disable", item);
};
}

Expand Down
118 changes: 60 additions & 58 deletions lib/plugins/remote-debug/remote-debug.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,7 @@ var url = require("url");
var path = require("path");
var fs = require("fs");
var Immutable = require("immutable");
var pesticide = fs.readFileSync(__dirname + "/css/pesticide.min.css", "utf-8");
var pesticideDepth = fs.readFileSync(__dirname + "/css/pesticide-depth.css", "utf-8");
var clientFiles = require("./client-files");

const PLUGIN_NAME = "Remote Debug";

Expand All @@ -14,12 +13,6 @@ const PLUGIN_NAME = "Remote Debug";
var timestamp;
var weinreApp;

const PESTICIDE_NAME = "pesticide";
const PESTICIDE_DEPTH_NAME = "pesticidedepth";
const PESTICIDE_URL = "/browser-sync/pesticide.css";
const PESTICIDE_DEPTH_URL = "/browser-sync/pesticide-depth.css";
const PESTICIDE_ID = "__browser-sync-pesticide__";
const PESTICIDE_DEPTH_ID = "__browser-sync-pesticidedepth__";
const WEINRE_NAME = "weinre";
const WEINRE_PORT = 8080;
const WEINRE_ID = "#browsersync";
Expand Down Expand Up @@ -54,16 +47,13 @@ module.exports = {
var socket = bs.io.of(cp.config.getIn(["socket", "namespace"]));
var clients = bs.io.of(bs.options.getIn(["socket", "namespace"]));

bs.setOption("clientFiles", Immutable.fromJS(clientFiles.css));

var hostUrl = getHostUrl(cp, bs);

weinreTargetUrl.hostname = hostUrl.hostname;
weinreClientUrl.hostname = hostUrl.hostname;

bs.setOption(PESTICIDE_NAME, Immutable.fromJS({
name: PESTICIDE_NAME,
active: false
}));

bs.setOption(WEINRE_NAME, Immutable.fromJS({
name: WEINRE_NAME,
active: false,
Expand All @@ -74,12 +64,15 @@ module.exports = {
}));

socket.on("connection", function (client) {
client.on("cp:weinre:toggle", toggleDebugger.bind(null, socket, clients, cp, bs));
client.on("cp:pesticide:toggle", togglePesticide.bind(null, socket, clients, cp, bs));
client.on("cp:weinre:toggle", toggleWeinre.bind(null, socket, clients, cp, bs));
client.on("cp:clientfile:enable", enableClientFile.bind(null, clients, cp, bs));
client.on("cp:clientfile:disable", disableClientFile.bind(null, clients, cp, bs));
});

clients.on("connection", function (client) {
updateClients(clientScripts, client);
clientScripts.map(function (item) {
addElement(clients, item);
});
});
},
/**
Expand Down Expand Up @@ -136,55 +129,53 @@ function getRemoteUrl(targetPath, cp, bs) {
return targetPath;
}

var serving = [];

/**
* @param socket
* @param clients
* @param cp
* @param bs
* @param value
* @param file
*/
function togglePesticide (socket, clients, cp, bs, value) {
function enableClientFile (clients, cp, bs, file) {

if (value !== true) {
value = false;
}
var item = bs.getOptionIn(["clientFiles", file.name]).toJS();

if (value) {
bs.setOptionIn([PESTICIDE_NAME, "active"], true, {silent: true});
clientScripts = clientScripts.set(PESTICIDE_NAME, {
type: "css",
src: getRemoteUrl(PESTICIDE_URL, cp, bs),
id: PESTICIDE_ID
});
clientScripts = clientScripts.set(PESTICIDE_DEPTH_NAME, {
type: "css",
src: getRemoteUrl(PESTICIDE_DEPTH_URL, cp, bs),
id: PESTICIDE_DEPTH_ID
});
bs.serveFile(PESTICIDE_URL, {
type: "text/css",
content: pesticide
});
bs.serveFile(PESTICIDE_DEPTH_URL, {
type: "text/css",
content: pesticideDepth
});
updateClients(clientScripts, clients);
} else {
bs.setOptionIn([PESTICIDE_NAME, "active"], false, {silent: true});
clientScripts = clientScripts.remove(PESTICIDE_DEPTH_NAME);
clientScripts = clientScripts.remove(PESTICIDE_NAME);
clients.emit("cp:element:remove", {id: PESTICIDE_ID});
clients.emit("cp:element:remove", {id: PESTICIDE_DEPTH_ID});
if (!item.active) {

bs.setOptionIn(["clientFiles", item.name, "active"], true, {silent: true});

if (!item.served) {
bs.setOptionIn(["clientFiles", item.name, "served"], true, {silent: true});
bs.serveFile(item.src, {
type: "text/css",
content: fs.readFileSync(item.file)
});
}
clientScripts = clientScripts.set(item.name, item);
addElement(clients, bs.getOptionIn(["clientFiles", item.name]).toJS());
}
}

/**
*
*/
function disableClientFile (clients, cp, bs, file) {
var item = bs.getOptionIn(["clientFiles", file.name]).toJS();
bs.setOptionIn(["clientFiles", item.name, "active"], false, {silent: true});
removeElement(clients, item.id);
clientScripts = clientScripts.remove(item.name);
}

/**
* @param elements
* @param clients
*/
function updateClients (elements, clients) {
elements.map(function (value) {
clients.emit("cp:element:add", value);
if (value.get("active")) {
clients.emit("cp:element:add", value.toJS());
}
});
}

Expand All @@ -195,7 +186,7 @@ function updateClients (elements, clients) {
* @param bs
* @param value
*/
function toggleDebugger (socket, clients, cp, bs, value) {
function toggleWeinre (socket, clients, cp, bs, value) {

if (value !== true) {
value = false;
Expand All @@ -215,31 +206,34 @@ function toggleDebugger (socket, clients, cp, bs, value) {
// Let the UI know about it
socket.emit("cp:weinre:enabled", _debugger);

// Add the JS script to the clients elements list
clientScripts = clientScripts.set(WEINRE_NAME, {
clients.emit("cp:element:add", {
type: "js",
src: bs.getOptionIn([WEINRE_NAME, "targetUrl"]),
id: WEINRE_ELEM_ID
});

// Update all client elements
updateClients(clientScripts, clients);
clientScripts = clientScripts.set("weinre", {
type: "js",
src: bs.getOptionIn([WEINRE_NAME, "targetUrl"]),
id: WEINRE_ELEM_ID
});

} else {

// Stop it
disableWeinre(cp, bs);

clientScripts = clientScripts.remove("weinre");

// Reset the state
bs.setOptionIn([WEINRE_NAME, "active"], false, {silent: false}); // Force a reload here

// Remove the script from client elements list
clientScripts = clientScripts.remove(WEINRE_NAME);

// Let the UI know
socket.emit("cp:weinre:disabled");

// Reload all browsers to remove weinre elements/JS
clients.emit("browser:reload");

}
}

Expand Down Expand Up @@ -290,4 +284,12 @@ function disableWeinre (cp, bs) {
}

return bs.options.get(WEINRE_NAME).toJS();
}

function addElement (clients, item) {
clients.emit("cp:element:add", item);
}

function removeElement(clients, id) {
clients.emit("cp:element:remove", {id: id});
}

0 comments on commit c983e1f

Please sign in to comment.