index.js

// Generated by CoffeeScript 1.7.1
(function() {
  var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };

  window.Skillz = (function() {
    Skillz.prototype.skillz = [];

    function Skillz(options) {
      this.onResize = __bind(this.onResize, this);
      this.onDragStop = __bind(this.onDragStop, this);
      this.renderSkillz = __bind(this.renderSkillz, this);
      this.initialize = __bind(this.initialize, this);
      $(document).ready(this.initialize);
    }

    Skillz.prototype.initialize = function() {
      this.$el = $('.canvas');
      if (localStorage.key('skillz')) {
        this.skillz = JSON.parse(localStorage.getItem('skillz'));
        this.renderSkillz();
      }
      $.getJSON('skillz.json', null, (function(_this) {
        return function(result) {
          var skill, _i, _len;
          for (_i = 0, _len = result.length; _i < _len; _i++) {
            skill = result[_i];
            if (!_this.getSkill(skill.id)) {
              _this.skillz.push(skill);
            }
          }
          return _this.renderSkillz();
        };
      })(this));
      return $(window).resize(this.onResize);
    };

    Skillz.prototype.renderSkillz = function() {
      var skill, _i, _len, _ref;
      $('ul').empty();
      _ref = this.skillz;
      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
        skill = _ref[_i];
        $('ul').append("<li data-skill-id='" + skill.id + "' class='" + skill.category + "'>" + skill.name + "</li>");
      }
      $('li').draggable({
        stop: this.onDragStop
      });
      return this.onResize();
    };

    Skillz.prototype.onDragStop = function(ev) {
      var skill, target, x, y;
      x = (ev.pageX - ev.offsetX) / $(window).width();
      y = (ev.pageY - ev.offsetY) / $(window).height();
      target = $(ev.target);
      skill = this.getSkill(target.data('skill-id'));
      skill.x = x;
      skill.y = y;
      console.log("" + x + "," + y + " - " + (target.css('top')));
      return this.save();
    };

    Skillz.prototype.onResize = function(ev) {
      var skill, _i, _len, _ref, _results;
      _ref = this.skillz;
      _results = [];
      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
        skill = _ref[_i];
        if (skill.x) {
          console.log("" + skill.x + "," + skill.y + " - " + ($(window).width()));
          console.log("moving to " + (skill.x * $(window).width()) + ", " + (skill.y * $(window).height()));
          _results.push($("[data-skill-id=" + skill.id + "]").css({
            top: skill.y * $(window).height(),
            left: skill.x * $(window).width()
          }));
        } else {
          _results.push(void 0);
        }
      }
      return _results;
    };

    Skillz.prototype.save = function() {
      return localStorage.setItem('skillz', JSON.stringify(this.skillz));
    };

    Skillz.prototype.getSkill = function(id) {
      var skill, _i, _len, _ref;
      _ref = this.skillz;
      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
        skill = _ref[_i];
        if (skill.id === id) {
          return skill;
        }
      }
    };

    return Skillz;

  })();

}).call(this);