Skip to content
This repository was archived by the owner on Apr 13, 2020. It is now read-only.

Commit cc09f24

Browse files
dennisseahyradsmikhamsamiyaakhtar
authored
[FEATURE] Present information in https://catalystcode.github.io/spk/commands on changes in commands between releases (#538)
* [DOC] comparing command changes between releases * add comand value change * anchor for release changes * add jsDoc * cleanup Co-authored-by: Yvonne Radsmikham <[email protected]> Co-authored-by: Samiya Akhtar <[email protected]>
1 parent a40b396 commit cc09f24

File tree

5 files changed

+4385
-21
lines changed

5 files changed

+4385
-21
lines changed

‎docs/commands/change-rels.js

+330
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,330 @@
1+
/* eslint-disable */
2+
var changeTemplate =
3+
'<div class="change-container"><div class="change-header" id="change_rel_@@id-version@@">@@version@@</div><div class="change-content">@@changes@@</div></div>';
4+
var commandAddedTemplate =
5+
'<div class="change-item-header">Commands Added</div><ul class="change-list">@@changes@@</ul>';
6+
var commandRemovedTemplate =
7+
'<div class="change-item-header">Commands Removed</div><ul class="change-list">@@changes@@</ul>';
8+
var commandValueChangedTemplate =
9+
'<div class="change-option-header">Command Values Changed</div><ul class="change-list">@@changes@@</ul>';
10+
var optionAddedTemplate =
11+
'<div class="change-option-header">Options Added</div><ul class="change-list">@@changes@@</ul>';
12+
var optionRemovedTemplate =
13+
'<div class="change-option-header">Options Removed</div><ul class="change-list">@@changes@@</ul>';
14+
var optionChangedTemplate =
15+
'<div class="change-option-header">Options Changed</div><ul class="change-list">@@changes@@</ul>';
16+
17+
/**
18+
* Returns variable name associate with an argument.
19+
* e.g. --service-principal-id -> servicePrincipalId
20+
* @param arg arugment
21+
*/
22+
function argToVariableName(arg) {
23+
var match = arg.match(/\s?--([-\w]+)\s?/);
24+
if (match) {
25+
return match[1]
26+
.replace(/\.?(-[a-z])/g, (_, y) => {
27+
return y.toUpperCase();
28+
})
29+
.replace(/-/g, "");
30+
}
31+
return null;
32+
}
33+
34+
/**
35+
* Compare two versions to figure out what new commands are added
36+
*
37+
* @param prev Previous version
38+
* @param cur Current version
39+
*/
40+
function compareVersionDiff(prev, cur) {
41+
var prevKeys = Object.keys(prev);
42+
var results = Object.keys(cur).filter(function (k) {
43+
return prevKeys.indexOf(k) === -1;
44+
});
45+
return results.length > 0 ? results : undefined;
46+
}
47+
48+
/**
49+
* Compare two set of options in the same command to figure out what new options are added.
50+
*
51+
* @param prev set of options in the same command in previous release
52+
* @param cur set of options in the same command in current release
53+
*/
54+
function compareArgsDiff(prev, cur) {
55+
var prevKeys = prev.map(function (opt) {
56+
return opt.arg;
57+
});
58+
59+
return cur
60+
.filter(function (opt) {
61+
return prevKeys.indexOf(opt.arg) === -1;
62+
})
63+
.map(function (opt) {
64+
return opt.arg;
65+
});
66+
}
67+
68+
/**
69+
* Compare two set of options in the same command to figure out the changes.
70+
* New options added, Option removed, Option args changed.
71+
*
72+
* @param prev set of options in the same command in previous release
73+
* @param cur set of options in the same command in current release
74+
*/
75+
function compareArgsChanged(prev, cur) {
76+
var optionsPrev = prev.options || [];
77+
var optionsCur = cur.options || [];
78+
var changes = {};
79+
var aliases = {};
80+
var aliasChanged = [];
81+
var aliasesRm = {};
82+
83+
var removed = compareArgsDiff(optionsCur, optionsPrev);
84+
if (removed.length > 0) {
85+
removed.forEach(function (r) {
86+
var m = r.match(/^-([a-zA-Z]),\s/);
87+
if (m) {
88+
var varName = argToVariableName(r);
89+
aliases[varName] = m[1];
90+
aliasesRm[varName] = r;
91+
}
92+
});
93+
}
94+
95+
// to figure out the change in options by comparing
96+
// old vs new
97+
var added = (compareArgsDiff(optionsPrev, optionsCur) || []).filter(function (
98+
add
99+
) {
100+
var m = add.match(/^-([a-zA-Z]),\s/);
101+
if (m) {
102+
var varName = argToVariableName(add);
103+
if (varName in aliases) {
104+
var idx = removed.indexOf(aliasesRm[varName]);
105+
removed.splice(idx, 1);
106+
aliasChanged.push(
107+
'change "' + aliasesRm[varName] + '" to "' + add + '"'
108+
);
109+
return false;
110+
}
111+
}
112+
return true;
113+
});
114+
115+
if (removed.length > 0) {
116+
changes.removed = removed;
117+
}
118+
119+
if (added.length > 0) {
120+
changes.added = added;
121+
}
122+
123+
if (aliasChanged.length > 0) {
124+
changes.changed = aliasChanged;
125+
}
126+
127+
return Object.keys(changes).length > 0 ? changes : null;
128+
}
129+
130+
/**
131+
* Compare changes in two set of commands. one from previous
132+
* release and one from current release
133+
*
134+
* @param prev set of commands from previous release
135+
* @param cur set of commands from current release
136+
*/
137+
function compareVersionChanged(prev, cur) {
138+
var changes = {};
139+
var curKeys = Object.keys(cur);
140+
var commonKeys = Object.keys(prev).filter(function (k) {
141+
return curKeys.indexOf(k) !== -1;
142+
});
143+
144+
commonKeys.forEach(function (k) {
145+
var newCmd = cur[k];
146+
var prevCmd = prev[k];
147+
var modified = {};
148+
149+
if (newCmd.command !== prevCmd.command) {
150+
modified["command"] = prevCmd.command + " to " + newCmd.command;
151+
}
152+
153+
if (newCmd.alias !== prevCmd.alias) {
154+
modified["alias"] = {
155+
prev: prevCmd.alias,
156+
newCmd: newCmd.alias,
157+
};
158+
}
159+
160+
var optChanges = compareArgsChanged(prevCmd, newCmd);
161+
162+
if (optChanges) {
163+
modified.options = optChanges;
164+
}
165+
166+
if (Object.keys(modified).length > 0) {
167+
changes[k] = modified;
168+
}
169+
});
170+
171+
return Object.keys(changes).length > 0 ? changes : undefined;
172+
}
173+
174+
/**
175+
* Compare two releases/versions e.g. master against 0.6.0
176+
*
177+
* @param prev previous version number e.g. 0.5.8
178+
* @param cur current version number e.g. 0.5.9
179+
*/
180+
function compareVersion(prev, cur) {
181+
var prevData = dataCache[prev];
182+
var curData = dataCache[cur];
183+
var data = {};
184+
185+
var added = compareVersionDiff(prevData, curData);
186+
if (added) {
187+
data.added = added;
188+
}
189+
190+
var removed = compareVersionDiff(curData, prevData);
191+
if (removed) {
192+
data.removed = removed;
193+
}
194+
195+
var changed = compareVersionChanged(prevData, curData);
196+
if (changed) {
197+
data.changed = changed;
198+
}
199+
200+
return Object.keys(data).length > 0 ? data : undefined;
201+
}
202+
203+
/**
204+
* Returns HTML for each command change
205+
*
206+
* @param oChanges changes information
207+
*/
208+
function getChangesHTML(oChanges) {
209+
changes = "";
210+
if (oChanges.added) {
211+
changes = commandAddedTemplate.replace(
212+
"@@changes@@",
213+
oChanges.added
214+
.map(function (add) {
215+
return "<li>spk " + sanitize(add) + "</li>";
216+
})
217+
.join("")
218+
);
219+
}
220+
if (oChanges.removed) {
221+
changes += commandRemovedTemplate.replace(
222+
"@@changes@@",
223+
oChanges.removed
224+
.map(function (rm) {
225+
return "<li>spk " + sanitize(rm) + "</li>";
226+
})
227+
.join("")
228+
);
229+
}
230+
if (oChanges.changed) {
231+
var optionChanges = "";
232+
Object.keys(oChanges.changed).forEach(function (k) {
233+
optionChanges +=
234+
'<div class="option-change"><div class="option-change-title">' +
235+
k +
236+
"</div>";
237+
238+
if (oChanges.changed[k].command) {
239+
optionChanges += commandValueChangedTemplate.replace(
240+
"@@changes@@",
241+
sanitize(oChanges.changed[k].command)
242+
);
243+
}
244+
245+
if (oChanges.changed[k].options) {
246+
var options = oChanges.changed[k].options;
247+
248+
if (options.added) {
249+
optionChanges += optionAddedTemplate.replace(
250+
"@@changes@@",
251+
options.added
252+
.map(function (add) {
253+
return "<li>" + sanitize(add) + "</li>";
254+
})
255+
.join("")
256+
);
257+
}
258+
if (options.removed) {
259+
optionChanges += optionRemovedTemplate.replace(
260+
"@@changes@@",
261+
options.removed
262+
.map(function (rm) {
263+
return "<li>" + sanitize(rm) + "</li>";
264+
})
265+
.join("")
266+
);
267+
}
268+
if (options.changed) {
269+
optionChanges += optionChangedTemplate.replace(
270+
"@@changes@@",
271+
options.changed
272+
.map(function (chg) {
273+
return "<li>" + sanitize(chg) + "</li>";
274+
})
275+
.join("")
276+
);
277+
}
278+
}
279+
optionChanges += "</div>";
280+
});
281+
282+
return (
283+
changes +
284+
'<div class="change-item-header">Commands Changed</div>' +
285+
optionChanges
286+
);
287+
}
288+
}
289+
290+
/**
291+
* Insert HTML element for command changes DIV.
292+
*/
293+
function compareVersions() {
294+
var versions = Object.keys(dataCache);
295+
versions.sort();
296+
var cur = versions.shift();
297+
var dataChanges = {};
298+
299+
versions.forEach(function (ver) {
300+
dataChanges[ver] = compareVersion(cur, ver);
301+
cur = ver;
302+
});
303+
versions.reverse();
304+
305+
$("#changes").append(
306+
versions
307+
.map(function (v) {
308+
var oChanges = dataChanges[v];
309+
var changes = oChanges ? getChangesHTML(oChanges) : "no changes";
310+
return changeTemplate
311+
.replace(/@@id-version@@/g, v.replace(/\./g, "_"))
312+
.replace(/@@version@@/g, v)
313+
.replace("@@changes@@", changes);
314+
})
315+
.join("")
316+
);
317+
if (window.location.hash && window.location.hash.startsWith("#change_rel_")) {
318+
try {
319+
var oDiv = $(window.location.hash);
320+
if (oDiv && oDiv[0]) {
321+
oDiv[0].scrollIntoView();
322+
}
323+
} catch (e) {
324+
console.log(e);
325+
}
326+
}
327+
$(".change-header").click(function () {
328+
window.location.hash = "#" + $(this).prop("id");
329+
});
330+
}

