workarea-image_decoration 1.0.0.pre

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 4d87c8a5f421ebc213517377fbb357fa03c6a3259ccc35896152b7c75353989e
+  data.tar.gz: 77bad5f188518eb142e7415bd8b29d6b8e49fa0616bfb2f600114f5751582752
+SHA512:
+  metadata.gz: e4ea779eac90c4dea02704c6a4cecd8022def4b0f29351c215feb5aca016c9b3f0195ef71326aa8b27386c5172e27eca09c26d87db89c98532d95db1c3dd367a
+  data.tar.gz: bdd87aa8d6fe856b4b1ee01d6f97f60a710e49466f27582d837e9d4206159958da08b474e71217b326900d1ce1c56e2081f387b987182bd5be4c14ff0e67445e

data/.gitignore

@@ -0,0 +1,21 @@
+.bundle/
+log/*.log
+pkg/
+test/dummy/log/*.log
+test/dummy/tmp/
+.DS_Store
+.byebug_history
+.bundle/
+.sass-cache/
+Gemfile.lock
+pkg/
+test/dummy/tmp/
+test/dummy/public/
+log/*.log
+test/dummy/log/*.log
+test/dummy/db/*.sqlite3
+test/dummy/db/*.sqlite3-journal
+node_modules
+yarn.lock
+yarn-error.log
+package-lock.json

data/Gemfile

@@ -0,0 +1,17 @@
+source 'https://rubygems.org'
+git_source(:github) { |repo| "https://github.com/#{repo}.git" }
+
+# Declare your gem's dependencies in image_decoration.gemspec.
+# Bundler will treat runtime dependencies like base dependencies, and
+# development dependencies will be added by default to the :development group.
+gemspec
+
+# Declare any dependencies that are still in development here instead of in
+# your gemspec. These might include edge Rails or gems from your path or
+# Git. Remember to move these dependencies to your gemspec before releasing
+# your gem to rubygems.org.
+
+# To use a debugger
+# gem 'byebug', group: [:development, :test]
+
+gem 'workarea', github: 'workarea-commerce/workarea'

data/LICENSE

@@ -0,0 +1,52 @@
+WebLinc
+Business Source License
+
+Licensor: WebLinc Corporation, 22 S. 3rd Street, 2nd Floor, Philadelphia PA 19106
+
+Licensed Work: Workarea Commerce Platform
+               The Licensed Work is (c) 2019 WebLinc Corporation
+
+Additional Use Grant:
+                      You may make production use of the Licensed Work without an additional license agreement with WebLinc so long as you do not use the Licensed Work for a Commerce Service.
+
+                      A "Commerce Service" is a commercial offering that allows third parties (other than your employees and contractors) to access the functionality of the Licensed Work by creating or managing commerce functionality, the products, taxonomy, assets and/or content of which are controlled by such third parties.
+
+                      For information about obtaining an additional license agreement with WebLinc, contact licensing@workarea.com.
+
+Change Date: 2019-08-20
+
+Change License: Version 2.0 or later of the GNU General Public License as published by the Free Software Foundation
+
+Terms
+
+The Licensor hereby grants you the right to copy, modify, create derivative works, redistribute, and make non-production use of the Licensed Work. The Licensor may make an Additional Use Grant, above, permitting limited production use.
+
+Effective on the Change Date, or the fourth anniversary of the first publicly available distribution of a specific version of the Licensed Work under this License, whichever comes first, the Licensor hereby grants you rights under the terms of the Change License, and the rights granted in the paragraph above terminate.
+
+If your use of the Licensed Work does not comply with the requirements currently in effect as described in this License, you must purchase a commercial license from the Licensor, its affiliated entities, or authorized resellers, or you must refrain from using the Licensed Work.
+
+All copies of the original and modified Licensed Work, and derivative works of the Licensed Work, are subject to this License. This License applies separately for each version of the Licensed Work and the Change Date may vary for each version of the Licensed Work released by Licensor.
+
+You must conspicuously display this License on each original or modified copy of the Licensed Work. If you receive the Licensed Work in original or modified form from a third party, the terms and conditions set forth in this License apply to your use of that work.
+
+Any use of the Licensed Work in violation of this License will automatically terminate your rights under this License for the current and all other versions of the Licensed Work.
+
+This License does not grant you any right in any trademark or logo of Licensor or its affiliates (provided that you may use a trademark or logo of Licensor as expressly required by this License). TO THE EXTENT PERMITTED BY APPLICABLE LAW, THE LICENSED WORK IS PROVIDED ON AN "AS IS" BASIS. LICENSOR HEREBY DISCLAIMS ALL WARRANTIES AND CONDITIONS, EXPRESS OR IMPLIED, INCLUDING (WITHOUT LIMITATION) WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, NON-INFRINGEMENT, AND TITLE. MariaDB hereby grants you permission to use this License’s text to license your works and to refer to it using the trademark "Business Source License" as long as you comply with the Covenants of Licensor below.
+
+Covenants of Licensor
+In consideration of the right to use this License’s text and the "Business Source License" name and trademark, Licensor covenants to MariaDB, and to all other recipients of the licensed work to be provided by Licensor:
+
+To specify as the Change License the GPL Version 2.0 or any later version, or a license that is compatible with GPL Version 2.0 or a later version, where "compatible" means that software provided under the Change License can be included in a program with software provided under GPL Version 2.0 or a later version. Licensor may specify additional Change Licenses without limitation.
+
+To either: (a) specify an additional grant of rights to use that does not impose any additional restriction on the right granted in this License, as the Additional Use Grant; or (b) insert the text "None."
+
+To specify a Change Date.
+
+Not to modify this License in any other way.
+
+Notice
+The Business Source License (this document, or the "License") is not an Open Source license. However, the Licensed Work will eventually be made available under an Open Source License, as stated in this License.
+
+For more information on the use of the Business Source License generally, please visit the Adopting and Developing Business Source License FAQ.
+
+License text copyright (c) 2017 MariaDB Corporation Ab, All Rights Reserved. "Business Source License" is a trademark of MariaDB Corporation Ab.

data/README.md

@@ -0,0 +1,42 @@
+# Workarea::Image::Manipulation
+### Following features will be available.
+
+	Size
+		- Small, Medium Large
+		- Custom size dimensions
+		- Image adjusts to size selected or entered
+	Patterns
+		- Similar to color, a repeatable pattern to be printed at a specific scale/size (example:
+	Material
+		- materials to select from
+		- Material selection alters price p/sq ft
+	Options
+		- Black/White
+		- Top Coat
+		- Flip Image
+
+## Usage
+How to use my plugin.
+
+## Installation
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'workarea-image_decoration'
+```
+
+And then execute:
+```bash
+$ bundle
+```
+
+Or install it yourself as:
+```bash
+$ gem install workarea-image_decoration
+```
+
+## Contributing
+Contribution directions go here.
+
+## License
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,56 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'Image Decoration'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.md')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+APP_RAKEFILE = File.expand_path("../test/dummy/Rakefile", __FILE__)
+load 'rails/tasks/engine.rake'
+load 'rails/tasks/statistics.rake'
+load 'workarea/changelog.rake'
+
+require 'rake/testtask'
+Rake::TestTask.new(:test) do |t|
+  t.libs << 'lib'
+  t.libs << 'test'
+  t.pattern = 'test/**/*_test.rb'
+  t.verbose = false
+end
+task default: :test
+
+$LOAD_PATH.unshift File.expand_path('../lib', __FILE__)
+require 'workarea/image_decoration/version'
+
+desc "Release version #{Workarea::ImageDecoration::VERSION} of the gem"
+task :release do
+  Rake::Task['workarea:changelog'].execute
+  system 'git add CHANGELOG.md'
+  system 'git commit -m "Update CHANGELOG"'
+
+  system "git tag -a v#{Workarea::ImageDecoration::VERSION} -m 'Tagging #{Workarea::ImageDecoration::VERSION}'"
+  system 'git push origin HEAD --follow-tags'
+
+  system "gem build workarea-image_decoration.gemspec"
+  system "gem push workarea-image_decoration-#{Workarea::ImageDecoration::VERSION}.gem"
+  system "rm workarea-image_decoration-#{Workarea::ImageDecoration::VERSION}.gem"
+end
+
+desc 'Run the JavaScript tests'
+ENV['TEASPOON_RAILS_ENV'] = File.expand_path('../test/dummy/config/environment', __FILE__)
+task teaspoon: 'app:teaspoon'
+
+desc 'Start a server at http://localhost:3000/teaspoon for JavaScript tests'
+task :teaspoon_server do
+  Dir.chdir("test/dummy")
+  teaspoon_env = File.expand_path('../test/teaspoon_env.rb', __FILE__)
+  system "RAILS_ENV=test TEASPOON_ENV=#{teaspoon_env} rails s"
+end

