Yes, Pranav, that makes sense - thanks for that info!
On Fri, May 17, 2013 at 7:30 PM, Pranav Saxena <[email protected]>wrote: > 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:[email protected]] > Sent: Saturday, May 18, 2013 6:53 AM > To: Pranav Saxena > Cc: [email protected] > 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 <[email protected] > >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:[email protected]] > > *Sent:* Saturday, May 18, 2013 3:15 AM > > *To:* Pranav Saxena > > *Cc:* [email protected] > > > > *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 < > > [email protected]> 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 < > > [email protected]> 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 < > > [email protected]> wrote:**** > > > > Thanks, Pranav!**** > > > > ** ** > > > > On Thu, May 16, 2013 at 11:20 PM, Pranav Saxena > > <[email protected]> > > 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:[email protected]] > > *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 > > <[email protected]> > > 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:[email protected]]**** > > > > Sent: Friday, May 17, 2013 9:40 AM > > To: [email protected] > > 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 > > <[email protected] > > >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:[email protected]] > > > Sent: Friday, May 17, 2013 6:56 AM > > > To: [email protected] > > > Subject: Re: Example code for GUI > > > > > > Thanks Isaac > > > Regards > > > Ilya > > > > > > > > > > > > -------- Original message -------- > > > From: Isaac Chiang <[email protected]> > > > Date: > > > To: [email protected],"Musayev, Ilya" <[email protected]> > > > 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 <[email protected]> > > 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 <[email protected]> > > > > Date: > > > > To: [email protected] > > > > 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 <[email protected]> > > > > > > > > > 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:[email protected]] > > > > > > Sent: Thursday, May 16, 2013 6:26 PM > > > > > > To: [email protected] > > > > > > 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 < > > > > > > [email protected]> 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 > > > > > > > <[email protected]> > > > > > > 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 <[email protected]> > > > > > > >> > > > > > > >> > 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: [email protected] > > > > > > >> > 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: [email protected] > > > > > > > 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: [email protected] > > > > > > 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: [email protected] > > 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: [email protected]**** > > > > 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: [email protected]**** > > > > 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: [email protected]**** > > > > 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: [email protected]**** > > > > 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: [email protected]**** > > > > 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: [email protected] > 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: [email protected] o: 303.746.7302 Advancing the way the world uses the cloud<http://solidfire.com/solution/overview/?video=play> *™*
