I was trying to port the euroscipy2014 tutorial (which is also the base for the ipython cookbook) to the newer ipywidget API. I succesfully converted 3 of the 4 notebooks following the directions I found on the relative ipython documentation but i'm having troubles in porting the 3rd notebook (03_custom.ipynb).
I changed the js code from:
%%javascript
// We import the WidgetManager.
require(["widgets/js/widget"], function(WidgetManager){
// We define the NumberSelector view here.
var NumberSelector = widget.DOMWidgetView.extend({
// Function for rendering the view.
render: function(){
to:
%%javascript
// We import the WidgetManager.
require(["widget"], function(WidgetManager){
// We define the NumberSelector view here.
var NumberSelector = widget.DOMWidgetView.extend({
// Function for rendering the view.
render: function(){
using require(["widget”] … instead of require(["widgets/js/widget … and widget.DOMWidgetView.extend instead of IPython.DOMWidgetView.extend
but when testing the widget at the code cell 4 I have (log from the js console):
Couldn't create a view for model id '8727d6f51f804c7aa582b3d95b3c630d' -- Error: Class NumberSelector not found in registry (…)
I guess the last line in the js code:
WidgetManager.register_widget_view('NumberSelector', NumberSelector);
didn’t worked. (maybe .register_widget_view is no more a valid call).
Have you any idea on how to fix this? thanks!
I opened an issue here but i thought the proting of such API can be a topic of general interest, so i'm posting a question here as well.
https://github.com/rossant/euroscipy2014/issues/2
Related
When a component errors in storybook you only get the line number where it died in the main.iframe.bundle.js file. How can I get it to give me the line number in the original source file? Is there an option to have it generate & use some kind of sourcemap?
Are you using typescript ? Are you using React or something else ?
On my storybook, I use React with Typescript. If I put an error like that:
export function BookList (p: BookListProps) {
// ...
throw new Error('hey')
return (
//...
);
}
I have this error embed in the document (is that what you meant ?):
But I do have something useful in the console:
When clicking on the link, it open the sources panel in chrome dev tools.
I am completely new to the the Shopware (6) community and I am still learning how to code in Symfony and Vue.js.
After trying some how to's in the developer wiki, I wanted to try some coding by myself.
I would like to combine https://docs.shopware.com/en/shopware-platform-dev-en/how-to/add-admin-new-field and https://docs.shopware.com/en/shopware-platform-dev-en/how-to/new-tab-admin?category=shopware-platform-dev-en/how-to into one functionallity (Product tabs with custom admin fields).
However, when I use the v-model attribute into an input field, the complete tab will turn white and the following error is outputted in the console: product is not defined.
My guess is that the model needs to be imported into the module (I can't find this anywhere into the docs).
Can someone tell me what I have to do to make this work? My current source code can be found here: https://github.com/Millerdigital-matthew/miller-product-upsells
As I understand, you need to change your index.js as follows:
const { Component } = Shopware;
const { mapState } = Component.getComponentHelper();
Component.register('...', {
computed: {
...mapState('swProductDetail', [
'product'
]),
}
});
I looked into your current code.
In your extension you try to bind
v-model="product.manufacturerId"
But in the block you are extending, there is no product defined.
So the solution to this problem, is to define product on your
view/sw-product-detail-upsells
You know, I spend more time just trying to get things set up to work with Angular than I do actually developing with Angular. There must be an easier way... :(
Currently, I am using the aspnetcore-spa template, creating a project with the command "dotnet new angular" - this is version 1.0.3, which adds Angular 4.1.2 to the npm dependencies. This works great to get a project running quickly. But now I want to add PrimeNG to take advantage of their form controls. I have been struggling with this all day, and would love it if anyone could provide some assistance.
Here is what I have done in my current effort (the latest of many, starting fresh each time):
1) Added to the package.json file: "primeng": "4.1.0-rc.2"
2) Added 'primeng/primeng' to the webpack.config.vendor.js file's vendor collection.
3) Added the following to my test module (which is in turn referenced in app.module.shared.ts so I can route to it via my RouterModule):
import { FileUploadModule } from 'primeng/components/fileupload/fileupload';
And in the html for the module, in an attempt to use the file uploader control, I have (from their site - https://www.primefaces.org/primeng/#/fileupload):
<p-fileUpload name="myfile[]" url="./upload.php"></p-fileUpload>
4) ran "webpack --config webpack.config.vendor.js" from a command prompt at the root of the project folder, which completed with no errors.
Then I hit F5 to run the project, and I got this error:
Exception: Call to Node module failed with error: Error: Template parse errors:
'p-fileUpload' is not a known element:
1. If 'p-fileUpload' is an Angular component, then verify that it is part of this module.
2. If 'p-fileUpload' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '#NgModule.schemas' of this component to suppress this message. (" type="button" (click)="onclick()" class="ui-button-info" label="Click Me">Click Me</button>-->
So, in an effort to comply, I added a reference to the ngprime module to the app.module.shared.ts file, like this (I don't really know how I should reference the module...):
import { FileUploadModule } from 'primeng/primeng';
But got the same exact error.
What am I missing???
Any help would be most appreciated.
I finally have this working, using the asp-prerender-module to get server-side rendering, and not having to rely on the asp-ng2-prerender-module (see my last comment). The trick, I found, was to reference the FileUploaderModule in the app.module.shared.ts file like this:
import { FileUploadModule } from 'primeng/components/fileupload/fileupload';
rather than like this:
import { FileUploadModule } from 'primeng/primeng';
The reason this matters is that the latter method of referencing will load all other components as well (see explanation here: https://www.primefaces.org/primeng/#/setup), and SOME of the PrimeNG components can not be rendered on the server due to DOM-related references (things like "window", which do not exist on the server). See the discussion here for more on this: https://github.com/primefaces/primeng/issues/1341
This change, combined with the other steps listed in my answer and, of course, actually referencing the directive in app.module (thank you #pankaj !) made everything work correctly at last. Only took me about 7 hours to figure it out. :(
I've been writing a custom script for QuickBase, which requires some date manipulation. I decided to use moments.js and, since I'm using it within quickbase, I am loading moments.js dynamically, using $.getscript. I've done this process before with other plugin (jquery.md5.min.js), and this works correctly.
The problem is, even though moment.js is read correctly, when I try to use it (for instance, see the console.log() I added for debugging, I get an error message telling me that "moment is not defined".
I know moment.js is being read because I already had it dumped into the console after loading, and I'm trying to use its functions only after it is loaded via the asynchronous methods. I have also played with a few simple jsfiddles just to make sure I was calling it correctly. I also checked several times the url and it is correct. The rest of my code is also correct (if I comment out the lines with moment(), it works as expected).
$.getScript(domain + dbid_app + urlMoments)
.done(function(script, textStatus) {
rightNow = moment();
dfd.resolve(); // Resolve when the script is finished loading.
console.log("moments.js has finished loading.\n\n" + textStatus);
console.log(rightNow);
})
.fail(function( jqxhr, settings, exception ) {
console.log( "Triggered ajaxError handler." );
});
How do I call the moment() function? When running the fiddle, and after looking at many online examples, it is as simple as: var myTime = moment();, but this is not working inside of my script. Is there a chance that, even after loading moments.js with $.getscript(), it was not executed? From what I can see on the source code of moments.js, the factory function should be automatically called, shouldn't it?
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
global.moment = factory()
}
One last thing: the url points to the QuickBase code page I created with moments.js. This is also how I'm using jquery.md5.js without any problems.
It looks like your issue might be caused by Quickbase loading a different version of moment.js already. Specifically, Quickbase forms are using Moment 2.8.4 in some capacity and it is being loaded using RequireJS. Following Moment's example for using RequireJS I was able to get a moment object with the following code:
require(['moment'], function(){
moment();
});
rightNow = moment();
I hope that helps you solve your problem.
I am a meteor newbie. I am trying out by building a simple app and it does nothing but shows list of items. I first tried out with hard coded model values in my client javascript code and it worked just fine. I then created a folder called 'model' under root of the application and created the model there like the following
Favorites = new Meteor.collection("favorites")
with this change, meteor throws exception pointing to this line of the file on load. If I move this code to client the code works ofcourse that is wrong. The full code is # https://github.com/ksunair/13favs It is a very simple solution has few files and less than 20 or 30 lines altogether. My client code is,
Template.favorites_main.helper({
favorites:Favorites
});
I did the following in order to clear your app of errors:
Favorites = new Meteor.Collection("favorites"); (Collection starts with a capital C)
I moved model/mainmodel.js to lib/mainmodel.js so Favorites would be available as soon as the template rendered. I always put my models under lib (or in a subdirectory) so they will be loaded first. This contradicts what I see in other places including discover meteor, so I'm unclear what the best practice is. In any case, it fixed the problem.
$ meteor add accounts-ui was needed because you referenced Accounts.ui.config.
You need to actually do a find in your favorites_main template. So it should look something like:
Template.favorites_main.helpers({
favorites: Favorites.find();
});