Github integration

src/js/app.js

@@ -0,0 +1,41 @@
+import './../styles/scss/base.scss';
+import './../styles/css/base.css';
+import { parseWebDriverCommand } from '../../node_modules/blocking-proxy/built/lib/webdriver_commands';
+
+const Microbot = require("./microbot-ops.js");
+const app = new Microbot();
+document.write('<h1>' + app.createRepository() + '</h1>');
+
+var getUrlParameter = function getUrlParameter(sParam) {
+    var sPageURL = decodeURIComponent(window.location.search.substring(1)),
+        sURLVariables = sPageURL.split('&'),
+        sParameterName,
+        i;
+
+    for (i = 0; i < sURLVariables.length; i++) {
+        sParameterName = sURLVariables[i].split('=');
+
+        if (sParameterName[0] === sParam) {
+            return sParameterName[1] === undefined ? true : sParameterName[1];
+        }
+    }
+};
+
+// window.onload = function() {
+//     var code = getUrlParameter('code');
+//     console.log(code)
+//     if(code !== undefined) {
+//         var result = $.ajax({
+//             type: "POST",
+//             url: 'https://github.com/login/oauth/access_token',
+//             data: {
+//                 client_id: app.clientId,
+//                 client_secret: app.clientSecret,
+//                 code: code
+//             }
+//         });
+//        // alert(JSON.stringify(result));
+//     }
+//     //access_token = JSON.parse(result)['access_token']
+//     return code;
+// };

src/js/github-ops.js

@@ -0,0 +1,61 @@
+module.exports = class Github {
+
+    getToken() {
+
+    }
+
+    createRepository(newRepoJson) {
+        $.ajax({
+            type: "POST",
+            headers: {'Authorization' : 'token bcce9020b0604acc8a535d6d0e026b04b4996432'},
+            url: "https://api.github.com/user/repos",
+            contentType: "application/json",
+            dataType: "jsonp",
+            data: newRepoJson
+        })
+    }
+
+    updateRepository(updateRepoJson) {
+
+    }
+
+    deleteRepositoy(repoId) {
+
+    }
+
+    createIssue(newIssueJson) {
+
+    }
+
+    updateIssue(updateIssueJson) {
+
+    }
+
+    deleteIssue(issueId) {
+        
+    }
+
+    closeIssue(issueId) {
+
+    }
+
+    createUser(newuserJson) {
+
+    }
+
+    updateUser(updateUserJson) {
+
+    }
+
+    deleteUser(userId) {
+        
+    }
+
+    addCollaborator(userId, collaboratorId) {
+
+    }
+
+    removeCollaborator(userId, collaboratorId) {
+
+    }
+}

src/js/greeter.js

