 
     _updateMetrics: (hard=on) ->
       if hard is on
-        @$metricsSamples.$item = @$sampleItem.clone()
-        @$metricsSamples.$expanded = @$sampleItem.clone().addClass @classNames.expanded
-        @$metricsSamples.$wrap?.remove()
-        @$metricsSamples.$wrap = $('<div>').addClass @classNames.sample
-          .css left: 0, position: 'absolute', right: 0, top: 0
-          .css visibility: 'hidden', zIndex: 0
-          .append @$metricsSamples.$item
-          .append @$metricsSamples.$expanded
-          .appendTo @$el
-
-      {$item, $expanded} = @$metricsSamples
+        {$item, $expanded} = @_getMetricSamples()
+        @metrics =
+          itemWidth: $item.outerWidth()
+          itemHeight: $item.outerHeight()
+          expandedWidth: $expanded.outerWidth()
+          expandedHeight: $expanded.outerHeight()
+
       gutter = Math.round parseFloat(@$sampleItem.css('margin-right'))
-      fullWidth = $item.outerWidth() + gutter
-      fullHeight = $item.outerHeight() + gutter
-
-      if hard is on then @metrics =
-        gutter: gutter
-        itemWidth: $item.outerWidth()
-        itemHeight: $item.outerHeight()
-        expandedWidth: $expanded.outerWidth()
-        expandedHeight: $expanded.outerHeight()
+      fullWidth = @metrics.itemWidth + gutter
+      fullHeight = @metrics.itemHeight + gutter
 
       @$el.css width: 'auto', height: 'auto'
+
       rowSize = parseInt ((@$el.outerWidth() + gutter) / fullWidth), 10
       colSize = Math.ceil @$items.length / rowSize
-      $.extend @metrics,
-        rowSize: rowSize
-        colSize: colSize
+      $.extend @metrics, { gutter, rowSize, colSize },
         wrapWidth: fullWidth * rowSize
         wrapHeight: fullHeight * colSize
       return

      @_dimTimeout = null
      return

    _isBottomEdgeItem: (i) -> (i + 1) > (@$items.length - @metrics.rowSize)

    _isRightEdgeItem: (i) -> (i + 1) % @metrics.rowSize is 0


      # Layout.
      @metrics = {}

      @on 'ready', =>
        @_updateMetrics()