data/app/assets/javascripts/workarea/storefront/image_decoration/modules/custom_sizing.js

@@ -0,0 +1,37 @@
+/**
+ * @namespace WORKAREA.customSizing
+ */
+
+ WORKAREA.registerModule('customSizing', (function () {
+  'use strict';
+
+  var customSize = function (event) {
+   var target = $(this).data("target")
+    // $('.item.has-overlayed-item').add(target).removeClass("has-overlayed-item")
+    const image = document.getElementsByClassName('scalable_main_image');
+    console.log(image);
+    const cropper = new Cropper(image, {
+      aspectRatio: 16 / 9,
+      crop(event) {
+        console.log(event.detail.x);
+        console.log(event.detail.y);
+        console.log(event.detail.width);
+        console.log(event.detail.height);
+        console.log(event.detail.rotate);
+        console.log(event.detail.scaleX);
+        console.log(event.detail.scaleY);
+      },
+    });
+
+  },
+  
+  init = function ($scope) {
+
+    $('input[value="custom"]', $scope).on('click', customSize);
+    
+  };
+
+  return {
+    init: init
+  };
+}()));

data/app/assets/javascripts/workarea/storefront/image_decoration/modules/optional_feature.js

@@ -0,0 +1,33 @@
+/**
+ * @namespace WORKAREA.optionalFeature
+ */
+
+ WORKAREA.registerModule('optionalFeature', (function () {
+  'use strict';
+
+    var onCheckboxClick = function (event) {
+        var target = $("[data-grayscale-target]")
+        target.toggleClass('img-filter-grayscale')
+    },
+
+    flipImage = function (event) {
+        var target = $("[data-flipimage-target]")
+        target.toggleClass('img-transform-mirror')
+    },
+
+    personalize = function (event) {
+        $('#add-text').toggle();
+    },
+    
+
+    init = function ($scope) {
+        $('input[type="checkbox"][data-grayscale]', $scope).on('click', onCheckboxClick); 
+        $('input[type="checkbox"][data-flipimage]', $scope).on('click', flipImage); 
+        $('#text', $scope).on('click', personalize);
+    };
+
+    return {
+        init: init
+    };
+
+}()));