@@ -1,4 +1,4 @@
-class Greeter {
+module.exports = class Greeter {
     constructor(name) {
         this.name = name;
     }

src/js/index.js

@@ -1,5 +0,0 @@
-const Greeter = require("./Greeter");
-
-const g = new Greeter('Sapient');
-
-document.write('<h1>${g.greet()} </h1>')

src/js/microbot-ops.js

@@ -0,0 +1,27 @@
+const Github = require('./github-ops.js');
+const $github = new Github()
+
+module.exports = class Microbot {
+    
+    constructor(clientId, clientSecret) {
+        // TODO move to config or env variables
+        this.clientId = 'f6f649a1fe2dfea082ba';
+        this.clientSecret = '7e9a33d05ffdb36b4a498140bb9bb06d62de4f0e';
+    }
+
+    createRepository(repoName, repoType) {
+        $github.createRepository({
+            "name": "first-js-git-api-repo",
+            "description": "This is your first repository",
+            "homepage": "https://github.com",
+            "private": false,
+            "has_issues": true,
+            "has_wiki": true
+        })
+    }
+
+    // testingWebpackcalls() {
+
+    //     console.log('call successful');
+    // }
+}

src/styles/scss/base.scss

@@ -0,0 +1,333 @@
+$themeColor-Light: #f3e2c7;
+$themeColor-Dark:#252525;
+$theme-font: verdana, sans-serif;
+$theme-supplementer: #f39c12;
+
+body {
+    font-family: 'Poppins', sans-serif;
+    background-color: $themeColor-Dark;
+}
+
+p {
+    font-family: 'Poppins', sans-serif;
+    font-size: 1.1em;
+    font-weight: 300;
+    line-height: 1.7em;
+    color: #999;
+}
+
+a,
+a:hover,
+a:focus {
+    color: inherit;
+    text-decoration: none;
+    transition: all 0.3s;
+}
+
+.navbar {
+    padding: 15px 10px;
+    background: #fff;
+    border: none;
+    border-radius: 0;
+    margin-bottom: 40px;
+    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.navbar-btn {
+    box-shadow: none;
+    outline: none !important;
+    border: none;
+}
+
+.line {
+    width: 100%;
+    height: 1px;
+    border-bottom: 1px dashed #ddd;
+    margin: 40px 0;
+}
+
+i,
+span {
+    display: inline-block;
+}
+
+/* ---------------------------------------------------
+    SIDEBAR STYLE
+----------------------------------------------------- */
+
+.wrapper {
+    display: flex;
+    align-items: stretch;
+}
+
+#sidebar {
+    min-width: 250px;
+    max-width: 250px;
+    background: $theme-supplementer;
+    color: $themeColor-Dark;
+    transition: all 0.3s;
+}
+
+#sidebar.active {
+    min-width: 80px;
+    max-width: 80px;
+    text-align: center;
+}
+
+#sidebar.active .sidebar-header h3,
+#sidebar.active .CTAs {
+    display: none;
+}
+
+.sidebar-header h3 {
+  display: inline;
+  padding-left: 0.6em;
+  vertical-align: middle;
+}
+
+#sidebar.active .sidebar-header strong {
+    display: block;
+}
+
+#sidebar ul li a {
+    text-align: left;
+}
+
+#sidebar.active ul li a {
+    padding: 20px 10px;
+    text-align: center;
+    font-size: 0.85em;
+}
+
+#sidebar.active ul li a i {
+    margin-right: 0;
+    display: block;
+    font-size: 1.8em;
+    margin-bottom: 5px;
+}
+
+#sidebar.active ul ul a {
+    padding: 10px !important;
+}
+
+#sidebar.active .dropdown-toggle::after {
+    top: auto;
+    bottom: 10px;
+    right: 50%;
+    -webkit-transform: translateX(50%);
+    -ms-transform: translateX(50%);
+    transform: translateX(50%);
+}
+
+#sidebar .sidebar-header {
+    padding: 20px;
+    background:$themeColor-Dark;
+}
+
+#sidebar .sidebar-header strong {
+    display: none;
+    font-size: 1.8em;
+}
+
+#sidebar ul.components {
+    padding: 20px 0;
+    border-bottom: 1px solid #47748b;
+}
+
+#sidebar ul li a {
+    padding: 10px;
+    font-size: 1.1em;
+    display: block;
+}
+
+#sidebar ul li a:hover {
+    color: #7386D5;
+    background: #fff;
+}
+
+#sidebar ul li a i {
+    margin-right: 10px;
+}
+
+#sidebar ul li.active>a,
+a[aria-expanded="true"] {
+    color: $theme-supplementer;
+    background:$themeColor-Dark;
+}
+
+a[data-toggle="collapse"] {
+    position: relative;
+}
+
+.dropdown-toggle::after {
+    display: block;
+    position: absolute;
+    top: 50%;
+    right: 20px;
+    transform: translateY(-50%);
+}
+
+ul ul a {
+    font-size: 0.9em !important;
+    padding-left: 30px !important;
+    background: white;
+    font-weight: bolder;
+}
+
+ul.CTAs {
+    padding: 20px;
+}
+
+ul.CTAs a {
+    text-align: center;
+    font-size: 0.9em !important;
+    display: block;
+    border-radius: 5px;
+    margin-bottom: 5px;
+}
+
+a.download {
+    background: #fff;
+    color: #7386D5;
+}
+
+a.article,
+a.article:hover {
+    background: #6d7fcc !important;
+    color: #fff !important;
+}
+
+/* ---------------------------------------------------
+    CONTENT STYLE
+----------------------------------------------------- */
+
+#content {
+    width: 100%;
+    padding: 20px;
+    min-height: 100vh;
+    transition: all 0.3s;
+}
+
+/* ---------------------------------------------------
+    MEDIAQUERIES
+----------------------------------------------------- */
+
+@media (max-width: 768px) {
+    #sidebar {
+        min-width: 80px;
+        max-width: 80px;
+        text-align: center;
+        margin-left: -80px !important;
+    }
+    .dropdown-toggle::after {
+        top: auto;
+        bottom: 10px;
+        right: 50%;
+        -webkit-transform: translateX(50%);
+        -ms-transform: translateX(50%);
+        transform: translateX(50%);
+    }
+    #sidebar.active {
+        margin-left: 0 !important;
+    }
+    #sidebar .sidebar-header h3,
+    #sidebar .CTAs {
+        display: none;
+    }
+    #sidebar .sidebar-header strong {
+        display: block;
+    }
+    #sidebar ul li a {
+        padding: 20px 10px;
+    }
+    #sidebar ul li a span {
+        font-size: 0.85em;
+    }
+    #sidebar ul li a i {
+        margin-right: 0;
+        display: block;
+    }
+    #sidebar ul ul a {
+        padding: 10px !important;
+    }
+    #sidebar ul li a i {
+        font-size: 1.3em;
+    }
+    #sidebar {
+        margin-left: 0;
+    }
+    #sidebarCollapse span {
+        display: none;
+    }
+}
+/* -------------------------------------------------
+ADDITIONS
+--------------------------------------------------*/
+.hide {
+  display: none;
+}
+
+.prompt {
+  display: flex;
+  width: 2em;
+  border-right: 1px solid #c99034;
+  background-color: #f5d38b;
+  width: 4%;
+  margin-bottom: 40px;
+  border-radius: 4px 0 0 4px;
+}
+
+.promptext {
+  animation:blinkingText 0.8s infinite;
+  color: #975f04;
+  text-align: center;
+  line-height: 2em;
+  font: 1.5em bolder;
+  margin: auto;
+}
+
+@keyframes blinkingText {
+  0%{     color: #000;    }
+  49%{    color: transparent; }
+  50%{    color: transparent; }
+  99%{    color:transparent;  }
+  100%{   color: #000;    }
+}
+
+.headerprompt {
+  display: flex;
+  width: 100%;
+}
+
+.logotext {
+  color: $theme-supplementer;
+}
+
+#content nav div.collapse li a.nav-link i.far {
+  color: $theme-supplementer;
+  font-size: 1.8em;
+  padding: 0.2em;
+}
+/* --------------------------------------------------
+  OVERRIDES
+  --------------------------------------------------*/
+  .btn {
+    background-color: $theme-supplementer;
+    color: $themeColor-Dark
+  }
+
+  #content #header .navbar {
+    width: 96%;
+  }
+
+  .navbar-form {
+    width: 88%;
+  }
+
+  .form-control {
+    padding: .6rem 1em;
+  }
+
+  .container-fluid {
+    padding-left: 0.3em;
+  }