Skip to content

Instantly share code, notes, and snippets.

@stefri
Created May 28, 2011 15:44

Revisions

  1. Steffen Fritzsche revised this gist May 28, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion template_changing_view.js
    Original file line number Diff line number Diff line change
    @@ -7,7 +7,7 @@ SC.TemplateChangingView = SC.TemplateView.extend(
    }.observes('template'),

    /**
    Called when the templateName property associated with this <span> changes.
    Called when the template property associated with this view changes.
    We destroy all registered children, then render the view again and insert
    it into DOM.
  2. Steffen Fritzsche revised this gist May 28, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion template_changing_view.js
    Original file line number Diff line number Diff line change
    @@ -4,7 +4,7 @@ SC.TemplateChangingView = SC.TemplateView.extend(
    templateNameDidChange: function() {
    SC.Logger.debug("Template name was set to " + this.get('templateName'));
    this.rerender();
    }.observes('templateName'),
    }.observes('template'),

    /**
    Called when the templateName property associated with this <span> changes.
  3. Steffen Fritzsche revised this gist May 28, 2011. 1 changed file with 57 additions and 0 deletions.
    57 changes: 57 additions & 0 deletions test_statechart.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,57 @@
    testSpace: SC.State.design({
    enterState: function() {
    Analyzer.mainPane = SC.TemplatePane.append({
    layerId: 'myApp',
    templateName: 'application',

    contentView: SC.TemplateView.create({
    templateName: 'testSpace',
    testView: SC.TemplateChangingView.create()
    })
    });
    },

    exitState: function() {
    Analyzer.mainPane.remove();
    },

    // --------- Actions ---------------------------------------------------------------

    onEmptyDetails: function() {
    SC.Logger.debug('Open Empty Details');
    this.gotoState('emptyDetails');
    },

    onTestLink1: function() {
    SC.Logger.debug('Open Test Details 1');
    this.gotoState('testDetails1');
    },

    onTestLink2: function() {
    SC.Logger.debug('Open Test Details 2');
    this.gotoState('testDetails2');
    },

    // --------- States -----------------------------------------------------------------

    initialSubstate: 'emptyDetails',

    emptyDetails: SC.State.design({
    enterState: function() {
    Analyzer.getPath('mainPane.contentView.contentView.testView').set('templateName', 'empty');
    }
    }),

    testDetails1: SC.State.design({
    enterState: function() {
    Analyzer.getPath('mainPane.contentView.contentView.testView').set('templateName', 'test1');
    }
    }),

    testDetails2: SC.State.design({
    enterState: function() {
    Analyzer.getPath('mainPane.contentView.contentView.testView').set('templateName', 'test2');
    }
    })

    })
  4. Steffen Fritzsche created this gist May 28, 2011.
    36 changes: 36 additions & 0 deletions template_changing_view.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,36 @@
    SC.TemplateChangingView = SC.TemplateView.extend(
    /** @scope SC.TemplateChangingView.prototype */{

    templateNameDidChange: function() {
    SC.Logger.debug("Template name was set to " + this.get('templateName'));
    this.rerender();
    }.observes('templateName'),

    /**
    Called when the templateName property associated with this <span> changes.
    We destroy all registered children, then render the view again and insert
    it into DOM.
    */
    rerender: function() {
    var idx, len, childViews, childView;

    childViews = this.get('childViews');
    len = childViews.get('length');
    for (idx = len-1; idx >= 0; idx--) {
    childView = childViews[idx];
    childView.$().remove();
    childView.removeFromParent();
    childView.destroy();
    }

    var context = this.renderContext(this.get('tagName'));
    var elem;
    this.renderToContext(context);

    elem = context.element();
    this.$().replaceWith(elem);
    this.set('layer', elem);
    this._notifyDidCreateLayer();
    }
    });