Merged in fix_injection (pull request #24) Dynamic JS/CSS loading and some external lib fixes.

chrome_point_plus/css/fancybox/style.css

@@ -0,0 +1,27 @@
+/* 
+    Created on : Jan 7, 2015, 8:58:42 AM
+    Author     : skobkin
+*/
+
+/* Fancybox fix */
+#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
+    background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_sprite.png');
+}
+
+#fancybox-loading div {
+    background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_loading.gif');
+}
+
+.fancybox-overlay {
+    background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_overlay.png');
+}
+
+@media only screen and (min-device-pixel-ratio: 1.5) {
+    #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
+        background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_sprite@2x.png');
+    }
+
+    #fancybox-loading div {
+        background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_loading@2x.gif');
+    }
+}

chrome_point_plus/css/markitup/skins/markitup/style.css

@@ -1,147 +1,36 @@
-/* -------------------------------------------------------------------
-// markItUp! Universal MarkUp Engine, JQuery plugin
-// By Jay Salvat - http://markitup.jaysalvat.com/
-// ------------------------------------------------------------------*/
-.markItUp * {
-	margin:0px; padding:0px;
-	outline:none;
-}
-.markItUp a:link,
-.markItUp a:visited {
-	color:#000;
-	text-decoration:none;
-}
-.markItUp  {
-	width:700px;
-	margin:5px 0 5px 0;
-	border:5px solid #F5F5F5;	
-}
 .markItUpContainer  {
-	border:1px solid #3C769D;	
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-container.png);
-	background:#FFF url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-container.png) repeat-x top left;
-	padding:5px 5px 2px 5px;
-	font:11px Verdana, Arial, Helvetica, sans-serif;
 }
 .markItUpEditor {
-	font:12px 'Courier New', Courier, monospace;
+    background: none;
-	padding:5px 5px 5px 5px/*35px*/;
+    /* Padding fix */
-	border:3px solid #3C769D;
+    padding-left: 10px;
-	width:643px;
-	height:320px;
-	/*background:#FFF url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor.png) no-repeat;*/
-	clear:both;
-	line-height:18px;
-	overflow:auto;
-}
-.markItUpPreviewFrame	{
-	overflow:auto;
-	background-color:#FFFFFF;
-	border:1px solid #3C769D;
-	width:99.9%;
-	height:300px;
-	margin:5px 0;
-}
-.markItUpFooter {
-	width:100%;
-	cursor:n-resize;
 }
 .markItUpResizeHandle {
-	overflow:hidden;
-	width:22px; height:5px;
-	margin-left:auto;
-	margin-right:auto;
     background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/handle.png);
-	cursor:n-resize;
 }
 /***************************************************************************************/
 /* first row of buttons */
