Skip to content

Commit

Permalink
refactoring
Browse files Browse the repository at this point in the history
  • Loading branch information
maccman committed Apr 5, 2012
1 parent 393ca39 commit 8f27385
Show file tree
Hide file tree
Showing 14 changed files with 300 additions and 139 deletions.
69 changes: 16 additions & 53 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ Phase 1:
* ✓ Select multiple items
* ✓ Toolbar menu
* Inspector panel (Element/Text/Ruler)
* Background
* Border
* ½ Background
* ½ Border
* ✓ Shadow
* Font alignment
* Font family/size/style/color
Expand All @@ -24,19 +24,18 @@ Phase 2:

* ✓ Stage snapping
* ✓ Color picker
* Complete background inspector
* Scaling stage & size
* Z-index
* Z-index
* Copy paste
* Undo/redo (on set())
* ½ Undo/redo
* Saving/opening
* Resizing snapping
* Element snapping
* Pen tool
* Keyboard shortcuts

Nice to have:

* Keyboard shortcuts
* Versioning
* Exporting HTML
* Share (dropbox/email?)
Expand All @@ -45,6 +44,17 @@ Nice to have:

Inherit Ellipsis from Rectangle (resizing & lines).

##Elements

* Triangle
* ✓ Rectangle
* ✓ Ellipsis
* Form elements
* Text
* Image
* Line tool?
* Link?

##Rulers & Snap

When moving element - cycle through all the other elements, compare the sides - inject rulers if necessary. Also show rulers for center of page. Need to think about how multiple selected items works.
Expand All @@ -59,53 +69,6 @@ Two types of snapping:
* Width snapping:
* Detect distance between elements - snap when two distances are the same.

##Elements

* Triangle
* ✓ Rectangle
* ✓ Ellipsis
* Form elements
* Text
* Image
* Line tool?
* Link?

##Canvas CSS properties

background-clip: border-box;
background-color: transparent;
background-image: none;
background-position: 0% 0%;
background-repeat: repeat;
background-size: auto;

border-bottom-color: #555;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
border-bottom-style: none;
border-bottom-width: 0px;

border-left-color: #555;
border-left-style: none;
border-left-width: 0px;
border-right-color: #555;
border-right-style: none;
border-right-width: 0px;
border-top-color: #555;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-top-style: none;
border-top-width: 0px;

box-shadow: none;
color: #555;

filter: none;
height: 20px;

width: 848px;
z-index: auto;

#Save to png

https://github.com/paulhammond/webkit2png/blob/master/webkit2png
Expand Down
39 changes: 0 additions & 39 deletions assets/javascripts/app/controllers/canvas.module.coffee

This file was deleted.

10 changes: 4 additions & 6 deletions assets/javascripts/app/controllers/element.module.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ Background = require('app/models/properties/background')
Color = require('app/models/properties/color')

class Element extends Spine.Controller
className: 'element'

defaults: ->
result =
position: 'absolute'
Expand All @@ -18,9 +20,7 @@ class Element extends Spine.Controller
'mousedown': 'select'

constructor: (attrs = {}) ->
@el = attrs.el if 'el' of attrs
super()
@el.addClass('element')
super(el: attrs.el)

@properties = {}

Expand Down Expand Up @@ -60,15 +60,13 @@ class Element extends Spine.Controller
@el.trigger('moved', [this])

order: (i) ->
# Make sure zIndex doesn't conflict
# with other interface elements
@set('zIndex', i + 100)

remove: ->
@el.remove()

clone: ->
# TODO - inheritance...
# TODO - @properties inheritance...
new @constructor(@properties)

# Selecting elements
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ class Thumb extends Spine.Controller
difference =
left: e.pageX - @dragPosition.left
top: e.pageY - @dragPosition.top

@dragPosition = {left: e.pageX, top: e.pageY}
@el.trigger('resize.start', [@type, difference, e.shiftKey])

Expand Down Expand Up @@ -96,7 +97,7 @@ class Resizing extends Spine.Controller
area.left += position.left

