rtyler
/
blueocean-plugin
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Boring commit so I can push to sync repo

This commit is contained in:
Josh McDonald 2016-02-05 08:37:13 +11:00
parent 2e3d38463f
commit f19f201140
14 changed files with 322 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
js-plugin-experiments/.flowconfig Normal file
View File

@ -0,0 +1,8 @@
[ignore]
.*/node_modules/*.
[include]
[libs]
[options]

3
js-plugin-experiments/README.md
View File

@ -4,6 +4,9 @@ This isn't part of the maven build for now, just a place to flesh out ideas befo
Initially spawned from https://github.com/vasanthk/react-es6-webpack-boilerplate
All of the infrastructure, build code an static resources (css / images etc) should be considered
throwaway, but the JS code will probably be evolved into the real thing over time.
### Usage
```

9
js-plugin-experiments/index.html
View File

@ -1,10 +1,13 @@
<!DOCTYPE html>
<html>
<head>
<title>Sample App</title>
<title>Jenkins II' Champion Edition</title>
<link rel="stylesheet" href="/resources/style.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
</head>
<body>
<img src="/resources/logo.png" alt="Yarr">
<div id='root'></div>
<div id="root"></div>
<script src="/static/bundle.js"></script>
<script src="/resources/pre-compiled-plugin.js"></script>
</body>
</html>

30
js-plugin-experiments/npm-shrinkwrap.json generated
View File

@ -1173,6 +1173,11 @@
"from": "decamelize@>=1.0.0 <2.0.0",
"resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.1.2.tgz"
},
"deep-equal": {
"version": "1.0.1",
"from": "deep-equal@>=1.0.0 <2.0.0",
"resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz"
},
"deep-is": {
"version": "0.1.3",
"from": "deep-is@>=0.1.2 <0.2.0",
@ -2144,6 +2149,11 @@
"from": "has-flag@>=1.0.0 <2.0.0",
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
},
"history": {
"version": "1.17.0",
"from": "history@*",
"resolved": "https://registry.npmjs.org/history/-/history-1.17.0.tgz"
},
"home-or-tmp": {
"version": "1.0.0",
"from": "home-or-tmp@>=1.0.0 <2.0.0",
@ -2718,6 +2728,11 @@
"from": "qs@4.0.0",
"resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
},
"query-string": {
"version": "3.0.0",
"from": "query-string@>=3.0.0 <4.0.0",
"resolved": "https://registry.npmjs.org/query-string/-/query-string-3.0.0.tgz"
},
"querystring": {
"version": "0.2.0",
"from": "querystring@0.2.0",
@ -2770,6 +2785,11 @@
"from": "react-proxy@>=1.1.1 <2.0.0",
"resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.2.tgz"
},
"react-router": {
"version": "1.0.3",
"from": "react-router@*",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-1.0.3.tgz"
},
"readable-stream": {
"version": "2.0.5",
"from": "readable-stream@>=2.0.0 <2.1.0",
@ -2965,6 +2985,11 @@
"from": "stream-cache@>=0.0.1 <0.1.0",
"resolved": "https://registry.npmjs.org/stream-cache/-/stream-cache-0.0.2.tgz"
},
"strict-uri-encode": {
"version": "1.1.0",
"from": "strict-uri-encode@>=1.0.0 <2.0.0",
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
},
"string_decoder": {
"version": "0.10.31",
"from": "string_decoder@>=0.10.0 <0.11.0",
@ -3121,6 +3146,11 @@
"from": "vm-browserify@0.0.4",
"resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz"
},
"warning": {
"version": "2.1.0",
"from": "warning@>=2.0.0 <3.0.0",
"resolved": "https://registry.npmjs.org/warning/-/warning-2.1.0.tgz"
},
"watchpack": {
"version": "0.2.9",
"from": "watchpack@>=0.2.1 <0.3.0",

4
js-plugin-experiments/package.json
View File

@ -17,9 +17,11 @@
"author": "jmcdonald@cloudbees.com",
"license": "MIT",
"dependencies": {
"babel-runtime": "^6.3.19",
"history": "^1.17.0",
"react": "^0.14.5",
"react-dom": "^0.14.5",
"babel-runtime": "^6.3.19"
"react-router": "^1.0.3"
},
"devDependencies": {
"babel-core": "^6.3.21",

BIN
js-plugin-experiments/resources/dovescry.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 207 KiB

BIN
js-plugin-experiments/resources/hawhaw.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
js-plugin-experiments/resources/logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 66 KiB

16
js-plugin-experiments/resources/pre-compiled-plugin.js Normal file
View File

@ -0,0 +1,16 @@
(function($HACK){
// This is crappy and hand-coded because I haven't yet set up babel pipeline for anything that's not include()ed
var metadata = {
key: "example-js-plugin",
name: "Plain JS Plugin",
version: "0.0.0"
};
$HACK.registerPlugin(metadata);
})($HACK);

96
js-plugin-experiments/resources/style.css Normal file
View File

@ -0,0 +1,96 @@
* {
margin: 0;
}
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html, body, #outer {
display: flex;
flex: 1;
flex-direction: column;
}
html {
font-size: 62.5%;
}
body {
background: #e5e8e9;
color: #444;
font-family: -apple-system, 'san francisco', 'helvetica neue', helvetica, 'avenir next', avenir, roboto, noto, ubuntu, 'century gothic', 'franklin gothic', arial, sans-serif;
font-size: 1.4rem;
}
#outer {
min-height: 100vh;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
}
header {
background: #1d8ab7;
min-height: 3em;
display: flex;
flex-direction: row;
align-items: center;
}
#jenkins-logo {
margin: 0 1em;
}
header nav {
flex: 1;
display: flex;
flex-wrap: wrap;
align-items: stretch;
padding: 0 0.5rem 0.5rem 0;
}
header nav a {
color: white;
font-weight: bold;
text-decoration: none;
display: block;
border-radius: 0.4rem;
padding: 0.2rem 0.8rem;
margin: 0.5rem 0 0 0.5rem;
flex: 1 1 auto;
}
header nav a:hover {
box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.3);
background: rgba(0, 0, 0, 0.3);
}
header nav::after {
content: '';
flex: 10000 0 auto;
margin: 0;
padding: 0;
height: 0;
}
main {
flex: 1;
}
main article {
max-width: 60rem;
padding: 1rem;
margin-left: auto;
margin-right: auto;
}
footer {
background: #caced0;
font-size: 1.2rem;
text-align: center;
padding: 0.3rem;
}

34
js-plugin-experiments/scripts/App.jsx
View File

@ -1,10 +1,32 @@
import React, {Component} from 'react';
import { Link } from 'react-router';
// Root Blue Ocean UI component
export default class App extends Component {
render() {
return (
// Add your component markup and other subcomponent references here.
<h1>Hello, World!</h1>
);
}
render() {
console.log("Rendering App, props", this.props);
return (
<div id="outer">
<header>
<img src="/resources/logo.png" width="150" id="jenkins-logo"/>
<nav>
<Link to="/">Home</Link>
<Link to="/about">About</Link>
<Link to="/dynamic">Dynamic</Link>
</nav>
{/* <button onClick={window.$HACK.addDynamicRoute}>Add route</button> */}
</header>
<main>
{/* children currently set by router */}
{this.props.children}
</main>
<footer>
<p>This is a footer. I'm sure you'll agree.</p>
</footer>
</div>
);
}
}

