X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=inliner.js;h=f079dd86cfe9060762b84925b8623e83da5f4530;hb=0e5193e6109c8f251dcb4b9f0e9ee07ff6dd664e;hp=9861b5cad8aca3916f279d530113ee995915f527;hpb=cff2e4b2bdf29792510bcb864ea02188a0041c38;p=app.webkitpdf

diff --git a/inliner.js b/inliner.js
index 9861b5c..f079dd8 100644
--- a/inliner.js
+++ b/inliner.js
@@ -1,154 +1,120 @@
 /**
  *
- * Based on...
- * CSS Inline Transform v0.1
- * http://tikku.com/css-inline-transformer-simplified
- * 
- * Copyright 2010-2012, Nirvana Tikku
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * https://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt
- * 
- * This tool leverages the jQuery library.
- * 
- * Compatibility only tested with FireFox 3.5+, Chrome 5+
- * 
- * @author Nirvana Tikku
- * @dependent jQuery 1.4
- * @date Wed Mar 31 14:58:04 2010 -0500
- * @updated Sat Mar 10 16:21:20 2012 -0500
+ * could this work by findind all the visible text,
+ * then making them hidden..
+ *
+ * -- make a snapshot of the background..
+ *
+ * -- delete the whole page...
+ * -- show the image as the background.
+ * -- then overlay all the text given their calculated positions..
  * 
+ *
+ *
  */
 
