chrome extension update issues

[searchtheskyes]

Hi, I'm trying to update an outdated chrome extension (I'm not a coder, just playing around to learn). It needed to be updated from the manifest 1 version to manifest 2.

 

After I made the update chrome required, the extension no longer works.. It goes to the options page, and then the buttons won't bring up the secondary page as it did before. I'm assuming there are more updates I need to make to the code, but don't know what?

 

What else do I need to change? I don't understand why it won't work if I haven't changed the html or js files, just the manifest?

 

my manifest:

 

{
"manifest_version": 2,
"name": "WatchAds",
"version": "2.2",
"description": "Ad Watcher.",
"icons": {
"48": "adaware.png",
"128": "adaware.png"
},

"background": {
"page": "main.html",
"persistent": true
},
"options_page": "main.html",
"permissions": [
"tabs",
"unlimitedStorage",
"history"
]
}

 

main.html:

 

<script type="text/javascript" src="main.js"></script>
<style type="text/css">
#putHere {
list-style-type: none;
}
span {
color: #ddd;
-webkit-transition: 1s;
}
span:hover {
color: #000;
}

#putHere a, strong {
margin-left: 20px;
text-decoration: none;
}

img {
margin-right: 7px;
position: relative;
top: 3px;
width: 16px;
height: 16px;
}
</style>
<ul>
<li><a href="javascript:m.displayData()">Show</a></li>
<li><a href="javascript:( m.clearData() || m.displayData() )">Clear</a></li>
</ul>
<ul id="putHere"></ul>

 

main.js:

m = {
key: 'history', 
ls: window.localStorage,
clearData: function() {
m.ls.removeItem( m.key );
m.ls.setItem( m.key, "[]" );
},

get: function() {
if ( m.ls.getItem( m.key ) == null ) { 
m.ls.setItem( m.key, "[]" );
}

return JSON.parse( m.ls.getItem( m.key ) );
},

set: function( v ) {
m.ls.setItem( 
m.key, 
JSON.stringify( (m.get()).concat( [v] ) )
);
},

callbackTabs: function( id, i, tab ) {
if ( tab.status == 'complete' ) {
m.set( { 
date: m.date(),
favIcon: tab.favIconUrl || '',
url: tab.url || '',
title: tab.title || '',
incognito: tab.incognito
} );
}
},

date: function() {
d = new Date();
return '' + (
( d.getDate() > 9 ? d.getDate() : '0' + d.getDate() ) + ' ' + 
['January','February','March','April','May','June','July','August',
'September','October','November','December'][d.getMonth()] +
' ' + d.getFullYear() + ', ' + 
( d.getHours() > 9 ? d.getHours() : '0' + d.getHours() ) + ':' + 
( d.getMinutes() > 9 ? d.getMinutes() : '0' + d.getMinutes() ) + ':' +
( d.getSeconds() > 9 ? d.getSeconds() : '0' + d.getSeconds() )
);
},

$: function( id ) {
return document.getElementById( id );
},

parseURL: function( url ) {
var a =  document.createElement('a');
a.href = url;

return { 
source: url,
protocol: a.protocol.replace(':',''),
host: a.hostname,
port: a.port,
query: a.search,
params: (function(){
var ret = {},
seg = a.search.replace(/^\?/,'').split('&'),
len = seg.length, i = 0, s;
for (;i<len;i++) {
if (!seg[i]) { continue; }
s = seg[i].split('=');
ret[s[0]] = s[1];
}
return ret;
})(),
file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
hash: a.hash.replace('#',''), */
path: a.pathname.replace(/^([^\/])/,'/$1')/* ,
relative: (a.href.match(/tp:\/\/[^\/]+(.+)/) || [,''])[1],
segments: a.pathname.replace(/^\//,'').split('/') */
};
},

displayData: function() {
var html = '';

(m.get()).forEach( function( v ) {
p = m.parseURL( v.url );

html += '<li><span>' + v.date + '</span> ' + ( v.incognito ? '<strong>incognito mode</strong> ' : '') 
+ '<a href="' + v.url + '"><img src="' 
+ ( v.favIcon ? v.favIcon : ('http://www.google.com/s2/favicons?domain=' + p.host) ) + '"/>' 
+ ( v.title ? v.title : ((p.host + p.path ).substr( 0, 80 )) ) + '</a></li>';
});

m.$( 'putHere' ).innerHTML = html;

return false;
}
};

chrome.tabs.onUpdated.addListener( m.callbackTabs )

}

 

[racken]

Because changing the manifest version changed how things work you can see a list of what changed between manifest 1 & 2 https://developer.chrome.com/extensions/manifestVersion#manifest-v1-changes

and just go though each point and update your code