Good day! I use Django + Angular + Django REST. It is necessary to dynamically place the images of different size tiles, with the ability to move them through drag-n-drop. I use bootstrap.js for posting now, and for dragging Sortable.js + ng-sortable.js git :: //github.com/rubaxa/Sortable.git But there is a problem with pictures of different sizes, a situation like this
And it is necessary that there are several columns, and each picture could occupy one or several columns, depending on the size of the picture. Something like this (imagine that each block is a picture):
An example for Susy from their site seems to be closer to what should be: 
But I’m not completely sure if this framework is right for me to solve this problem? Install sudo gem install sass, sudo gem install susy, pip install libsass . What else you need to install and how to use susy for django site? For Zend, the framework found the manual: http://zencoder.ru/susy/brief-tutorial-susy-2/ How can I do the same for Django? With the help of susy or suggest, please, the best option. About susy not sure.
Update: Installed sudo apt-get install ruby-dev, sudo gem install compass .
Where to connect this, and in what form for Django?
@import "normalize"; @import "compass"; @import "susy"; Update 2: Install sudo pip install django-compass2 , in settings.py added:
COMPASS_INPUT = BASE_DIR + 'media/sass' COMPASS_OUTPUT = BASE_DIR + 'media/css' COMPASS_STYLE = 'compact' COMPASS_REQUIRES = ( 'ninesixty', # 960.gs Grid System ) and 'djcompass' in INSTALLED_APPS. Created folders media / sass, media / css
When running python manage.py compass does not find the module 'djcompass'.
Update 3: while commented out djcompass in INSTALLED_APPS. Added in settings.py:
COMPRESS_PRECOMPILERS = ( ('text/scss', 'sass --scss {infile} {outfile}'), ) In the template:
{% load compress %} {% load staticfiles %} {% compress css %} <link rel="stylesheet" type="text/scss" href="{% static 'styles.scss' %}" /> {% endcompress %} Swears: 'compress' is not a valid tag library Google says you need to do something like
compass create [folder] -r rest-foundation --using foundation But compass I could not configure. And it is not entirely clear, for susy / compass / sass, you need to create a separate project within the django project? I don’t understand how to cross them all together to make it work: Django + Django REST + Angular + SASS + Compass (and it’s not clear if you can do without it?) + Susy.
Update 4: sass -v issues Sass 3.4.18 (Selective Steve)
Installed pip install django-compressor based on this http://django-compressor.readthedocs.org/en/latest/quickstart/ In the settings added
STATICFILES_FINDERS = ( 'django.contrib.staticfiles.finders.FileSystemFinder', 'django.contrib.staticfiles.finders.AppDirectoriesFinder', # other finders.. 'compressor.finders.CompressorFinder', ) Added a "compressor" in INSTALLED_APPS - after this 500 error.
When added to TEMPLATES OPTIONS django.templatetags.compress и django.contrib.staticfiles.templatetags.compress writes that such modules do not have "compress" attribute / class
Update 5: found angular-gridster.js, which places it seems to be as needed, + supports drag-n-drop http://manifestwebdesign.imtqy.com/angular-gridster/?utm_source=angular-js.in&utm_medium=website&utm_campaign=content- curation At the stage before sass / susy / compass:
bower install angular-gridster <link rel="stylesheet" href="bower_components/angular-gridster/dist/angular-gridster.min.css"/> <script src="bower_components/javascript-detect-element-resize/jquery.resize.js"></script> <script src="bower_components/angular-gridster/dist/angular-gridster.min.js"></script> Обновление 6 I connected it on the developer’s website, everything works. The only problem is how to configure angular-gripster to remove the z-layers and overlay images on each other?