data/app/assets/javascripts/workarea/storefront/image_decoration/modules/pattern_repeat.js

@@ -0,0 +1,45 @@
+/**
+ * @namespace WORKAREA.patternRepeat
+ */
+
+ WORKAREA.registerModule('patternRepeat', (function () {
+  'use strict';
+
+  var onRadioClick = function (event) {
+
+    var others = $("[name='" + this.name + "']").map(function () {
+      return this.value
+    }).get().join(" ")
+    $('.scalable_main_image, .thumb-set-bg').removeClass(others).addClass(this.value)
+  },
+
+  displayLiving = function (event) {
+    var target = $(this).data("target")
+    $('.product-details__primary-image.overlayed-item').add(target).removeClass("overlayed-image-3 detail-view first-preview overlayed-image-4").addClass('overlayed-image-3')
+  },
+  displayDining = function (event) {
+    var target = $(this).data("target")
+    $('.product-details__primary-image.overlayed-item ').add(target).removeClass("overlayed-image-3 detail-view first-preview overlayed-image-4").addClass('overlayed-image-4')
+  }, 
+  displayDetail = function (event) {
+    var target = $(this).data("target")
+    $('.product-details__primary-image.overlayed-item').add(target).removeClass("overlayed-image-3 first-preview overlayed-image-4").addClass('detail-view')
+  },
+  firstPreview = function (event) {
+    var target = $(this).data("target")
+    $('.product-details__primary-image.overlayed-item').add(target).removeClass("overlayed-image-3 detail-view overlayed-image-4").addClass('first-preview')
+  },
+  
+  init = function ($scope) {
+
+    $('input[type="radio"]', $scope).on('click', onRadioClick);
+    $('.first-preview', $scope).on('click', firstPreview);
+    $('.overlayed-item-3', $scope).on('click', displayLiving);
+    $('.overlayed-item-4', $scope).on('click', displayDining);
+    $('.detail-thumb', $scope).on('click', displayDetail);
+  };
+
+  return {
+    init: init
+  };
+}()));

data/app/assets/javascripts/workarea/storefront/products/modules/create_your_own.js