+
 (function(){
     
-    //
-    // private methods
-    //
-    /**
-     * @param stylesArray - the array of string 
-     * 			"{name}:{value};" pairs that are to be broken down
-     *
-     */
-    function createCSSRuleObject (stylesArray) {
-    	var cssObj = {};
-    	for(_s in stylesArray){
-    		var S = stylesArray[_s].split(":");
-    		if(S[0].trim()==""||S[1].trim()=="")continue;
-    		cssObj[S[0].trim()] = S[1].trim();
-    	}
-    	return cssObj;
+    var camelize = function(a,b){
+        return b.toUpperCase();
     }
-
-    /**
-     * @param $out - the tmp html content
-     * 
-     */
-    function interpritAppendedStylesheet ($out) { 
-    	var stylesheet = $out[0].styleSheets[0]; // first stylesheet
-    	for(r in stylesheet.cssRules){
-    		try{
-    			var rule = stylesheet.cssRules[r]; 
-    			if(!isNaN(rule))break; // make sure the rule exists
-    			var $destObj = $out.find(rule.selectorText);
-    			var obj = rule.cssText.replace(rule.selectorText, '');
-    			obj = obj.replace('{','').replace('}',''); // clean up the { and }'s
-    			var styles = obj.split(";"); // separate each 
-    			$destObj.css(createCSSRuleObject(styles)); // do the inline styling
-    		} catch (e) { }
-    	}
-    };
     
+     
     
-	function isPatternRelevant (newHTML, pattern, relevantPatterns) {
-	    if( newHTML.indexOf(pattern) > -1 )
-	        relevantPatterns.push(new RegExp(pattern,"i"));
-	};
-
-    /**
-     * The main method - inflinify
-     *	this utilizes two text areas and a div for final output -  
-     * 		(1) css input textarea for the css to apply
-     * 		(2) html content for the css to apply TO
-     */
-    function inlinify () {
-    	
-    	interpritAppendedStylesheet(document); // apply styles to the document just created
+    var fillStyle = function(dom, pstyle)
+    {
+        if (!dom || dom.nodeType != 1) {
+            //console.log("SKIP: " + dom.nodeName);
+            return;
+        }
+        //console.log(dom.nodeName);
         
-        // remove existing stylesheets..
-        var ar = document.getElementsByTagName('style');
-        for(var i =0;i< ar.length;i++) {
-            ar[i].parentElement.remove(ar[i]);
+        var style = window.getComputedStyle(dom, null);
+        if (style.display == 'none' || dom.nodeName == "NOSCRIPT" || dom.nodeName == "SCRIPT" ) {
+            dom.parentElement.removeChild(dom);
+            return;
         }
+        var cn = [];
         
-    	//var relevantPatterns = [];
-        //	isPatternRelevant(newHTML, "href=\"", relevantPatterns);
-        //	isPatternRelevant(newHTML, "src=\"", relevantPatterns);
-        //	return sanitize( newHTML, relevantPatterns );
-    };
-    
-    function sanitize(html, patterns){
-        var ret = html;
-        for(var i=0; i<patterns.length; i++){
-            ret = san(ret, patterns[i])
-        }  
-        return ret;
-    };
-
-    /**
-     * This method will take HTML and a PATTERN and essentially
-     * sanitize the following chars within the HTML with that 
-     * pattern through a filter: 
-     *      Currently this only applies to &amp;' -> &
-     */
-    function san(html, pattern){
-    
-    	var ret = "";
-    	var remainingString;
-    	var hrefIndex;
-    	for(var i=0; i<html.length; i++){
-    		remainingString = html.substring(i);
-    		hrefIndex = remainingString.search(pattern);
-    		if( hrefIndex === 0 ){
-    		    // actually sanitize the pattern, i.e. href="[sanitize-candidate]"
-    		    // must be encapsulated within quotes, "
-    	       (function(){
-    	           // get the start of what we will sanitize
-    	           var startIndex = remainingString.indexOf("\"");
-    	           // and the end 
-    	           var endIndex = remainingString.indexOf("\"",startIndex+1);
-    	           // get the data to sanitize
-    	           var newHREF = html.substring(i+startIndex+1, i+endIndex+1);
-    	           // here we actually perform the replacement
-    	           newHREF = newHREF.replace(/&amp;/g, '&');
-    	           // add the pattern + the new data + a closing quote
-    	           var regExpStartLen = "/".length;
-    	           var regExpFlagsLen = "/i".length;
-    	           ret += String(pattern).substring( regExpStartLen, String(pattern).length - regExpFlagsLen)
-    	                + newHREF;
-    	           i += endIndex;
-    	       })();
-    	       continue;
-    		} else { 
-    		    // if we have another href, copy everything until that href index
-    		    if( hrefIndex > 0 ) {
-    		        ret += html.substring(i, hrefIndex);
-    		        i = hrefIndex-1;
-    		    } else { 
-    		        // otherwise just add the remaining chars and stop trying to sanitize
-    		        ret += html.substring(i);
-    		        break;
-    		    }
-    		}
-    	}
-    	return ret;
-	
-    };
+        if (dom.childNodes.length > 100) {
+            console.log(dom);
+            throw "too many child nodes?" + dom.childNodes.length ;
+        }
+        for (var i = 0;i < dom.childNodes.length;i++) {
+            cn.push(dom.childNodes[i]);
+        }
+        
+        if (cn.length > 100) {
+            console.log(dom);
+            throw "too many child nodes? cn";
+        }
+        for (var i = 0;i < cn.length;i++) {
+            
+            //console.log( i + ':'+ cn[i].nodeName);
+            fillStyle(cn[i], style);
+        }    
+              
+        
+        //var pstyle = false;
+        //if (dom.nodeName != 'BODY') {
+        //    pstyle = window.getComputedStyle(dom.parentElement, null);
+        //}
+         
+        if (dom.nodeName == 'SPAM') {
+            pstyle = false; //?? others??
+        }
+        
+        //if (dom.nodeName == 'LI') {            throw 'done';        }
+        
+        
+        for(var i=0;i<style.length;i++){
+            var prop = style[i];
+            var camel = prop.replace(/\-([a-z])/g, camelize);
+            var val = style.getPropertyValue(prop);
+            //returns[camel] = val;
+            
+            // idea... if the parent has the same style.. then do not apply it to the child?
+            if (pstyle && pstyle[prop] == val) {
+                continue;
+            }
+            //console.log(prop + '=' + val);
+            
+            dom.style[camel] = val;
+         
+            
+        }
+        var es = dom.getAttribute('style');
+        //console.log(dom.nodeName + '::' + es);
+        dom.setAttribute('style', es);
+        
+        //return returns;
+    }
     
-    //
-    // public methods
-    //
-    doInline = function(input) {
-    	return inlinify(input);
+    function changeit() {
+        
+        
+        var el = document.querySelector('body');
+        fillStyle(el), false;
+        
+        var matches = document.getElementsByTagName('style');
+        var rm = [];
+        for(var i =0;i < matches.length;i++) {
+            rm.push(matches[i]);
+            
+        }
+        var matches = document.getElementsByTagName('link');
+        for(var i =0;i < matches.length;i++) {
+            rm.push(matches[i]);
+        }
+        for(var i =0 ; i < rm.length;i++) {
+            rm[i].parentNode.removeChild(rm[i]);
+        }
+        
+        
+        
     }
+    changeit();
+    console.log("done");
     
 })();
\ No newline at end of file