‎docs/commands/index.html

+27-5
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,12 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<link rel="stylesheet" href="styles/feb02e3b.site-ltr.css">
77
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
8+
<link rel="stylesheet" href="styles/ms.css ">
89
<link rel="stylesheet" href="styles/spk.css ">
910
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" crossorigin="anonymous"></script>
1011
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js"></script>
1112
<script src="./spk.js"></script>
13+
<script src="./change-rels.js"></script>
1214
<title>SPK Commands</title>
1315
</head>
1416
<body>
@@ -36,8 +38,24 @@
3638
</div>
3739
<div id="header">
3840
<div class="header-left-text">
39-
<div><img width="30px" src="images/mslogo.png"></div>
40-
<div class="header-text">SPK</div>
41+
<header id="azure-header" class="azure-header">
42+
<div class="logo-container">
43+
<div><img width="30px" src="images/mslogo.png"></div>
44+
<div class="header-text">SPK</div>
45+
</div>
46+
47+
<nav class="nav-main" aria-label="Site navigation"></nav>
48+
<nav class="nav-basic" aria-label="Utility navigation">
49+
<ul id="nav-main-links" class="nav-main-links">
50+
<li id="navigation-overview">
51+
<a href="javascript:showCommandView();">Command</a>
52+
</li>
53+
<li>
54+
<a href="javascript:showChangesView();">Changes</a>
55+
</li>
56+
</ul>
57+
</nav>
58+
</header>
4159
</div>
4260
</div>
4361
<div id="subheader">
@@ -50,11 +68,10 @@
5068
<span class="tinyfont">Share</span>
5169
</div>
5270
</div>
53-
<div id="content">
71+
<div id="content" class="page">
5472
<div class="content-left">
5573
<div class="title">SPK Commands</div>
5674
<div>
57-
5875
<div class="moniker-picker2" data-bi-name="moniker-picker" style="width:90%;margin-left:4px">
5976
<div class="dropdown has-margin-bottom-small">
6077
<button id="btnSelectRelease" class="dropdown-trigger has-flex-justify-content-start is-full-width button is-small has-border has-inner-focus" aria-expanded="false" aria-controls="ax-3">
@@ -84,6 +101,11 @@
84101

85102
<div id="spk-details" class="content-right"></div>
86103
</div>
87-
104+
105+
<div id="changes" class="page" style="display: none">
106+
<div class="title">Changes over releases</div>
107+
108+
</div>
109+
88110
</body>
89111
</html>

0 commit comments

Comments
 (0)