octoproject's Introduction

OctoProject

Browser extension that helps to work with multiple projects on GitHub

Features

Adds the following features to GitHub:

merged project boards. Just create a new project board and in the description put URLs to your other project boards
"Copy snapshot" button that puts a text summary of the project to clipboard. You can make a new snapshot or an incremental update at the end of an existing snapshot.

Installing

You can install it for Chrome and Firefox.

Build Setup

# install dependencies
npm install

# build for production with minification
npm run build

After you build, you'll have a build directory with two sub-directories webextension and firefox. WebExtension folder can be used for every browser that supports WebExtension except Firefox, and you can use firefox directory with you-guessed-it browser.

Adding to browser

Chrome: You can add build/webextension folder as an unpacked extension by going to chrome://extensions/ and clicking "Load unpacked extension".
Firefox: You can add build/firefox folder as an unpacked extension by going to about:debugging#addons then clicking "Load Temporary Add-on" and selecting manifest.json file.
Opera: You can add build/webextension folder as an unpacked extension by clicking Menu (or press alt), then selecting "Extensions", then on the top-right corner select "Developer Mode" then "Load unpacked extension", then select the folder.

Easier development

You can run

npm install -g webpack
webpack -w

This will watch for file changes and compile again after every file modification you make. Then in the browser, you'll need to "Reload extension" after each modification. Each modification will take you ~2 seconds to see live. Easy enough.

Publishing

After you build, you'll need to zip the extension and upload it to the desired store.

To do

Write tests

octoproject's People

Contributors

Watchers

octoproject's Issues

Moving cards between columns does not work

Moving cards between columns in merged projects is disabled at the moment, mostly because I didn't have time to try making this work.

Get back to this if needed.

Add automation in issue comments to move between columns

E.g. a text in the comment Moving to the column "Finished" should do just that.

Copy snapshot causes a the Fullscreen button to move unexpectedly

Cannot parse multiline project descriptions

Cannot parse multiline project descriptions to determine URLs for merged project boards.

Empty columns are not detached from DOM

Copy snapshot should have a prompt for a GitHub link

Copy snapshot should have a prompt for a GitHub link that contains a previous version of the snapshot. If provided, the resulting snapshot will be a diff between the snapshot and the current state.
If not provided, it will make a full snapshot.

window.initialSnapshot = '';

function makeProjectSnapshot() {
	let sb = [];
	const newLine = "\r\n";
	const title = document.querySelector("h3.d-flex.flex-items-center.f5");
	const cols = document.querySelectorAll("div.project-column");
	const date = new Date();

	sb.push("# ", title.innerText, " - ", date.getFullYear(), ".", (date.getMonth() + 1), ".", date.getDate(), newLine, newLine);

	for (let i = 0; i < cols.length; i++) {
		const col = cols[i];
		const title = col.querySelector("span.js-project-column-name").innerText;

		sb.push("### ", title);

		const issues = col.querySelectorAll("a.h5.d-block");

		sb.push(" (", issues.length, ")");
		sb.push(newLine, newLine);

		for (let j = 0; j < issues.length; j++) {
		  const issue = issues[j];
			if (window.initialSnapshot.indexOf(issue.href) > -1) {
				continue;
			}
			const url = issue.href;
			const name = escapeSpecialMarkdownChars(issue.innerText);

			sb.push("- [", name, "](", url, ")", newLine);
		}

		sb.push(newLine)
	}

	return sb.join("");
}

function escapeSpecialMarkdownChars (str) {
	str = str.replace(/</g, "&lt;");
	str = str.replace(/>/g, "&gt;");
	str = str.replace(/_/g, "\\_");
	return str;
}

makeProjectSnapshot()