Merge pull request #86 from Team-Sass/2.x.x-memoization

2.x.x memoization
at-import · Dec 17, 2013 · 4ce02b0 · 4ce02b0
2 parents eeb90f6 + 2f0aad7
commit 4ce02b0
Show file tree

Hide file tree

Showing 42 changed files with 4,192 additions and 50 deletions.
diff --git a/Gemfile b/Gemfile
@@ -3,7 +3,7 @@ source 'https://rubygems.org'
 
 gem 'sass', '3.3.0.rc.2'
 gem 'compass', '1.0.0.alpha.13'
-gem 'singularitygs', '~>1.0.7'
+gem 'sassy-maps', '<1.0.0'
 
 group :test do
   gem 'rake'

diff --git a/bower.json b/bower.json
@@ -7,5 +7,8 @@
     "node_modules",
     "components",
     "test"
-  ]
+  ],
+  "dependencies": {
+    "sassy-maps": "<1.0.0"
+  }
 }
diff --git a/breakpoint.gemspec b/breakpoint.gemspec
@@ -27,4 +27,5 @@ Gem::Specification.new do |s|
 
   s.add_dependency("sass",      ["~>3.3.0.rc.2"])
   s.add_dependency("compass",   ["~>1.0.0.alpha.13"])
+  s.add_dependency("sassy-maps",   ["<1.0.0"])
 end
diff --git a/lib/breakpoint.rb b/lib/breakpoint.rb
@@ -1,8 +1,9 @@
 require 'compass'
+require 'sassy-maps'
 
 Compass::Frameworks.register("breakpoint", :path => "#{File.dirname(__FILE__)}/..")
 
 module Breakpoint
-  VERSION = "2.3.1"
-  DATE = "2013-12-04"
+  VERSION = "2.3.2"
+  DATE = "2013-12-16"
 end
diff --git a/stylesheets/breakpoint/_parsers.scss b/stylesheets/breakpoint/_parsers.scss
@@ -7,77 +7,98 @@
 @import "parsers/triple";
 @import "parsers/resolution";
 