-.markItUpHeader ul li	{
-	list-style:none;
-	float:left;
-	position:relative;
-}
-.markItUpHeader ul li ul{
-	display:none;
-}
-.markItUpHeader ul li:hover > ul{
-	display:block;
-}
 .markItUpHeader ul .markItUpDropMenu {
-	background:transparent url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/menu.png) no-repeat 115% 50%;
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/menu.png);
-	margin-right:5px;
-}
-.markItUpHeader ul .markItUpDropMenu li {
-	margin-right:0px;
-}
-.markItUpHeader ul .markItUpSeparator {
-	margin:0 10px;
-	width:1px;
-	height:16px;
-	overflow:hidden;
-	background-color:#CCC;
-}
-.markItUpHeader ul ul .markItUpSeparator {
-	width:auto; height:1px;
-	margin:0px;
-}
-/* next rows of buttons */
-.markItUpHeader ul ul {
-	display:none;
-	position:absolute;
-	top:18px; left:0px;	
-	background:#F5F5F5;
-	border:1px solid #3C769D;
-	height:inherit;
-}
-.markItUpHeader ul ul li {
-	float:none;
-	border-bottom:1px solid #3C769D;
 }
 .markItUpHeader ul ul .markItUpDropMenu {
-	background:#F5F5F5 url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/submenu.png) no-repeat 100% 50%;
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/submenu.png);
-}
-/* next rows of buttons */
-.markItUpHeader ul ul ul {
-	position:absolute;
-	top:-1px; left:150px;
-}
-.markItUpHeader ul ul ul li {
-	float:none;
-}
-.markItUpHeader ul a {
-	display:block;
-	width:16px; height:16px;
-	text-indent:-10000px;
-	background-repeat:no-repeat;
-	padding:3px;
-	margin:0px;
-}
-.markItUpHeader ul ul a {
-	display:block;
-	padding-left:0px;
-	text-indent:0;
-	width:120px; 
-	padding:5px 5px 5px 25px;
-	background-position:2px 50%;
-}
-.markItUpHeader ul ul a:hover  {
-	color:#FFF;
-	background-color:#3C769D;
 }
 /***************************************************************************************/
 .html .markItUpEditor {
-	background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-html.png);
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-html.png);
 }
 .markdown .markItUpEditor {
-	background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-markdown.png);
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-markdown.png);
 }
 .textile .markItUpEditor {
-	background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-textile.png);
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-textile.png);
 }
 .bbcode .markItUpEditor {
-	background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-bbcode.png);
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-bbcode.png);
 }
 .wiki .markItUpEditor,
 .dotclear .markItUpEditor {
-	background-image:url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-wiki.png);
+    background-image: url(chrome-extension://__MSG_@@extension_id__/images/markitup/skins/markitup/bg-editor-wiki.png);
 }

chrome_point_plus/css/point-plus.css

@@ -164,33 +164,3 @@ div#markItUpText-input {
     background-repeat: repeat-x;
     background-image: url('chrome-extension://__MSG_@@extension_id__/images/nesting-point.png');
 }
-
-
-/* Fancybox fix */
-#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
-	background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_sprite.png');
-}
-
-#fancybox-loading div {
-	background: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_loading.gif') center center no-repeat;
-}
-
-.fancybox-nav {
-	background: transparent url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/blank.gif'); /* helps IE */
-}
-.fancybox-overlay {
-	background: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_overlay.png');
-}
-
-@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
-	   only screen and (min--moz-device-pixel-ratio: 1.5),
-	   only screen and (min-device-pixel-ratio: 1.5) {
-
-	#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
-		background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_sprite@2x.png');
-	}
-
-	#fancybox-loading div {
-		background-image: url('chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/chrome-extension://__MSG_@@extension_id__/vendor/fancybox/source/fancybox_loading@2x.gif');
-	}
-}

chrome_point_plus/js/background.js

@@ -8,15 +8,50 @@ chrome.storage.sync.get('options_version', function(data) {
     }
 });
 
+// Crutches and bikes
+/**
+ * Inject several JS files
+ * @param {number} tabId Unique ID of tab which requested injection
+ * @param {Object[]} files Array of objects of files to inject
+ * @param {function} onAllInjected allback function running when injection ends
+ */
+function injectJS(tabId, files, onAllInjected) {
+    var item = files.shift();
+    if (item) {
+        console.log('Injecting JS "%s" to the tab #%s', item.file, tabId);
+        
+        if ('file' in item) {
+            chrome.tabs.executeScript(tabId ? tabId : null, {
+                file: item.file,
+                runAt: item.runAt || 'document_start'
+            }, function(result) {
+                console.info('"%s" injected to the tab #%s', item.file, tabId);
+                
+                injectJS(tabId, files, onAllInjected);
+            });
+        }
+    } else {
+        onAllInjected();
+    }
+}
+
+// @todo Implement injectCSS (because JS execution working always after CSS injection)
+
 // Message listener
