station 0.0.106 → 0.0.111

data/lib/nexmo_developer/app/views/static/default_landing/partials/_join_slack.html.erb

@@ -1,3 +1,3 @@
 <h2 class="Vlt-title--nomargin Vlt-center">
-    <%= image_tag 'slack.svg', id: 'community-slack-image' %> Join the <%= link_to "Vonage Developer Community Slack", community_slack_path, { :class=>"Vlt-text-btn" } %>
+    <%= image_pack_tag 'slack.svg', id: 'community-slack-image' %> Join the <%= link_to "Vonage Developer Community Slack", community_slack_path, { :class=>"Vlt-text-btn" } %>
 </h2>

data/lib/nexmo_developer/app/views/static/landing.html.erb

@@ -2,8 +2,8 @@
 
   <div class="row">
     <div class="center">
-      <h1 class="Vlt-title--margin-top2">Connected Code</h1>
-      <p class="p-large">Everything you need to build connected applications with Vonage APIs</p>
+      <h1 class="Vlt-title--margin-top2">Default Entry Page</h1>
+      <p class="p-large">This is the default landing page for a developer portal running on Station.</p>
     </div>
     <div class="columns small-12">
       <a name="products"></a>
@@ -17,10 +17,10 @@
             <h2>
               <a href="/tools">
                 <div><svg class="Vlt-icon Vlt-icon--large Vlt-purple-dark"><use xlink:href="/symbol/volta-icons.svg#Vlt-icon-design-tools"/></svg></div>
-                SDKs &amp; Tools
+                Featured Topic 1
               </a>
             </h2>
-            <p>The Nexmo libraries allow you to get up and running with<br>Nexmo APIs quickly in your language of choice.</p>
+            <p>You can choose to highlight an area of your portal on the landing page.</p>
           </div>
         </div>
         <div class="Vlt-col Vlt-col--M-1of2">
@@ -28,10 +28,10 @@
             <h2>
               <a href="/community">
                 <div><svg class="Vlt-icon Vlt-icon--large Vlt-purple-dark"><use xlink:href="/symbol/volta-icons.svg#Vlt-icon-group"/></svg></div>
-                Community
+                Featured Topic 2
               </a>
             </h2>
-            <p>Find out about our talks, community hacks,<br>and what events we'll be at.</p>
+            <p>You can highlight more than one area.</p>
           </div>
         </div>
       </div>
@@ -39,8 +39,8 @@
       <hr class="hr--tall">
 
       <div class="center">
-        <h3>Do you have a question?</h3>
-        <p class="p-large">We're always here to help. Check out our <a href="https://help.nexmo.com">support FAQs</a>, contact our super helpful <a href="https://help.nexmo.com/hc/en-us/requests/new">support team</a> or get in touch on <a href="http://stackoverflow.com/questions/tagged/nexmo">Stack Overflow</a>.<br />Your data will be treated in accordance with our <a href="https://www.nexmo.com/privacy-policy">Privacy Policy</a>, which sets out the rights you have in respect of your data.</p>
+        <h3>Modifying This Content</h3>
+        <p class="p-large">To modify this content you can copy <a href="https://raw.githubusercontent.com/Nexmo/station/master/lib/nexmo_developer/app/views/static/landing.html.erb">this file</a> to the `custom/views/static` folder in your documentation folder and modify that copy. More detailed instructions to create your own landing page can be found on the <a href="https://nexmo.github.io/station/How-To-Use#customization-options">Station documentation</a>.</p>
       </div>
     </div>
   </div>

data/lib/nexmo_developer/app/webpacker/javascript/code_snippet_events/index.js