42
js-plugin-experiments/scripts/blue-ocean/index.jsx Normal file
View File

@ -0,0 +1,42 @@
/**
* TODO: Docs
* @type {RegExp}
*/
//===[ Imports ]========================================================================================================
//===[ Consts ]=========================================================================================================
//===[ PluginManager ]==================================================================================================
const keyRegex = /^\w[-.\w\d_]+$/;
function validateKey(key) {
if (typeof(key) !== "string") {
throw new Error("Key not string");
}
if (!keyRegex.exec(key)) {
throw new Error("Key didn't match " + keyRegex);
}
}
export class PluginManager {
constructor() {
this.plugins = {};
}
registerPlugin(metadata) {
const {key, name} = metadata;
console.log("registerPlugin:", name, "key", key);
validateKey(key);
// TODO: Check for dupe keys
this.plugins[key] = metadata;
// TODO: notify changes to plugin list
// TODO: look up dependencies
// TODO: bind provided artefacts to namespace
// TODO: call some sort of "init" method for the plugin
// TODO: link plugin mappings to extension points
}
}

39
js-plugin-experiments/scripts/index.jsx
View File

@ -2,7 +2,42 @@ import React from 'react';
import {render} from 'react-dom';
import App from './App';
import { Router, Route, Link } from 'react-router';
import createBrowserHistory from 'history/lib/createBrowserHistory';
import {HomePage, AboutPage, NotFoundPage} from './pages.jsx';
import {PluginManager} from './blue-ocean';
// ------------------------------------------------------------------------------------
// THIS IS ALL BAD
function addDynamicRoute() {
//if (routes.length == 3) {
console.log("adding Dynamic route");
//routes.unshift({ path: "/dynamic", name: "added dynamically", component: ThirdPage, key: (routeKey++)});
//renderApp();
//}
}
const pluginManager = new PluginManager();
const registerPlugin = pluginManager.registerPlugin.bind(pluginManager);
window.$HACK = {
addDynamicRoute,
registerPlugin
};
// ^^^ ALL BAD
// ------------------------------------------------------------------------------------
render(
<App />,
document.getElementById('root')
<Router history={createBrowserHistory()}>
<Route component={App}>
<Route path="/" component={HomePage}/>
<Route path="/about" component={AboutPage}/>
<Route path="*" component={NotFoundPage}/>
</Route>
</Router>,
document.getElementById('root')
);

53
js-plugin-experiments/scripts/pages.jsx Normal file
View File

@ -0,0 +1,53 @@
import React, {Component} from 'react';
export class HomePage extends Component {
render() {
return <article>
<h1>Home</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad architecto autem deleniti, dicta
exercitationem explicabo facere harum hic inventore laborum magnam magni maiores molestias nemo
recusandae rem saepe! Illo, perferendis?</p>
</article>
}
}
export class AboutPage extends Component {
render() {
return <article>
<h1>About</h1>
<p>
Jenkins is an award-winning, cross-platform, continuous integration and continuous delivery application
that increases your productivity. Use Jenkins to build and test your software projects continuously
making it easier for developers to integrate changes to the project, and making it easier for users to
obtain a fresh build. It also allows you to continuously deliver your software by providing powerful
ways to define your build pipelines and integrating with a large number of testing and deployment
technologies.
</p>
</article>
}
}
//export class ThirdPage extends Component {
// render() {
// return <article>
// <h1>This is the third page</h1>
// <p>Its route is not hard-coded.</p>
// <p><img src="/resources/dovescry.png"/></p>
// </article>
// }
//}
// TODO: Replace this with a "plugin container" component that also knows about routes
export class NotFoundPage extends Component {
render() {
console.log("Rendering NotFoundPage, props", this.props);
return <article>
<h1>Not found</h1>
<p>This route (<strong>{this.props.location.pathname}</strong>) is not currently mapped to anything :(</p>
<p><img src="/resources/hawhaw.gif"/></p>
</article>
}
}