Fixed issues with twitter, vimeo and other services (work in progress)

ejci · Jan 1, 2016 · 9faecac · 9faecac
1 parent 5867e1c
commit 9faecac
Show file tree

Hide file tree

Showing 9 changed files with 399 additions and 229 deletions.
diff --git a/extension/background/background.js b/extension/background/background.js
@@ -7,17 7,17 @@
 'use strict';
 
 // console.log('background.js');
-chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
 chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
  //console.log(sender.tab ? "from a content script:" sender.tab.url : "from the extension");
  //get setting from page
  if (request.action === 'get') {
- chrome.storage.local.get(function(items) {
  chrome.storage.local.get(function (items) {
  //console.log('background.js', 'chrome.storage.local.get', items);
  sendResponse({
- eq : items.eq,
- config : items.config,
- selected : items.selected,
- version : items.version
  eq: items.eq,
  config: items.config,
  selected: items.selected,
  version: items.version
  });
  });
 
@@ -33,7 33,7 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  chrome.storage.local.set(items);
  //console.log(request);
  chrome.tabs.query({
- }, function(tabs) {
  }, function (tabs) {
  function onTabMsgResp(response) {
  //console.log('tab response', response);
  }
@@ -48,18 48,18 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.action === 'status') {
  if (request.status == 'enabled') {
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : false
  enabled: false
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : true
  enabled: true
  });
 
  } else {
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : true
  enabled: true
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : false
  enabled: false
  });
  }
  }
@@ -72,7 72,7 @@ chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  return true;
 });
 