@@ -1,89 +1,27 @@
-export default () => {
-    let hasTriggeredCopyStat = {};
-    let hasTriggeredLinkStat = {};
-
-    // Track copy to clipboard usage
-    var clipboard = new Clipboard('.copy-button',{
-        text: function(trigger) {
-            return $(trigger).next().find('.main-code').text();
-        }
-    });
-
-    clipboard.on('success', function(e) {
-        let trigger = $(e.trigger);
-
-        let params = {
-            "language": trigger.attr("data-lang"),
-            "snippet": trigger.attr("data-block"),
-            "section": trigger.attr("data-section"),
-            "event": "copy"
-        };
-
-        let key = params['language'] + params['section'] + params['snippet'];
-
-        // We only want to track each copy once per page load
-        if (hasTriggeredCopyStat[key]) { return true; }
-
-        trigger.find('span').text('Copied');
-
-        fetch(createRequest(params))
-            .then((response) => {
-                if (response.ok) { return response.json() }
-                return Promise.reject({ message: 'Bad response from server', response })
-            })
-            .then((payload) => {
-                hasTriggeredCopyStat[key] = true;
-            })
-
-        // Can we point them to the dependencies too?
-        if (trigger.parent().hasClass("main-code")) {
-            trigger.parent().parent().find(".configure-dependencies").prepend("<span class='label label--small'>Don't forget me!</span>");
-        }
+import Clipboard from 'clipboard';
 
-    });
-
-
-    clipboard.on('error', function(e) {
-        console.error('Action:', e.action);
-        console.error('Trigger:', e.trigger);
-    });
-
-    // Track source link usage
-    $(document).on('mousedown', '.source-link', function(e){
-        if (e.which === 3) { return; }
-        let trigger = $(this);
-
-        let section = trigger.attr("data-section");
-
-        let params = {
-            "language": trigger.attr("data-lang"),
-            "snippet": trigger.attr("data-block"),
-            "section": section,
-            "event": "source"
-        };
-
-        let key = params['language'] + params['section'];
-
-        if (hasTriggeredLinkStat[key]) { return true; }
-
-        fetch(createRequest(params))
-            .then((response) => {
-                if (response.ok) { return response.json() }
-                return Promise.reject({ message: 'Bad response from server', response })
-            })
-            .then((payload) => {
-                hasTriggeredLinkStat[key] = true;
-            })
-    });
+export default () => {
+  document.querySelectorAll('.code-toolbar button').forEach(function(button) {
+    button.addEventListener('click', createRequest, { once: true })
+  });
 };
 
-function createRequest(params) {
-    return new Request('/usage/code_snippet', {
-        method: 'POST',
-        credentials: 'same-origin',
-        body: JSON.stringify(params),
-        headers: {
-            'Content-Type': 'application/json'
-        }
-    });
+function createRequest(event) {
+  let dataset = event.target.closest('.code-toolbar').firstChild.dataset;
+
+  let params = {
+    "language": dataset.lang,
+    "snippet": dataset.block,
+    "section": dataset.section,
+    "event": "copy"
+  };
+
+  fetch(new Request('/usage/code_snippet', {
+    method: 'POST',
+    credentials: 'same-origin',
+    body: JSON.stringify(params),
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  }));
 }

data/lib/nexmo_developer/app/webpacker/javascript/volta/volta.js

@@ -1455,7 +1455,7 @@ Volta.tab = function () {
 
 			this._activeLink.setAttribute('tabindex', '0');
 			this._activeLink.setAttribute('aria-selected', 'true');
-			this._activeLink.focus();
+                        this._activeLink.focus({ preventScroll: true });
 			if (this._activePanel) {
 				this._activePanel.removeAttribute('hidden');
 			}

data/lib/nexmo_developer/app/webpacker/javascript/volta_tabbed_examples/index.js

@@ -11,6 +11,7 @@ export default class VoltaTabbedExamples {
       this.onTabClick = this.onTabClick.bind(this)
       this.onPopState = this.onPopState.bind(this)
       this.persistLanguage = this.persistLanguage.bind(this)
+      this.activateTabFromURLHash = this.activateTabFromURLHash.bind(this);
       this.restoreTabs()
       this.setupEvents()
     }
@@ -55,6 +56,9 @@ export default class VoltaTabbedExamples {
   setupEvents() {
     $('.Vlt-tabs__link').click(this.onTabClick)
     $(window).on('popstate', this.onPopState)
+
+    window.addEventListener("load", this.activateTabFromURLHash);
+    window.addEventListener("hashchange", this.activateTabFromURLHash);
   }
 
   onPopState(event) {
@@ -64,12 +68,14 @@ export default class VoltaTabbedExamples {
   }
 
   onTabClick(event) {
+    const target = $(event.currentTarget);
     // Prevent nested tabs from changing the url
     if ($(event.target).parents('.Vlt-tabs').length > 1) { return; }
 
-    const language = $(event.currentTarget).data('language')
-    const languageType = $(event.currentTarget).data('language-type')
-    const linkable = $(event.currentTarget).data('language-linkable')
+    const language = target.data('language')
+    const languageType = target.data('language-type')
+    const linkable = target.data('language-linkable')
+    const tabId = target.attr('id');
 
     if (language) {
       if (linkable) {
@@ -81,6 +87,8 @@ export default class VoltaTabbedExamples {
       }
 
       this.persistLanguage(language, languageType, linkable)
+    } else if (tabId) {
+      window.location.hash = tabId;
     }
   }
 
@@ -103,4 +111,16 @@ export default class VoltaTabbedExamples {
   setPlatform(platform) {
       setTimeout(() => { $(`[data-platform='${platform}']`).click(); }, 0);
   }
+
+  activateTabFromURLHash() {
+    let tabId = window.location.hash;
+
+    if (tabId !== "") {
+      let tab = document.querySelector(`.Vlt-tabs__link${tabId}`);
+      if (tab) {
+        tab.focus();
+        tab.click();
+      }
+    }
+  }
 }

data/lib/nexmo_developer/app/webpacker/packs/active_admin.js

@@ -0,0 +1,5 @@
+// Load Active Admin's styles into Webpacker,
+// see `active_admin.scss` for customization.
+import "../stylesheets/active_admin";
+
+import "@activeadmin/activeadmin";

data/lib/nexmo_developer/app/webpacker/packs/active_admin/print.scss

@@ -0,0 +1,2 @@
+/* Active Admin Print Stylesheet */
+@import "~@activeadmin/activeadmin/src/scss/print";

data/lib/nexmo_developer/app/webpacker/packs/application.js

@@ -14,14 +14,26 @@ import Rails from "@rails/ujs"
 
 import '../stylesheets/application'
 
+require.context('../images', true);
+require.context('../fonts', true);
+
 require.context('@vonagevolta/volta2/images/logos', true)
 require.context('@vonagevolta/volta2/dist/symbol', true)
 
+require('chartkick');
+require('chart.js');
+require('jquery');
+require('clipboard');
+require('underscore');
+require('@googlemaps/google-maps-services-js');
+
 // XXX: hack for Volta, unfortunately it doesn't provide modules :(
 import Volta from "../javascript/volta/volta.js"
 
 import Vue from 'vue'
 
+import mermaid from 'mermaid'
+
 import { TweenLite, CSSPlugin } from 'gsap'
 import GithubCards from '../javascript/github_cards'
 import VoltaTabbedExamples from '../javascript/volta_tabbed_examples'

data/lib/nexmo_developer/app/{assets → webpacker}/stylesheets/active_admin.scss

@@ -1,4 +1,4 @@
-// SASS variable overrides must be declared before loading up Active Admin's styles.
+// Sass variable overrides must be declared before loading up Active Admin's styles.
 //
 // To view the variables that Active Admin provides, take a look at
 // `app/assets/stylesheets/active_admin/mixins/_variables.scss` in the
@@ -8,10 +8,10 @@
 // $sidebar-width: 242px;
 
 // Active Admin's got SASS!
-@import "active_admin/mixins";
-@import "active_admin/base";
+@import "~@activeadmin/activeadmin/src/scss/mixins";
+@import "~@activeadmin/activeadmin/src/scss/base";
 
-// Overriding any non-variable SASS must be done after the fact.
+// Overriding any non-variable Sass must be done after the fact.
 // For example, to change the default status-tag color:
 //
 //   .status_tag { background: #6090DB; }

data/lib/nexmo_developer/app/webpacker/stylesheets/application.scss

@@ -34,7 +34,6 @@
 @import "./custom/syntax";
 @import "./custom/mixins";
 
-@import "./objects/building-block";
 @import "./objects/card";
 @import "./objects/collapsible";
 @import "./objects/content-block";

data/lib/nexmo_developer/app/webpacker/stylesheets/custom/_core.scss

@@ -19,7 +19,7 @@ em {
   font-style: italic;
 }
 
-#logo {
+#logo, #logo-small {
   display: flex;
 }
 

data/lib/nexmo_developer/app/webpacker/stylesheets/objects/_icons.scss

@@ -58,6 +58,7 @@ $icon-callback: "\ea2d";
         url('/public/assets/fonts/icomoon.svg?vz4q9h#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
+  font-display: swap;
 }
 
 [class^="icon-"], [class*=" icon-"] {

data/lib/nexmo_developer/app/webpacker/stylesheets/objects/_navigation.scss

@@ -65,12 +65,11 @@
 
 #Vlt-sidenav-mobile-trigger {
   display: inline-block;
-  margin-top: $unit0;
-  margin-right: $unit2;
 
   svg {
     height: 24px;
     width: 24px;
+    fill: #131415;
   }
 
   @media #{$M-plus} {

data/lib/nexmo_developer/config/environments/development.rb

@@ -47,7 +47,7 @@ Rails.application.configure do
   # Debug mode disables concatenation and preprocessing of assets.
   # This option may cause significant delays in view rendering with a large
   # number of complex assets.
-  config.assets.debug = true
+  # config.assets.debug = true
 
   config.assets.check_precompiled_asset = false
 

data/lib/nexmo_developer/config/environments/production.rb

@@ -20,7 +20,14 @@ Rails.application.configure do
 
   # Disable serving static files from the `/public` folder by default since
   # Apache or NGINX already handles this.
-  config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?
+  if ENV['RAILS_SERVE_STATIC_FILES'].present?
+    config.public_file_server.enabled = true
+
+    config.public_file_server.headers = {
+      'Cache-Control' => 'public, max-age=31536000',
+      'Expires' => 1.year.from_now.to_formatted_s(:rfc822),
+    }
+  end
 
   # Compress JavaScripts and CSS.
   # config.assets.js_compressor = Uglifier.new(harmony: true)

data/lib/nexmo_developer/config/initializers/active_admin.rb

@@ -13,6 +13,9 @@ ActiveAdmin.setup do |config|
   #
   # config.site_title_link = "/"
 
+  # Webpacker
+  config.use_webpacker = true
+
   # Set an optional image to be displayed for the header
   # instead of a string (overrides :site_title)
   #

data/lib/nexmo_developer/config/initializers/assets.rb

@@ -12,5 +12,3 @@ Rails.application.config.assets.paths << Rails.root.join('node_modules')
 # application.js, application.css, and all non-JS/CSS in the app/assets
 # folder are already added.
 # Rails.application.config.assets.precompile += %w( admin.js admin.css )
-
-Rails.application.config.assets.paths << Rails.root.join('app', 'assets', 'fonts')