WIP: Add simple AssetCreateView #4647

Create basic form for creating a Mediathread asset based on an
external image or video source.

mediathread/assetmgr/tests/test_views.py

@@ -18,7 +18,7 @@
     EMBED_WIDTH, EMBED_HEIGHT,
     asset_workspace_courselookup,
     RedirectToExternalCollectionView,
-    RedirectToUploaderView, AssetCreateView, AssetEmbedListView,
+    RedirectToUploaderView, ExternalAssetCreateView, AssetEmbedListView,
     _parse_domain, AssetEmbedView, annotation_delete,
     annotation_create_global, annotation_create, AssetUpdateView
 )
@@ -86,7 +86,7 @@ def test_sources_from_args(self):
                 'image': 'x' * 5000,  # too long
                 'url': 'https://www.youtube.com/abcdefghi'}
         request = RequestFactory().post('/save/', data)
-        sources = AssetCreateView.sources_from_args(request)
+        sources = ExternalAssetCreateView.sources_from_args(request)
 
         self.assertEquals(len(sources.keys()), 0)
 
@@ -95,7 +95,7 @@ def test_sources_from_args(self):
                 'image': 'https://www.flickr.com/',
                 'image-metadata': ['w720h526;text/html']}
         request = RequestFactory().post('/save/', data)
-        sources = AssetCreateView.sources_from_args(request)
+        sources = ExternalAssetCreateView.sources_from_args(request)
         self.assertEquals(len(sources.keys()), 2)
         self.assertEquals(sources['image'].url, 'https://www.flickr.com/')
         self.assertTrue(sources['image'].primary)
@@ -111,7 +111,7 @@ def test_sources_from_args(self):
             'metadata-description': 'Video description',
         }
         request = RequestFactory().post('/save/', data)
-        sources = AssetCreateView.sources_from_args(request)
+        sources = ExternalAssetCreateView.sources_from_args(request)
         self.assertEquals(len(sources.keys()), 2)
         self.assertEquals(sources['video'].url,
                           'http://www.example.com/video.mp4')
@@ -120,7 +120,7 @@ def test_sources_from_args(self):
         self.assertEquals(sources['video'].height, 358)
 
     def test_parse_user(self):
-        view = AssetCreateView()
+        view = ExternalAssetCreateView()
         request = RequestFactory().get('/')
         request.course = self.sample_course
 
@@ -222,7 +222,7 @@ def test_asset_create_via_bookmarklet(self):
         request.user = self.instructor_one
         request.course = self.sample_course
 
-        view = AssetCreateView()
+        view = ExternalAssetCreateView()
         view.request = request
         response = view.post(request)
 
@@ -240,7 +240,7 @@ def test_asset_create_via_bookmarklet(self):
         request.user = self.instructor_one
         request.course = self.sample_course
 
-        view = AssetCreateView()
+        view = ExternalAssetCreateView()
         view.request = request
         response = view.post(request)
 
@@ -1025,7 +1025,7 @@ def test_update_primary_and_thumb(self):
             self.assertEquals(self.asset.thumb_url, 'new thumb')
 
 
-class UploadedAssetCreateViewTest(MediathreadTestMixin, TestCase):
+class AssetCreateViewTest(MediathreadTestMixin, TestCase):
     def setUp(self):
         self.setup_sample_course()
         self.setup_alternate_course()

mediathread/assetmgr/urls.py

@@ -9,7 +9,7 @@
     MostRecentView, annotation_create, annotation_create_global,
     annotation_save, annotation_delete, asset_delete, final_cut_pro_xml,
     AnnotationCopyView, PDFViewerDetailView, S3SignView,
-    UploadedAssetCreateView
+    AssetCreateView
 )
 from mediathread.djangosherd.apiviews import SherdNoteCreate
 from mediathread.assetmgr.apiviews import AssetUpdate
@@ -36,7 +36,7 @@
     path('<int:asset_id>/annotations/<int:annot_id>/',
          AssetWorkspaceView.as_view(), {}, 'annotation-view'),
 
-    path('create/', UploadedAssetCreateView.as_view(), name='asset-create'),
+    path('create/', AssetCreateView.as_view(), name='asset-create'),
 
     path('create/<int:asset_id>/annotations/', annotation_create),
 

mediathread/assetmgr/views.py