-chrome.storage.local.get(function(storage) {
 chrome.storage.local.get(function (storage) {
  //Default values
  //console.log('background.js init', 'chrome.storage.local.get', storage);
  if (storage.version !== CONST.VERSION) {
@@ -81,90 81,95 @@ chrome.storage.local.get(function(storage) {
  storage.version = CONST.VERSION;
  }
 
- chrome.storage.local.set(storage, function() {
  chrome.storage.local.set(storage, function () {
  //console.log('background.js init', 'chrome.storage.local.set');
  });
  icon.generate(storage.eq);
 
 });
 
-chrome.tabs.onActivated.addListener(function(active) {
 chrome.tabs.onActivated.addListener(function (active) {
 
  chrome.tabs.sendMessage(active.tabId, {
- action : 'status'
- }, function(status) {
  action: 'status'
  }, function (status) {
 
  if (status == 'enabled') {
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : false
  enabled: false
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : true
  enabled: true
  });
 
  } else {
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : true
  enabled: true
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : false
  enabled: false
  });
  }
  });
 });
 
 
 
 //MENUS
 var menu = {};
 menu.root = chrome.contextMenus.create({
- title : "Audio EQ",
- contexts : ['page']
  title: "Audio EQ",
  contexts: ['page']
 });
 menu.eqStatusEnable = chrome.contextMenus.create({
- id : 'eqStatusEnable',
- title : "Enable for this domain",
- enabled : false,
- parentId : menu.root,
- onclick : function() {
  id: 'eqStatusEnable',
  title: "Enable for this domain",
  enabled: false,
  parentId: menu.root,
  onclick: function () {
  chrome.tabs.query({
- active : true
- }, function(tabs) {
  active: true
  }, function (tabs) {
  for (var i = 0, l = tabs.length; i < l; i ) {
  var tab = tabs[i];
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : false
  enabled: false
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : true
  enabled: true
  });
  chrome.tabs.sendMessage(tab.id, {
- action : 'enable'
- }, function() {
  action: 'enable'
  }, function () {
  chrome.tabs.reload(tab.id);
 
  });
  }
  });
  }
 });
 
 
 menu.eqStatusDisable = chrome.contextMenus.create({
- id : 'eqStatusDisable',
- title : "Disable for this domain",
- enabled : true,
- parentId : menu.root,
- onclick : function() {
  id: 'eqStatusDisable',
  title: "Disable for this domain",
  enabled: true,
  parentId: menu.root,
  onclick: function () {
  chrome.tabs.query({
- active : true
- }, function(tabs) {
  active: true
  }, function (tabs) {
  for (var i = 0, l = tabs.length; i < l; i ) {
  var tab = tabs[i];
  chrome.contextMenus.update('eqStatusEnable', {
- enabled : true
  enabled: true
  });
  chrome.contextMenus.update('eqStatusDisable', {
- enabled : false
  enabled: false
  });
  chrome.tabs.sendMessage(tab.id, {
- action : 'disable'
- }, function() {
  action: 'disable'
  }, function () {
  chrome.tabs.reload(tab.id);
 
  });

diff --git a/extension/background/background_v2.js b/extension/background/background_v2.js
@@ -7,7 7,8 @@ Pros:
 Cons:
  - chrome.tabCapture.capture needs to be called from popup.html context manualy
  - cant automaticaly add filter when opening new tab (becaue of ^)
- 
  - needs "tabcapture" permission
  
 Im not sure about performance. But I guess it should be the same
 
 */

diff --git a/extension/background/headers.js b/extension/background/headers.js
@@ -0,0 1,70 @@
 //manipulate headers to sort out crossorigin issues
 //not very happy with the idea of manpulating headers but its good for user experience
 //TODO: explain in raeadme and page why extension needs to manipulate headers for transparency
 
 chrome.webRequest.onHeadersReceived.addListener(function (details) {
  //console.log(details);
  //check for content-type video/... or audio/...
  var contentTypeVideoOrAudio = false;
  var accessControlAllowOrigin = false;
  for (var i = 0; i < details.responseHeaders.length; i ) {
  if (details.responseHeaders[i].name === 'Content-Type' && (/\bvideo\b/.test(details.responseHeaders[i].value) || /\audio\b/.test(details.responseHeaders[i].value) )) {
  contentTypeVideoOrAudio = true;
  }
  if (details.responseHeaders[i].name === 'Access-Control-Allow-Origin') {
  accessControlAllowOrigin = true;
  }
  }
  //console.log(contentTypeVideoOrAudio);
  //if there is video or audio then manipulate or add Access-Control-Allow-Origin: * header
  //contentTypeVideoOrAudio=true;
  if (contentTypeVideoOrAudio && !accessControlAllowOrigin) {
  //console.log(details);
  //var responseHeaders=JSON.parse(JSON.stringify(details.responseHeaders));
  details.responseHeaders.push({
  name: 'Access-Control-Allow-Origin',
  value: '*'
  });
  details.responseHeaders.push({
  name: 'chrome-audio-eq',
  value: 'enabled'
  });
  console.log(details.url, details.responseHeaders);
  }
  return {
  responseHeaders: details.responseHeaders
  };
 }, {
  urls: ["<all_urls>"],
  types: ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
 }, ['blocking', 'responseHeaders']);
 
 
 chrome.webRequest.onBeforeSendHeaders.addListener( function (details) {
  //console.log('onBeforeSendHeaders',details);
  var origin = false;
  var host='';
  for (var i = 0; i < details.requestHeaders.length;  i) {
  if (details.requestHeaders[i].name === 'Origin') {
  origin = true;
  }
  if (details.requestHeaders[i].name === 'Host') {
  host = details.requestHeaders[i].value;
  }
  }
 
 
  if(!origin){
  details.requestHeaders.push({
  name: 'Origin',
  value: host
  });
  }
 
  return { 
  requestHeaders: details.requestHeaders 
  };
 }, { 
  urls: ["<all_urls>"],
  types: ["main_frame", "sub_frame", "stylesheet", "script", "image", "object", "xmlhttprequest", "other"]
 }, ["blocking", "requestHeaders"]);
diff --git a/extension/common/chart.js b/extension/common/chart.js
@@ -1,12 1,13 @@
-/* global window,
- document
- */
 /* global 
  window,
  document
 */
 'use strict';
 
-var chart = (function() {
 var chart = (function () {
  var canvas, context;
  var px = (window.devicePixelRatio > 1) ? 2 : 1;
- var prepareChart = function(eq) {
  var prepareChart = function (eq) {
 
  canvas = document.getElementById('chart');
  //330x40
@@ -31,7 32,7 @@ var chart = (function() {
  context.stroke();
  context.beginPath();
  context.stroke();
- context.font = px * 8   'px Rationale';
  context.font = px * 6   'px Arial';
  context.textAlign = 'right';
  context.fillStyle = 'rgb(50,90,140)';
  context.fillText(' 12', px * 8, px * (6   3));
@@ -42,19 43,21 @@ var chart = (function() {
  context.closePath();
  refreshChart(eq);
  };
- var refreshChart = function(eq) {
 
  var refreshChart = function (eq) {
  //------------ line ------------//
  var points = [];
  for (var l = eq.length, i = 1; i < l; i ) {
  points.push({
- x : ((i - 1) * 32)   12,
- y : 20 - (15 / 12) * eq[i].gain,
- xc : 0,
- xy : 0
  x: ((i - 1) * 32)   12,
  y: 20 - (15 / 12) * eq[i].gain,
  xc: 0,
  xy: 0
  });
  }
  context.beginPath();
  context.moveTo(px * points[0].x, px * points[0].y);
- for ( i = 1; i < points.length - 2; i ) {
  for (i = 1; i < points.length - 2; i ) {
  var xc = (points[i].x   points[i   1].x) / 2;
  var yc = (points[i].y   points[i   1].y) / 2;
  context.quadraticCurveTo(px * points[i].x, px * points[i].y, px * xc, px * yc);
@@ -64,9 67,38 @@ var chart = (function() {
  context.strokeStyle = 'rgb(50,90,140)';
  context.stroke();
 
  //------------ gradient ------------//
  var gradiend = context.createLinearGradient(px * 0, px * 0, px * 0, px * 40);
  gradiend.addColorStop(0, "rgba(50,90,140,200)");
  gradiend.addColorStop(0.5, "rgba(255,255,255,0)");
  gradiend.addColorStop(1, "rgba(50,90,140,200)")
  points = [];
 
  for (var l = eq.length, i = 1; i < l; i ) {
  points.push({
  x: ((i - 1) * 32)   12,
  y: 20 - (15 / 12) * eq[i].gain,
  xc: 0,
  xy: 0
  });
  }
  context.beginPath();
  context.moveTo(px * 12, px * 20);
  context.lineTo(px * points[0].x, px * points[0].y);
  for (i = 1; i < points.length - 2; i ) {
  var xc = (points[i].x   points[i   1].x) / 2;
  var yc = (points[i].y   points[i   1].y) / 2;
  context.quadraticCurveTo(px * points[i].x, px * points[i].y, px * xc, px * yc);
  }
  context.quadraticCurveTo(px * points[i].x, px * points[i].y, px * points[i   1].x, px * points[i   1].y);
  context.lineTo(px * 300, px * 20);
  context.closePath();
  context.fillStyle = gradiend;
  context.fill();
 
  };
  return {
- prepareChart : prepareChart,
- refreshChart : refreshChart
  prepareChart: prepareChart,
  refreshChart: refreshChart
  };
 })();