if lockAR
# TODO - FIXME
# TODO - FIXME, this doesn't lock AR properly
area.width = Math.max(area.width, area.height)
area.height = area.width

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ class Resizing extends Spine.Controller
@areaTitle.change(area)

resizeEnd: ->
# Reset areaTitle
@areaTitle?.remove()
@areaTitle = null

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,9 +50,7 @@ class SelectArea extends Spine.Controller
$(document).mouseup(@drop)

drag: (e) =>
# Mouse events need to be offset
# by the height of the header,
# We also offset by 1, so it doesn't
# We offset by 1, so it doesn't
# mess up click events
unless @selectArea
@selectArea = new Area(
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

min = (a = 0, b = 0) ->
return b if a is 0
Math.min(a, b)
Expand Down
7 changes: 0 additions & 7 deletions assets/javascripts/app/controllers/undo.module.coffee

This file was deleted.

20 changes: 20 additions & 0 deletions assets/javascripts/app/models/undo.module.coffee
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
class Undo
@undoStack: []
@redoStack: []

@add: (undo, redo) ->
@undoStack.push([undo, redo])
@redoStack = []
redo()

@undo: ->
[undo, redo] = @undoStack.pop()
undo()
@redoStack.push([undo, redo])

@redo: ->
[undo, redo] = @redoStack.pop()
redo()
@undoStack.push([undo, redo])

module.exports = Undo
8 changes: 5 additions & 3 deletions public/assets/app/controllers/element.module.js
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,8 @@ this.require.define({"app/controllers/element":function(exports, require, module

__extends(Element, _super);

Element.prototype.className = 'element';

Element.prototype.defaults = function() {
var result;
return result = {
Expand All @@ -95,9 +97,9 @@ this.require.define({"app/controllers/element":function(exports, require, module
function Element(attrs) {
if (attrs == null) attrs = {};
this.selected = __bind(this.selected, this);
if ('el' in attrs) this.el = attrs.el;
Element.__super__.constructor.call(this);
this.el.addClass('element');
Element.__super__.constructor.call(this, {
el: attrs.el
});
this.properties = {};
this.set(this.defaults());
this.set(attrs);
Expand Down
86 changes: 86 additions & 0 deletions public/assets/app/controllers/element/undo.module.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
(function() {
if (!this.require) {
var modules = {}, cache = {};

var require = function(name, root) {
var path = expand(root, name), indexPath = expand(path, './index'), module, fn;
module = cache[path] || cache[indexPath];
if (module) {
return module;
} else if (fn = modules[path] || modules[path = indexPath]) {
module = {id: path, exports: {}};
cache[path] = module.exports;
fn(module.exports, function(name) {
return require(name, dirname(path));
}, module);
return cache[path] = module.exports;
} else {
throw 'module ' + name + ' not found';
}
};

var expand = function(root, name) {
var results = [], parts, part;
// If path is relative
if (/^\.\.?(\/|$)/.test(name)) {
parts = [root, name].join('/').split('/');
} else {
parts = name.split('/');
}
for (var i = 0, length = parts.length; i < length; i++) {
part = parts[i];
if (part == '..') {
results.pop();
} else if (part != '.' && part != '') {
results.push(part);
}
}
return results.join('/');
};

var dirname = function(path) {
return path.split('/').slice(0, -1).join('/');
};

this.require = function(name) {
return require(name, '');
};

this.require.define = function(bundle) {
for (var key in bundle) {
modules[key] = bundle[key];
}
};

this.require.modules = modules;
this.require.cache = cache;
}

return this.require;
}).call(this);
this.require.define({"app/controllers/element/undo":function(exports, require, module){(function() {
var Undo;

Undo = (function() {

function Undo() {}

Undo.undoStack = [];

Undo.redoStack = [];

Undo.add = function(undo, action) {
this.undoStack.push(undo);
return this.redoStack = [];
};

Undo.undo = function() {};

return Undo;

})();

module["extends"] = Undo;

}).call(this);
;}});

0 comments on commit 8f27385

Please sign in to comment.