@@ -0,0 +1,25 @@
+/**
+ * @namespace WORKAREA.createYourOwn
+ */
+
+ WORKAREA.registerModule('createYourOwn', (function () {
+  'use strict';
+
+    var description = function (event) {
+        $('#own-create').toggle();
+    },
+    
+    shipping = function (event) {
+        $('#own-ship').toggle();
+    },
+
+    init = function ($scope) {
+        $('#create', $scope).on('click', description);
+        $('#ship', $scope).on('click', shipping);
+    };
+
+    return {
+        init: init
+    };
+
+}()));

data/app/assets/stylesheets/workarea/storefront/image_decoration/components/custom_sizing.scss

@@ -0,0 +1,62 @@
+// Styling for Custom sizing feature
+
+.form-list {
+    margin: 0px;
+}
+.form-list .radio {
+    font-size: 1em;
+    cursor: pointer;
+}
+.custom-size-options li {
+    margin-bottom: 5px;
+}
+
+.custom-size-options .form-control {
+    display: inline-block;
+    vertical-align: middle;
+}
+.custom-size-options .size-input {
+    height: 2.2em;
+    width: 4em;
+}
+.form-control {
+    display: block;
+    width: 100%;
+    height: 34px;
+    padding: 6px 12px;
+    font-size: 14px;
+    line-height: 1.42857143;
+    color: #555;
+    background-color: #fff;
+    background-image: none;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
+    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+}
+.custom-size-options label {
+    font-size: 14px;
+    color: #929292;
+}
+.custom-size-options ul {
+    padding: 0;
+}
+.custom-size-options li {
+    margin-bottom: 5px;
+}
+.custom-size-options li > div {
+    display: inline-block;
+}
+
+.form-list input[type='radio'] {
+
+	&:before {
+		box-shadow: 0 0 0 0px #ffa200 inset !important;
+	}
+	&:checked {
+		box-shadow: 0 0 0 8px #ffa200 inset;
+	}
+}

data/app/assets/stylesheets/workarea/storefront/image_decoration/components/optional_feature.scss

@@ -0,0 +1,15 @@
+.img-filter-grayscale {
+	filter: grayscale(100%);
+}
+
+.img-transform-mirror {
+	transform: scaleX(-1);
+}
+
+.personalize{
+	display: none;
+}
+
+input[type='radio'] {
+    left: 0em !important;
+}

data/app/assets/stylesheets/workarea/storefront/image_decoration/components/pattern_repeat.scss

