Skip to content

E
edx-platform
Commit a6cf7cb0 by Calen Pennington
Options

Merge pull request #817 from MITx/feature/tomg/cms-library 

Feature/tomg/cms library
parents 35d1966d df385bc5
Showing with 456 additions and 20 deletions
cms/djangoapps/contentstore/views.py
......@@ -616,3 +616,9 @@ def remove_user(request, org, course, name):
remove_user_from_course_group(request.user, user, location, EDITOR_ROLE_NAME)
return create_json_response()
@login_required
@ensure_csrf_cookie
def asset_index(request, location):
return render_to_response('asset_index.html',{})
cms/static/js/base.js
......@@ -13,15 +13,62 @@ $(document).ready(function() {
$newComponentTypePicker = $('.new-component');
$newComponentTemplatePickers = $('.new-component-templates');
$newComponentButton = $('.new-component-button');
$body.bind('keyup', onKeyUp);
$('.expand-collapse-icon').bind('click', toggleSubmodules);
$('.visibility-options').bind('change', setVisibility);
$('.unit-history ol a').bind('click', showHistoryModal);
$modal.bind('click', hideHistoryModal);
$modal.bind('click', hideModal);
$modalCover.bind('click', hideHistoryModal);
$('.assets .upload-button').bind('click', showUploadModal);
$('.upload-modal .close-button').bind('click', hideModal);
});
function showUploadModal(e) {
e.preventDefault();
$('.upload-modal').show();
$('.file-input').bind('change', startUpload);
$('.upload-modal .choose-file-button').bind('click', showFileSelectionMenu);
$modalCover.show();
}
function showFileSelectionMenu(e) {
e.preventDefault();
$('.file-input').click();
}
function startUpload(e) {
$('.upload-modal h1').html('Uploading…');
$('.upload-modal .file-name').html($('.file-input').val());
$('.upload-modal .choose-file-button').hide();
$('.upload-modal .progress-bar').removeClass('loaded').show();
$('.upload-modal .progress-fill').html('').css('width', '0').animate({
'width': '100%'
}, 1500);
setTimeout(markAsLoaded, 1500);
}
function markAsLoaded() {
$('.upload-modal .copy-button').css('display', 'inline-block');
$('.upload-modal .progress-bar').addClass('loaded');
$('.upload-modal .progress-fill').html('loaded successfully');
$('.upload-modal .choose-file-button').html('Load Another File').show();
}
function hideModal(e) {
e.preventDefault();
$('.modal').hide();
$modalCover.hide();
}
function onKeyUp(e) {
if(e.which == 87) {
$body.toggleClass('show-wip');
}
}
function toggleSubmodules(e) {
e.preventDefault();
$(this).toggleClass('expand').toggleClass('collapse');
......
cms/static/sass/_assets.scss 0 → 100644
.assets {
input.asset-search-input {
float: left;
width: 260px;
background-color: #fff;
}
.upload-button {
@include blue-button;
float: left;
margin-right: 20px;
font-size: 12px;
}
.asset-library {
@include clearfix;
table {
width: 100%;
border-radius: 3px 3px 0 0;
border: 1px solid #c5cad4;
td,
th {
padding: 10px 20px;
text-align: left;
vertical-align: middle;
}
thead th {
background: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, .1)) #ced2db;
font-size: 12px;
font-weight: 700;
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
}
tbody {
background: #fff;
tr {
border-top: 1px solid #c5cad4;
&:first-child {
border-top: none;
}
}
}
.thumb-col {
width: 100px;
}
.date-col {
width: 200px;
}
.embed-col {
width: 70px;
}
.thumb {
width: 100px;
max-height: 80px;
img {
width: 100%;
}
}
}
.pagination {
float: right;
margin: 15px 10px;
ol, li {
display: inline;
}
a {
display: inline-block;
height: 25px;
padding: 0 4px;
text-align: center;
line-height: 25px;
}
}
}
}
.upload-modal {
display: none;
width: 640px !important;
margin-left: -320px !important;
.modal-body {
height: auto !important;
overflow-y: auto !important;
text-align: center;
}
.file-input {
display: none;
}
.choose-file-button {
@include blue-button;
padding: 10px 82px 12px;
font-size: 17px;
}
.progress-bar {
display: none;
width: 350px;
height: 50px;
margin: 30px auto 10px;
border: 1px solid $blue;
&.loaded {
border-color: #66b93d;
.progress-fill {
background: #66b93d;
}
}
}
.progress-fill {
width: 0%;
height: 50px;
background: $blue;
color: #fff;
line-height: 48px;
}
h1 {
float: none;
margin: 40px 0 30px;
font-size: 34px;
font-weight: 300;
}
.close-button {
@include white-button;
position: absolute;
top: 0;
right: 15px;
width: 29px;
height: 29px;
padding: 0 !important;
border-radius: 17px !important;
line-height: 29px;
text-align: center;
}
.copy-button {
@include white-button;
display: none;
margin-bottom: 100px;
}
}
\ No newline at end of file
cms/static/sass/_base.scss
......@@ -24,10 +24,16 @@ a {
}
h1 {
float: left;
font-size: 28px;
margin: 36px 6px;
}
.page-actions {
float: right;
margin-top: 42px;
}
.main-wrapper {
position: relative;
margin: 0 40px;
......@@ -37,6 +43,10 @@ h1 {
position: relative;
max-width: 1280px;
margin: auto;
> article {
clear: both;
}
}
.window {
......@@ -189,20 +199,21 @@ label {
}
}
.wip {
outline: 1px solid #f00 !important;
position: relative;
}
.wip-box {
@extend .wip;
&:after {
content: "WIP";
font-size: 8px;
padding: 2px;
background: #f00;
color: #fff;
@include position(absolute, 0px 0px 0 0);
body.show-wip {
.wip {
outline: 1px solid #f00 !important;
position: relative;
}
}
.wip-box {
@extend .wip;
&:after {
content: "WIP";
font-size: 8px;
padding: 2px;
background: #f00;
color: #fff;
@include position(absolute, 0px 0px 0 0);
}
}
}
\ No newline at end of file
cms/static/sass/_cms_mixins.scss
......@@ -72,7 +72,7 @@
&:hover {
background-color: #d9e3ee;
color: #6d788b;
color: #6d788b;
}
}
......
cms/static/sass/_graphics.scss
......@@ -41,6 +41,13 @@
background: url(../img/list-icon.png) no-repeat;
}
.close-icon {
display: inline-block;
width: 13px;
height: 12px;
background: url(../img/close-icon.png) no-repeat;
}
.home-icon {
display: inline-block;
width: 19px;
......
cms/static/sass/_modal.scss
......@@ -9,7 +9,7 @@
background: rgba(0, 0, 0, .8);
}
.history-modal {
.modal {
display: none;
position: fixed;
top: 60px;
......
cms/static/sass/base-style.scss
......@@ -13,6 +13,7 @@
@import "courseware";
@import "subsection";
@import "unit";
@import "assets";
@import "course-info";
@import "graphics";
@import "modal";
......
cms/templates/asset_index.html 0 → 100644
<%inherit file="base.html" />
<%! from django.core.urlresolvers import reverse %>
<%block name="bodyclass">assets</%block>
<%block name="title">CMS Courseware Overview</%block>
<%block name="content">
<div class="main-wrapper">
<div class="inner-wrapper">
<h1>Asset Library</h1>
<div class="page-actions">
<a href="#" class="upload-button">Upload New File</a><input type="text" class="asset-search-input search wip-box" placeholder="search assets" />
</div>
<article class="asset-library">
<table>
<thead>
<tr>
<th class="thumb-col"></th>
<th class="name-col">Name</th>
<th class="date-col">Date Added</th>
<th class="embed-col">Embed</th>
</tr>
</thead>
<tbody>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/3185/screenshots/149571/picture_39.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-1.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/4573/screenshots/157708/final.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/15101/screenshots/228625/star_wars_lightsbaer_2.jpg"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/3185/screenshots/149571/picture_39.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-1.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/4573/screenshots/157708/final.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/15101/screenshots/228625/star_wars_lightsbaer_2.jpg"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/3185/screenshots/149571/picture_39.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-1.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/4573/screenshots/157708/final.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/15101/screenshots/228625/star_wars_lightsbaer_2.jpg"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-2.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
<tr>
<td class="thumb-col">
<div class="thumb"><img src="http://dribbble.s3.amazonaws.com/users/3185/screenshots/149571/picture_39.png"></div>
</td>
<td class="name-col">
<a href="#" class="filename">raygun-1.jpg</a>
</td>
<td class="date-col">
10/2/2012
</td>
<td class="embed-col">
<a href="#">copy</a>
</td>
</tr>
</tbody>
</table>
<nav class="pagination">
Page:
<ol class="pages">
<li>1</li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ol>
<a href="#" class="next">»</a>
</nav>
</article>
</div>
</div>
<div class="upload-modal modal">
<a href="#" class="close-button"><span class="close-icon"></span></a>
<div class="modal-body">
<h1>Upload New File</h1>
<p class="file-name"></a>
<div class="progress-bar">
<div class="progress-fill"></div>
</div>
<a href="#" class="copy-button">Copy Embed Link</a>
<div class="file-chooser">
<a href="#" class="choose-file-button">Choose File</a>
<input type="file" class="file-input">
</div>
</div>
</div>
<div class="modal-cover"></div>
</%block>
cms/templates/index.html
......@@ -6,7 +6,7 @@
<div class="main-wrapper">
<div class="inner-wrapper">
<h1>My Courses</h1>
<h1>My Courses</h1>
<article class="my-classes">
<a href="#" class="new-course-button wip-box"><span class="plus-icon"></span> New Course</a>
<ul class="class-list">
......
cms/urls.py
......@@ -28,7 +28,9 @@ urlpatterns = ('',
url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)/add_user$',
'contentstore.views.add_user', name='add_user'),
url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)/remove_user$',
'contentstore.views.remove_user', name='remove_user')
'contentstore.views.remove_user', name='remove_user'),
url(r'^assets/(?P<location>.*?)$', 'contentstore.views.asset_index', name='asset_index')
)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment