Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Dec 06 2022 17:58
    dependabot[bot] labeled #50
  • Dec 06 2022 17:58
    dependabot[bot] opened #50
  • Dec 06 2022 17:58

    dependabot[bot] on npm_and_yarn

    Bump express from 3.3.6 to 4.17… (compare)

  • Dec 06 2022 16:23
    dependabot[bot] labeled #188
  • Dec 06 2022 16:23
    dependabot[bot] opened #188
  • Dec 06 2022 16:23

    dependabot[bot] on npm_and_yarn

    Bump qs and http-server Bumps … (compare)

  • Dec 06 2022 16:20
    dependabot[bot] labeled #49
  • Dec 06 2022 16:20
    dependabot[bot] opened #49
  • Dec 06 2022 16:20

    dependabot[bot] on npm_and_yarn

    Bump qs, ampersand-model and ex… (compare)

  • Nov 02 2022 04:07
    dependabot[bot] labeled #48
  • Nov 02 2022 04:07
    dependabot[bot] opened #48
  • Nov 02 2022 04:07

    dependabot[bot] on npm_and_yarn

    Bump minimatch and precommit-ho… (compare)

  • Apr 27 2022 18:34

    dependabot[bot] on npm_and_yarn

    (compare)

  • Apr 27 2022 18:34
    dependabot[bot] closed #46
  • Apr 27 2022 18:34
    dependabot[bot] commented #46
  • Apr 27 2022 18:34
    dependabot[bot] labeled #47
  • Apr 27 2022 18:34
    dependabot[bot] opened #47
  • Apr 27 2022 18:34

    dependabot[bot] on npm_and_yarn

    Bump async from 0.2.9 to 2.6.4 … (compare)

  • Apr 27 2022 18:34

    dependabot[bot] on npm_and_yarn

    (compare)

  • Apr 27 2022 18:34
    dependabot[bot] closed #186
v1rt
@v1rt
Good evening/morning folks. Do you know of any nice project in github that I can git clone where it shows a very nice usage of Ampersand, Backbone/Marionette?
Richard Butler
@RickButler
@v1rt so wherever you start your app, you could initialize your UserProfile model, and set it as window.UserProfile , or set it as a property of Ampersand-App, or declare it in UserProfile.js but instead of exporting the constructor you would export an instance module.export = new UserProfile();
then in your view declare a prop with the default function returning whichever of the above you chose.
Richard Butler
@RickButler
prop: ['state', true, function () { return window.UserProfile; }]
props: { ['state', true, function () { return window.UserProfile; }] } rather
lol terrible with examples today
props: { userProfile: ['state', true, function () { return window.UserProfile; }] }
and then you could bind to it, and the events would register on both views
v1rt
@v1rt
got it
ScrumInsight
@ScrumInsight
Is it possible to create an Ampersand model and add properties to it later on depending on a condition? For example, can I create a User model that extends AmpersandModel with a few properties, and then conditionally add more properties? If this is possible, how would I go about doing it?
ScrumInsight
@ScrumInsight
Here is an example of what I am attempting. My JavaScript is a bit weak so I admit this might be completely loopy.
var AmpersandModel = require('ampersand-model');
var _ = require('lodash');
var sensor = require('Sensor');

var model = AmpersandModel.extend({
    props: {
        requestor_name: ['string', true, ''],
        requestor_email: ['string', true, ''],
        message: ['string', false, null],
        enterprise: ['string', true, function() { return sensor.name(); }]
    },
    url: function() {
        return '/api/sta';
    }
});

if (sensor.name() === 'SomeValue') {
    model = model.extend({
        props: _.extend({}, model.prototype.props, {
            requestor_phone: ['string', true, ''],
            requestor_title: ['string', true, '']
        })
    });
}