-chrome.extension.onMessage.addListener(function(message, sender) {
+chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
-    console.log('Received message: %O', message);
+    // @todo Check if sender.tab may be undefined in some cases
+    console.log('Received message from tab #%i: %O', sender.tab.id, message);
     
     if (message) {
         switch (message.type) {
             case 'showPageAction':
-                var tab = sender.tab;
+                chrome.pageAction.show(sender.tab.id);
-                chrome.pageAction.show(tab.id);
+                sendResponse(true);
+                
+                console.log('Showed pageAction for tab #%s', sender.tab.id);
+                
+                // Fuck You, Chrome API documentation!!11
+                return true;
                 break;
                 
             case 'showNotification':
@@ -28,11 +63,15 @@ chrome.extension.onMessage.addListener(function(message, sender) {
                         message: message.text,
                         priority: 0,
                         isClickable: true
-                    },
+                    }, function(notificationId) {
-                    function() { /* Error checking goes here */} 
+                        console.info('Notification "%s" created', notificationId);
+
+                        sendResponse(true);
+                    } 
                 );
                 
-                console.log('Showing notification %s', message.notificationId); 
+                // Fuck You, Chrome API documentation!!11
+                return true;
                 break;
                 
             case 'listenNotificationClicks':
@@ -52,30 +91,95 @@ chrome.extension.onMessage.addListener(function(message, sender) {
                         });
                     }
                 });
+                
+                sendResponse(true);
+                
+                // Fuck You, Chrome API documentation!
+                return true;
                 break;
 
+            /**
+             * @deprecated since 1.19.1
+             */
             case 'injectJSFile':
