From 44d4a4b0d9bf98fd2a96b619e73f24a514a12333 Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Tue, 2 Oct 2012 17:02:47 -0400 Subject: [PATCH 1/5] started asset library template -wip --- cms/djangoapps/contentstore/views.py | 6 ++++++ cms/static/sass/_assets.scss | 11 +++++++++++ cms/static/sass/base-style.scss | 1 + cms/templates/asset_index.html | 18 ++++++++++++++++++ cms/templates/index.html | 2 +- cms/urls.py | 4 +++- 6 files changed, 40 insertions(+), 2 deletions(-) create mode 100644 cms/static/sass/_assets.scss create mode 100644 cms/templates/asset_index.html diff --git a/cms/djangoapps/contentstore/views.py b/cms/djangoapps/contentstore/views.py index 1443f37c2d..342de2401a 100644 --- a/cms/djangoapps/contentstore/views.py +++ b/cms/djangoapps/contentstore/views.py @@ -599,3 +599,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',{}) + diff --git a/cms/static/sass/_assets.scss b/cms/static/sass/_assets.scss new file mode 100644 index 0000000000..c7b01ed07a --- /dev/null +++ b/cms/static/sass/_assets.scss @@ -0,0 +1,11 @@ +.assets { + input.asset-search-input { + position: absolute; + right: 0; + top: 5px; + width: 260px; + background-color: #fff; + } + + +} \ No newline at end of file diff --git a/cms/static/sass/base-style.scss b/cms/static/sass/base-style.scss index ef734b7115..476f9de377 100644 --- a/cms/static/sass/base-style.scss +++ b/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"; diff --git a/cms/templates/asset_index.html b/cms/templates/asset_index.html new file mode 100644 index 0000000000..34745d832a --- /dev/null +++ b/cms/templates/asset_index.html @@ -0,0 +1,18 @@ +<%inherit file="base.html" /> +<%! from django.core.urlresolvers import reverse %> +<%block name="bodyclass">assets +<%block name="title">CMS Courseware Overview + +<%block name="content"> + +
+
+

Asset Library

+ +
+ +
+
+
+ + diff --git a/cms/templates/index.html b/cms/templates/index.html index fd4891c771..36ddd1044b 100644 --- a/cms/templates/index.html +++ b/cms/templates/index.html @@ -6,7 +6,7 @@
-

My Courses

+

My Courses

