From 334bf8db3cfe125c7820e1b87dff6cc511ad9058 Mon Sep 17 00:00:00 2001 From: Samuel Georges Date: Wed, 15 Jul 2015 19:35:31 +1000 Subject: [PATCH] Initial outlay of ImportExportController --- .../behaviors/ImportExportController.php | 64 ++++++++++++++++++ .../assets/css/importexport.css | 53 +++++++++++++++ .../assets/js/october.importexport.js | 11 +++ .../assets/less/importexport.less | 67 +++++++++++++++++++ .../partials/_button_export.htm | 0 .../partials/_button_import.htm | 0 .../partials/_container.htm | 9 +++ .../partials/_import_fields.htm | 40 +++++++++++ .../partials/_import_upload.htm | 0 9 files changed, 244 insertions(+) create mode 100644 modules/backend/behaviors/ImportExportController.php create mode 100644 modules/backend/behaviors/importexportcontroller/assets/css/importexport.css create mode 100644 modules/backend/behaviors/importexportcontroller/assets/js/october.importexport.js create mode 100644 modules/backend/behaviors/importexportcontroller/assets/less/importexport.less create mode 100644 modules/backend/behaviors/importexportcontroller/partials/_button_export.htm create mode 100644 modules/backend/behaviors/importexportcontroller/partials/_button_import.htm create mode 100644 modules/backend/behaviors/importexportcontroller/partials/_container.htm create mode 100644 modules/backend/behaviors/importexportcontroller/partials/_import_fields.htm create mode 100644 modules/backend/behaviors/importexportcontroller/partials/_import_upload.htm diff --git a/modules/backend/behaviors/ImportExportController.php b/modules/backend/behaviors/ImportExportController.php new file mode 100644 index 000000000..ee6998e91 --- /dev/null +++ b/modules/backend/behaviors/ImportExportController.php @@ -0,0 +1,64 @@ +addJs('js/october.importexport.js', 'core'); + $this->addCss('css/importexport.css', 'core'); + } + + public function import() + { + + } + + public function importRender() + { + return $this->importExportMakePartial('container'); + } + + public function importRenderUpload() + { + return $this->importExportMakePartial('import_upload'); + } + + public function importRenderFields() + { + return $this->importExportMakePartial('import_fields'); + } + + /** + * Controller accessor for making partials within this behavior. + * @param string $partial + * @param array $params + * @return string Partial contents + */ + public function importExportMakePartial($partial, $params = []) + { + $contents = $this->controller->makePartial('import_export_'.$partial, $params + $this->vars, false); + if (!$contents) { + $contents = $this->makePartial($partial, $params); + } + + return $contents; + } + +} \ No newline at end of file diff --git a/modules/backend/behaviors/importexportcontroller/assets/css/importexport.css b/modules/backend/behaviors/importexportcontroller/assets/css/importexport.css new file mode 100644 index 000000000..335e254f7 --- /dev/null +++ b/modules/backend/behaviors/importexportcontroller/assets/css/importexport.css @@ -0,0 +1,53 @@ +.import-behavior ul { + margin: 0; + padding: 0; + list-style: none; +} +.import-behavior ul li.placeholder { + display: block; + position: relative; +} +.import-behavior ul li.dragged { + position: absolute; + z-index: 2000; + -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075); + box-shadow: 0 3px 6px rgba(0, 0, 0, 0.075); +} +.import-behavior ul.import-file-columns li, +.import-behavior ul.import-record-columns li { + background: #f0f0f0; + border: 1px solid #cccccc; + border-radius: 3px; + margin-bottom: 5px; +} +.import-behavior ul.import-file-columns li div.import-column-name > span, +.import-behavior ul.import-record-columns li div.import-column-name > span, +.import-behavior ul.import-file-columns li > span, +.import-behavior ul.import-record-columns li > span { + display: block; + padding: 5px; +} +.import-behavior ul.import-file-columns li:before, +.import-behavior ul.import-file-columns li:after { + content: " "; + display: table; +} +.import-behavior ul.import-file-columns li:after { + clear: both; +} +.import-behavior ul.import-file-columns div.import-column-name { + float: left; + width: 50%; +} +.import-behavior ul.import-file-columns ul.import-column-bindings { + float: right; + width: 50%; +} +.import-behavior ul.import-column-bindings { + background: #999; + padding: 5px 5px; +} +.import-behavior ul.import-column-bindings li { + background: transparent; + border-color: transparent; +} diff --git a/modules/backend/behaviors/importexportcontroller/assets/js/october.importexport.js b/modules/backend/behaviors/importexportcontroller/assets/js/october.importexport.js new file mode 100644 index 000000000..8e66f2341 --- /dev/null +++ b/modules/backend/behaviors/importexportcontroller/assets/js/october.importexport.js @@ -0,0 +1,11 @@ +/* + * Scripts for the Import/Export controller behavior. + */ ++function ($) { "use strict"; + + var ImportExportBehavior = function() { + + } + + $.oc.importExportBehavior = new ImportExportBehavior; +}(window.jQuery); \ No newline at end of file diff --git a/modules/backend/behaviors/importexportcontroller/assets/less/importexport.less b/modules/backend/behaviors/importexportcontroller/assets/less/importexport.less new file mode 100644 index 000000000..ad4c2a5a0 --- /dev/null +++ b/modules/backend/behaviors/importexportcontroller/assets/less/importexport.less @@ -0,0 +1,67 @@ +@import "../../../../assets/less/core/boot.less"; + +@color-import-column-bg: #f0f0f0; +@color-import-column-border: #ccc; + +.import-behavior { + + ul { + margin: 0; + padding: 0; + list-style: none; + + li.placeholder { + display: block; + position: relative; + } + + li.dragged { + position: absolute; + //opacity: 0.5; + z-index: 2000; + .box-shadow(0 3px 6px rgba(0,0,0,.075)); + } + } + + ul.import-file-columns, + ul.import-record-columns { + li { + background: @color-import-column-bg; + border: 1px solid @color-import-column-border; + border-radius: 3px; + margin-bottom: 5px; + + div.import-column-name > span, + > span { + display: block; + padding: 5px; + } + } + } + + ul.import-file-columns { + li { + .clearfix; + } + + div.import-column-name { + float: left; + width: 50%; + } + + ul.import-column-bindings { + float: right; + width: 50%; + } + } + + ul.import-column-bindings { + background: #999; + padding: 5px 5px; + li { + background: transparent; + border-color: transparent; + } + } + +} \ No newline at end of file diff --git a/modules/backend/behaviors/importexportcontroller/partials/_button_export.htm b/modules/backend/behaviors/importexportcontroller/partials/_button_export.htm new file mode 100644 index 000000000..e69de29bb diff --git a/modules/backend/behaviors/importexportcontroller/partials/_button_import.htm b/modules/backend/behaviors/importexportcontroller/partials/_button_import.htm new file mode 100644 index 000000000..e69de29bb diff --git a/modules/backend/behaviors/importexportcontroller/partials/_container.htm b/modules/backend/behaviors/importexportcontroller/partials/_container.htm new file mode 100644 index 000000000..b43af4e99 --- /dev/null +++ b/modules/backend/behaviors/importexportcontroller/partials/_container.htm @@ -0,0 +1,9 @@ +
+

1. Upload a CSV file

+ + importRenderUpload() ?> + +

2. Match fields to the CSV columns

+ + importRenderFields() ?> +
\ No newline at end of file diff --git a/modules/backend/behaviors/importexportcontroller/partials/_import_fields.htm b/modules/backend/behaviors/importexportcontroller/partials/_import_fields.htm new file mode 100644 index 000000000..106e56328 --- /dev/null +++ b/modules/backend/behaviors/importexportcontroller/partials/_import_fields.htm @@ -0,0 +1,40 @@ + + +
+
+ File Columns + +
    +
  • +
    + Name +
    +
      +
    +
  • +
  • +
    + URL Name +
    +
      +
    +
  • +
+
+
+ Record Columns + +
    +
  • SKU
  • +
  • Title
  • +
  • Description
  • +
+
+
+ + \ No newline at end of file diff --git a/modules/backend/behaviors/importexportcontroller/partials/_import_upload.htm b/modules/backend/behaviors/importexportcontroller/partials/_import_upload.htm new file mode 100644 index 000000000..e69de29bb