Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 01:04
    greenkeeper[bot] commented #5392
  • 01:04

    greenkeeper[bot] on core-js-3.5.0

    chore(package): update core-js … (compare)

  • Dec 11 18:34
    greenkeeper[bot] labeled #5444
  • Dec 11 18:34
    greenkeeper[bot] opened #5444
  • Dec 11 18:34

    greenkeeper[bot] on can-observable-mixin-1.0.7

    fix(package): update can-observ… (compare)

  • Dec 11 18:30

    cherifGsoul on update-infrastructure-page

    (compare)

  • Dec 11 18:30

    cherifGsoul on master

    Update infrastructure page with… (compare)

  • Dec 11 18:30
    cherifGsoul closed #5441
  • Dec 11 18:30
    cherifGsoul closed #5417
  • Dec 10 17:40
    cherifGsoul review_requested #5443
  • Dec 10 16:47
    cherifGsoul review_requested #5441
  • Dec 10 16:35
    cherifGsoul synchronize #5441
  • Dec 10 16:35

    cherifGsoul on update-infrastructure-page

    Fix typos (compare)

  • Dec 10 10:01
    jkeruzec starred canjs/canjs
  • Dec 09 18:59
    cherifGsoul review_requested #5443
  • Dec 09 18:59
    cherifGsoul opened #5443
  • Dec 09 18:51

    cherifGsoul on document-inserted-removed-can6

    Add inserted/removed events to … (compare)

  • Dec 09 15:38
    greenkeeper[bot] labeled #5442
  • Dec 09 15:38
    greenkeeper[bot] opened #5442
  • Dec 09 15:38

    greenkeeper[bot] on can-view-live-5.0.1

    fix(package): update can-view-l… (compare)

