ryohek 5 лет назад
Родитель
Сommit
e62b89ba58

+ 5 - 2
src/client/js/components/PageEditor/GridEditModal.jsx

@@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
 import {
   Modal, ModalHeader, ModalBody, ModalFooter,
 } from 'reactstrap';
+import geu from './GridEditorUtil';
 
 export default class GridEditModal extends React.PureComponent {
 
@@ -45,8 +46,10 @@ export default class GridEditModal extends React.PureComponent {
 
   pasteCodedGrid() {
     // dummy data
-    const pastedGridData = `::: editable-row\n<div class="container">\n  <div class="row">
-    <div class="col-sm-6 col-md-5 col-lg-12">dummy</div>\n  </div>\n</div>\n:::`;
+    const convertedHTML = geu.convertRatiosAndSizeToHTML([1, 5, 6], 'sm');
+    const pastedGridData = `::: editable-row\n<div class="container">\n\t<div class="row">\n${convertedHTML}\n\t</div>\n</div>\n:::`;
+    // display converted html on console
+    console.log(convertedHTML);
 
     if (this.props.onSave != null) {
       this.props.onSave(pastedGridData);

+ 8 - 0
src/client/js/components/PageEditor/GridEditorUtil.js

@@ -114,6 +114,14 @@ class GridEditorUtil {
     editor.getDoc().setCursor(curPos.line + 1, 2);
   }
 
+  convertRatiosAndSizeToHTML(ratioNumbers, responsiveSize) {
+    const cols = ratioNumbers.map((ratioNumber, i) => {
+      const className = `col${responsiveSize !== 'xs' ? `-${responsiveSize}` : ''}-${ratioNumber} bsGrid${i + 1}`;
+      return `<div class="${className}"></div>`;
+    });
+    return cols.join('\n');
+  }
+
 }
 
 // singleton pattern

+ 4 - 7
src/client/js/models/BootstrapGrid.js

@@ -12,14 +12,11 @@ export default class BootstrapGrid {
   static validateColsRatios(colsRatios) {
 
     if (colsRatios.length < 2) {
-      return new Error('Incorrect array length of cols ratios');
+      throw new Error('Incorrect array length of cols ratios');
     }
-    let ratiosTotal = 0;
-    colsRatios.forEach((ratio) => {
-      ratiosTotal += ratio;
-    });
+    const ratiosTotal = colsRatios.reduce((sum, ratio) => { return sum += ratio }, 0);
     if (ratiosTotal !== 12) {
-      return new Error('Incorrect cols ratios value');
+      throw new Error('Incorrect cols ratios value');
     }
 
     return colsRatios;
@@ -29,7 +26,7 @@ export default class BootstrapGrid {
     if (responsiveSize === this.ResponsiveSize.XS_SIZE || responsiveSize === this.ResponsiveSize.SM_SIZE || responsiveSize === this.ResponsiveSize.MD_SIZE) {
       return responsiveSize;
     }
-    return new Error('Incorrect responsive size');
+    throw new Error('Incorrect responsive size');
   }
 
 }