Skip to content

Commit 69833c2

Browse files
consideRatioconsideRatio
authored
Merge pull request #1382 from yuvipanda/new-class
Slightly cleanup 2 js files
2 parents 731b92f + 7ddd16f commit 69833c2

File tree

3 files changed

+106
-105
lines changed

3 files changed

+106
-105
lines changed

‎binderhub/static/js/index.js‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import 'bootstrap';
1717
import 'event-source-polyfill';
1818

1919
import BinderImage from './src/image';
20-
import { markdownBadge, rstBadge } from './src/badge';
20+
import { makeBadgeMarkup } from './src/badge';
2121
import { getPathType, updatePathText } from './src/path';
2222
import { nextHelpText } from './src/loading';
2323

@@ -135,8 +135,12 @@ function updateUrls(formValues) {
135135
// update URLs and links (badges, etc.)
136136
$("#badge-link").attr('href', url);
137137
$('#basic-url-snippet').text(url);
138-
$('#markdown-badge-snippet').text(markdownBadge(url));
139-
$('#rst-badge-snippet').text(rstBadge(url));
138+
$('#markdown-badge-snippet').text(
139+
makeBadgeMarkup(BADGE_BASE_URL, BASE_URL, url, 'markdown')
140+
);
141+
$('#rst-badge-snippet').text(
142+
makeBadgeMarkup(BADGE_BASE_URL, BASE_URL, url, 'rst')
143+
);
140144
} else {
141145
['#basic-url-snippet', '#markdown-badge-snippet', '#rst-badge-snippet' ].map(function(item){
142146
const el = $(item);
@@ -159,7 +163,8 @@ function build(providerSpec, log, fitAddon, path, pathType) {
159163

160164
$('.on-build').removeClass('hidden');
161165

162-
const image = new BinderImage(providerSpec);
166+
const buildToken = $("#build-token").data('token');
167+
const image = new BinderImage(providerSpec, BASE_URL, buildToken);
163168

164169
image.onStateChange('*', function(oldState, newState, data) {
165170
if (data.message !== undefined) {

‎binderhub/static/js/src/badge.js‎

Lines changed: 12 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,16 @@
1-
const BASE_URL = $("#base-url").data().url;
2-
const BADGE_BASE_URL = $('#badge-base-url').data().url;
3-
let badge_url;
1+
export function makeBadgeMarkup(badgeBaseUrl, baseUrl, url, syntax) {
2+
let badgeImageUrl;
43

5-
if (BADGE_BASE_URL) {
6-
badge_url = BADGE_BASE_URL + "badge_logo.svg";
7-
}
8-
else {
9-
badge_url = window.location.origin + BASE_URL + "badge_logo.svg";
10-
}
4+
if (badgeBaseUrl) {
5+
badgeImageUrl = badgeBaseUrl + "badge_logo.svg";
6+
} else {
7+
badgeImageUrl = window.location.origin + baseUrl + "badge_logo.svg";
8+
}
119

12-
export function markdownBadge(url) {
13-
// return markdown badge snippet
14-
return "[![Binder](" + badge_url + ")](" + url + ")";
15-
}
10+
if (syntax === 'markdown') {
11+
return "[![Binder](" + badgeImageUrl + ")](" + url + ")";
12+
} else if (syntax === 'rst') {
13+
return ".. image:: " + badgeImageUrl + "\n :target: " + url;
1614

17-
export function rstBadge(url) {
18-
// return rst badge snippet
19-
return ".. image:: " + badge_url + "\n :target: " + url;
15+
}
2016
}

‎binderhub/static/js/src/image.js‎

Lines changed: 85 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -2,104 +2,104 @@ import { NativeEventSource, EventSourcePolyfill } from 'event-source-polyfill';
22

33
const EventSource = NativeEventSource || EventSourcePolyfill;
44

5-
export default function BinderImage(providerSpec) {
6-
this.providerSpec = providerSpec;
7-
this.callbacks = {};
8-
this.state = null;
9-
}
10-
11-
BinderImage.prototype.fetch = function() {
12-
const baseUrl = $("#base-url").data('url');
13-
let apiUrl = baseUrl + "build/" + this.providerSpec;
14-
const buildToken = $("#build-token").data('token');
15-
if (buildToken) {
16-
apiUrl = apiUrl + `?build_token=${buildToken}`;
5+
export default class BinderImage {
6+
constructor(providerSpec, baseUrl, buildToken) {
7+
this.providerSpec = providerSpec;
8+
this.baseUrl = baseUrl;
9+
this.buildToken = buildToken;
10+
this.callbacks = {};
11+
this.state = null;
1712
}
1813

19-
this.eventSource = new EventSource(apiUrl);
20-
const that = this;
21-
this.eventSource.onerror = function(err) {
22-
console.error("Failed to construct event stream", err);
23-
that.changeState("failed", {
24-
message: "Failed to connect to event stream\n"
25-
});
26-
};
27-
this.eventSource.addEventListener("message", function(event) {
28-
const data = JSON.parse(event.data);
29-
// FIXME: Rename 'phase' to 'state' upstream
30-
// FIXME: fix case of phase/state upstream
31-
let state = null;
32-
if (data.phase) {
33-
state = data.phase.toLowerCase();
14+
fetch() {
15+
let apiUrl = this.baseUrl + "build/" + this.providerSpec;
16+
if (this.buildToken) {
17+
apiUrl = apiUrl + `?build_token=${this.buildToken}`;
3418
}
35-
that.changeState(state, data);
36-
});
37-
};
3819

39-
BinderImage.prototype.close = function() {
40-
if (this.eventSource !== undefined) {
41-
this.eventSource.close();
20+
this.eventSource = new EventSource(apiUrl);
21+
this.eventSource.onerror = (err) => {
22+
console.error("Failed to construct event stream", err);
23+
this.changeState("failed", {
24+
message: "Failed to connect to event stream\n"
25+
});
26+
};
27+
this.eventSource.addEventListener("message", (event) => {
28+
const data = JSON.parse(event.data);
29+
// FIXME: Rename 'phase' to 'state' upstream
30+
// FIXME: fix case of phase/state upstream
31+
let state = null;
32+
if (data.phase) {
33+
state = data.phase.toLowerCase();
34+
}
35+
this.changeState(state, data);
36+
});
4237
}
43-
};
4438

45-
BinderImage.prototype.launch = function(url, token, path, pathType) {
46-
// redirect a user to a running server with a token
47-
if (path) {
48-
// strip trailing /
49-
url = url.replace(/\/$/, "");
50-
// trim leading '/'
51-
path = path.replace(/(^\/)/g, "");
52-
if (pathType === "file") {
53-
// trim trailing / on file paths
54-
path = path.replace(/(\/$)/g, "");
55-
// /doc/tree is safe because it allows redirect to files
56-
url = url + "/doc/tree/" + encodeURI(path);
57-
} else {
58-
// pathType === 'url'
59-
url = url + "/" + path;
39+
close() {
40+
if (this.eventSource !== undefined) {
41+
this.eventSource.close();
42+
}
43+
}
44+
45+
launch(url, token, path, pathType) {
46+
// redirect a user to a running server with a token
47+
if (path) {
48+
// strip trailing /
49+
url = url.replace(/\/$/, "");
50+
// trim leading '/'
51+
path = path.replace(/(^\/)/g, "");
52+
if (pathType === "file") {
53+
// trim trailing / on file paths
54+
path = path.replace(/(\/$)/g, "");
55+
// /doc/tree is safe because it allows redirect to files
56+
url = url + "/doc/tree/" + encodeURI(path);
57+
} else {
58+
// pathType === 'url'
59+
url = url + "/" + path;
60+
}
6061
}
62+
const sep = url.indexOf("?") == -1 ? "?" : "&";
63+
url = url + sep + $.param({ token: token });
64+
window.location.href = url;
6165
}
62-
const sep = url.indexOf("?") == -1 ? "?" : "&";
63-
url = url + sep + $.param({ token: token });
64-
window.location.href = url;
65-
};
6666

67-
BinderImage.prototype.onStateChange = function(state, cb) {
68-
if (this.callbacks[state] === undefined) {
69-
this.callbacks[state] = [cb];
70-
} else {
71-
this.callbacks[state].push(cb);
67+
onStateChange(state, cb) {
68+
if (this.callbacks[state] === undefined) {
69+
this.callbacks[state] = [cb];
70+
} else {
71+
this.callbacks[state].push(cb);
72+
}
7273
}
73-
};
7474

75-
BinderImage.prototype.validateStateTransition = function(oldState, newState) {
76-
if (oldState === "start") {
77-
return (
78-
newState === "waiting" || newState === "built" || newState === "failed"
79-
);
80-
} else if (oldState === "waiting") {
81-
return newState === "building" || newState === "failed";
82-
} else if (oldState === "building") {
83-
return newState === "pushing" || newState === "failed";
84-
} else if (oldState === "pushing") {
85-
return newState === "built" || newState === "failed";
86-
} else {
87-
return false;
75+
validateStateTransition(oldState, newState) {
76+
if (oldState === "start") {
77+
return (
78+
newState === "waiting" || newState === "built" || newState === "failed"
79+
);
80+
} else if (oldState === "waiting") {
81+
return newState === "building" || newState === "failed";
82+
} else if (oldState === "building") {
83+
return newState === "pushing" || newState === "failed";
84+
} else if (oldState === "pushing") {
85+
return newState === "built" || newState === "failed";
86+
} else {
87+
return false;
88+
}
8889
}
89-
};
9090

91-
BinderImage.prototype.changeState = function(state, data) {
92-
const that = this;
93-
[state, "*"].map(function(key) {
94-
const callbacks = that.callbacks[key];
95-
if (callbacks) {
96-
for (let i = 0; i < callbacks.length; i++) {
97-
callbacks[i](that.state, state || that.state, data);
91+
changeState(state, data) {
92+
[state, "*"].map(key => {
93+
const callbacks = this.callbacks[key];
94+
if (callbacks) {
95+
for (let i = 0; i < callbacks.length; i++) {
96+
callbacks[i](this.state, state || this.state, data);
97+
}
9898
}
99-
}
100-
});
99+
});
101100

102-
if (state && this.validateStateTransition(this.state, state)) {
103-
this.state = state;
101+
if (state && this.validateStateTransition(this.state, state)) {
102+
this.state = state;
103+
}
104104
}
105-
};
105+
}

0 commit comments

Comments
 (0)