Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixed "Open in JsBin/JsFiddle", switched localstorage to chrome.storage.local #71

Open
wants to merge 10 commits into
base: master
Choose a base branch
from
6 changes: 1 addition & 5 deletions css/panel.css
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,7 @@
top: 5px;
}

#export-buttons-row div:first-child {
text-align: right;
}

#export-buttons-row div:nth-child(2) {
#export-buttons-row div {
text-align: center;
}

Expand Down
20 changes: 11 additions & 9 deletions js/background.js
Original file line number Diff line number Diff line change
@@ -1,17 +1,19 @@
/*
Allows to read, change and override settings kept in localStorage

FIXME Can be replaced with chrome.storage.local as soon as http://crbug.com/178618 will be resolved
FIXME Can be replaced with localStorage on the panel page as soon as http://crbug.com/319328 will be resolved
*/
chrome.runtime.onMessage.addListener(function (message, sender, callback) {
chrome.runtime.onMessage.addListener((message, sender, callback) => {
"use strict";

if (message.name === 'getSettings') {
if(message.name === 'getSettings')
callback(localStorage);
} else if (message.name === 'setSettings') {
localStorage = message.data;
} else if (message.name === 'changeSetting') {
localStorage[message.item] = message.value;

else if(message.name === 'setSettings')
chrome.storage.local.set(message.data);

else if(message.name === 'changeSetting') {
let data = {};
data[message.item] = message.value;

chrome.storage.local.set(data);
}
});
23 changes: 21 additions & 2 deletions js/panel.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
codepenForm = $('#codepen-form'),
jsfiddleForm = $('#jsfiddle-form'),
jsbinForm = $('#jsbin-form'),
copyToClipboard = $('#copy-to-clipboard'),

propertiesCleanUpInput = $('#properties-clean-up'),
removeDefaultValuesInput = $('#remove-default-values'),
Expand Down Expand Up @@ -56,9 +57,27 @@
jsbinForm.on('submit', function () {
var htmlInput = jsbinForm.find('input[name=html]');
var cssInput = jsbinForm.find('input[name=css]');
var csrfToken = jsbinForm.find('input[name=_csrf]');

htmlInput.val(encodeURIComponent(htmlTextarea.val()));
cssInput.val(encodeURIComponent(cssTextarea.val()));
htmlInput.val(htmlTextarea.val());
cssInput.val(cssTextarea.val());

if(!csrfToken.val()){
fetch("https://jsbin.com")
.then(e => e.text())
.then(e => {
let token = e.match(/name="_csrf" value="(.*?)"/)[1];
csrfToken.val(token);
jsbinForm.find('[type=submit]').click();
});

e.preventDefault();
}
});

copyToClipboard.on('click', function () {
var text = htmlTextarea.val() + "\n\n\n" + cssTextarea.val();
navigator.clipboard.writeText(text);
});

//Event listeners
Expand Down
9 changes: 9 additions & 0 deletions manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,25 @@
"version": "0.5",
"manifest_version": 2,
"minimum_chrome_version": "18.0",

"permissions": [
"storage",
"https://jsbin.com/"
],

"icons": {
"24": "gfx/icon_24.png",
"128": "gfx/icon_128.png"
},

"devtools_page": "devtools.html",

"background": {
"scripts": [
"js/background.js"
],
"persistent": false
},

"content_security_policy": "script-src 'self' https://apis.google.com https://platform.twitter.com https://www.facebook.com; object-src 'self'"
}
23 changes: 19 additions & 4 deletions panel.html
Original file line number Diff line number Diff line change
Expand Up @@ -103,25 +103,40 @@ <h4 class="panel-title">
</div>

<div class="row" id='export-buttons-row'>
<div class="col-xs-4">
<div class="col-xs-3">
<form action="https://codepen.io/pen/define" method="POST" target="_blank" id='codepen-form'>
<input type="hidden" name="data" value=''/>
<button type='submit' class='btn btn-primary'><span class="fui-mail"></span> Send to CodePen</button>
</form>
</div>
<div class="col-xs-4">
<form action="https://jsbin.com/?html,css,output" method="POST" target="_blank" id='jsbin-form'>

<div class="col-xs-3">
<form action="https://jsbin.com/save" method="POST" target="_blank" id='jsbin-form'>
<input type="hidden" name="html" value=''/>
<input type="hidden" name="css" value=''/>

<input type = "hidden" name = "method" value = "save">
<input type = "hidden" name = "checksum" value = "false">

<input type = "hidden" name = "_csrf" value = ''>

<button type='submit' class='btn btn-primary'><span class="fui-mail"></span> Send to JS Bin</button>
</form>
</div>
<div class="col-xs-4">

<div class="col-xs-3">
<form action="https://jsfiddle.net/api/post/library/pure/" method="POST" target="_blank" id='jsfiddle-form'>
<input type="hidden" name="html" value=''/>
<input type="hidden" name="css" value=''/>
<input type="hidden" name="js" value=''/>
<button type='submit' class='btn btn-primary'><span class="fui-mail"></span> Send to jsFiddle</button>
</form>
</div>

<div class="col-xs-3">
<button class="btn btn-primary" id="copy-to-clipboard">
<span class="fui-arrow-left" style="transform: rotate(90deg);"></span> Copy to Clipboard
</button>
</div>
</div>
</div>
Expand Down