-                console.log('Injecting JS: %s', message.file);
+                console.log('Executing JS: %s', message.file);
-                chrome.tabs.executeScript(null, {
+                chrome.tabs.executeScript(sender.tab.id ? sender.tab.id : null, {
-                    file: message.file
+                    file: message.file,
-                    //,runAt: 'document_end'
+                    runAt: message.runAt || 'document_start'
+                }, function() {
+                    sendResponse(true);
+
+                    console.info('JS file executed: "%s"', message.file);
+                    return true;
                 });
+                
+                // Fuck You, Chrome API documentation!
+                return true;
                 break;
                 
-            case 'injectCSSFile':
+            // Inject several files
-                console.log('Injecting CSS: %s', message.file);
+            case 'executeJSFiles':
-                chrome.tabs.insertCSS(null, {
+                //console.debug('Received JS file list: %O', message.files);
-                    file: message.file
+                
+                if (message.files.length) {
+                    injectJS(sender.tab.id ? sender.tab.id : null, message.files, function() {
+                        // @fixme does not sending response now!
+                        console.info('All scripts executed');
+                        
+                        sendResponse(true);
+                        return true;
                     });
+                } else {
+                    /* 
+                     * May be not?
+                     * But I don't want to block some shit-code execution
+                     */
+                    sendResponse(false);
+                    
+                    console.warn('No scripts executed (empty script array)');
+                }
+                
+                // Fuck You, Chrome API documentation!
+                return true;
+                break;
+
+            /**
+             * @deprecated since 1.19.1
+             */
+            case 'injectCSSFile':
+                console.log('Injecting CSS: "%s"', message.file);
+                chrome.tabs.insertCSS(sender.tab.id ? sender.tab.id : null, {
+                    file: message.file
+                }, function() {
+                    // @todo message response callback processing
+                    //sendResponse(true);
+
+                    console.info('CSS file "%s" injected', message.file);
+                });
+                
+                // Fuck You, Chrome API documentation!
+                return true;
                 break;
                 
             case 'injectCSSCode':
                 if (message.code !== undefined) {
-                    chrome.tabs.insertCSS(null, {
+                    chrome.tabs.insertCSS(sender.tab.id ? sender.tab.id : null, {
                         code: message.code
+                    }, function() {
+                        // @todo message response callback processing
+                        //sendResponse(true);
+                        
+                        console.info('CSS code injected: \n%s', message.file);
                     });
                 }
 
+                // Fuck You, Chrome API documentation!
+                return true;
+                break;
+                
+            default:
+                sendResponse(false);
+                return true;
                 break;
         }
     }   

chrome_point_plus/js/point-plus.js

@@ -1,6 +1,8 @@
 // Showing page action
-chrome.extension.sendMessage({
+chrome.runtime.sendMessage({
     type: 'showPageAction'
+}, null, function(response) {
+    console.debug('showPageAction response: %O', response);
 });
 
 /**
@@ -68,7 +70,7 @@ $(document).ready(function() {
         // Options debug
         try {
             console.debug('Options loaded: %O', options.getOptions());
-        }catch(e){}
+        } catch(e){}
         create_tag_system();
 
         // Embedding
@@ -94,12 +96,17 @@ $(document).ready(function() {
 
             // Soundcloud
             if (options.is('option_embedding_soundcloud')) {
-                // Injecting JS API
+                // Executing Soundcloud player JS API
-                chrome.extension.sendMessage({
+                chrome.runtime.sendMessage({
-                    type: 'injectJSFile',
+                    type: 'executeJSFiles',
-                    file: 'vendor/soundcloud/soundcloud.player.api.js'
+                    files: [{
-                });
+                        file: 'vendor/soundcloud/soundcloud.player.api.js',
-
+                        runAt: 'document_end'
+                    }]
+                }, null, function(response) {
+                    console.debug('Soundcloud injection response: %O', response);
+                    // If scripts are executed
+                    if (response) {
                         // Processing links
                         $('.post .post-content a[href*="\\:\\/\\/soundcloud\\.com\\/"]').each(function(index) {
                             console.log($(this));
@@ -125,7 +132,8 @@ $(document).ready(function() {
                                 $(this).replaceWith($player);
                             }
                         });
-
+                    }
+                });
             }
 
             // Parse pleer.com links and create audio instead
@@ -142,18 +150,33 @@ $(document).ready(function() {
         // Fancybox
         if (options.is('option_fancybox')) {
             // Injecting Fancybox to the page
-            chrome.extension.sendMessage({
+            // CSS
-                type: 'injectJSFile',
+            // @todo message response callback processing
-                file: 'vendor/fancybox/source/jquery.fancybox.pack.js'
+            chrome.runtime.sendMessage({
-            });
-            chrome.extension.sendMessage({
-                type: 'injectJSFile',
-                file: 'vendor/fancybox/source/helpers/jquery.fancybox-media.js'
-            });
-            chrome.extension.sendMessage({
                 type: 'injectCSSFile',
                 file: 'vendor/fancybox/source/jquery.fancybox.css'
             });
+            // @todo message response callback processing
+            chrome.runtime.sendMessage({
+                type: 'injectCSSFile',
+                file: 'css/fancybox/style.css'
+            });
+            // JS
+            chrome.runtime.sendMessage(null, {
+                type: 'executeJSFiles',
+                files: [{
+                    file: 'vendor/fancybox/source/jquery.fancybox.pack.js',
+                    runAt: 'document_end'
+                }, {
+                    // @todo Move to the option_fancybox_videos section
+                    file: 'vendor/fancybox/source/helpers/jquery.fancybox-media.js',
+                    runAt: 'document_end'
+                }]
+            }, null, function(response) {
+                // If all JS are executed
+                console.debug('Fancybox injection response: %O', response);
+                if (response) {
+                    console.log('Fancybox executed. Processing...');
                     
                     if (options.is('option_fancybox_bind_images_to_one_flow')) {
                         // Linking images in posts to the galleries
@@ -203,6 +226,8 @@ $(document).ready(function() {
                         });
                     }
                 }
+            });
+        }
 
         // NSFW Filtering
         if (options.is('option_nsfw')) {
@@ -282,29 +307,41 @@ $(document).ready(function() {
         }
         // Visual editor
         if (options.is('option_visual_editor_post')) {
-            // Injecting editor JS
+            // Add classes
-            chrome.extension.sendMessage({
+            $('#new-post-form #text-input, .post-content #text-input').addClass('markitup').css('height', '20em');
-                type: 'injectJSFile',
+            
-                file: 'vendor/markitup/markitup/jquery.markitup.js'
-            });
-            // Getting mySettings from set.js
-            chrome.extension.sendMessage({
-                type: 'injectJSFile',
-                file: 'js/markitup/sets/markdown/set.js'
-            });
             // CSS
-            chrome.extension.sendMessage({
+            // @todo message response callback processing
+            chrome.runtime.sendMessage({
                 type: 'injectCSSFile',
                 file: 'vendor/markitup/markitup/skins/markitup/style.css'
             });
-            chrome.extension.sendMessage({
+            // Fixes for extension
+            // @todo message response callback processing
+            chrome.runtime.sendMessage({
+                type: 'injectCSSFile',
+                file: 'css/markitup/skins/markitup/style.css'
+            });
+            // @todo message response callback processing
+            chrome.runtime.sendMessage({
                 type: 'injectCSSFile',
                 file: 'css/markitup/sets/markdown/style.css'
             });
-            
+            // JS
-            // Add classes
+            chrome.runtime.sendMessage({
-            $('#new-post-form #text-input, .post-content #text-input').addClass('markitup').css('height', '20em');
+                type: 'executeJSFiles',
-            // Init
+                files: [{
+                    file: 'vendor/markitup/markitup/jquery.markitup.js',
+                    runAt: 'document_end'
+                }, {
+                    file: 'js/markitup/sets/markdown/set.js',
+                    runAt: 'document_end'
+                }]
+            }, null, function(response) {
+                console.debug('MarkItUp injection response: %O', response);
+                // If scripts are executed
+                if (response) {
+                    // Init MarkItUp
                     $('.markitup').markItUp(mySettings);
 
                     // Send by CTRL+Enter
@@ -318,6 +355,8 @@ $(document).ready(function() {
                         });
                     }
                 }
+            });
+        }
         // Google search
         if (options.is('option_search_with_google')) {
             $('#search-form input[type="text"]').attr('placeholder', 'Google').keydown(function(e) {
@@ -335,7 +374,7 @@ $(document).ready(function() {
 
             // @todo: унести в опцию
             // Adding event listener for notification click
-            chrome.extension.sendMessage({
+            chrome.runtime.sendMessage({
                 type: 'listenNotificationClicks',
                 protocol: getProtocol()
             });
@@ -357,7 +396,7 @@ $(document).ready(function() {
                 try {
                     // ping :)
                     if (evt.data == 'ping') {
-                        console.debug('ws-ping');
+                        console.info('ws-ping');
                     } else {
                         var wsMessage = JSON.parse(evt.data);
 
@@ -491,7 +530,7 @@ $(document).ready(function() {
                                         // Desktop notifications
                                         if (options.is('option_ws_comments_notifications')) {
                                             console.log('Showing desktop notification');
-                                            chrome.extension.sendMessage({
+                                            chrome.runtime.sendMessage({
                                                 type: 'showNotification',
                                                 notificationId: 'comment_' + wsMessage.post_id + '#' + wsMessage.comment_id,
                                                 avatarUrl: getProtocol() + userAvatar + '/80',
@@ -550,7 +589,8 @@ $(document).ready(function() {
         }
         // @ before username
         if (options.is('option_at_before_username')) {
-            chrome.extension.sendMessage({
+            // @todo message response callback processing
+            chrome.runtime.sendMessage({
                 type: 'injectCSSFile',
                 file: 'css/modules/at_before_username.css'
             });
@@ -594,7 +634,7 @@ $(document).ready(function() {
 });
 
 function getProtocol() {
-    return ((location.protocol == 'http:') ? 'http:' : 'https:')
+    return ((location.protocol == 'http:') ? 'http:' : 'https:');
 }
 
 function escapeHtml(text) {

chrome_point_plus/manifest.json

@@ -44,6 +44,7 @@
     "web_accessible_resources": [
         "images/*",
         "includes/*",
+        "vendor/*",
         "manifest.json"
     ],
     "background": {