diff --git a/.travis.yml b/.travis.yml index 84aef06..f297134 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,35 +6,28 @@ before_install: - sudo apt-get -qq update install: - - sudo apt-get install p7zip-full - -before_script: - - wget https://dl.google.com/chat/latest/InstallHangoutsChat.dmg - - 7z x InstallHangoutsChat.dmg - - mkdir t - - sudo mount -oloop *.hfs t + - sudo apt-get install git p7zip-full script: - - ./generate_patch.sh t/Chat.app/Contents/Resources/app/main.js - - cd out/slacktheme && 7z a -tzip ../electron-slack.zip main.js && cd ../.. - - cd out/darktheme && 7z a -tzip ../electron-dark.zip main.js && cd ../.. - - cd out/ghctheme && 7z a -tzip ..//electron-ghc.zip main.js && cd ../.. + - ./generate_patch.sh + - cd out/slacktheme/firefox && 7z a -tzip firefox-slack.zip * && cd ../../.. + - cd out/ghctheme/firefox && 7z a -tzip firefox-ghc.zip * && cd ../../.. + - cd out/darktheme/firefox && 7z a -tzip firefox-dark.zip * && cd ../../.. - cp out/slacktheme/gmonkeyscript.js out/gmonkeyscript-slack.js - cp out/ghctheme/gmonkeyscript.js out/gmonkeyscript-ghc.js - cp out/darktheme/gmonkeyscript.js out/gmonkeyscript-dark.js - - export GHCVER=`./ghc_version.sh t/Chat.app/Contents/Info.plist` deploy: provider: releases api_key: $TOKEN file: - - "out/electron-ghc.zip" - - "out/electron-dark.zip" - - "out/electron-slack.zip" - "out/gmonkeyscript-ghc.js" - "out/gmonkeyscript-slack.js" - "out/gmonkeyscript-dark.js" + - "out/ghctheme/firefox/firefox-ghc.zip" + - "out/darktheme/firefox/firefox-dark.zip" + - "out/slacktheme/firefox/firefox-slack.zip" skip-cleanup: true on: tags: true - name: Release $TRAVIS_TAG - $(date +'%Y.%m.%d') - GHC build v$GHCVER + name: Release $TRAVIS_TAG - $(date +'%Y.%m.%d') diff --git a/Makefile b/Makefile deleted file mode 100644 index 967b367..0000000 --- a/Makefile +++ /dev/null @@ -1,19 +0,0 @@ -ELECTRON?=/Applications/Chat.app/Contents/Resources/app/main.js -THEME?=dark# can be replaced with `slack` or `ghc` -OUTELECTRON?=out/$(THEME)theme/main.js - -all: build_all - -install: $(OUTELECTRON) - cp -f $(OUTELECTRON) $(ELECTRON) - -$(OUTELECTRON): clean - ./generate_patch.sh $(ELECTRON) - -gmonkey: - ./generate_patch.sh - -build_all: $(OUTELECTRON) - -clean: - rm -rf out/ diff --git a/README.md b/README.md index f6ab1a8..2167f45 100644 --- a/README.md +++ b/README.md @@ -6,9 +6,12 @@ Better Hangouts Chat This patch extends Google Hangouts Chat to make it nicer and simpler to use. Works with both the official Electron clients and the web version. -*Note*: Google is dropping support for the Electron client in favor of using the new Chrome App. -In order to use this plugin within the Chrome App, follow the instructions for the browser -version of this plugin, within Chrome. +*Note*: Google has dropped support for the Electron client in favor of using the new Chrome App. +In order to use this plugin within the Chrome App, you can use either the javascript snippet +within Greasemonkey or Tampermonkey in your browser, or install the custom better-hangoutschat +browser extension (experimental). +If you still use an old version of the Electron client, you can use the electron file from release +v4.2.1, the latest version of better-hangoutschat supporting the Electron client. Features --------- @@ -31,28 +34,12 @@ Installing from official release files - Download the latest release from the 'releases' section: https://github.com/paveyry/better-hangoutschat/releases -- For the electron client: open the client at least once, then replace the official -`main.js` with the patched one at this path: - - For Windows: `C:\Users\\AppData\Local\Google\Hangouts Chat\resources\app\main.js` - - For macOS: `/Applications/Chat.app/Contents/Resources/app/main.js` - - For GNU/Linux: Google have not released their electron client for GNU/Linux, but you can use - the browser script with the web version. -If the theme doesn't appear the first time you restart GHC, try to restart it a second time. - -- For the browser, just paste the `gmonkeyscript.js` script in your greasemonkey or tampermonkey -extension - -Easy installation on macOS --------------------------- - -- Install the GHC client -- Run it at least once -- Clone this repository -- Run the `make install` rule with the appropriate THEME variable: - THEME= make install +- For the custom script using the tampermonkey (or greasemonkey) extension, just paste the +`gmonkeyscript.js` script in tampermonkey +- [EXPERIMENTAL] For the dedicated browser extension, download the extension file for your browser +and install it manually. -- Restart GHC Building script from source ---------------------------- @@ -64,24 +51,6 @@ Just run this command: The script will appear in `out`. You can now copy it in your greasemonkey or tampermonkey extension -Building Electron Client patch from source -------------------------------------------- - -- Install the GHC client -- Run it at least once (this is important) -- Locate `main.js` in the installation directory on Windows, or in the App - package on Mac (`/Applications/Chat.app/Contents/Resources/app/main.js`) and run this command: - - ./generate_patch.sh - -- The patched electron file will appear in `out`. Simply replace the initial one with -the patched one: - - cp out//main.js /Applications/Chat.app/Contents/Resources/app/main.js - -- Restart GHC. If the theme doesn't appear the first time you restart GHC, try to restart it -a second time. - Preview -------- diff --git a/browser_extensions/firefox_manifest.json b/browser_extensions/firefox_manifest.json new file mode 100644 index 0000000..3ceb287 --- /dev/null +++ b/browser_extensions/firefox_manifest.json @@ -0,0 +1,20 @@ +{ + "manifest_version": 2, + "name": "Better Hangouts Chat - COLOR", + "version": "VERSION", + "homepage_url": "https://github.com/paveyry/better-hangoutschat", + "description": "Themes and Thread Links in Google Hangouts Chat", + + "icons": { + "48": "icons/icon.png" + }, + + "content_scripts": [ + { + "matches": ["*://chat.google.com/*"], + "js": ["plugin.js"], + "css": ["shape.css", "color.css"] + } + ] + +} diff --git a/browser_extensions/icon.png b/browser_extensions/icon.png new file mode 100644 index 0000000..3fe07b1 Binary files /dev/null and b/browser_extensions/icon.png differ diff --git a/generate_patch.sh b/generate_patch.sh index 6faa7c8..2e0a153 100755 --- a/generate_patch.sh +++ b/generate_patch.sh @@ -1,38 +1,38 @@ #!/bin/bash -# Usage: ./generate_patch.sh [original_mainjs_file] +# Usage: ./generate_patch.sh set -e -PLUGINGEN="$(mktemp)" -ESCAPEDPLUGIN="$(mktemp)" -WRAPPEDPLUGIN="$(mktemp)" -DEFAULTINIT="$(mktemp)" -MAINJSFILE="$1" +PLUGIN="$(mktemp)" +CSSINSERTCODE="$(mktemp)" +PLUGINWITHCSS="$(mktemp)" +URL="https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/COLOR" generateFiles() { - mkdir -p "$3" - cat js/plugin.js \ - | sed "s/CSSSHAPEURL/$1/g" \ - | sed "s/CSSCOLORURL/$2/g" \ - > "$PLUGINGEN" - - if grep -q "paveyry" "$MAINJSFILE"; then - echo "The specified main.js file is already patched, please specify a clean main.js file from a fresh release" - return 1 - fi - - [ -z "$MAINJSFILE" ] || cat $PLUGINGEN | sed "s/\\\/\\\\\\\\/g" > "$ESCAPEDPLUGIN" - [ -z "$MAINJSFILE" ] || cat js/electron_code_wrapper.js | sed "/CODEHERE/r $ESCAPEDPLUGIN" > $WRAPPEDPLUGIN - [ -z "$MAINJSFILE" ] || cat $MAINJSFILE $WRAPPEDPLUGIN > $3/main.js - - cat js/gmonkeyscript_template.js "$PLUGINGEN" > "$3/gmonkeyscript.js" + mkdir -p "$2" + COLORURL="$(echo $URL | sed "s/COLOR/$1/g")" + [ -z $1 ] && COLORURL="" + cat js/insert_css.js | sed "s#CSSCOLORURL#$COLORURL#g" > "$CSSINSERTCODE" + cat js/plugin.js | sed "/INSERTCSS/r $CSSINSERTCODE" > "$PLUGINWITHCSS" + cat js/plugin.js | sed "s/^.*INSERTCSS$//g" > "$PLUGIN" + + cat js/gmonkeyscript_template.js "$PLUGINWITHCSS" > "$2/gmonkeyscript.js" + + VERSION="$(git tag | tail -n 1 | cut -c2-)" + mkdir -p "$2/firefox" + cat browser_extensions/firefox_manifest.json | sed "s/VERSION/$VERSION/g" | sed "s/COLOR/$3/g" > $2/firefox/manifest.json + cp css/shape.css $2/firefox/ + [ -z $1 ] && touch $2/firefox/color.css || cp "css/$1" $2/firefox/color.css + cp "$PLUGIN" $2/firefox/plugin.js + mkdir -p "$2/firefox/icons" + cp browser_extensions/icon.png "$2/firefox/icons/icon.png" } -generateFiles "https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/shape.css" "https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/color_slack.css" "out/slacktheme" +generateFiles "color_slack.css" "out/slacktheme" "Slack" -generateFiles "https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/shape.css" "" "out/ghctheme" +generateFiles "" "out/ghctheme" "GHC" -generateFiles "https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/shape.css" "https:\/\/raw.githubusercontent.com\/paveyry\/better-hangoutschat\/master\/css\/color_dark.css" "out/darktheme" +generateFiles "color_dark.css" "out/darktheme" "Dark" -rm -rf "$DEFAULTINIT" "$PLUGINGEN" "$ESCAPEDPLUGIN" "$WRAPPEDPLUGIN" +rm -rf "$PLUGINGEN" "$PLUGINWITHCSS" diff --git a/js/electron_code_wrapper.js b/js/electron_code_wrapper.js deleted file mode 100644 index 7ee78fa..0000000 --- a/js/electron_code_wrapper.js +++ /dev/null @@ -1,24 +0,0 @@ -const app = require('electron').app; -app.on('web-contents-created', (e, webContents) => { - var code = ` - ( - function(){ - // CODEHERE - }() - ) - `; - if (webContents.id > -1) { - webContents.on('did-finish-load', () => { - var millisecondsToWait = 3500; - setTimeout(function() { - webContents.executeJavaScript(`(console.log("running better-hangoutschat..."))`); - webContents.executeJavaScript(code, true); - }, millisecondsToWait); - }); - webContents.on('before-input-event', (event, input) => { - if (input.key == "F12") { - webContents.openDevTools(); - } - }); - } -}) diff --git a/js/insert_css.js b/js/insert_css.js new file mode 100644 index 0000000..aeabdce --- /dev/null +++ b/js/insert_css.js @@ -0,0 +1,37 @@ +// Then get its webviews +let webviews = document.querySelectorAll("webview"); + +function loadCSS(cssPath) { + if (cssPath == '') { + return; + } + // Fetch our CSS in parallel ahead of time + let cssPromise = fetch(cssPath).then(response => response.text()); + + // Insert a style tag into the wrapper view + cssPromise.then(css => { + let s = document.createElement('style'); + s.type = 'text/css'; + s.innerHTML = css; + document.head.appendChild(s); + }); + + // Wait for each webview to load + webviews.forEach(webview => { + webview.addEventListener('ipc-message', message => { + if (message.channel == 'didFinishLoading') + // Finally add the CSS into the webview + cssPromise.then(css => { + let script = "let s = document.createElement('style');"+ + "s.type = 'text/css';"+ + "s.id = 'slack-custom-css';"+ + "s.innerHTML = '"+css+"';"+ + "document.head.appendChild(s);"; + webview.executeJavaScript(script); + }) + }); + }); +} + +loadCSS('https://raw.githubusercontent.com/paveyry/better-hangoutschat/master/css/shape.css'); +loadCSS('CSSCOLORURL'); diff --git a/js/plugin.js b/js/plugin.js index 764055c..2384265 100644 --- a/js/plugin.js +++ b/js/plugin.js @@ -71,44 +71,8 @@ function inject(){ addLinkButton(document.getElementsByClassName("oJM7Pc")[0]); insertionQ('.oJM7Pc').every(addLinkButton); - - // Then get its webviews - let webviews = document.querySelectorAll("webview"); - function loadCSS(cssPath) { - if (cssPath == '') { - return; - } - // Fetch our CSS in parallel ahead of time - let cssPromise = fetch(cssPath).then(response => response.text()); - - // Insert a style tag into the wrapper view - cssPromise.then(css => { - let s = document.createElement('style'); - s.type = 'text/css'; - s.innerHTML = css; - document.head.appendChild(s); - }); - - // Wait for each webview to load - webviews.forEach(webview => { - webview.addEventListener('ipc-message', message => { - if (message.channel == 'didFinishLoading') - // Finally add the CSS into the webview - cssPromise.then(css => { - let script = "let s = document.createElement('style');"+ - "s.type = 'text/css';"+ - "s.id = 'slack-custom-css';"+ - "s.innerHTML = '"+css+"';"+ - "document.head.appendChild(s);"; - webview.executeJavaScript(script); - }) - }); - }); - } - - loadCSS('CSSSHAPEURL'); - loadCSS('CSSCOLORURL'); +// INSERTCSS } if ( window !== undefined ) {