module.exports = model;
Richard Butler
@RickButler
@ScrumInsight well you are changing what the module exports based on whatever is in sensor. I think that logic should probably be in the constructor/initialize instead, but I think we need more background on what sensor does. Is there any reason why extraProperties wouldn't work here?
ScrumInsight
@ScrumInsight
Hmmm.... @RickButler - I've continued to experiment. I've set extraProperties to allow. I only want certain properties to be "required" if certain conditions are true in the browser. My exact usage is that the application will be accessible from different urls (e.g. abc.scruminsight.com and xyz.scruminsight.com) and depending on the url used to access the application, different properties of the model need to be present/required. I will likewise be using a similar approach to dynamically create a form to collect the relevant information. Perhaps there is an easier way, but I was thinking of using this approach so that when the application is loaded, the model is configured on the client side and when the model is saved, the information is immediately accessible on the server side (there will be a single stateless server application running on a different virtual machine). I worry that because I am not a JS expert, nor an Ampersand expert, I might be missing an obvious design pattern.
Richard Butler
@RickButler
@ScrumInsight if your API dictates the properties returned then extraProperties is probably the most flexible way. Define the props that everyone gets on the model. The additional properties will automatically get created by what the API returns. If you absolutely need concrete implementations of logic, you could create a base model and extend it based on each site, or come up with something more dynamic than you example.
ScrumInsight
@ScrumInsight
@RickButler Okay - I understand how I would use extraProperties... Can I then set those new properties to be required and to have default values? My understanding is that when you set extraProperties to "allow", you can add properties at runtime to an instance of a model, but not to the overall class. In other words, the properties get created after you call new model();.
ScrumInsight
@ScrumInsight
Maybe a better way to express my problem is that I want a single back-end which serves the application and in the browser, it configures forms and models dynamically based on information such as the url, the browser type, the time of day or anything else that is only known on the browser side. A silly example of this is a model that, when loaded on Safari, has an extra required property for the type of Apple device being used, but otherwise the property doesn't exist and is not required. The form that is displayed to the user also shows and validates this property (only in safari), and on all other browsers it is not displayed and not required.
faultable
@faultable
Hello, just getting started with AmpersandJS. I want to know, is AmpersandJS is server-side app?
Richard Butler
@RickButler
@filosofikode ampersand is client side,
There were plans for server side rendering initially, but I don't think anyone got around to it.
Neeraj
@smurfpandey
Hello,
I am looking for a a plugin similar to backbone deep-model for ampersand-state/model
Neeraj
@smurfpandey
I am trying to create the plugin myself, but I am stuck at set method. I am trying to replicate the implementation of backbone deepmodel
Richard Butler
@RickButler
@smurfpandey nested children is kind of the equivalent to deep models.
@smurfpandey
@smurfpandey your best bet is to either extended the object type and make it track changes on its props. A comparison algorithm, and then triggering the appropriate changes.
Richard Butler
@RickButler
@smurfpandey any other option would include some rather large changes to how ampersand state works, and would probably be a p to keep in sync.
Be a pain to keep in sync*
bilguuneni
@bilguuneni
Whats going in here?
Neeraj
@smurfpandey
@RickButler nested child won't work in my case, as I am exposing my models for users to define their own properties, and properties might be objects.
Richard Butler
@RickButler
@smurfpandey do you want to do something like
props: {
deepmodel: ['deepObject', true, function () { return { name: 'john', lastname: 'smith',  friends: ['tim', 'will']]}}
}
and have it track changes
if that's what you want, you need a custom data type with an onchange property that does deep diffing on your object.
Neeraj
@smurfpandey
Yes, something like that. I will try doing this approach.
Thanks for your help :)
ScrumInsight
@ScrumInsight
I'm wondering if there is anyone who can share a pattern or solution for creating an ampersand form where each field in the form is displayed one at a time with a progress bar and back/forward buttons? I can probably figure it out myself, but I'm guessing someone else has already done it :-)
Richard Butler
@RickButler
@ScrumInsight form with all inputs hidden, in the view that contains the form you have a prop you use in a switch binding, next prev buttons change the prop and the switch shows the next input hides the others. There is more to it than that though, you are going to have to setup validation for the input before you move to next, and the last input will need to hide your next button and show the submit (or just run submit).
@ScrumInsight if it's not a lot of inputs/data I would do it so each input had it's own view/route, and you would store the data on the route. eg step one /signup
step 2 /signup/john-firstname
where john was the value from step 1
step 3 signup/john-firstname/smith-lastname
that way you can refresh the page and not lose your state.
ScrumInsight
@ScrumInsight
Thanks @RickButler - there are about 100 fields which is why I want to have them show sequentially (it's a survey of sorts). But I also like the idea of the route - maybe I could generate that stuff programmatically so that each view is instantiated dynamically in an initialization loop of some sort. I assume that the views would need properties bound to the prev and next buttons in that case. It might be tough with the model though since the fields are all required. Hmmm....
johowie
@johowie
Q: Is it possible to pass an existing collection to the collections property of a model, or must it be a raw array of json like objects ?
Hamish Blake
@hsimah_twitter
good evening
johowie
@johowie
good evening indeed
Brad Compton (he/him)
@Bradcomp
@johowie Yes, that is indeed possible.
Paul Green
@thatgreenguy
Hi I have this in a view :
a.btn.btn-default(href="#")
span.glyphicon.glyphicon-plus
| New
But I'm not seeing the correct display for the glyph - just some weird circle character - anyone point me in the right direction - first time ampersand user ;->
I can see bootstrap.css in stylesheets but i'm not sure if that comes with the glyphs or I need to import them as a separate file?
Paul Green
@thatgreenguy
ok so I have bootstrap v3.2 which comes with default set of glyphicons - ampersand is building/bundling the icons into a fonts directory and delivering that to the client so they should be served from localhost:3000/fonts/ etc