var Submission = klass.create();
Object.extend(Submission.prototype, {
  initialize: function(instance, state, media) {
    this.id = instance;
    this.state = state;
    this.media = media || 'default';

    this.bindControls();
    this.text = null;

    //
    // If owned by the user then no
    // controls now
    //
    if (!this.span) {
      return;
    }

    this.span.style.cursor = 'default';
    if (this.state == 'owned') {
      Event.observe(this.span, 'click',
                    this.startEdit.bindAsEventListener(this));
      Event.observe(this.descriptionClose, 'click',
                    this.closeEdit.bindAsEventListener(this));
      this.removePowerText
        = new RemovalPowerText(this, this.controlRemove,
                               this.removeSubmission.bind(this));
    } else {
      Event.observe(this.span, 'click',
                    this.toggle.bindAsEventListener(this));
      Event.observe(this.demote, 'click',
                    this.demoteToggle.bindAsEventListener(this));
    }
    this.span.style.cursor = 'pointer';
    if (this.state != 'owned') {
      this.demote.style.cursor = 'pointer';
    }

    if (this.media == 'embed') {
      // this.description.style.display = 'none';
      // this.description.style.visible = 'hidden';
      this.createMediaControls();
    }
  },

  createMediaControls: function() {
    var opener = $E('span');
    opener.appendChild($T('Click to view media'));
    // TODO - stylize the folling function
    opener.style.cursor = 'pointer';
    opener.style.textDecoration = 'underline';
    Event.observe(opener, 'click', this.getMedia.bindAsEventListener(this));
    this.description.appendChild(opener);
  },

  bindControls: function() {
    this.submissionBlock = $('submission-' + this.id);
    this.span = $('submission-' + this.id + '-span');
    this.demote = $('submission-' + this.id + '-demote');
    this.description = $('submission-' + this.id + '-description');
    this.descriptionEdit = $('submission-' + this.id + '-description-edit');
    this.descriptionClose = $('submission-' + this.id + '-description-close');
    this.controlRemove = $('submission-' + this.id + '-remove');
  },

  setPromote: function() {
    this.state = 'promote';

    removeChildren(this.span);
    this.span.className = 'smallactionpromote';
    var text = $T('promote');
    this.span.appendChild(text);

    removeChildren(this.demote);
    text = $T('demote');
    this.demote.className = 'smallactionpromote';
    this.demote.appendChild(text);
  },

  setPromoted: function() {
    this.state = 'promoted';

    removeChildren(this.span);
    this.span.className = 'smallactionpromoted';
    var text = $T('promoted');
    this.span.appendChild(text);

    removeChildren(this.demote);
    this.demote.className = 'smallactionpromote';
    text = $T('demote');
    this.demote.appendChild(text);
  },

  setDemoted: function() {
    this.state = 'demoted';

    removeChildren(this.span);
    this.span.className = 'smallactionpromote';
    var text = $T('promote');
    this.span.appendChild(text);

    removeChildren(this.demote);
    this.demote.className = 'smallactionpromoted';
    text = $T('demoted');
    this.demote.appendChild(text);
  },

  setState: function(state) {
    if (state == 'promote') {
      this.setPromote();
    } else if (state == 'promoted') {
      this.setPromoted();
    } else if (state == 'demoted') {
      this.setDemoted();
    }
  },

  startEdit: function(e) {
    this.description.style.display = 'none';
    this.description.style.visibility = 'hidden';
    this.descriptionEdit.style.display = '';
    this.descriptionEdit.style.visibility = 'visible';
  },

  closeEdit: function(e) {
    this.description.style.display = '';
    this.description.style.visibility = 'visible';
    this.descriptionEdit.style.display = 'none';
    this.descriptionEdit.style.visibility = 'hidden';
  },

  closeMedia: function(e) {
    this.description.innerHTML = ''; // cheat like crazy
    this.createMediaControls();
  },

  getMediaResults: function(req, json, extra) {
    if (req.status != 200) return;
    var response = xrpcBind(req.responseXML);
    if (!response.ok) {
      alert('Could not get media');
    }
    // For IE we need to recreate the whole 
    // div block for use of the innerHTML propery
    var container = this.description.parentNode;
    var insertionPoint = this.description.nextSibling;
    container.removeChild(this.description);
    var media = $E('div');

    if (Prototype.Browser.IE) {
      // Figure out why IE pitches a fit when
      // the object tag exists in the embed
      media.innerHTML = response.media.replace('object', 'div');
    } else {
      media.innerHTML = response.media;
    }
    this.description = media;
    container.insertBefore(this.description, insertionPoint);

    var closer = $E('div');
    // TODO - stylize the folling function
    closer.style.cursor = 'pointer';
    closer.style.textDecoration = 'underline';
    closer.appendChild($T('Close'));
    this.description.appendChild(closer);
    Event.observe(closer, 'click', this.closeMedia.bindAsEventListener(this));
  },

  getMedia: function(evt) {
    Global.call(this.getMediaResults.bind(this),
                'getSubmissionMedia', this.id);
  },

  toggleResults: function(req, json, extra) {
    if (req.status != 200) return;
    var response = xrpcBind(req.responseXML);
    if (!response.ok) {
      alert('Could not toggle');
    }
    this.setState(response.state);
  },

  toggle: function(evt) {
    Global.call(this.toggleResults.bind(this), 'toggle', this.id);
  },

  demoteToggleResult: function(req, json, extra) {
    if (req.status != 200) return;
    var response = xrpcBind(req.responseXML);
    if (!response.ok) {
      alert('Could not toggle');
    }
    this.setState(response.state);
  },

  demoteToggle: function(evt) {
    Global.call(this.demoteToggleResult.bind(this), 'demoteToggle', this.id);
  },

  removeSubmissionResult: function(req, json, extra) {
    if (req.status != 200) return;
    var response = xrpcBind(req.responseXML);
    if (!response.ok) {
      alert('Could not remove');
    }
    // refresh?
    window.location = window.location;
  },

  removeSubmission: function(evt) {
    Global.call(this.removeSubmissionResult.bind(this),
                'removeSubmission', this.id);
  }
});

var g_submissionComponents = [];

function g_submissionInit() {
  g_submissionComponents.each(function(inst, i) {
    new Submission(inst.id, inst.state, inst.media);
  });
}

g_components.push(g_submissionInit);

// vim:set sts=2 sw=2 expandtab: