From 6de9ac66b5e7ee2378d4f4f29f4e5708ef1c2f7c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 20 Jul 2015 14:41:58 -0400 Subject: add business logic to new plan style --- public/assets/stylesheets/app.css | 49 +++++++---- public/assets/test/ortho3.html | 64 +++++++++++++-- views/about/_old_plans.ejs | 63 ++++++++++++++ views/about/_plans.ejs | 168 +++++++++++++++++++++++++------------- views/about/brochure.ejs | 94 +-------------------- 5 files changed, 265 insertions(+), 173 deletions(-) create mode 100644 views/about/_old_plans.ejs diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css index 4bfa363..56c65fe 100755 --- a/public/assets/stylesheets/app.css +++ b/public/assets/stylesheets/app.css @@ -903,24 +903,33 @@ iframe.embed { } /* PLANS BROCHURE */ -/* nb these styles should be fixed for narrower screens/mobile layout */ -.about_plan { - width: 28vw; - margin: 2vw; - float: left; - min-height: 28vw; - position: relative; -} -.about_plan button { - position: absolute; - bottom: 5%; - left: 5%; - width: 90%; -} .about_custom { clear: both; - width: 76vw; - margin: 2vw 10vw; + max-width: 600px; + margin: 0 auto; + font-size: 14px; + border-bottom: 1px solid #e5e5e5; +} +.about_custom h3 { + text-transform: uppercase; + letter-spacing: 3px; + font-size: 1.25em; + font-weight: 500; + background: #3A3A3A; + color: white; + text-align: center; +} +.about_custom li { + list-style-type: none; + line-height: 2em; + padding: 10px 20px; + background: white; + text-align: center; + border-left: 1px solid #e5e5e5; + border-right: 1px solid #e5e5e5; +} +.about_custom a { + border-bottom: 1px solid black; } ul#plans { @@ -1013,6 +1022,14 @@ ul#plans .signup { padding: 25px 0; } +.signup .current { + display: inline-block; + color: white; + font-weight: bold; + font-size: 1em; + padding: 4px 30px 3px; +} + .signup .button { font-weight: bold; padding: 16px 30px 14px; diff --git a/public/assets/test/ortho3.html b/public/assets/test/ortho3.html index 3ae0204..fa7e3c5 100644 --- a/public/assets/test/ortho3.html +++ b/public/assets/test/ortho3.html @@ -44,6 +44,7 @@ body { + @@ -96,7 +97,7 @@ var ArrowTool = MapTool.extend(function(base){ exports.down = function(e, cursor){ last_point.a = cursor.x.a last_point.b = cursor.y.a - var p = findClosestPoint(last_point) + var p = shapes.findClosestPoint(last_point) if (p) { selected_shape = p.shape selected_point = p.point @@ -110,7 +111,7 @@ var ArrowTool = MapTool.extend(function(base){ exports.move = function(e, cursor){ last_point.a = cursor.x.a last_point.b = cursor.y.a - var p = findClosestPoint(last_point) + var p = shapes.findClosestPoint(last_point) if (p) { document.body.style.cursor = "pointer" last_point.assign(p.point) @@ -339,6 +340,26 @@ var OrthoPolylineTool = MapTool.extend(function (base) { return exports }) +var EraserTool = MapTool.extend(function(base){ + var exports = {} + exports.down = function(e, cursor){ + } + exports.move = function(e, cursor){ + var segment = shapes.findClosestSegment(last_point) + if (segment) { + document.body.style.cursor = "pointer" + last_point.a = segment.x + last_point.b = segment.y + cursor.x.a = cursor.x.b = last_point.a + cursor.y.a = cursor.y.b = last_point.b + return + } + else { + document.body.style.cursor = "crosshair" + } + } + return exports +}) var ShapeList = Fiber.extend(function(base){ var exports = {} @@ -348,6 +369,12 @@ var ShapeList = Fiber.extend(function(base){ exports.add = function(shape){ this.shapes.push(shape) } + exports.remove = function(shape){ + var index = this.shapes.indexOf(shape) + if (index !== -1) { + this.shapes.splice(index, 1) + } + } exports.findClosestPoint = function (p){ var point for (var i = 0; i < this.shapes.length; i++) { @@ -364,6 +391,17 @@ var ShapeList = Fiber.extend(function(base){ } return null } + exports.findClosestSegment = function (p){ + var segment = null, closest_segment = null + for (var i = 0; i < this.shapes.length; i++) { + segment = this.shapes[i].hasSegmentNear(p, 10) + if (segment && (! closest_segment || segment.distance < closest_segment.distance)) { + closest_segment = segment + closest_segment.shape = this.shapes[i] + } + } + return closest_segment + } exports.forEach = function(fn){ this.shapes.forEach(fn) } @@ -421,7 +459,10 @@ var Polyline = Fiber.extend(function(base){ var dx, dy, new_x, new_y, x, y, closest_distance = min_dist || Infinity var closest_i = -1 var points = this.points + var p1, p2 = points[0] for (var i = 1; i < points.length; i++) { + p1 = p2 + p2 = points[i] d1 = p1.a - p2.a d2 = p1.b - p2.b sum = d1*d1 + d2*d2 @@ -448,10 +489,6 @@ var Polyline = Fiber.extend(function(base){ } } - exports.getSegment = function(i){ - return [ points[i], points[i+1] ] - } - exports.draw = function(ctx){ var points = this.points if (! points.length) return @@ -541,7 +578,16 @@ MX.Polyline = MX.Object3D.extend({ }) var hue = abs(round( angle / PI * 90 + 300)) mx.el.style.backgroundColor = 'hsl(' + [hue, "100%", "50%"] + ')' - } + }, + + destroy: function(){ + this.faces.forEach(function(mx){ + scene.remove(mx) + }) + this.faces = null + this.points = null + }, + }) MX.Point = MX.Object3D.extend({ @@ -577,6 +623,7 @@ map = new Map ({ map.ui.add_tool("arrow", new ArrowTool) map.ui.add_tool("polyline", new PolylineTool) map.ui.add_tool("ortho-polyline", new OrthoPolylineTool) +map.ui.add_tool("eraser", new EraserTool) map.ui.add_tool("position", new PositionTool) $(window).resize(function(){ @@ -645,6 +692,9 @@ OrthographicToolbar.add("polyline-mode", function(){ OrthographicToolbar.add("ortho-polyline-mode", function(){ map.ui.set_tool("ortho-polyline") }) +OrthographicToolbar.add("eraser-mode", function(){ + map.ui.set_tool("eraser") +}) OrthographicToolbar.pick("ortho-polyline-mode") document.addEventListener('DOMContentLoaded', build) diff --git a/views/about/_old_plans.ejs b/views/about/_old_plans.ejs new file mode 100644 index 0000000..e4b07be --- /dev/null +++ b/views/about/_old_plans.ejs @@ -0,0 +1,63 @@ +
+

[[- plans.free.name ]]

+ +
+ +
+

[[- plans.basic.name ]]

+ +
+ +
+

[[- plans.pro.name ]]

+ +
+ +
+ +
+ +
+

Want Something Custom?

+
  • We offer customized white-label options for business and educational uses. +
  • Contact us for more information. +
  • diff --git a/views/about/_plans.ejs b/views/about/_plans.ejs index 16fb9c6..af2a050 100644 --- a/views/about/_plans.ejs +++ b/views/about/_plans.ejs @@ -1,63 +1,117 @@ -
    -

    [[- plans.free.name ]]

    - -
    -
    -

    [[- plans.basic.name ]]

    - + + +
    +

    Want Something Custom?

    +
  • We offer customized white-label options for business and educational uses. +
    + Contact us for more information. +
  • diff --git a/views/about/brochure.ejs b/views/about/brochure.ejs index 80cb154..e34d3d3 100644 --- a/views/about/brochure.ejs +++ b/views/about/brochure.ejs @@ -11,99 +11,7 @@

    Subscriptions

    - - -
      - -
    • -
      -

      Medium

      -

      $10 / mo

      -

      Great for personal sites and small blogs.

      -
      -
        -
      • - 5 Source Accounts / Hashtags -
      • -
      • - 1 Embeddable Feed -
      • -
      • - Pulls In New Posts Every Hour -
      • -
      • - Moderation and Filtering Tools -
      • -
      • - Everything the Small Plan Contains -
      • -
      • - No Juicer Branding! -
      • -
      - -
    • -
    • -
      -

      Small

      -

      $0 / mo

      -

      Free forever.

      -
      -
        -
      • - 2 Source Accounts / Hashtags -
      • -
      • - 1 Embeddable Social Media Feed -
      • -
      • - Pulls In New Posts Every 24 Hours -
      • -
      • - All Templates and Custom Styling -
      • -
      • - HTTPS Secure Connection Support -
      • -
      • - Juicer Branding -
      • -
      - -
    • -
    - - - - - [[ include _plans ]] + [[ include _plans ]]
    [[ include ../partials/confirm-modal ]] -- cgit v1.2.3-70-g09d2