@@ -155,7 +155,7 @@ def post(self, request):
 # This view is used by Mediathread's browser extension, so disable CSRF
 # until we implement this in the extension.
 @method_decorator(csrf_exempt, name='dispatch')
-class AssetCreateView(View):
+class ExternalAssetCreateView(View):
     OPERATION_TAGS = ('jump', 'title', 'noui', 'v', 'share',
                       'as', 'set_course', 'secret')
 
@@ -328,9 +328,10 @@ def post(self, request):
             return HttpResponseRedirect(asset_url)
 
 
-class UploadedAssetCreateView(LoggedInCourseMixin, View):
+class AssetCreateView(LoggedInCourseMixin, View):
     """
-    View for creating an Asset via an uploaded media object.
+    View for creating an Asset via an uploaded media object, or
+    a piece of media imported via the import form.
     """
     http_method_names = ['post']
 

mediathread/templates/main/collection_add.html

@@ -179,16 +179,62 @@ <h6 class="card-title mt-2">IMAGE</h6>
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title text-center">Import Media</h5>
+
+                           <form method="POST" action="{% url 'asset-create' %}">
+                               {% csrf_token %}
+                               <div class="form-group">
+                                   <label for="import-source-url">
+                                       Source URL
+                                   </label>
+                                   <input type="text"
+                                          id="import-source-url"
+                                          class="form-control"
+                                          name="url"
+                                          aria-describedby="sourceURL" />
+                                   <small class="form-text text-muted">
+                                       Right-click source image and "Copy image address"
+                                   </small>
+                               </div>
+                               <div class="form-group">
+                                   <label for="import-form-name">Asset Title</label>
+                                   <input type="text"
+                                          class="form-control"
+                                          id="import-form-name"
+                                          name="title" />
+                               </div>
+                               <button type="submit" class="btn btn-primary">
+                                   Import
+                               </button>
+                           </form>
+
+                           <hr />
+
                            <p class="card-text">
-                               Install Mediathread’s Google Chrome
-                               extension to import assets like video, audio, and
+                               Alternatively, you can install
+                               Mediathread’s Google Chrome extension
+                               to import assets like video, audio, and
                                images into this course from various
                                sites across the web.
 
-                               <ul><li>Visit the Chrome Web Store and make sure to click Add To Chrome.</li>
-                               <li>Once added to your browser, you can click on the Extension icon next
-                               to the Address Bar to pin the Mediathread extension for easier access.</li>
-                               <li>You can click the extension to collect single media items from sites like Flickr, YouTube, and Google Images.</li>
+                               <ul>
+                                   <li>
+                                       Visit the Chrome Web Store and
+                                       make sure to click Add To
+                                       Chrome.
+                                   </li>
+                                   <li>
+                                       Once added to your browser, you
+                                       can click on the Extension icon
+                                       next to the Address Bar to pin
+                                       the Mediathread extension for
+                                       easier access.
+                                   </li>
+                                   <li>
+                                       You can click the extension to
+                                       collect single media items from
+                                       sites like Flickr, YouTube, and
+                                       Google Images.
+                                   </li>
                                </ul>
 
                                You must be using a browser in the <a href="https://en.wikipedia.org/wiki/Chromium_(web_browser)#Browsers_based_on_Chromium">Chrome family</a>

mediathread/urls.py

@@ -23,7 +23,8 @@
     AssetDetailView, ReactAssetDetailView,
     TagCollectionView,
     RedirectToExternalCollectionView, RedirectToUploaderView,
-    AssetCreateView, BookmarkletMigrationView, AssetUpdateView)
+    ExternalAssetCreateView, BookmarkletMigrationView, AssetUpdateView
+)
 from mediathread.main.forms import CustomRegistrationForm
 from mediathread.main.views import (
     error_500,
@@ -284,8 +285,8 @@
     path('course/<int:course_pk>/reports/',
          include('mediathread.reports.urls')),
 
-    # Bookmarklet, Wardenclyffe, Staff custom asset entry
-    path('save/', AssetCreateView.as_view(), name='asset-save'),
+    # Browser Extension, Wardenclyffe, Staff custom asset entry
+    path('save/', ExternalAssetCreateView.as_view(), name='asset-save'),
     path('update/', AssetUpdateView.as_view(), name='asset-update-view'),
 
     path('setting/<slug:user_name>/', set_user_setting),