I am assuming that when you make the changes in the UI code , then you probably build them using (mvn -P developer -pl :cloud-client-ui -DskipTests=true ) . This would only copy your changes to the server without having to stop the jetty . Once your changes are copied to the server and then , when you refresh your browser , that is the time the JS is loaded into the browser and in case it's got any compilation errors it would reflect in the Firebug console . It's not about triggering a particular function on clicking something but the compilation is done for the JS file as a whole unless you have errors in which the response from the API is undefined or something. In this case it would throw an error when you perform that particular action . To summarize ,the widget /front end code is compiled as a whole entity .
Hope you got my point here. Thanks, Pranav -----Original Message----- From: Mike Tutkowski [mailto:mike.tutkow...@solidfire.com] Sent: Saturday, May 18, 2013 6:53 AM To: Pranav Saxena Cc: dev@cloudstack.apache.org Subject: Re: Example code for GUI So, Pranav, I'm curious when (and how) these JavaScript files get interpreted (or compiled). I noticed the code where I was missing a comma was related to a dialog that I never tried to open (wasn't able to get that far) yet the entire Service Offerings tab was not rendered. It looks like the JIT compiler encountered my code quite early (even though it wasn't actively being executed) and generated the problem. Are these JS files loaded at a single time and really compiled or are they just syntax checked and then later interpreted? Thanks! On Fri, May 17, 2013 at 7:15 PM, Pranav Saxena <pranav.sax...@citrix.com>wrote: > So yes , you are right . If you encounter something like this , it > indicates a JS compilation error which can be easily traced using > Firebug console . It would show you the exact line number where the > compilation error occurred . **** > > ** ** > > *From:* Mike Tutkowski [mailto:mike.tutkow...@solidfire.com] > *Sent:* Saturday, May 18, 2013 3:15 AM > *To:* Pranav Saxena > *Cc:* dev@cloudstack.apache.org > > *Subject:* Re: Example code for GUI**** > > ** ** > > Once I found the JavaScript Console in Chrome, it was easy to > determine I was missing a comma in one place. It works as expected > now. :)**** > > ** ** > > On Fri, May 17, 2013 at 3:19 PM, Mike Tutkowski < > mike.tutkow...@solidfire.com> wrote:**** > > I found the JavaScript Console in Chrome. I've been doing Java for > over 15 years, but am still pretty new to JavaScript. :)**** > > ** ** > > On Fri, May 17, 2013 at 2:37 PM, Mike Tutkowski < > mike.tutkow...@solidfire.com> wrote:**** > > Pranav - Quick question for you (or, of course, anyone else who might > know):**** > > ** ** > > I've made some changes to the JavaScript and rebuilt the system.**** > > ** ** > > When I log into the GUI and look down at the Service Offerings tab at > the bottom left, there is an icon, but no text. If I click on it, > nothing is displayed. :) I'm not that familiar with JavaScript > debugging. What do you suggest I do in such a situation to debug the > problem? I've read and re-read my code looking for simple syntax > errors and such, but don't see any. I did update from master this > morning, so hopefully this is not just a problem that's in master at > the time being and I didn't notice it until I made my changes.**** > > ** ** > > Thanks!**** > > ** ** > > On Fri, May 17, 2013 at 8:24 AM, Mike Tutkowski < > mike.tutkow...@solidfire.com> wrote:**** > > Thanks, Pranav!**** > > ** ** > > On Thu, May 16, 2013 at 11:20 PM, Pranav Saxena > <pranav.sax...@citrix.com> > wrote:**** > > So within this block , you could use anyone of the exception handling > mechanisms as shown below - **** > > **** > > > $.ajax({ > url:'API CMD', > data:data , > success:function(args){ > args.response.success();**** > > },**** > > > error:function(args){ > **** > > args.response.error(parseXMLHttpResponse(json)); // > This would handle the exception handling when the API throws an > error**** > > OR**** > > cloudStack.dialog.notice( { message:_l(' Minlops valus > is greater than Max lops , please enter a correct value ') });**** > > } > }); > > Thanks,**** > > Pranav**** > > **** > > *From:* Mike Tutkowski [mailto:mike.tutkow...@solidfire.com] > *Sent:* Friday, May 17, 2013 10:44 AM > *To:* Pranav Saxena**** > > > *Subject:* Re: Example code for GUI**** > > **** > > Great, thanks!**** > > **** > > One quick question comes to mind: If the criteria I'm checking fails, > is there a way I should exit the code block and have an error message > displayed or should those kinds of problems be returned once the API > call is executing on the server side?**** > > **** > > Thanks again!**** > > **** > > On Thu, May 16, 2013 at 10:59 PM, Pranav Saxena > <pranav.sax...@citrix.com> > wrote:**** > > Yeah , so these dependencies/relationships would be handled when you > are passing these parameters to the API call within the actions block. > Below is the code snippet which will help you accomplish your tasks > (might require little tweaking ) but that's how the structure should look > like . > > action: function(args) { > var dataObj = { > minlops: args.data.minlops, > maxlops:args.data.maxlops, > burstlops:args.data.burstlops > > }; > > if(args.data.minlops != "" && args.data.maxlops !="" > && args.data.burstlops !="") { > > if(args.data.maxlops >= args.data.minlops){ > $.extend(data, dataObj) > }); > } > } > > $.ajax({ > url:'API CMD', > data:data , > success:function(args){ > args.response.success(); > },**** > > > > > }); > > > Let me know if you need any more help. > > Thanks, > Pranav**** > > > -----Original Message----- > From: Mike Tutkowski [mailto:mike.tutkow...@solidfire.com]**** > > Sent: Friday, May 17, 2013 9:40 AM > To: dev@cloudstack.apache.org > Subject: Re: Example code for GUI**** > > Hi Pranav, > > Thanks for posting the link to your commit, as well. :) > > I'm trying to set up my fields based on the pattern we already have > today where the Admin can check a box to allow the User to specify a disk > size. > > In my case, I'd like the Admin to check a box if he wants the User to > potentially specify Min, Max, and Burst IOPS. The trick is that Min, > Max, and Burst IOPS should either all be filled in or none of them > filled in (and Max has to be >= Min and Burst has to be >= Max). Right > now, I'm playing around with code that makes these three fields depend > on the checkbox (if it's checked, they get displayed). Can you teach > me a bit about how I might specify the relationships I'm looking for? > > Thanks! > > Here's what I have right now (I believe it handles displaying the IOPS > fields if the checkbox is selected, but that's about it): > > isIopsCustomized: { > label: 'label.custom.disk.iops', > docID: 'helpDiskOfferingCustomDiskIops', > isBoolean: true, > isReverse: true, > isChecked: false > }, > minIops: { > label: 'label.disk.iops.min', > docID: 'helpDiskOfferingDiskIopsMin', > dependsOn: 'isIopsCustomized', > validation: { required: true, number: true } > }, > maxIops: { > label: 'label.disk.iops.max', > docID: 'helpDiskOfferingDiskIopsMax', > dependsOn: 'isIopsCustomized', > validation: { required: true, number: true } > }, > burstIops: { > label: 'label.disk.iops.burst', > docID: 'helpDiskOfferingDiskIopsBurst', > dependsOn: 'isIopsCustomized', > validation: { required: true, number: true } > }, > > > On Thu, May 16, 2013 at 8:40 PM, Pranav Saxena > <pranav.sax...@citrix.com > >wrote: > > > Hey Ilya , > > > > So this is how you declare the following items - > > > > <object name> :{ > > > > createForm:{ > > > > fields:{ > > > > //CheckBox Item > > <item object name> :{ > > Label:'Label Name', > > isBoolean:true, // This statement creates a > checkbox > > for you > > isChecked: true // make it false for the checkbox > to > > be unchecked by default > > > > > > > > }, > > > > //Drop Down > > <itemobjectname2>:{ > > Label:'label name2', > > select:function(args):{ > > var items=[]; > > items.push(id:'memory' , description: > > 'the description appears in the drop down'); > > > > } > > } > > } > > } > > > > } > > > > The actual handling is done by the widgets (dialog.js) , once you > > follow the above mentioned code structure . In case you want to > > design a multi-edit table (entering multiple values in a single > > table ), the structure for that is prepared by another widget > > (multiEdit.js) . That has a slightly complex way to invoke the relevant > > widget functions. > > Let me know in case you need any more information on this . The CPU > > overcommit and memory overcommit feature was committed by me . Here > > is the commit - > > > > https://git-wip-us.apache.org/repos/asf?p=cloudstack.git;a=blobdiff; > > f= > > ui/scripts/system.js;h=d76aa3e6a2e8d0d009728174f07d600c28febd89;hp=e > > 51 > > bf90ba81445f176607823857e38f930d17c11;hb=215621daa88883dde4f09d55fde > > 49 > > e0bf0cd75f5;hpb=2beb66fd32bd8b176a7b4eff2d0a34aa4d278045 > > > > Let me know if you need any more help on this . > > > > Thanks, > > Pranav > > > > -----Original Message----- > > From: Musayev, Ilya [mailto:imusa...@webmd.net] > > Sent: Friday, May 17, 2013 6:56 AM > > To: dev@cloudstack.apache.org > > Subject: Re: Example code for GUI > > > > Thanks Isaac > > Regards > > Ilya > > > > > > > > -------- Original message -------- > > From: Isaac Chiang <isaacchi...@gmail.com> > > Date: > > To: dev@cloudstack.apache.org,"Musayev, Ilya" <imusa...@webmd.net> > > Subject: Re: Example code for GUI > > > > > > Hi Musayev, > > You'll find out that there are "createForm" object under > > listView(or detailView) actions in each file, e.g., instance.js, > > accounts.js. If you need a selection, you can just define a > > attribute for createForm like following: > > > > select: function(args) { > > //... > > } > > > > and pass returned data from ajax call to > > > > args.response.success({data: 'your json data'}) > > > > Then the CS's frontend engine will make a selection for you. > > > > Regards > > > > Isaac > > > > > > On Fri, May 17, 2013 at 7:48 AM, Musayev, Ilya <imusa...@webmd.net> > wrote: > > > > > Thank you Wei . > > > > > > Any idea on how can I change the field type from in UI from text > > > field to multi-select or checkbox group? Is this CSS only change > > > or is there more to it? > > > > > > > > > > > > -------- Original message -------- > > > From: Wei ZHOU <ustcweiz...@gmail.com> > > > Date: > > > To: dev@cloudstack.apache.org > > > Subject: Re: Example code for GUI > > > > > > > > > From my point view: > > > > > > (1) UI: > > > ui/scripts/*.js (such as network.js, configuration.js) > > > ui/dictionary.jsp > > > client/WEB-INF/classes/resources/messages.properties > > > > > > (2) Java > > > *Cmd.java (commands) > > > *VO.java (tables) > > > *Manager.java > > > *ManagerImpl.java > > > > > > Wei > > > > > > > > > 2013/5/17 Musayev, Ilya <imusa...@webmd.net> > > > > > > > We actually have a similar question on the GUI part, we've done > > > > lots of backend work, but the GUI part does not seem very > > > > straightforward. Would someone know how to add options into GUI? > > > > > > > > Also, How can I change the field type from in UI from text > > > > field to multi-select or checkbox group? What is the controlling > > > > configuration > > > file? > > > > > > > > If you can mention general flow on making GUI changes/addition > > > > and > > > perhaps > > > > point to an example, it would be truly appreciated. > > > > > > > > Thanks > > > > ilya > > > > > > > > > -----Original Message----- > > > > > From: Mike Tutkowski [mailto:mike.tutkow...@solidfire.com] > > > > > Sent: Thursday, May 16, 2013 6:26 PM > > > > > To: dev@cloudstack.apache.org > > > > > Subject: Re: Example code for GUI > > > > > > > > > > It looks like your feature revolves around rate limiting, if I > > > understand > > > > > correctly. > > > > > > > > > > It seems like I could leverage a bit of what you're doing > > > > > here, but I'd > > > > need > > > > > additional fields in the Add Disk Offering dialog (and DB) > > > > > since we > > > > support > > > > > min, max, and burst values for IOPS (as opposed to just a max). > > > > > > > > > > What do you think? > > > > > > > > > > > > > > > On Thu, May 16, 2013 at 4:18 PM, Mike Tutkowski < > > > > > mike.tutkow...@solidfire.com> wrote: > > > > > > > > > > > Thanks for the info, Wei. > > > > > > > > > > > > I am in the process of writing a storage plug-in for > > > > > > Edison's new storage framework. The idea is to be able to > > > > > > have a single SAN volume associated with a single data disk. > > > > > > In our SAN, you can set Min, Max, and Burst IOPS values on a > > > > > > volume-by-volume basis and I'd like to see CloudStack support this. > > > > > > > > > > > > Can you tell me a bit about how you see our features overlapping? > > > > > > Perhaps I will not need to update the GUI at all because you > > > > > > might already be putting in place such new fields? > > > > > > > > > > > > Thanks! > > > > > > > > > > > > > > > > > > On Thu, May 16, 2013 at 4:13 PM, Wei ZHOU > > > > > > <ustcweiz...@gmail.com> > > > > > wrote: > > > > > > > > > > > >> Mike, > > > > > >> > > > > > >> I am working on Disk I/O Throttling now. The source code > > > > > >> has been verified on 4.0.2. It need more test on master branch. > > > > > >> I hope to finish it before the deadline of 4.2 feature > > > > > >> freeze > > > > (31-5-2013). > > > > > >> > > > > > >> For more information: > > > > > >> https://issues.apache.org/jira/browse/CLOUDSTACK-1301 > > > > > >> > > > > > >> > > > > > https://cwiki.apache.org/confluence/display/CLOUDSTACK/VM+Disk > > > > > +I > > > > > O+ > > > > > Th > > > > > r > > > > > >> ottling > > > > > >> > > > > > >> Wei > > > > > >> > > > > > >> > > > > > >> 2013/5/16 Mike Tutkowski <mike.tutkow...@solidfire.com> > > > > > >> > > > > > >> > Hi everyone, > > > > > >> > > > > > > >> > I'm trying to add a few fields to the GUI's Add Disk > > > > > >> > Offering dialog > > > > > >> (min, > > > > > >> > max, and burst IOPS). > > > > > >> > > > > > > >> > Once I have these fields in place, they will of course > > > > > >> > need to > > > pass > > > > > >> > this information to the backend and the data will need to > > > > > >> > end up > > > in > > > > > >> > new > > > > > >> fields > > > > > >> > in the DB. > > > > > >> > > > > > > >> > I was wondering if anyone knew of example code I might be > > > > > >> > able to > > > > > >> pattern > > > > > >> > my changes off of. The one that comes to mind is CPU and > > > > > >> > RAM overcommit changes to the Add Cluster dialog (but I'm > > > > > >> > having a > > > hard > > > > > >> > time tracking these down in Git). > > > > > >> > > > > > > >> > Thanks! > > > > > >> > > > > > > >> > -- > > > > > >> > *Mike Tutkowski* > > > > > >> > *Senior CloudStack Developer, SolidFire Inc.* > > > > > >> > e: mike.tutkow...@solidfire.com > > > > > >> > o: 303.746.7302 > > > > > >> > Advancing the way the world uses the > > > > > >> > cloud<http://solidfire.com/solution/overview/?video=play> > > > > > >> > *(tm)* > > > > > >> > > > > > > >> > > > > > > > > > > > > > > > > > > > > > > > > -- > > > > > > *Mike Tutkowski* > > > > > > *Senior CloudStack Developer, SolidFire Inc.* > > > > > > e: mike.tutkow...@solidfire.com > > > > > > o: 303.746.7302 > > > > > > Advancing the way the world uses the > > > > > > cloud<http://solidfire.com/solution/overview/?video=play> > > > > > > *(tm)* > > > > > > > > > > > > > > > > > > > > > > > > > > -- > > > > > *Mike Tutkowski* > > > > > *Senior CloudStack Developer, SolidFire Inc.* > > > > > e: mike.tutkow...@solidfire.com > > > > > o: 303.746.7302 > > > > > Advancing the way the world uses the > > > > > cloud<http://solidfire.com/solution/overview/?video=play> > > > > > *(tm)* > > > > > > > > > > > > > > > > > -- > *Mike Tutkowski* > *Senior CloudStack Developer, SolidFire Inc.* > e: mike.tutkow...@solidfire.com > o: 303.746.7302 > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > > > > **** > > **** > > -- > *Mike Tutkowski***** > > *Senior CloudStack Developer, SolidFire Inc.***** > > e: mike.tutkow...@solidfire.com**** > > o: 303.746.7302**** > > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > > > > **** > > ** ** > > -- > *Mike Tutkowski***** > > *Senior CloudStack Developer, SolidFire Inc.***** > > e: mike.tutkow...@solidfire.com**** > > o: 303.746.7302**** > > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > > > > **** > > ** ** > > -- > *Mike Tutkowski***** > > *Senior CloudStack Developer, SolidFire Inc.***** > > e: mike.tutkow...@solidfire.com**** > > o: 303.746.7302**** > > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > > > > **** > > ** ** > > -- > *Mike Tutkowski***** > > *Senior CloudStack Developer, SolidFire Inc.***** > > e: mike.tutkow...@solidfire.com**** > > o: 303.746.7302**** > > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > > > > **** > > ** ** > > -- > *Mike Tutkowski***** > > *Senior CloudStack Developer, SolidFire Inc.***** > > e: mike.tutkow...@solidfire.com**** > > o: 303.746.7302**** > > Advancing the way the world uses the > cloud<http://solidfire.com/solution/overview/?video=play> > *(tm)***** > -- *Mike Tutkowski* *Senior CloudStack Developer, SolidFire Inc.* e: mike.tutkow...@solidfire.com o: 303.746.7302 Advancing the way the world uses the cloud<http://solidfire.com/solution/overview/?video=play> *(tm)*
