How to add a datepicker to angular-meteor? - javascript

I've just started experimenting with angular-meteor, which feels good, but weird at the same time. The thing I'm uncomfortable with is the fact that everything is done with packages and that I'm unsure of how much I can do manually.
So I've followed the tutorial up until step 9 which made a simple party planning website. I now want to add a datepicker so that parties also have dates. For this I want to use something like Bootstrap Datepicker or angular-datepicker or this Meteor Datepicker but I'm unsure of which one to pick and how to do this.
Do I need to install everything in meteor using meteor packages? Should I use bower? Can I manually inject those libs using the regular <script src=""> way? And which one would be the most appropriate?
All tips are welcome!

Since the impact of this feature is restricted to the presentation layer, how you choose to install / integrate your datepicker is mostly a matter of taste.
You can go for a meteor package, and get simpler integration (given that the package has no conflicting dependencies with your project, such as iron-router vs flow router) and updates (given that the package is seriously managed and maintained)
If you choose to go with bower or another package manager than meteor's (or none and just download the sources, for that matter), you'll need to integrate the library yourself (either through a custom package or directly in the client/lib folder) and update it manually. But you will get "official" updates from the actual library maintainers.
To keep things simple, I would personnaly go with rajit:bootstrap3-datepicker. It seems correctly maintained (last commit a couple months ago), and has enough installs for my taste:
$ meteor add rajit:bootstrap3-datepicker
Then in my template:
<label>Date</label>
<input type="text" class="form-control" id="my-datepicker" ng-model="newParty.date">
And in PartiesListCtrl I would set up the datepicker using:
$('#my-datepicker').datepicker();
If you consider doing the integration yourself after all, here are a couple useful SO links for you: here and here and here

Related

How to alter a javascript extension and use it in my project without waiting for approvals?

I'm using an extension in my project called cytoscape in my Ember.js project and along with it, cytoscape-context-menushttps. I needed to make one tiny change to it to accommodate the needs of my project. I have done so and it works great (I tested it locally by simply monkey-patching the code in the relevant JS file in the extension and confirming it works).
I just want to know, how am I supposed to incorporate this change into my project, without having to manually change that bit of code every time we build our project? I know that I can pull down the repo and make a PR on it and get it approved, but that could take days/weeks/months. There must be a way I can manage this myself.
Fork the repository and use your own fork as the dependency. Maintain your fork and keep it up to date with the upstream repository. Switch back whenever your pull request is incorporated.

Angular2.JS files with d.ts files WITHOUT npm Visual Studio 2015

Does anyone know of a recent blog post or tutorial on which angular 2 .js files along with the appropriate d.ts files I need so I can just drop them into an existing VS solution without using NPM? I see that I can get the angular files here, but not sure which ones I need. According to the Angular docs, I need do nothing to get typings files for library packages that include d.ts files—as all Angular packages do., but again, when I look thru a sample Angular app, don't know which d.ts files I need.
I can't stand bloat and clutter. Below is a brand new asp.net core on .net 4.6 on the left, the same thing on the right after following this blog:
I can't stomache having to add over 13,000 files to get ahold of maybe 20?, 30? files.
Maybe I'm being too OCD about this, but right now I'll take any suggestions to avoid that bloat, even going with another front-end framework. I've briefly looked at Aurelia, which I like, but again, NPM. Not sure React is appropriate.
My business domain includes Category, which is a self-referencing class/table, and I'm after an intuitive UI where the user can quickly create their own Category structure without having to do a bunch of post-backs to the server. Seems with either Angular2 or Aurelia, I'd only need a couple of Components to accomplish this in the browser.
I know Angular 1.5 added Components, and I may explore that if need be. From what I understand about React, it's not for data management.
So to reiterate my questions, can I get just the Angular2 files along with their d.ts files so I can code in typescript? If not, the same question for Aurelia. And if not, any way that I can keep bloat down yet still write some elegant front-end code.
Any help will be appreciated
Ok so for Development purposes yes your Angular 2 stuff will be massive (its annoying but necissary) however as I am sure you know, once you build your angular app for production (using angular cli for example) it cuts all those 40,000 files down to about 10. for example this is my application before and after production...
and after
So I would guess you want to build your angular stuff out first and then drop it in you application

How to add AngularJS 2 in existing Java Web project

I have some experience using AngularJS 1.x in .Net MVC application. In that project, we basically downloaded all required Angularjs min files and included them in project. We did not use npm or bower. It worked fine.
Now my next project is on Java Web application. This is an existing application with plain servlet/jsp. I want to use Angularjs 2 on new pages that I'm developing. But I'm not able to make progress on how to include Angularjs in this existing project.
Angular team recommends to use Typescript along with npm/gulp. But I want to stick to javascript and not introduce complications with TypeScript in existing project. I was expecting to download angular min files and include in my JSP and get going. Apparently I cannot even find link do download min files. New Angular website doesn't even have link to download them. I also looked up angular github but couldn't find min files.
I would appreciate if someone can guide me in right direction. At this point, I'm thinking to stick to 1.x instead of 2.0. Thank you.
Wow, that is so annoying.
You could try creating a test project using NPM, add the dependencies you need, and then build the project. From there, you could copy paste out the javascript files you need.
Hope that helps.
You can find angular2 versions prior to release here : https://code.angularjs.org but if you want the latest ones you will have to try Samuel's answer.
Besides, if you're doing this project at school and it asks you to use servlet / jsp, you should stick with it and use something like bootstrap for easier html/css.
Doing the frontend with angular might be considered a cheat or a workaround ( speaking from experience )

is it possible to run two different versions of ReactJS on the same page?

Hello everyone I am wondering if is possible to run two version of ReactJS on the same page , something similar to jQuery.noConflict().
With a bit of research i have found two interesting things :
Two Reacts Won’t Be Friends
While I’m happy that everybody seems to be converging on NPM in 2015 and NPM wants developers to use it for managing front-end dependencies, it still has rough edges. The biggest problem with using NPM for front-end dependencies is that if two packages specify a library like React as a dependency, they might get two separate copies of React. Even worse, they might get different versions of it. This works fine for something like Node, but not for browser libraries that want to mess with the same global mutable DOM! NPM tried to solve this with peerDependencies but all hell broke loose and they’re backing out.
https://medium.com/#dan_abramov/two-weird-tricks-that-fix-react-7cf9bbdef375#.hfx35f6hl
And an issue on github: https://github.com/facebook/react/issues/1939
However is not clear for me how we could wrap & delivery our ReactJS widgets in order they could run without conflicts on a page using other version of ReactJS .
thanks
However is not clear for me how we could wrap & delivery our ReactJS widgets in order they could run without conflicts on a page using other version of ReactJS.
You can use Browserify with reactify to load your JS and version of ReactJS without conflicting with another ReactJS version that may be loaded on the page.
More information is available here:
Embeddable JavaScript widget with React

How do you create a meteorJS package with build options for the user?

I'm creating a meteor package for a JS library that contains a number of optional plugins in the main repository. I would like to provide the option for the user to select which library extensions to use, without always including them unnecessarily.
Is this possible with the current build system? If so, where do I begin?
This is not currently supported. In a sense, each package is the "option" you enable through the package system itself. Your current best bet is to just publish packages for each piece and maybe add packages for common build combinations.
Twitter Bootstrap currently does something similar like so:
twbs:bootstrap // normal bootstrap
twbs:bootstrap-noglyph // bootstrap sans glpyhs
Also relevant, some of the (many) pre-packaged stylus packages out there:
stolinski:stylus-multi
cryptoquick:stylus-multi
mquandalle:stylus
I look forward to this answer going stale.

Categories

Resources