From ac801833433c024cbea6c472eb69835814e3cdac Mon Sep 17 00:00:00 2001
From: Eric Fischer <efischer@edx.org>
Date: Thu, 21 Sep 2017 16:32:06 -0400
Subject: [PATCH] Add studio-frontend to studio, if waffle flag set

---
 .gitignore                     |  1 +
 cms/templates/asset_index.html | 23 +++++++++++++++++------
 package.json                   |  1 +
 pavelib/assets.py              | 18 +++++++++++++++---
 4 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/.gitignore b/.gitignore
index 637b00b853..13e6d07f4f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -95,6 +95,7 @@ lms/static/css/
 lms/static/certificates/css/
 cms/static/css/
 common/static/common/js/vendor/
+common/static/common/css/vendor/
 common/static/bundles
 webpack-stats.json
 
diff --git a/cms/templates/asset_index.html b/cms/templates/asset_index.html
index aa9e4e65cc..9634501eaa 100644
--- a/cms/templates/asset_index.html
+++ b/cms/templates/asset_index.html
@@ -13,13 +13,19 @@
 <%namespace name='static' file='static_content.html'/>
 
 <%block name="header_extras">
-% for template_name in ["asset"]:
-<script type="text/template" id="${template_name}-tpl">
-    <%static:include path="js/${template_name}.underscore" />
-</script>
-% endfor
+% if waffle_flag_enabled:
+    <link rel="stylesheet" type="text/css" href="${static.url('common/css/vendor/studio-frontend.min.css')}" />
+    <script type="text/javascript" src="${static.url('common/js/vendor/assets.min.js')}" defer></script>
+% else:
+    % for template_name in ["asset"]:
+    <script type="text/template" id="${template_name}-tpl">
+        <%static:include path="js/${template_name}.underscore" />
+    </script>
+    % endfor
+% endif
 </%block>
 
+% if not waffle_flag_enabled:
 <%block name="requirejs">
     require(["js/factories/asset_index"], function (AssetIndexFactory) {
         AssetIndexFactory({
@@ -30,6 +36,7 @@
         });
     });
 </%block>
+% endif
 
 <%block name="content">
 
@@ -53,7 +60,11 @@
 <div class="wrapper-content wrapper">
     <div class="content">
         <div class="content-primary">
-            <div class="wrapper-assets"> </div>
+            % if waffle_flag_enabled:
+                <div id="root"></div>
+            % else:
+                <div class="wrapper-assets"></div>
+            % endif
             <div class="ui-loading">
                 <p><span class="spin"><span class="icon fa fa-refresh" aria-hidden="true"></span></span> <span class="copy">${_("Loading")}</span></p>
             </div>
diff --git a/package.json b/package.json
index fa0be9b955..cd3cb8a4ba 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
     "backbone.paginator": "~2.0.3",
     "coffee-loader": "^0.7.3",
     "coffee-script": "1.6.1",
+    "@edx/studio-frontend": "0.1.0",
     "edx-bootstrap": "^0.2.1",
     "edx-pattern-library": "0.18.1",
     "edx-ui-toolkit": "1.5.2",
diff --git a/pavelib/assets.py b/pavelib/assets.py
index 2d4261c219..282372d9f8 100644
--- a/pavelib/assets.py
+++ b/pavelib/assets.py
@@ -64,6 +64,10 @@ NPM_INSTALLED_LIBRARIES = [
     'requirejs/require.js',
     'underscore.string/dist/underscore.string.js',
     'underscore/underscore.js',
+    '@edx/studio-frontend/dist/assets.min.js',
+    '@edx/studio-frontend/dist/assets.min.js.map',
+    '@edx/studio-frontend/dist/studio-frontend.min.css',
+    '@edx/studio-frontend/dist/studio-frontend.min.css.map'
 ]
 
 # A list of NPM installed developer libraries that should be copied into the common
@@ -74,7 +78,9 @@ NPM_INSTALLED_DEVELOPER_LIBRARIES = [
 ]
 
 # Directory to install static vendor files
-NPM_VENDOR_DIRECTORY = path('common/static/common/js/vendor')
+NPM_JS_VENDOR_DIRECTORY = path('common/static/common/js/vendor')
+NPM_CSS_VENDOR_DIRECTORY = path("common/static/common/css/vendor")
+NPM_CSS_DIRECTORY = path("common/static/common/css")
 
 # system specific lookup path additions, add sass dirs if one system depends on the sass files for other systems
 SASS_LOOKUP_DEPENDENCIES = {
@@ -604,10 +610,14 @@ def process_npm_assets():
         Copies a vendor library to the shared vendor directory.
         """
         library_path = 'node_modules/{library}'.format(library=library)
+        if library.endswith('.css') or library.endswith('.css.map'):
+            vendor_dir = NPM_CSS_VENDOR_DIRECTORY
+        else:
+            vendor_dir = NPM_JS_VENDOR_DIRECTORY
         if os.path.exists(library_path):
             sh('/bin/cp -rf {library_path} {vendor_dir}'.format(
                 library_path=library_path,
-                vendor_dir=NPM_VENDOR_DIRECTORY,
+                vendor_dir=vendor_dir,
             ))
         elif not skip_if_missing:
             raise Exception('Missing vendor file {library_path}'.format(library_path=library_path))
@@ -618,7 +628,9 @@ def process_npm_assets():
         return
 
     # Ensure that the vendor directory exists
-    NPM_VENDOR_DIRECTORY.mkdir_p()
+    NPM_JS_VENDOR_DIRECTORY.mkdir_p()
+    NPM_CSS_DIRECTORY.mkdir_p()
+    NPM_CSS_VENDOR_DIRECTORY.mkdir_p()
 
     # Copy each file to the vendor directory, overwriting any existing file.
     print("Copying vendor files into static directory")