New Course
    diff --git a/cms/urls.py b/cms/urls.py index 94b247ee54..1f1e547327 100644 --- a/cms/urls.py +++ b/cms/urls.py @@ -26,7 +26,9 @@ urlpatterns = ('', url(r'^(?P[^/]+)/(?P[^/]+)/course/(?P[^/]+)/add_user$', 'contentstore.views.add_user', name='add_user'), url(r'^(?P[^/]+)/(?P[^/]+)/course/(?P[^/]+)/remove_user$', - 'contentstore.views.remove_user', name='remove_user') + 'contentstore.views.remove_user', name='remove_user'), + url(r'^assets/(?P.*?)$', 'contentstore.views.asset_index', name='asset_index') + ) From 6e6ba534f08e62404e9a860944289e815a32b7c2 Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Wed, 3 Oct 2012 11:25:18 -0400 Subject: [PATCH 2/5] upload modal functionality --- cms/static/js/base.js | 49 ++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 48 insertions(+), 1 deletion(-) diff --git a/cms/static/js/base.js b/cms/static/js/base.js index b2a0f74f81..138d1879d7 100644 --- a/cms/static/js/base.js +++ b/cms/static/js/base.js @@ -13,6 +13,7 @@ $(document).ready(function() { $newComponentTypePicker = $('.new-component'); $newComponentTemplatePickers = $('.new-component-templates'); $newComponentButton = $('.new-component-button'); + $body.bind('keyup', onKeyUp); $('li.component').each(function(idx, element) { new CMS.Views.ModuleEdit({ @@ -33,10 +34,56 @@ $(document).ready(function() { $newComponentTemplatePickers.find('.cancel-button').bind('click', closeNewComponent); $('.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'); From 3bb5a003bcdba84908318337ae06d32916071920 Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Wed, 3 Oct 2012 11:26:30 -0400 Subject: [PATCH 3/5] asset library styles --- cms/static/sass/_assets.scss | 157 ++++++++++++++++++++++++++++++- cms/static/sass/_base.scss | 41 +++++--- cms/static/sass/_cms_mixins.scss | 2 +- cms/static/sass/_graphics.scss | 7 ++ cms/static/sass/_modal.scss | 2 +- 5 files changed, 188 insertions(+), 21 deletions(-) diff --git a/cms/static/sass/_assets.scss b/cms/static/sass/_assets.scss index c7b01ed07a..54ad25c0a3 100644 --- a/cms/static/sass/_assets.scss +++ b/cms/static/sass/_assets.scss @@ -1,11 +1,160 @@ .assets { input.asset-search-input { - position: absolute; - right: 0; - top: 5px; + 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 diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss index abacff87c3..312d066078 100644 --- a/cms/static/sass/_base.scss +++ b/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 diff --git a/cms/static/sass/_cms_mixins.scss b/cms/static/sass/_cms_mixins.scss index 0360fe5d37..d05c80dd71 100644 --- a/cms/static/sass/_cms_mixins.scss +++ b/cms/static/sass/_cms_mixins.scss @@ -72,7 +72,7 @@ &:hover { background-color: #d9e3ee; - color: #6d788b; + color: #6d788b; } } diff --git a/cms/static/sass/_graphics.scss b/cms/static/sass/_graphics.scss index 1ee1313073..35924cdeda 100644 --- a/cms/static/sass/_graphics.scss +++ b/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; diff --git a/cms/static/sass/_modal.scss b/cms/static/sass/_modal.scss index 203f5a776c..a60d5629e3 100644 --- a/cms/static/sass/_modal.scss +++ b/cms/static/sass/_modal.scss @@ -9,7 +9,7 @@ background: rgba(0, 0, 0, .8); } -.history-modal { +.modal { display: none; position: fixed; top: 60px; From e7db2b55719b40ff9fa02a606592f5271df42abd Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Wed, 3 Oct 2012 11:27:15 -0400 Subject: [PATCH 4/5] static asset library template --- cms/templates/asset_index.html | 186 ++++++++++++++++++++++++++++++++- 1 file changed, 184 insertions(+), 2 deletions(-) diff --git a/cms/templates/asset_index.html b/cms/templates/asset_index.html index 34745d832a..0069cae9ba 100644 --- a/cms/templates/asset_index.html +++ b/cms/templates/asset_index.html @@ -8,11 +8,193 @@

    Asset Library

    - +
    + Upload New File +
    - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    NameDate AddedEmbed
    +
    +     		+ raygun-1.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-1.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-1.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-2.jpg + + 10/2/2012 + + copy +
    +
    +     		+ raygun-1.jpg + + 10/2/2012 + + copy +
    +
    +
    + +
    +

    Upload New File

    +

    +

    +
    +
    + Copy Embed Link +
    + Choose File + +
    +
    +
    + +
    + From df385bc559b93d36773e1aeb6c0505b95ebd3434 Mon Sep 17 00:00:00 2001 From: Tom Giannattasio Date: Wed, 3 Oct 2012 11:27:32 -0400 Subject: [PATCH 5/5] modal close butotn icon --- cms/static/img/close-icon.png | Bin 0 -> 1115 bytes 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 cms/static/img/close-icon.png diff --git a/cms/static/img/close-icon.png b/cms/static/img/close-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..684399725b360217069be984ecefde2444925c08 GIT binary patch literal 1115 zcmaJ=TSyd97#<6x+eQyocB5gsM?06jjPB%C+m6Z#6{Ydy3LGjsm)^MBv}o&W#O!K#W) zo@w)^5d`6hZ5HG1ioY3C^6|g7r)U^2^H6CWs)k9FmMuU;RM-T_m@YSiIFQx$?N31o zK}=q%CF)R}R4yn`r)4*Wc61Y?38G}ZW6DYkKx7kW){HPUa<88vH8o7t1|?Q9qadYi z?yx|0M@2&EXi-8cwSFC0;s}^P2S_Fzz16S;}3(#sU30kR%~y*hn@M5EH``=AboA6*wQuihO`$ zgB-4VsV{_0F&HTh^3kZjI9Qa$ico3Ofq}AE^$*sU6YCCxZsN=$u(TaOEwi9bjvZRi za%%CH<>VX3s=2kWIk5~D!?>;etJPT-o*&no7+k!W7=2*idAIOjpFI5LBEA&QVqzrW zyly>q)ANum5cRp`Z~3ir8i|#Y{8fX4FJIkXr#0psn(`ul%dLG^?hK4p3Kz~+t_eTx z-Lqo2xqo=k>1~mL&wIMQp3CnVEjT|_{Ltlz6i>fvZhbKD^VFBj{ywuH8K?<7|8e!Q zvb%F}_t6`3I@*>Nj;!AMZC1_biFeCnt+U}%H}ihM>^ynxi-ydZ%MzW$yi)JU zEZcRUr}y3Up$+u%!Q09DnLE4tzBUvlh)aFtp~<^?7mhqR@G(`M89HKre^a|Rk7#IO TA?rWxxYs>aS|MKB*x30CdAfDU literal 0 HcmV?d00001