@@ -0,0 +1,273 @@
+// Styling for pattern repeat image
+
+.relative input[type='radio'] {
+	left: 0.9em !important;
+
+	&:before {
+		box-shadow: 0 0 0 0px #ffa200 inset !important;
+	}
+	&:checked {
+		box-shadow: 0 0 0 8px #ffa200 inset;
+	}
+}
+
+tr td input {
+	cursor: pointer;
+}
+
+.scalable-img {
+	width: 68px;
+	height: 68px;
+}
+.scalable_main_image {
+	width: 100%;
+	height: 550px;
+	transition: all, .3s;
+}
+
+// Pattern repeats 
+
+.scalable-img.hundred, .scalable_main_image.hundred, .thumb-set-bg.hundred {
+	border: 2px solid transparent;
+	padding: 0px;
+	background-size: 100%;
+}
+.scalable-img.seventyfive, .scalable_main_image.seventyfive, .thumb-set-bg.seventyfive {
+	border: 2px solid transparent;
+	padding: 0px;
+	background-size: 75%;
+}
+.scalable-img.fifty, .scalable_main_image.fifty, .thumb-set-bg.fifty {
+	border: 2px solid transparent;
+	padding: 0px;
+	background-size: 50%;
+}
+.scalable-img.twentyfive, .scalable_main_image.twentyfive, .thumb-set-bg.twentyfive {
+	border: 2px solid transparent;
+	padding: 0px;
+	background-size: 25%;
+}
+.no-repeat, .scalable_main_image.no-repeat, .thumb-set-bg.no-repeat {
+	border: 2px solid transparent;
+	padding: 0px;
+	background-size: 100%;
+}
+.thumb-zoom {
+    background-position: top left;
+    background-size: 140% !important;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    width: 100%;
+    height: 100%;
+}
+.scalable-patterns.radio .no-repeat-pattern {
+	font-size: 11px;
+	letter-spacing: .5px;
+	line-height: 1.2;
+	left: 0px;
+	bottom: 19px;
+	width: 67px;
+	height: 68px;
+	color: white;
+	opacity: .8;
+	background-color: #6d6e71;
+	-webkit-box-pack: center;
+	-ms-flex-pack: center;
+	justify-content: center;
+	-webkit-box-align: center;
+	-ms-flex-align: center;
+	align-items: center;
+	display: -webkit-box;
+	display: -ms-flexbox;
+	display: flex;
+	z-index: 2;
+	text-align: -webkit-center;
+}
+.detailed-view {
+	font-size: 11px;
+	letter-spacing: .5px;
+	line-height: 1.2;
+	left: 0px;
+	top: 0px;
+	bottom: 0px;
+	width: 70px;
+    height: 71px;
+	color: white;
+	opacity: .8;
+	background-color: #6d6e71;
+	-webkit-box-pack: center;
+	-ms-flex-pack: center;
+	justify-content: center;
+	-webkit-box-align: center;
+	-ms-flex-align: center;
+	align-items: center;
+	display: -webkit-box;
+	display: -ms-flexbox;
+	display: flex;
+	z-index: 2;
+	text-align: -webkit-center;
+}
+
+.detail-view {
+	width: 750px;
+	background-size: 200%;
+    position: relative;
+    // background-repeat: no-repeat;
+    left: -1500px;
+    top: 0px;
+    z-index: 999;
+    opacity: 1;
+}
+
+.first-preview {
+	background-size: 200%;
+}
+
+.absolute {
+	position: absolute;
+}
+.relative {
+	position: relative;
+}
+.scalable-patterns.radio {
+	margin-bottom: 45px;
+	margin-top: 5px;
+}
+
+.radio {
+	font-size: 1em;
+	cursor: pointer;
+	position: relative;
+	display: block;
+	margin-top: 10px;
+	margin-bottom: 10px;
+}
+
+ul {
+	display: block;
+	list-style-type: disc;
+	margin-block-start: 1em;
+	margin-block-end: 1em;
+	margin-inline-start: 0px;
+	margin-inline-end: 0px;
+	padding-inline-start: 40px;
+}
+dd, dt {
+	line-height: 1.42857143;
+}
+dl {
+	display: block;
+	margin-block-start: 1em;
+	margin-block-end: 1em;
+	margin-inline-start: 0px;
+	margin-inline-end: 0px;
+}
+ul li{
+	display: inline;
+}
+
+.img-responsive{
+	width: 5em !important;
+	height: 5em !important;
+
+}
+
+.thumb-set-bg {
+	// background-size: 100%;
+	background-position: top left;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	width: 100%;
+	height: 100%;
+	-webkit-transition: all, .3s;
+	-o-transition: all, .3s;
+	transition: all, .3s;
+}
+
+.radio label {
+	min-height: 20px;
+	padding-left: 20px;
+	margin-bottom: 0;
+	font-weight: 400;
+	cursor: pointer;
+}
+.scalable-patterns.radio .pattern-name {
+	position: static;
+	right: 17px;
+	bottom: -25px;
+	padding-left: 14px;
+}
+.z-index-1 {
+	z-index: 1;
+}
+.overlay-item-ruler .ruler-overlay {
+	background-repeat: no-repeat;
+	background-size: cover;
+	background-image: url(https://www.muralsyourway.com/skin/frontend/smartwave/porto/images/YouRule.png);
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	width: 100%;
+	height: 100%;
+	z-index: 1;
+}
+
+.has-overlayed-item {
+	position: relative;
+	height: 100%;
+	display: block;
+}
+.has-overlayed-item .overlayed-item {
+	position: absolute;
+	width: 100%;
+	height: 120%;
+	bottom: 0;
+	left: 0;
+	z-index: 1;
+	background-size: contain;
+	background-position: center bottom;
+	background-repeat: no-repeat;
+}
+
+.overlayed-image-3 {
+	background-image: url('https://www.muralsyourway.com/media/overlays/living_land.png');
+	transition: all, 1s;
+}
+.overlayed-image-4 {
+	background-image: url('https://www.muralsyourway.com/media/overlays/office_land.png');
+	transition: all, 1s;
+}
+.living-overlay {
+	margin-left: 4px;
+}
+.office_land-overlay {
+	margin-left: 4px;
+}
+.thumbnail {
+	margin-left: 4px;
+	margin-top: -3.3em;
+}
+td .item {
+	cursor: pointer;
+}
+.has-overlayed-item .zoomed {
+    background-repeat: no-repeat;
+    background-position: top left;
+    background-size: 141%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 1;
+}