constructor-core 0.9.1 → 1.0.0beta1

data/app/assets/javascripts/constructor_core/jquery_bundle.js.coffee

@@ -1,3 +1,4 @@
 #= require jquery
+#= require jquery.ui.all
 #= require jquery_ujs
-#= require constructor_core/jquery.cookie
+#= require ./expandable_tree/jquery.cookie

data/app/assets/javascripts/constructor_core/render_tree_helper.js.coffee

@@ -0,0 +1,82 @@
+@_escape = (str) ->
+  str
+  .replace(/&/g, '&')
+  .replace(/>/g, '>')
+  .replace(/</g, '&lt;')
+  .replace(/"/g, '&quot;')
+
+@_unescape = (str) ->
+  str
+  .replace(/&amp;/g, '&')
+  .replace(/&gt;/g, '>')
+  .replace(/&lt;/g, '<')
+  .replace(/&quot;/g, '"')
+
+@render_tree = (tree, options = {}) ->
+  html = ''
+
+  opts =
+    id:    'id'
+    node:  null
+    root:  false
+    level: 0
+    boost: []
+
+  # JQuery hash merge
+  $.extend opts, options
+
+  # Define Boost Only Once
+  unless opts['boost'].length is 0
+    boost = []
+    for node in tree
+      num  = node.parent_id || 0
+      item = boost[num]
+      boost[num] = [] unless item instanceof Array
+      boost[num].push node
+
+    opts['boost'] = boost
+
+  unless opts.node
+    # render root nodes
+    roots = opts['boost'][0]
+
+    # select roots
+    # for node in tree
+    #   roots.push node if node.parent_id is null
+
+    # roots is empty, but tree is not empty
+    # I should select nodes with minimal parent_id
+    # they will be roots
+    # order by lft, should be made at server side
+    min_elem = tree[0]
+    if roots.length is 0 and tree.length isnt 0
+      for elem in tree
+        min_elem = elem if elem.parent_id < min_elem.parent_id
+      # select roots witn min parent_id
+      for elem in tree
+        if elem.parent_id is min_elem.parent_id
+          roots.push elem
+
+    # render tree
+    for node in roots
+      $.extend opts, { node: node, root: false, level: opts.level + 1 }
+      children_html = render_tree tree, opts
+      html += opts.render_node(node, children_html, opts)
+  else
+    # render children nodes
+    children      = []
+    children_html = ''
+    children      = boost[opts.node.id]
+
+    # select children
+    # for elem in tree
+    #   children.push elem if elem.parent_id is opts.node.id
+
+    # render children nodes
+    for node in children
+      $.extend opts, { node: node, root: false, level: opts.level + 1 }
+      children_html = render_tree tree, opts
+      html += opts.render_node(node, children_html, opts)
+  
+  # result html
+  html

data/app/assets/javascripts/constructor_core/sortable_tree/initializer.js.coffee

@@ -0,0 +1,54 @@
+@rebuild_sortable_tree = (rebuild_url, item_id, parent_id, prev_id, next_id) ->
+  $.ajax
+    type:     'POST'
+    dataType: 'script'
+    url:      rebuild_url
+    data:
+      id:        item_id
+      parent_id: parent_id
+      prev_id:   prev_id
+      next_id:   next_id
+
+    error: (xhr, status, error) ->
+      console.log error
+
+@init_sortable_tree = ->
+  sortable_tree = $('.b-tree')
+  return false if sortable_tree.length is 0
+  
+  rebuild_url = sortable_tree.data('rebuild_url') || sortable_tree.data('rebuild-url')
+  max_levels  = sortable_tree.data('max_levels')  || sortable_tree.data('max-levels')
+
+  ############################################
+  # Initialize Sortable Tree
+  ############################################
+  sortable_tree.nestedSortable
+    items:            '.b-tree__li'
+    helper:           'clone'
+    handle:           '.b-tree__handle'
+    tolerance:        'pointer'
+    maxLevels:        max_levels
+    revert:           250
+    tabSize:          25
+    opacity:          0.6
+    placeholder:      'placeholder'
+    disableNesting:   'no-nest'
+    toleranceElement: '> div'
+    forcePlaceholderSize: true
+
+  ############################################
+  # Sortable Update Event
+  ############################################
+  sortable_tree.on "sortupdate", (event, ui) =>
+    item      = ui.item
+    attr_name = 'node-id'
+    item_id   = item.data(attr_name)
+    prev_id   = item.prev().data(attr_name)
+    next_id   = item.next().data(attr_name)
+    parent_id = item.parent().parent().data(attr_name)
+    
+    rebuild_sortable_tree(rebuild_url, item_id, parent_id, prev_id, next_id)
+
+  true
+
+$ -> init_sortable_tree()

data/app/assets/stylesheets/constructor_core/application.css.scss

@@ -1,3 +1,26 @@
 //= require ckeditor/contents
 //= require ckeditor/skins/moono/editor.css
-//= require ./main
+//= require font-awesome
+//= require jquery.ui.all
+//= require tree
+//= require sortable_tree
+//= require nested_options
+//= require_self
+
+@import 'framework/all';
+@import 'project/**/*';
+
+html {
+  height: 100%;
+  width: 100%;
+}
+
+body {
+  height: 100%;
+  margin: 0;
+  color: #333;
+  font-size: 16px;
+  font-family: Ubuntu, Arial, sans-serif;
+  font-weight: 100;
+  background: #ddd;
+}

data/app/assets/stylesheets/constructor_core/framework/all.scss

@@ -0,0 +1,4 @@
+@import 'mixin';
+@import 'classes';
+@import 'globals';
+@import 'grid';

data/app/assets/stylesheets/constructor_core/framework/classes.scss

@@ -0,0 +1,4 @@
+.l-base { @include base; }
+.b-block { @include display-block; }
+.b-inline { @include display-inline; }
+.b-center { @include center-block; }

data/app/assets/stylesheets/constructor_core/framework/globals.scss

@@ -0,0 +1,49 @@
+.g-out { overflow: visible !important}
+
+.g-line {
+  @include clearfix;
+}
+
+.g-align_left {
+  text-align: left !important;
+}
+
+.g-align_right {
+  text-align: right !important;
+}
+
+.g-align_center {
+  text-align: center !important;
+}
+
+.g-float_left {
+  float: left !important;
+}
+
+.g-float_right {
+  float: right !important;
+}
+
+.g-hidden, .g-hide {
+  display: none !important;
+}
+
+.g-uppercase {
+  text-transform: uppercase !important;
+}
+
+.g-spin {
+  -webkit-animation-name: spin;
+  -webkit-animation-duration: 2000ms;
+  -webkit-animation-iteration-count: infinite;
+  -webkit-animation-timing-function: linear;
+  -moz-animation-name: spin;
+  -moz-animation-duration: 2000ms;
+  -moz-animation-iteration-count: infinite;
+  -moz-animation-timing-function: linear;
+  -ms-animation-name: spin;
+  -ms-animation-duration: 2000ms;
+  -ms-animation-iteration-count: infinite;
+  -ms-animation-timing-function: linear;
+  -o-transition: rotate(3600deg);
+}

data/app/assets/stylesheets/constructor_core/framework/grid.scss

@@ -0,0 +1,33 @@
+.l-row {
+  @include clearfix;
+  overflow: hidden;
+  margin-left: -20px;
+}
+
+.l-col {
+  float: left;
+  overflow: hidden;
+  margin-left: 20px;
+  @include box-sizing(border-box);
+}
+
+.l-col-i {
+  padding: 0 10px;
+}
+
+.l-col-1 { width: 40px; }
+.l-col-2 { width: 100px; }
+.l-col-3 { width: 160px; }
+.l-col-4 { width: 220px; }
+.l-col-5 { width: 280px; }
+.l-col-6 { width: 340px; }
+.l-col-7 { width: 400px; }
+.l-col-8 { width: 460px; }
+.l-col-9 { width: 520px; }
+.l-col-10 { width: 580px; }
+.l-col-11 { width: 640px; }
+.l-col-12 { width: 700px; }
+.l-col-13 { width: 760px; }
+.l-col-14 { width: 820px; }
+.l-col-15 { width: 880px; }
+.l-col-16 { width: 940px; }

data/app/assets/stylesheets/constructor_core/framework/mixin.scss

@@ -0,0 +1,193 @@
+@mixin gradient-vertical($startColor: #555, $endColor: #333) {
+    background-color: mix($startColor, $endColor, 60%);
+    background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
+    background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
+    background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
+    background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
+    background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
+    background-repeat: repeat-x;
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=0); // IE9 and down
+}
+
+@mixin gradient-horizontal($startColor: #555, $endColor: #333) {
+  background-color: $endColor;
+  background-image: -moz-linear-gradient(left, $startColor, $endColor); // FF 3.6+
+  background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
+  background-image: -webkit-linear-gradient(left, $startColor, $endColor); // Safari 5.1+, Chrome 10+
+  background-image: -o-linear-gradient(left, $startColor, $endColor); // Opera 11.10
+  background-image: linear-gradient(to right, $startColor, $endColor); // Standard, IE10
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($startColor)}', endColorstr='#{ie-hex-str($endColor)}', GradientType=1); // IE9 and down
+}
+
+@mixin gradient-radial($innerColor: #555, $outerColor: #333)  {
+    background-color: $outerColor;
+    background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor), to($outerColor));
+    background-image: -webkit-radial-gradient(circle, $innerColor, $outerColor);
+    background-image: -moz-radial-gradient(circle, $innerColor, $outerColor);
+    background-image: -o-radial-gradient(circle, $innerColor, $outerColor);
+    background-repeat: no-repeat;
+}
+
+@mixin box-shadow($shadow...) {
+    -webkit-box-shadow: $shadow;
+    -moz-box-shadow: $shadow;
+    box-shadow: $shadow;
+}
+
+@mixin box-sizing($boxmodel) {
+  -webkit-box-sizing: $boxmodel;
+  -moz-box-sizing: $boxmodel;
+  box-sizing: $boxmodel;
+}
+
+@mixin border-radius($radius) {
+    -webkit-border-radius: $radius;
+    -moz-border-radius: $radius;
+    border-radius: $radius;
+}
+
+@mixin border-top-left-radius($radius) {
+    -webkit-border-top-left-radius: $radius;
+    -moz-border-radius-topleft: $radius;
+    border-top-left-radius: $radius;
+}
+@mixin border-top-right-radius($radius) {
+    -webkit-border-top-right-radius: $radius;
+    -moz-border-radius-topright: $radius;
+    border-top-right-radius: $radius;
+}
+@mixin border-bottom-right-radius($radius) {
+    -webkit-border-bottom-right-radius: $radius;
+    -moz-border-radius-bottomright: $radius;
+    border-bottom-right-radius: $radius;
+}
+@mixin border-bottom-left-radius($radius) {
+    -webkit-border-bottom-left-radius: $radius;
+    -moz-border-radius-bottomleft: $radius;
+    border-bottom-left-radius: $radius;
+}
+
+@mixin border-top-radius($radius) {
+    @include border-top-right-radius($radius);
+    @include border-top-left-radius($radius);
+}
+@mixin border-right-radius($radius) {
+    @include border-top-right-radius($radius);
+    @include border-bottom-right-radius($radius);
+}
+@mixin border-bottom-radius($radius) {
+    @include border-bottom-right-radius($radius);
+    @include border-bottom-left-radius($radius);
+}
+@mixin border-left-radius($radius) {
+    @include border-top-left-radius($radius);
+    @include border-bottom-left-radius($radius);
+}
+
+@mixin transition($transition) {
+    -webkit-transition: $transition;
+    -moz-transition: $transition;
+    -o-transition: $transition;
+    transition: $transition;
+}
+
+@mixin opacity($opacity) {
+  opacity: $opacity / 100;
+  filter: alpha(opacity=$opacity);
+}
+
+@mixin size($height, $width) {
+  width: $width;
+  height: $height;
+}
+
+@mixin square($size) {
+  @include size($size, $size);
+}
+
+
+// Transformations
+@mixin rotate($degrees) {
+  -webkit-transform: rotate($degrees);
+  -moz-transform: rotate($degrees);
+  -ms-transform: rotate($degrees);
+  -o-transform: rotate($degrees);
+  transform: rotate($degrees);
+}
+@mixin scale($ratio) {
+  -webkit-transform: scale($ratio);
+  -moz-transform: scale($ratio);
+  -ms-transform: scale($ratio);
+  -o-transform: scale($ratio);
+  transform: scale($ratio);
+}
+@mixin translate($x, $y) {
+  -webkit-transform: translate($x, $y);
+  -moz-transform: translate($x, $y);
+  -ms-transform: translate($x, $y);
+  -o-transform: translate($x, $y);
+  transform: translate($x, $y);
+}
+@mixin skew($x, $y) {
+  -webkit-transform: skew($x, $y);
+  -moz-transform: skew($x, $y);
+  -ms-transform: skewX($x) skewY($y); // See https://github.com/twitter/bootstrap/issues/4885
+  -o-transform: skew($x, $y);
+  transform: skew($x, $y);
+  -webkit-backface-visibility: hidden; // See https://github.com/twitter/bootstrap/issues/5319
+}
+@mixin translate3d($x, $y, $z) {
+  -webkit-transform: translate3d($x, $y, $z);
+  -moz-transform: translate3d($x, $y, $z);
+  -o-transform: translate3d($x, $y, $z);
+  transform: translate3d($x, $y, $z);
+}
+
+
+
+@mixin display-inline() {
+    position: relative;
+    display: -moz-inline-stack;
+    display: inline-block;
+    overflow: hidden;
+    vertical-align: top;
+    *display: inline;
+    *zoom: 1;
+}
+
+@mixin display-block() {
+    position: relative;
+    display: block;
+    overflow: hidden;
+}
+
+@mixin clearfix(){
+  &:before,
+  &:after {
+    content: " ";
+    display: table;
+  }
+
+  &:after {
+    clear: both;
+  }
+
+  *zoom: 1;
+}
+
+@mixin center-block() {
+  @include display-block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+@mixin background-asset($asset, $options...) {
+  background: asset-data-url($asset) $options;
+  *background: asset-url($asset) $options;
+}
+
+@mixin base($width: 1000px) {
+  @include center-block;
+  width: $width;
+}