Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Major updates for social

- Extended data model to include stylebot social data
- Added a warning notification system when installing styles from stylebot social
  • Loading branch information...
commit 177d470d51a1708fc0c1f80867d568f8240afdae 1 parent e35d359
@ankit ankit authored
View
128 stylebot/js/background.js
@@ -7,9 +7,16 @@ var cache = {
/**
e.g. styles = {
'google.com' : {
- 'a': {
- 'color': 'red'
- }
+ rules: {
+ 'a': {
+ 'color': 'red'
+ }
+ },
+
+ social: {
+ id: 4,
+ timestamp: 123456 (UNIX based)
+ }
}
}
**/
@@ -29,10 +36,10 @@ var cache = {
};
function init() {
- updateVersion();
attachListeners();
loadOptionsIntoCache();
loadStylesIntoCache();
+ updateVersion();
loadAccordionState();
if (cache.options.sync) {
loadSyncId();
@@ -42,21 +49,34 @@ function init() {
}
function openReleaseNotes() {
- chrome.tabs.create({url:"http://stylebot.me/releases.html", selected: true}, null);
+ chrome.tabs.create({ url: "http://stylebot.me/releases.html", selected: true }, null);
}
function updateVersion() {
if (!localStorage.version) {
- localStorage.version = "0.2"; return true;
- }
- else if (localStorage.version != "0.2") {
- // display notification on update
- var notification = webkitNotifications.createHTMLNotification(
- 'notification.html'
- );
- notification.show();
- localStorage.version = "0.2";
+ localStorage.version = "1"; return true;
}
+ else if (localStorage.version != "1") {
+ upgradeTo1();
+ }
+}
+
+function upgradeTo1() {
+ localStorage.version = "1";
+
+ // upgrading to the new data model
+ for (var url in cache.styles) {
+ var rules = cache.styles[url];
+ cache.styles[url] = {};
+ cache.styles[url]['rules']= rules;
+ cache.styles[url]['social'] = {};
+ }
+
+ // save to localStorage
+ updateStylesInDataStore();
+
+ // save to sync data as well
+ saveSyncData(cache.styles);
}
function attachListeners() {
@@ -75,11 +95,13 @@ function attachListeners() {
case "copyToClipboard" : copyToClipboard(request.text); sendResponse({}); break;
- case "save" : save(request.url, request.rules); sendResponse({}); break;
+ case "save" : save(request.url, request.rules, request.data); sendResponse({}); break;
+
+ case "doesStyleExist" : sendResponse(doesStyleExist(request.url)); break;
case "transfer" : transfer(request.source, request.destination); sendResponse({}); break;
- case "getRulesForPage" : sendResponse(getRulesForPage(request.url)); sendResponse({}); break;
+ case "getRulesForPage" : sendResponse(getRulesForPage(request.url)); break;
case "fetchOptions" : sendResponse({ options: cache.options, enabledAccordions: cache.enabledAccordions }); break;
@@ -117,31 +139,35 @@ function disablePageIcon(tabId) {
/** Data save, load, etc. **/
-// save rule. ** not being used
-function saveRule(url, selector, rule) {
- if (!selector || selector == "" || !url || url == "")
- return false;
-
- if (rule) {
- if (!cache.styles[url])
- cache.styles[url] = new Object();
- cache.styles[url][selector] = rule;
- }
- else {
- if (cache.styles[url] && cache.styles[url][selector])
- delete cache.styles[url][selector];
- }
- updateStylesInDataStore();
+// checks if a style already exists for the site
+// used to issue warning to user while installing styles from social
+function doesStyleExist(url) {
+ if (cache.styles[url]) {
+ return true;
+ }
+ else
+ return false;
}
// save all rules for a page
-function save(url, rules) {
+function save(url, rules, data) {
if (!url || url == "")
return;
- if (rules)
- cache.styles[url] = rules;
+
+ if (rules) {
+ cache.styles[url] = {};
+ cache.styles[url]['rules'] = rules;
+ }
else
delete cache.styles[url];
+
+ // if there is meta data, store it in the social object
+ if (data != undefined) {
+ cache.styles[url]['social'] = {};
+ cache.styles[url]['social'].id = data.id;
+ cache.styles[url]['social'].timestamp = data.timestamp;
+ }
+
updateStylesInDataStore();
}
@@ -149,10 +175,11 @@ function save(url, rules) {
function transfer(source, destination) {
if (cache.styles[source]) {
cache.styles[destination] = cache.styles[source];
- // the user has to delete the styles for the previous url manually
+ updateStylesInDataStore();
+
+ // the user has to delete the styles for the previous url manually
// if (destination.indexOf(source) == -1)
// delete cache.styles[source];
- updateStylesInDataStore();
}
}
@@ -177,33 +204,30 @@ function mergeStyles(s1, s2) {
if (!s2) {
return s1;
}
+
for (var url in s1) {
if (s2[url]) {
- for (var selector in s1[url]) {
- if (s2[url][selector]) {
- for (var property in s1[url][selector]) {
- s2[url][selector][property] = s1[url][selector][property];
+ for (var selector in s1[url]['rules']) {
+ if (s2[url]['rules'][selector]) {
+ for (var property in s1[url]['rules'][selector]) {
+ s2[url]['rules'][selector][property] = s1[url]['rules'][selector][property];
}
}
else
- s2[url][selector] = s1[url][selector];
+ s2[url]['rules'][selector] = s1[url]['rules'][selector];
}
+ s1[url]['social'] = s2[url]['social'];
}
else
s2[url] = s1[url];
}
+
return s2;
}
function updateStylesInDataStore() {
var jsonString = JSON.stringify(cache.styles);
localStorage['stylebot_styles'] = jsonString;
-
- /** Automatic Sync is disabled for now, until it is made more robust **/
-
- // is sync enabled? if yes, store in bookmark as well
- // if (cache.options.sync)
- // saveSyncData(jsonString);
}
function loadStylesIntoCache() {
@@ -276,16 +300,16 @@ function getRulesForPage(currUrl) {
url_for_page = url;
// iterate over each selector in styles
- for (var selector in cache.styles[url]) {
+ for (var selector in cache.styles[url]['rules']) {
// if no rule exists for selector, simply copy the rule
if (rules[selector] == undefined)
- rules[selector] = cloneObject(cache.styles[url][selector]);
+ rules[selector] = cloneObject(cache.styles[url]['rules'][selector]);
// otherwise, iterate over each property
else {
- for (var property in cache.styles[url][selector])
+ for (var property in cache.styles[url]['rules'][selector])
{
if (rules[selector][property] == undefined || url == url_for_page)
- rules[selector][property] = cache.styles[url][selector][property];
+ rules[selector][property] = cache.styles[url]['rules'][selector][property];
}
}
}
@@ -370,7 +394,7 @@ function searchSocial() {
});
}
-function shareStyleOnSocial() {
+function shareStyleOnSocial() {
chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.sendRequest(tab.id, {name: "shareStyleOnSocial"}, function(){});
});
View
14 stylebot/js/chrome.js
@@ -18,22 +18,26 @@ stylebot.chrome = {
},
// save all rules for a page
- save: function(url, rules) {
- chrome.extension.sendRequest({ name: "save", rules: rules, url: url }, function(){});
+ save: function(url, rules, data) {
+ chrome.extension.sendRequest({ name: "save", rules: rules, url: url , data: data }, function(){});
},
+ doesStyleExist: function(url, callback) {
+ chrome.extension.sendRequest({ name: "doesStyleExist", url:url }, callback);
+ },
+
install: function(url, rules, id) {
- chrome.extension.sendRequest({ name: "install", rules: rules, url: url, id: id}, function() {});
+ chrome.extension.sendRequest({ name: "install", rules: rules, url: url, id: id }, function() {});
},
// transfer all rules for src url to dest url
transfer: function(src, dest) {
- chrome.extension.sendRequest({name: "transfer", source: src, destination: dest}, function(){});
+ chrome.extension.sendRequest({name: "transfer", source: src, destination: dest }, function(){});
},
// send request to fetch options from datastore
fetchOptions: function() {
- chrome.extension.sendRequest({ name: "fetchOptions" }, function(response){
+ chrome.extension.sendRequest({ name: "fetchOptions" }, function(response) {
initialize(response);
});
},
View
111 stylebot/js/installation.js
@@ -1,50 +1,99 @@
$(document).ready(function(e) {
+ // let social know stylebot is installed
sendAvailabilityMessage();
- // respond to requests from stylebot social
+ // communication channel between stylebot social and the extension
var $install_divs = $('.stylebot_install_div');
if ($install_divs.length != 0) {
+
+ // Bind listener for install event
$install_divs.bind('stylebotInstallEvent', function(e) {
- console.log("Stylebot: Install event received! Dispatching request...");
- var $parent = $(e.target).closest('.post');
- var css = $.trim($(this).text());
- console.log('CSS: ' + css);
- var site = $.trim($parent.find('.post_site').text());
- console.log("Site: " + site);
+ console.log("Stylebot: Install event received. Dispatching request.");
- // let's parse the css
- var parser = new CSSParser();
- try {
- var sheet = parser.parse(css);
- var rules = CSSUtils.getRulesFromParserObject(sheet);
- console.log("Parsed Rules: %o", rules);
- stylebot.chrome.save(site, rules);
+ var $post = $(e.target).closest('.post');
+
+ var url = $.trim($post.find('.post_site').text());
+
+ // first, let's check if a style already exists for the url
+ stylebot.chrome.doesStyleExist(url, function(response) {
- // send back success message
- var customEvent = document.createEvent('Event');
- customEvent.initEvent('stylebotInstallationSuccessfulEvent', true, true);
- this.dispatchEvent(customEvent);
- }
- catch(e) {
- console.log("Error parsing css: " + e);
-
- // send back error message
- var customEvent = document.createEvent('Event');
- customEvent.initEvent('stylebotInstallationErrorEvent', true, true);
- this.dispatchEvent(customEvent);
- }
- });
+ // if yes, warn the user
+ if (response) {
+ console.log("Style for '" + url + "' already exists.");
+
+ var customEvent = document.createEvent('Event');
+ customEvent.initEvent('stylebotStyleExistsEvent', true, true);
+ e.target.dispatchEvent(customEvent);
+ }
+
+ // else save the style
+ else
+ saveStyleFromSocial(e.target);
+ });
+ });
+
+
+ // Bind listener for overwrite installation (without checking if style already exists)
+
+ $install_divs.bind('stylebotOverwriteEvent', function(e) {
+ console.log("Stylebot: Overwrite event received. Dispatching request.");
+
+ var $post = $(e.target).closest('.post');
+
+ saveStyleFromSocial(e.target);
+ });
}
});
+
+// Sends stylebot social an availability message
function sendAvailabilityMessage() {
- // get first available install div
- install_div = $('.stylebot_install_div').get(0);
- // create event
+ // get the first communication DIV in DOM
+ var install_div = $('.stylebot_install_div').get(0);
+
+ // dispatch the message
if (install_div) {
var customEvent = document.createEvent('Event');
customEvent.initEvent('stylebotIsAvailableEvent', true, true);
install_div.dispatchEvent(customEvent);
}
+}
+
+
+// Send request to background.html to save style along with metadata (id, timestamp, etc.)
+function saveStyleFromSocial(channel) {
+ var $post = $(channel).closest('.post');
+
+ var css = $.trim( $post.find('pre').text() );
+
+ var url = $.trim( $post.find('.post_site').text() );
+
+ var timestamp = $post.attr('data-timestamp');
+
+ var id = $post.attr('id').substring(4);
+
+ // let's parse the css
+ var parser = new CSSParser();
+
+ try {
+ var sheet = parser.parse(css);
+ var rules = CSSUtils.getRulesFromParserObject(sheet);
+
+ stylebot.chrome.save(url, rules, { id: id, timestamp: timestamp });
+
+ // send back success message
+ var customEvent = document.createEvent('Event');
+ customEvent.initEvent('stylebotInstallationSuccessfulEvent', true, true);
+ channel.dispatchEvent(customEvent);
+ }
+
+ catch(e) {
+ console.log("Error parsing css: " + e);
+
+ // send back error message
+ var customEvent = document.createEvent('Event');
+ customEvent.initEvent('stylebotInstallationErrorEvent', true, true);
+ channel.dispatchEvent(customEvent);
+ }
}
View
23 stylebot/js/options.js
@@ -163,10 +163,10 @@ function translateOptionValue(name, value) {
function fillCustomStyles() {
var container = $("#custom-styles");
for (var url in styles)
- container.append(createCustomStyleOption(url, styles[url]));
+ container.append(createCustomStyleOption(url));
}
-function createCustomStyleOption(url, rules) {
+function createCustomStyleOption(url) {
var container = $('<div>', {
class: 'custom-style'
});
@@ -223,10 +223,13 @@ function removeStyle(e) {
function editStyle(e) {
var parent = $(e.target).parents('.custom-style');
var url = parent.find('.custom-style-url').html();
- var rules = styles[url];
+ var rules = styles[url]['rules'];
var css = CSSUtils.crunchFormattedCSS(rules, false);
- var html = "<div>Edit the CSS for <b>" + url + "</b>:</div><textarea class='stylebot-css-code' style='width: 100%; height:" + cache.textareaHeight + "'>" + css + "</textarea><button onclick='cache.modal.hide();'>Cancel</button><button onclick='onUpdate();cache.modal.hide();'>Save</button>";
+ var html = "<div>Edit the CSS for <b>" + url + "</b>:</div>";
+ html += "<textarea class='stylebot-css-code' style='width: 100%; height:" + cache.textareaHeight + "'>" + css + "</textarea>";
+ html += "<button onclick='cache.modal.hide();'>Cancel</button>";
+ html += "<button onclick='onUpdate(); cache.modal.hide();'>Save</button>";
initModal(html);
@@ -301,16 +304,19 @@ function onAdd() {
function saveStyle(url, css) {
var parser = new CSSParser();
var sheet = parser.parse(css);
- var rules = null;
var retVal = false;
if (sheet) {
try {
- styles[url] = CSSUtils.getRulesFromParserObject(sheet);
+ var rules = CSSUtils.getRulesFromParserObject(sheet);
+ styles[url] = {};
+ styles[url]['rules'] = rules;
+ styles[url]['social'] = {};
retVal = true;
}
catch(e) {}
}
- else if (styles[url]) {
+ // if css is empty. remove the style
+ else if (css === "" && styles[url]) {
delete styles[url];
$('.custom-style-url:contains(' + url + ')').parent().remove();
}
@@ -385,7 +391,8 @@ function importCSS() {
{
$(".custom-style").html("");
try {
- styles = mergeStyles(JSON.parse(json), styles);
+ var imported_styles = JSON.parse(json);
+ styles = mergeStyles(imported_styles, styles);
bg_window.saveStyles(styles);
}
catch(e) {}
Please sign in to comment.
Something went wrong with that request. Please try again.