Jim O'Harra-Sutton
@Psykoral
right, I guess I'm trying to find "whatever is the new way" to watch a Map value change
Brad Momberger
@bmomberger-bitovi
What you're doing with the changed value matters.
Jim O'Harra-Sutton
@Psykoral
I merely want to listen for it to be changed
Brad Momberger
@bmomberger-bitovi
If it's in another Map, using can-map-define or upgrading to can-define/map/map will let you define a getter that listens to that map's changes.
Jim O'Harra-Sutton
@Psykoral
AH ha, there we go... where would I find info on that right there
specifically listening to the value of an item in another map, exactly
Brad Momberger
@bmomberger-bitovi
For can-define/map/map (this would require some migration work): https://canjs.com/doc/can-define/map/map.html
Jim O'Harra-Sutton
@Psykoral
I am using can-define/map/map yeah
Brad Momberger
@bmomberger-bitovi
If you want to do this outside of a map's property, you can use can-compute instead: https://canjs.com/doc/can-compute.html
The general idea is pretty much the same between a getter on a defined map or a getter-setter in can-compute: Any other compute or property of a can-map or DefineMap that is read by the getter will cause the value to update when it changes.
Jim O'Harra-Sutton
@Psykoral
I want to have one Map A look at a property of a Super Map,and when that value changes do some things in Map A
Brad Momberger
@bmomberger-bitovi
So if you have a DefineMap A, and a DefineMap B (which could be coming from can-connect/super-map)...
And A.foo is a getter that reads the value of B.bar...
And (this is important) A.foo is bound
Then the getter for A.foo is called every time B.bar is updated.
In practice, that looks like this:
var B = new DefineMap({ bar: "some string" });
var AC = DefineMap.extend({ foo : { get() { return B.bar } } });
var A = new AC();
A.on("foo", function() {});  // <- this is binding.  You don't need to do this if a Stache is reading A.foo
Jim O'Harra-Sutton
@Psykoral
I'm probably not using the "getters" like I should be. Truth be told I'm still figuring out the syntax of the new (to me) DefineMap
Ah OK, let me try that
Brad Momberger
@bmomberger-bitovi
A more generalized form might put B in A as a property:
var B = new DefineMap({ bar: "some string" });
var AC = DefineMap.extend({ b: {}, foo : { get() { return this.b.bar } } });
var A = new AC({ b: B });
A.on("foo", function() {});
This is analogous to A being a view model, and containing B as a data model.
Jim O'Harra-Sutton
@Psykoral
cool, I've got some other errors to dig through but I think that worked
thanks again!
Brad Momberger
@bmomberger-bitovi
You're welcome. Good luck with your other errors.
Jim O'Harra-Sutton
@Psykoral
Do I have to specifically use a setter in order to make the getters "listen and react" to the changed value?
Brad Momberger
@bmomberger-bitovi
No. Setters can be used for translating inputs or other side effects, but they're not strictly necessary. You can have a getter without a setter.
Jim O'Harra-Sutton
@Psykoral
because right now, based on your sample above as reference, I'm just setting B.bar = null and B.bar = 'a thing' and thought that would be enough to make the getters do their updates
Brad Momberger
@bmomberger-bitovi
It should be. Do you see the getter effect happen when you read A.foo directly?
Jim O'Harra-Sutton
@Psykoral
my eqiv of A.foo is in a stache, so no that HTML isn't showing when I change the value of B.bar
Brad Momberger
@bmomberger-bitovi
OK. so if B is a DefineMap, was B.bar defined on its prototype OR present on the argument when B was instantiated?
This is important because we do all the live listening and side effect stuff on DefineMaps using JavaScript property definitions. It may or may not surprise you to know, that DefineMap can't act on properties it hasn't been informed about.
B = new DefineMap({ bar: "baz" });  // ok, on init we look at all the properties passed in
B = new (DefineMap.extend({ bar: "string" ))(); // ok, was defined on the prototoype
B = new DefineMap(); B.set("bar", "baz");  // ok.  set can set up the listeners.
B = new DefineMap(); B.bar = "baz";  // not ok.
Jim O'Harra-Sutton
@Psykoral
it's defined, but it's set to null until it gets a value
yeah, it's in the DefineMap directly
Brad Momberger
@bmomberger-bitovi
OK. I think there's something else going on here but I can't say what with the information provided. Possibly your Stache is looking at a different object than the one you intended.
Jim O'Harra-Sutton
@Psykoral
so here's my real example:
// state.js

export const AppState = DefineMap.extend({seal: false},{
  authToken: {
        type: 'string',
        value: null
    }
});

// footer.js
import AppState from '~/state';

export const ViewModel = DefineMap.extend({ seal: false },{
    loggedIn: {
        get () {
            return (AppState.authToken !== null);
        }
    },
    isAdmin: 'string',
    year: 'string'
});

// Stache:

{{#if loggedIn}}
  <li>
    <a href="{{routeUrl page='logout'}}">Logout</a>
  </li>
{{else}}
  <li>
    <a href="{{routeUrl page='login'}}">Login</a>
  </li>
{{/if}}
I'm essentially trying to get the Footer to change the link based on the state of being logged in or not
Brad Momberger
@bmomberger-bitovi
I see the problem immediately.
AppState as you have made it is a constructor class for your app state.
const AppStateClass =  DefineMap.extend({seal: false},{
  authToken: {
        type: 'string',
        value: null
    }
});
export const AppState = new AppStateClass();
Jim O'Harra-Sutton
@Psykoral
sorry, that's not all of it though, it actually exports a new AppState() that the whole app shares
Brad Momberger
@bmomberger-bitovi
OK, but your loggedIn getter is still looking at the class
Jim O'Harra-Sutton
@Psykoral

yep that's almost exactly what I have, I just still called is AppState

export default new AppState();

does that work or should I change the name and export?
Brad Momberger
@bmomberger-bitovi
ok, so the default export from state.js is new AppState() but it also exports the AppState class as a named export?
Jim O'Harra-Sutton
@Psykoral
yeah I'm probably confusing it with that, I've changed it to AppStateClass () to avoid that, good call
Brad Momberger
@bmomberger-bitovi
OK. I would definitely still check it from the console and see if all the values in the model and viewmodel are correct.
Do you know the tricks for getting access to modules in the dev console?
Jim O'Harra-Sutton
@Psykoral
not exactly but I do have a debugger setup that I can turn on that'll spit out values at the right times so I can tell what they are