adblockplusopera: Port UI code from Chrome

options/cssDisplay.js

-var cssParent = document.getElementById('css');
-
-var section = document.createElement('h2');
-section.appendChild(document.createTextNode(translate.get('css_filter')));
-cssParent.appendChild(section);
-
-sectionInfo = document.createElement('p');
-sectionInfo.appendChild(document.createTextNode(translate.get('css_filter_info')));
-cssParent.appendChild(sectionInfo);
-
-section = document.createElement('div');
-section.setAttribute('class', 'section');
-for(key in sources.css) {
-        var br = document.createElement('br');
-        var label = document.createElement('label');
-        
-        var checkbox = document.createElement('input');
-        checkbox.setAttribute('type', 'checkbox');
-        checkbox.setAttribute('name', key);
-        checkbox.setAttribute('id', key + '-check');
-        checkbox.setAttribute('onClick', 'cssClick("' + key + '")');
-        checkbox.checked = css.status(key);
-        
-        label.appendChild(checkbox);
-        var text = document.createElement('span');
-        text.appendChild(document.createTextNode(sources.name(key) + ' '));
-        label.appendChild(text);
-        var icon = document.createElement('img');
-        icon.setAttribute('src', '/images/opera_small.png');
-        label.appendChild(icon);
-        if(sources.css[key].match(/^https/)) {
-                var icon = document.createElement('img');
-                icon.setAttribute('src', '/images/secure.png');
-                label.appendChild(icon);
-        }
-        var time = document.createElement('i');
-        time.setAttribute('class', 'update_time');
-        label.appendChild(time);
-        section.appendChild(label);
-        section.appendChild(br);
-}
-cssParent.appendChild(section);
-
-
-var section = document.createElement('h3');
-section.appendChild(document.createTextNode(translate.get('perso_css')));
-cssParent.appendChild(section);
-
-var element = document.createElement('div');
-var descript = document.createElement('p');
-descript.innerHTML = translate.get('perso_css_descript');
-element.appendChild(descript);
-
-var cssPersoElement = document.createElement('textarea');
-cssPersoElement.value = css.personal().join('\n');
-cssPersoElement.setAttribute('id', 'css-perso');
-cssPersoElement.setAttribute('placeholder', translate.get('perso_css_holder'));
-element.appendChild(cssPersoElement);
-
-var cssPersoButtonParent = document.createElement('div');
-cssPersoButtonParent.setAttribute('class', 'button_parent');
-var cssPersoButton = document.createElement('button');
-cssPersoButton.setAttribute('onClick', 'cssPerso()');
-cssPersoButton.appendChild(document.createTextNode(translate.get('save_apply')));
-cssPersoButtonParent.appendChild(cssPersoButton)
-element.appendChild(cssPersoButtonParent);
-
-cssParent.appendChild(element);
-
-function cssClick(key){
-        if(document.getElementById(key + '-check').checked) {
-                window.setTimeout("css.enable('" + key + "', true);", 650); //Avoid CSS animation bug
-        }
-        else
-                window.setTimeout("css.disable('" + key + "', true);", 650); //Avoid CSS animation bug
-}
-function cssPerso() {
-        preferences.array('css-perso-content', document.getElementById('css-perso').value.split("\n"));
-        opera.extension.postMessage({request: 'ping', type: 'css'});
-}