+$Memo-Exists: function-exists(memo-get) and function-exists(memo-set);
+
 //////////////////////////////
 // Breakpoint Function
 //////////////////////////////
 @function breakpoint($query, $contexts...) {
-  // Internal Variables
-  $query-string: '';
-  $query-fallback: false;
+  $run: true;
   $return: ();
 
-  // Reserve Global Private Breakpoint Context
-  $holder-context: $private-breakpoint-context-holder;
-  $holder-query-count: $private-breakpoint-query-count;
+  // Grab the Memo Output if Memoization can be a thing
+  @if $Memo-Exists {
+    $return: memo-get(breakpoint, breakpoint $query $contexts);
 
-  // Reset Global Private Breakpoint Context
-  $private-breakpoint-context-holder: () !global;
-  $private-breakpoint-query-count: 0 !global;
+    @if $return != null {
+      $run: false;
+    }
+  }
 
+  @if not $Memo-Exists or $run {
+    // Internal Variables
+    $query-string: '';
+    $query-fallback: false;
+    $return: ();
 
-  // Test to see if it's a comma-separated list
-  $or-list: if(list-separator($query) == 'comma', true, false);
+    // Reserve Global Private Breakpoint Context
+    $holder-context: $private-breakpoint-context-holder;
+    $holder-query-count: $private-breakpoint-query-count;
 
+    // Reset Global Private Breakpoint Context
+    $private-breakpoint-context-holder: () !global;
+    $private-breakpoint-query-count: 0 !global;
 
-  @if ($or-list == false and $breakpoint-legacy-syntax == false) {
-    $query-string: breakpoint-parse($query);
-  }
-  @else {
-    $length: length($query);
 
-    $last: nth($query, $length);
-    $query-fallback: breakpoint-no-query($last);
+    // Test to see if it's a comma-separated list
+    $or-list: if(list-separator($query) == 'comma', true, false);
+
 
-    @if ($query-fallback != false) {
-      $length: $length - 1;
+    @if ($or-list == false and $breakpoint-legacy-syntax == false) {
+      $query-string: breakpoint-parse($query);
     }
+    @else {
+      $length: length($query);
 
-    @if ($breakpoint-legacy-syntax == true) {
-      $mq: ();
+      $last: nth($query, $length);
+      $query-fallback: breakpoint-no-query($last);
 
-      @for $i from 1 through $length {
-        $mq: append($mq, nth($query, $i), comma);
+      @if ($query-fallback != false) {
+        $length: $length - 1;
       }
 
-      $query-string: breakpoint-parse($mq);
-    }
-    @else {
-      $query-string: '';
-      @for $i from 1 through $length {
-        $query-string: $query-string + if($i == 1, '', ', ') + breakpoint-parse(nth($query, $i));
+      @if ($breakpoint-legacy-syntax == true) {
+        $mq: ();
+
+        @for $i from 1 through $length {
+          $mq: append($mq, nth($query, $i), comma);
+        }
+
+        $query-string: breakpoint-parse($mq);
+      }
+      @else {
+        $query-string: '';
+        @for $i from 1 through $length {
+          $query-string: $query-string + if($i == 1, '', ', ') + breakpoint-parse(nth($query, $i));
+        }
       }
     }
-  }
 
-  $return: ('query': $query-string,
-	    'fallback': $query-fallback,
-	    'context holder': $private-breakpoint-context-holder,
-	    'query count': $private-breakpoint-query-count
-  );
-  @if length($contexts) > 0 and nth($contexts, 1) != false {
-    @if $query-fallback != false {
-      $context-setter: private-breakpoint-set-context('no-query', $query-fallback);
+    $return: ('query': $query-string,
+        'fallback': $query-fallback,
+        'context holder': $private-breakpoint-context-holder,
+        'query count': $private-breakpoint-query-count
+    );
+    @if length($contexts) > 0 and nth($contexts, 1) != false {
+      @if $query-fallback != false {
+        $context-setter: private-breakpoint-set-context('no-query', $query-fallback);
+      }
+      $context-map: ();
+      @each $context in $contexts {
+        $context-map: map-merge($context-map, ($context: breakpoint-get-context($context)));
+      }
+      $return: map-merge($return, (context: $context-map));
     }
-    $context-map: ();
-    @each $context in $contexts {
-      $context-map: map-merge($context-map, ($context: breakpoint-get-context($context)));
+
+    // Reset Global Private Breakpoint Context
+    $private-breakpoint-context-holder: () !global;
+    $private-breakpoint-query-count: 0 !global;
+
+    @if $Memo-Exists {
+      $holder: memo-set(breakpoint, breakpoint $query $contexts, $return);
     }
-    $return: map-merge($return, (context: $context-map));
   }
 
-  // Reset Global Private Breakpoint Context
-  $private-breakpoint-context-holder: () !global;
-  $private-breakpoint-query-count: 0 !global;
   @return $return;
 }
 

diff --git a/tests/config.rb b/tests/config.rb
@@ -1,4 +1,5 @@
 # Require any additional compass plugins here.]
+require 'sassy-maps'
 
 # File system locations
 sass_dir              = 'tests'

diff --git a/tests/controls/18_pixel-memo.css b/tests/controls/18_pixel-memo.css
@@ -0,0 +1,42 @@
+/*
+ * Assume $breakpoint-default-feature
+ * if only a number
+ * $single-pixel-value: 500px;
+ * $single-em-value: 30em;
+ */
+@media (min-width: 500px) {
+  .foo {
+    content: '$single-pixel-value';
+    content: '@media (min-width: 500px)';
+  }
+}
+@media (min-width: 30em) {
+  .foo {
+    content: '$single-em-value';
+    content: '@media (min-width: 30em)';
+  }
+}
+@media (min-width: 500px) {
+  .foo {
+    content: '$single-pixel-value';
+    content: '@media (min-width: 500px)';
+  }
+}
+@media (min-width: 30em) {
+  .foo {
+    content: '$single-em-value';
+    content: '@media (min-width: 30em)';
+  }
+}
+@media (min-width: 500px) {
+  .foo {
+    content: '$single-pixel-value';
+    content: '@media (min-width: 500px)';
+  }
+}
+@media (min-width: 30em) {
+  .foo {
+    content: '$single-em-value';
+    content: '@media (min-width: 30em)';
+  }
+}
diff --git a/tests/controls/19_pixel_to_em-memo.css b/tests/controls/19_pixel_to_em-memo.css
@@ -0,0 +1,25 @@
+/* $breakpoint-to-ems: true; */
+@media (min-width: 31.25em) {
+  .breakpoint-default-feature-to-ems {
+    content: '$single-pixel-value';
+    content: '@media (min-width: 31.25em)';
+  }
+}
+@media (min-width: 30em) {
+  .breakpoint-default-feature-to-ems {
+    content: '$single-em-value';
+    content: '@media (min-width: 30em)';
+  }
+}
+@media (min-width: 31.25em) {
+  .breakpoint-default-feature-to-ems {
+    content: '$single-pixel-value';
+    content: '@media (min-width: 31.25em)';
+  }
+}
+@media (min-width: 30em) {
+  .breakpoint-default-feature-to-ems {
+    content: '$single-em-value';
+    content: '@media (min-width: 30em)';
+  }
+}
diff --git a/tests/controls/20_feature_values-memo.css b/tests/controls/20_feature_values-memo.css
@@ -0,0 +1,92 @@
+/*
+ * Single value with feature
+ * $feature-first : height 500px;
+ * $value-first : 500px height;
+ * $arbitrary-feature : lion 500px;
+ * $feature-value-both-strings : portrait orientation;
+ */
+@media (height: 500px) {
+  .foo {
+    content: '$feature-first';
+    content: '@media (height: 500px)';
+  }
+}
+@media (height: 500px) {
+  .foo {
+    content: '$value-first';
+    content: '@media (height: 500px)';
+  }
+}
+@media (lion: 500px) {
+  .foo {
+    content: '$arbitrary-feature';
+    content: '@media (lion: 500px)';
+  }
+}
+@media (orientation: portrait) {
+  .foo {
+    content: '$feature-value-both-strings';
+    content: '@media (orientation: portrait)';
+  }
+}
+@media (height: 500px) {
+  .foo {
+    content: '$feature-first';
+    content: '@media (height: 500px)';
+  }
+}
+@media (height: 500px) {
+  .foo {
+    content: '$value-first';
+    content: '@media (height: 500px)';
+  }
+}
+@media (lion: 500px) {
+  .foo {
+    content: '$arbitrary-feature';
+    content: '@media (lion: 500px)';
+  }
+}
+@media (orientation: portrait) {
+  .foo {
+    content: '$feature-value-both-strings';
+    content: '@media (orientation: portrait)';
+  }
+}
+
+@media (height: 500px) {
+  .bar {
+    content: '$feature-first';
+    content: '@media (height: 31.25em)';
+  }
+}
+@media (height: 500px) {
+  .bar {
+    content: '$value-first';
+    content: '@media (height: 31.25em)';
+  }
+}
+@media (lion: 500px) {
+  .bar {
+    content: '$arbitrary-feature';
+    content: '@media (lion: 31.25em)';
+  }
+}
+@media (height: 500px) {
+  .bar {
+    content: '$feature-first';
+    content: '@media (height: 31.25em)';
+  }
+}
+@media (height: 500px) {
+  .bar {
+    content: '$value-first';
+    content: '@media (height: 31.25em)';
+  }
+}
+@media (lion: 500px) {
+  .bar {
+    content: '$arbitrary-feature';
+    content: '@media (lion: 31.25em)';
+  }
+}
diff --git a/tests/controls/21_min_max-memo.css b/tests/controls/21_min_max-memo.css
@@ -0,0 +1,30 @@
+/*
+ * Set min-width/max-width
+ * if both values are numbers
+ * $min-max-default-feature : 500px 700px;
+ */
+@media (min-width: 500px) and (max-width: 700px) {
+  .foo {
+    content: '$min-max-default-feature';
+    content: '@media (min-width: 500px) and (max-width: 700px)';
+  }
+}
+@media (min-width: 500px) and (max-width: 700px) {
+  .foo {
+    content: '$min-max-default-feature';
+    content: '@media (min-width: 500px) and (max-width: 700px)';
+  }
+}
+
+@media (min-width: 500px) and (max-width: 700px) {
+  .bar {
+    content: '$min-max-default-feature';
+    content: '@media (min-width: 31.25em) and (max-width: 43.75em)';
+  }
+}
+@media (min-width: 500px) and (max-width: 700px) {
+  .bar {
+    content: '$min-max-default-feature';
+    content: '@media (min-width: 31.25em) and (max-width: 43.75em)';
+  }
+}