Ok, I'm at a little bit of a loss. I know the information is there in the docs, but the docs are made more for seasoned javascripters. I'm not that. I could use a little direction from anyone out there willing to explain a little. I am currently working with the 3d rotator, so that is my reference point. That bit of code begins with a module. I can only aliken this to a class. Then you place in required external classes (I know them as includes). Then you have your constructor method known here as the builder. The builder instantiates a variable to a page widget.
FIRST QUESTION: Do all functional widgets and Uize entities have to be instantiated as well? or... Must I have only one page instance and then create widgets as children of this page? or... Do each of those have to be encapsulated in their own module class?
Now it seems that our constructor is all inclusive, there are no external classes, local to the Module class but out of scope to the builder. Inside the builder we declare our global variables. At this point we create another variable which is assigned as a child of page and it is a "Drag" type of widget. The parameters are set forth here for cancelfade, releasetravel and the inner html of the div that will contain the set of images to be rotated, assigning a frame number dynamically to the image url.
Finally, before we fire off the page instance with wireUi we have two functions:
The first is able to access the rotationViewer child widget instance, but accesses frames by the use of "showNode".
SECOND QUESTION: If I wanted to access a specific frame within rotationViewer, how would I do this? Node.getValue is only for obtaining the value of say, a form element. So how would you access the node? Maybe rotationViewer.Node['frame0] ??? or would I have to wire the specific node and make the call to it within the wiring method as is done in the second example above? However, the second example contains two actions that access the rotationViewer itself (and not the individual nodes). Even still, I attempted to add to the existing 'Drag Start' and 'Drag Update' with a 'click'. Nothing happened. Why? I can only assume that because rotationViewer is an instance of Uize.Widget.Drag that it only has access to drag events. This being so, the images themselves are nodes withing the rotationViewer Widget and that is a child of the page instance. HOW would I access those individual images? rotationViewer.findNode(tagName:'IMG',className:'someAddedClassForReference s') ??? Or maybe : page.wireNode (Uize.Node.find ({tagName:'img',className:/\bjabawa\b/}), 'click',function (){alert("hey there");}); ***** THIS SEEMS TO WORK****
Now the QUESTION is this; How to I add additional widgets to these actions? Considering I now have access to each image, how do I fire off another widget? A zoom, a color shift/change, an image swap?
LAST QUESTION: How do I add additional widgets to the application? Must I create a new module? May I add it to the current builder? Do they all have to be children of the page instance (which is an instance of Uize.Widget.Page)?
Wow! It took forever to get a response back from the community that I didn't think my post was 'alive'. I've been busy working on other stuff & hadn't thought much about it some since posting.
Some days ago, I viewed the code generated by the browser & saw <div id="page_rotationViewer" class="rotationViewer insetBorderColor"></div> stays "empty".
So I thought about 'cheating' and simply add the text LOADING inside the <div id="page_rotationViewer"> as a shortcut but had refrained from doing so because the images I'm using are PNGs with some transparency & wasn't sure how it would look.
You've been working harder on this more than I have, that I thought, I best try to see if my theory works & sure enough, it does!
On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley <aryandunt...@gmail.com> wrote: > Ok, I'm at a little bit of a loss. I know the information is there in the > docs, but the docs are made more for seasoned javascripters. I'm not that. > I could use a little direction from anyone out there willing to explain a > little. I am currently working with the 3d rotator, so that is my reference > point. That bit of code begins with a module. I can only aliken this to a > class. Then you place in required external classes (I know them as > includes). Then you have your constructor method known here as the > builder. The builder instantiates a variable to a page widget.
> FIRST QUESTION: Do all functional widgets and Uize entities have to be > instantiated as well? or... Must I have only one page instance and then > create widgets as children of this page? or... Do each of those have to be > encapsulated in their own module class?
> Now it seems that our constructor is all inclusive, there are no external > classes, local to the Module class but out of scope to the builder. Inside > the builder we declare our global variables. At this point we create > another variable which is assigned as a child of page and it is a "Drag" > type of widget. The parameters are set forth here for cancelfade, > releasetravel and the inner html of the div that will contain the set of > images to be rotated, assigning a frame number dynamically to the image url.
> Finally, before we fire off the page instance with wireUi we have two > functions:
> The first is able to access the rotationViewer child widget instance, but > accesses frames by the use of "showNode".
> SECOND QUESTION: If I wanted to access a specific frame within > rotationViewer, how would I do this? Node.getValue is only for obtaining > the value of say, a form element. So how would you access the node? Maybe > rotationViewer.Node['frame0] ??? or would I have to wire the specific node > and make the call to it within the wiring method as is done in the second > example above? However, the second example contains two actions that access > the rotationViewer itself (and not the individual nodes). Even still, I > attempted to add to the existing 'Drag Start' and 'Drag Update' with a > 'click'. Nothing happened. Why? I can only assume that because > rotationViewer is an instance of Uize.Widget.Drag that it only has access to > drag events. This being so, the images themselves are nodes withing the > rotationViewer Widget and that is a child of the page instance. HOW would I > access those individual images? > rotationViewer.findNode(tagName:'IMG',className:'someAddedClassForReference s') > ??? Or maybe : > page.wireNode (Uize.Node.find ({tagName:'img',className:/\bjabawa\b/}), > 'click',function (){alert("hey there");}); ***** THIS SEEMS TO WORK****
> Now the QUESTION is this; How to I add additional widgets to these actions? > Considering I now have access to each image, how do I fire off another > widget? A zoom, a color shift/change, an image swap?
> LAST QUESTION: How do I add additional widgets to the application? Must I > create a new module? May I add it to the current builder? Do they all have > to be children of the page instance (which is an instance of > Uize.Widget.Page)?
PS, you may want to have your thingy auto-rotate. Here is the code to allow for that:
I haven't played with it but you should only have to replace the original onload function with that below. The drag should still work, but the continuous rotation may interfere??? If so, you would have to stop the setInterval when dragging and resume onRelease.
On Mon, Mar 5, 2012 at 4:38 PM, Mark Laurel <junj...@gmail.com> wrote: > Hi Aryan
> Wow! It took forever to get a response back from the community that I > didn't think my post was 'alive'. > I've been busy working on other stuff & hadn't thought much about it > some since posting.
> Some days ago, I viewed the code generated by the browser & saw > <div id="page_rotationViewer" class="rotationViewer > insetBorderColor"></div> stays "empty".
> So I thought about 'cheating' and simply add the text LOADING inside > the <div id="page_rotationViewer"> as a shortcut > but had refrained from doing so because the images I'm using are PNGs > with some transparency & wasn't sure how > it would look.
> You've been working harder on this more than I have, that I thought, I > best try to see if my theory > works & sure enough, it does!
> On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley <aryandunt...@gmail.com> > wrote: > > Ok, I'm at a little bit of a loss. I know the information is there in > the > > docs, but the docs are made more for seasoned javascripters. I'm not > that. > > I could use a little direction from anyone out there willing to explain a > > little. I am currently working with the 3d rotator, so that is my > reference > > point. That bit of code begins with a module. I can only aliken this > to a > > class. Then you place in required external classes (I know them as > > includes). Then you have your constructor method known here as the > > builder. The builder instantiates a variable to a page widget.
> > FIRST QUESTION: Do all functional widgets and Uize entities have to be > > instantiated as well? or... Must I have only one page instance and then > > create widgets as children of this page? or... Do each of those have to > be > > encapsulated in their own module class?
> > Now it seems that our constructor is all inclusive, there are no external > > classes, local to the Module class but out of scope to the builder. > Inside > > the builder we declare our global variables. At this point we create > > another variable which is assigned as a child of page and it is a "Drag" > > type of widget. The parameters are set forth here for cancelfade, > > releasetravel and the inner html of the div that will contain the set of > > images to be rotated, assigning a frame number dynamically to the image > url.
> > Finally, before we fire off the page instance with wireUi we have two > > functions:
> > The first is able to access the rotationViewer child widget instance, but > > accesses frames by the use of "showNode".
> > SECOND QUESTION: If I wanted to access a specific frame within > > rotationViewer, how would I do this? Node.getValue is only for obtaining > > the value of say, a form element. So how would you access the node? > Maybe > > rotationViewer.Node['frame0] ??? or would I have to wire the specific > node > > and make the call to it within the wiring method as is done in the second > > example above? However, the second example contains two actions that > access > > the rotationViewer itself (and not the individual nodes). Even still, I > > attempted to add to the existing 'Drag Start' and 'Drag Update' with a > > 'click'. Nothing happened. Why? I can only assume that because > > rotationViewer is an instance of Uize.Widget.Drag that it only has > access to > > drag events. This being so, the images themselves are nodes withing the > > rotationViewer Widget and that is a child of the page instance. HOW > would I > > access those individual images?
> rotationViewer.findNode(tagName:'IMG',className:'someAddedClassForReference s') > > ??? Or maybe : > > page.wireNode (Uize.Node.find ({tagName:'img',className:/\bjabawa\b/}), > > 'click',function (){alert("hey there");}); ***** THIS SEEMS TO WORK****
> > Now the QUESTION is this; How to I add additional widgets to these > actions? > > Considering I now have access to each image, how do I fire off another > > widget? A zoom, a color shift/change, an image swap?
> > LAST QUESTION: How do I add additional widgets to the application? > Must I > > create a new module? May I add it to the current builder? Do they all > have > > to be children of the page instance (which is an instance of > > Uize.Widget.Page)?
Thanks for the feedback, admittedly after working on the site for about a month I already want to change the design.
It's lacking IMO- but I've already spent too much time on it (especially when I was playing around with WP & reverse engineering one of their themes so I can use it as CMS). Maybe I'll just change the color schemes & bgImg.
I digress, I'll check that auto rotate code when I redo the animation & cut 18 frames from the animation, it's @ 90 frames at the moment. I've noticed some lag on my machine & that shouldn't happen (I would hate to see how it behaves on slower machines). Interestingly, it stutters with Safari on Windows7 but not on iPads.
BTW: IDT the continuous rotation shouldn't interfere since that's an onload event & doesn't get called again once the user interacts with the object- at least in theory.
One feature that I think would be cool to add is to allow users to navigate from a specific frame, that's something I'd like to work on if time allows.
On Mon, Mar 5, 2012 at 7:32 PM, Aryan Duntley <aryandunt...@gmail.com> wrote: > PS, you may want to have your thingy auto-rotate. Here is the code to allow > for that:
> I haven't played with it but you should only have to replace the original > onload function with that below. The drag should still work, but the > continuous rotation may interfere??? If so, you would have to stop the > setInterval when dragging and resume onRelease.
> On Mon, Mar 5, 2012 at 4:38 PM, Mark Laurel <junj...@gmail.com> wrote:
>> Hi Aryan
>> Wow! It took forever to get a response back from the community that I >> didn't think my post was 'alive'. >> I've been busy working on other stuff & hadn't thought much about it >> some since posting.
>> Some days ago, I viewed the code generated by the browser & saw >> <div id="page_rotationViewer" class="rotationViewer >> insetBorderColor"></div> stays "empty".
>> So I thought about 'cheating' and simply add the text LOADING inside >> the <div id="page_rotationViewer"> as a shortcut >> but had refrained from doing so because the images I'm using are PNGs >> with some transparency & wasn't sure how >> it would look.
>> You've been working harder on this more than I have, that I thought, I >> best try to see if my theory >> works & sure enough, it does!
>> On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley <aryandunt...@gmail.com> >> wrote: >> > Ok, I'm at a little bit of a loss. I know the information is there in >> > the >> > docs, but the docs are made more for seasoned javascripters. I'm not >> > that. >> > I could use a little direction from anyone out there willing to explain >> > a >> > little. I am currently working with the 3d rotator, so that is my >> > reference >> > point. That bit of code begins with a module. I can only aliken this >> > to a >> > class. Then you place in required external classes (I know them as >> > includes). Then you have your constructor method known here as the >> > builder. The builder instantiates a variable to a page widget.
>> > FIRST QUESTION: Do all functional widgets and Uize entities have to be >> > instantiated as well? or... Must I have only one page instance and >> > then >> > create widgets as children of this page? or... Do each of those have to >> > be >> > encapsulated in their own module class?
>> > Now it seems that our constructor is all inclusive, there are no >> > external >> > classes, local to the Module class but out of scope to the builder. >> > Inside >> > the builder we declare our global variables. At this point we create >> > another variable which is assigned as a child of page and it is a "Drag" >> > type of widget. The parameters are set forth here for cancelfade, >> > releasetravel and the inner html of the div that will contain the set of >> > images to be rotated, assigning a frame number dynamically to the image >> > url.
>> > Finally, before we fire off the page instance with wireUi we have two >> > functions:
>> > The first is able to access the rotationViewer child widget instance, >> > but >> > accesses frames by the use of "showNode".
>> > SECOND QUESTION: If I wanted to access a specific frame within >> > rotationViewer, how would I do this? Node.getValue is only for >> > obtaining >> > the value of say, a form element. So how would you access the node? >> > Maybe >> > rotationViewer.Node['frame0] ??? or would I have to wire the specific >> > node >> > and make the call to it within the wiring method as is done in the >> > second >> > example above? However, the second example contains two actions that >> > access >> > the rotationViewer itself (and not the individual nodes). Even still, I >> > attempted to add to the existing 'Drag Start' and 'Drag Update' with a >> > 'click'. Nothing happened. Why? I can only assume that because >> > rotationViewer is an instance of Uize.Widget.Drag that it only has >> > access to >> > drag events. This being so, the images themselves are nodes withing the >> > rotationViewer Widget and that is a child of the page instance. HOW >> > would I >> > access those individual images?
>> > rotationViewer.findNode(tagName:'IMG',className:'someAddedClassForReference s') >> > ??? Or maybe : >> > page.wireNode (Uize.Node.find ({tagName:'img',className:/\bjabawa\b/}), >> > 'click',function (){alert("hey there");}); ***** THIS SEEMS TO WORK****
>> > Now the QUESTION is this; How to I add additional widgets to these >> > actions? >> > Considering I now have access to each image, how do I fire off another >> > widget? A zoom, a color shift/change, an image swap?
>> > LAST QUESTION: How do I add additional widgets to the application? >> > Must I >> > create a new module? May I add it to the current builder? Do they all >> > have >> > to be children of the page instance (which is an instance of >> > Uize.Widget.Page)?
In my last post in the documentation, I showed how I worked on finding a way to recognize and click each individual frame. That will give you your navigation from a specific frame. Just add a conditional in the function to test for 'this' (I assume this would work).
On Mon, Mar 5, 2012 at 6:13 PM, Mark Laurel <junj...@gmail.com> wrote: > Thanks for the feedback, admittedly after working on the site for > about a month I already want to change the design.
> It's lacking IMO- but I've already spent too much time on it > (especially when I was playing around with WP & > reverse engineering one of their themes so I can use it as CMS). Maybe > I'll just change the color schemes & bgImg.
> I digress, I'll check that auto rotate code when I redo the animation > & cut 18 frames from the animation, it's > @ 90 frames at the moment. I've noticed some lag on my machine & that > shouldn't happen (I would hate to see > how it behaves on slower machines). Interestingly, it stutters with > Safari on Windows7 but not on iPads.
> BTW: IDT the continuous rotation shouldn't interfere since that's an > onload event & doesn't get called again once the user interacts > with the object- at least in theory.
> One feature that I think would be cool to add is to allow users to > navigate from a specific frame, that's something I'd like to work on > if time allows.
> Mark
> On Mon, Mar 5, 2012 at 7:32 PM, Aryan Duntley <aryandunt...@gmail.com> > wrote: > > PS, you may want to have your thingy auto-rotate. Here is the code to > allow > > for that:
> > I haven't played with it but you should only have to replace the original > > onload function with that below. The drag should still work, but the > > continuous rotation may interfere??? If so, you would have to stop the > > setInterval when dragging and resume onRelease.
> > On Mon, Mar 5, 2012 at 4:38 PM, Mark Laurel <junj...@gmail.com> wrote:
> >> Hi Aryan
> >> Wow! It took forever to get a response back from the community that I > >> didn't think my post was 'alive'. > >> I've been busy working on other stuff & hadn't thought much about it > >> some since posting.
> >> Some days ago, I viewed the code generated by the browser & saw > >> <div id="page_rotationViewer" class="rotationViewer > >> insetBorderColor"></div> stays "empty".
> >> So I thought about 'cheating' and simply add the text LOADING inside > >> the <div id="page_rotationViewer"> as a shortcut > >> but had refrained from doing so because the images I'm using are PNGs > >> with some transparency & wasn't sure how > >> it would look.
> >> You've been working harder on this more than I have, that I thought, I > >> best try to see if my theory > >> works & sure enough, it does!
> >> On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley <aryandunt...@gmail.com> > >> wrote: > >> > Ok, I'm at a little bit of a loss. I know the information is there in > >> > the > >> > docs, but the docs are made more for seasoned javascripters. I'm not > >> > that. > >> > I could use a little direction from anyone out there willing to > explain > >> > a > >> > little. I am currently working with the 3d rotator, so that is my > >> > reference > >> > point. That bit of code begins with a module. I can only aliken this > >> > to a > >> > class. Then you place in required external classes (I know them as > >> > includes). Then you have your constructor method known here as the > >> > builder. The builder instantiates a variable to a page widget.
> >> > FIRST QUESTION: Do all functional widgets and Uize entities have to > be > >> > instantiated as well? or... Must I have only one page instance and > >> > then > >> > create widgets as children of this page? or... Do each of those have > to > >> > be > >> > encapsulated in their own module class?
> >> > Now it seems that our constructor is all inclusive, there are no > >> > external > >> > classes, local to the Module class but out of scope to the builder. > >> > Inside > >> > the builder we declare our global variables. At this point we create > >> > another variable which is assigned as a child of page and it is a > "Drag" > >> > type of widget. The parameters are set forth here for cancelfade, > >> > releasetravel and the inner html of the div that will contain the set > of > >> > images to be rotated, assigning a frame number dynamically to the > image > >> > url.
> >> > Finally, before we fire off the page instance with wireUi we have two > >> > functions:
> >> > The first is able to access the rotationViewer child widget instance, > >> > but > >> > accesses frames by the use of "showNode".
> >> > SECOND QUESTION: If I wanted to access a specific frame within > >> > rotationViewer, how would I do this? Node.getValue is only for > >> > obtaining > >> > the value of say, a form element. So how would you access the node? > >> > Maybe > >> > rotationViewer.Node['frame0] ??? or would I have to wire the specific > >> > node > >> > and make the call to it within the wiring method as is done in the > >> > second > >> > example above? However, the second example contains two actions that > >> > access > >> > the rotationViewer itself (and not the individual nodes). Even > still, I > >> > attempted to add to the existing 'Drag Start' and 'Drag Update' with a > >> > 'click'. Nothing happened. Why? I can only assume that because > >> > rotationViewer is an instance of Uize.Widget.Drag that it only has > >> > access to > >> > drag events. This being so, the images themselves are nodes withing > the > >> > rotationViewer Widget and that is a child of the page instance. HOW > >> > would I > >> > access those individual images?
> rotationViewer.findNode(tagName:'IMG',className:'someAddedClassForReference s') > >> > ??? Or maybe : > >> > page.wireNode (Uize.Node.find > ({tagName:'img',className:/\bjabawa\b/}), > >> > 'click',function (){alert("hey there");}); ***** THIS SEEMS TO > WORK****
> >> > Now the QUESTION is this; How to I add additional widgets to these > >> > actions? > >> > Considering I now have access to each image, how do I fire off another > >> > widget? A zoom, a color shift/change, an image swap?
> >> > LAST QUESTION: How do I add additional widgets to the application? > >> > Must I > >> > create a new module? May I add it to the current builder? Do they > all > >> > have > >> > to be children of the page instance (which is an instance of > >> > Uize.Widget.Page)?
On Tue, Mar 6, 2012 at 12:07 AM, Aryan Duntley <aryandunt...@gmail.com> wrote: > In my last post in the documentation, I showed how I worked on finding a way > to recognize and click each individual frame. That will give you your > navigation from a specific frame. Just add a conditional in the function to > test for 'this' (I assume this would work).
> On Mon, Mar 5, 2012 at 6:13 PM, Mark Laurel <junj...@gmail.com> wrote:
>> Thanks for the feedback, admittedly after working on the site for >> about a month I already want to change the design.
>> It's lacking IMO- but I've already spent too much time on it >> (especially when I was playing around with WP & >> reverse engineering one of their themes so I can use it as CMS). Maybe >> I'll just change the color schemes & bgImg.
>> I digress, I'll check that auto rotate code when I redo the animation >> & cut 18 frames from the animation, it's >> @ 90 frames at the moment. I've noticed some lag on my machine & that >> shouldn't happen (I would hate to see >> how it behaves on slower machines). Interestingly, it stutters with >> Safari on Windows7 but not on iPads.
>> BTW: IDT the continuous rotation shouldn't interfere since that's an >> onload event & doesn't get called again once the user interacts >> with the object- at least in theory.
>> One feature that I think would be cool to add is to allow users to >> navigate from a specific frame, that's something I'd like to work on >> if time allows.
>> Mark
>> On Mon, Mar 5, 2012 at 7:32 PM, Aryan Duntley <aryandunt...@gmail.com> >> wrote: >> > PS, you may want to have your thingy auto-rotate. Here is the code to >> > allow >> > for that:
>> > I haven't played with it but you should only have to replace the >> > original >> > onload function with that below. The drag should still work, but the >> > continuous rotation may interfere??? If so, you would have to stop the >> > setInterval when dragging and resume onRelease.
>> > On Mon, Mar 5, 2012 at 4:38 PM, Mark Laurel <junj...@gmail.com> wrote:
>> >> Hi Aryan
>> >> Wow! It took forever to get a response back from the community that I >> >> didn't think my post was 'alive'. >> >> I've been busy working on other stuff & hadn't thought much about it >> >> some since posting.
>> >> Some days ago, I viewed the code generated by the browser & saw >> >> <div id="page_rotationViewer" class="rotationViewer >> >> insetBorderColor"></div> stays "empty".
>> >> So I thought about 'cheating' and simply add the text LOADING inside >> >> the <div id="page_rotationViewer"> as a shortcut >> >> but had refrained from doing so because the images I'm using are PNGs >> >> with some transparency & wasn't sure how >> >> it would look.
>> >> You've been working harder on this more than I have, that I thought, I >> >> best try to see if my theory >> >> works & sure enough, it does!
>> >> On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley <aryandunt...@gmail.com> >> >> wrote: >> >> > Ok, I'm at a little bit of a loss. I know the information is there >> >> > in >> >> > the >> >> > docs, but the docs are made more for seasoned javascripters. I'm not >> >> > that. >> >> > I could use a little direction from anyone out there willing to >> >> > explain >> >> > a >> >> > little. I am currently working with the 3d rotator, so that is my >> >> > reference >> >> > point. That bit of code begins with a module. I can only aliken >> >> > this >> >> > to a >> >> > class. Then you place in required external classes (I know them as >> >> > includes). Then you have your constructor method known here as the >> >> > builder. The builder instantiates a variable to a page widget.
>> >> > FIRST QUESTION: Do all functional widgets and Uize entities have to >> >> > be >> >> > instantiated as well? or... Must I have only one page instance and >> >> > then >> >> > create widgets as children of this page? or... Do each of those have >> >> > to >> >> > be >> >> > encapsulated in their own module class?
>> >> > Now it seems that our constructor is all inclusive, there are no >> >> > external >> >> > classes, local to the Module class but out of scope to the builder. >> >> > Inside >> >> > the builder we declare our global variables. At this point we create >> >> > another variable which is assigned as a child of page and it is a >> >> > "Drag" >> >> > type of widget. The parameters are set forth here for cancelfade, >> >> > releasetravel and the inner html of the div that will contain the set >> >> > of >> >> > images to be rotated, assigning a frame number dynamically to the >> >> > image >> >> > url.
>> >> > Finally, before we fire off the page instance with wireUi we have two >> >> > functions:
>> >> > The first is able to access the rotationViewer child widget instance, >> >> > but >> >> > accesses frames by the use of "showNode".
>> >> > SECOND QUESTION: If I wanted to access a specific frame within >> >> > rotationViewer, how would I do this? Node.getValue is only for >> >> > obtaining >> >> > the value of say, a form element. So how would you access the node? >> >> > Maybe >> >> > rotationViewer.Node['frame0] ??? or would I have to wire the specific >> >> > node >> >> > and make the call to it within the wiring method as is done in the >> >> > second >> >> > example above? However, the second example contains two actions that >> >> > access >> >> > the rotationViewer itself (and not the individual nodes). Even >> >> > still, I >> >> > attempted to add to the existing 'Drag Start' and 'Drag Update' with >> >> > a >> >> > 'click'. Nothing happened. Why? I can only assume that because >> >> > rotationViewer is an instance of Uize.Widget.Drag that it only has >> >> > access to >> >> > drag events. This being so, the images themselves are nodes withing >> >> > the >> >> > rotationViewer Widget and that is a child of the page instance. HOW >> >> > would I >> >> > access those individual images?
>> >> > Now the QUESTION is this; How to I add additional widgets to these >> >> > actions? >> >> > Considering I now have access to each image, how do I fire off >> >> > another >> >> > widget? A zoom, a color shift/change, an image swap?
>> >> > LAST QUESTION: How do I add additional widgets to the application? >> >> > Must I >> >> > create a new module? May I add it to the current builder? Do they >> >> > all >> >> > have >> >> > to be children of the page instance (which is an instance of >> >> > Uize.Widget.Page)?
I finally had some time to dig into the 3D Rotator a bit. As far as recognizing a click on a specific image on a frame (to zoom, etc.), I discovered it's going to be a bit tricky. If you click on the "Delve" > "Events" tab button on www.uize.com, it records user interaction.
This is what it returns after a mouseDown & mouseUp (this essentially was just a click on the rotator):
I thought I could delay the mouseUp event by using a timer & add a "onDblClick" event between down & up events- but I started digging around the different modules; I didn't even know which part to play around with, I didn't want to break anything & it was going to be time consuming.
I want to use the rotator as my primary navigation. So, I thought of an alternate solution for what I need. I added the following conditions in the updateRotation function (I'm sure there's prolly a more efficient way to code the conditional statements but this is a test).
/*** wire up the drag widget with events for updating rotation degree ***/ function updateRotation (newRotation) { rotation = ((newRotation % 360) + 360) % 360; var frameNo = 1 + Math.round (rotation / 360 * (totalFrames - 1)); if (frameNo != lastFrameNo) { rotationViewer.showNode ('frame'+ lastFrameNo,false); rotationViewer.showNode ('frame'+ (lastFrameNo = frameNo)); }
On Tue, Mar 6, 2012 at 8:33 PM, Mark Laurel <junj...@gmail.com> wrote: > Awesome! I'm gonna have to go through it in detail.
> Working on getting a new client so I kinda put my stuff on pause.
> On Tue, Mar 6, 2012 at 12:07 AM, Aryan Duntley <aryandunt...@gmail.com> > wrote: > > In my last post in the documentation, I showed how I worked on finding a > way > > to recognize and click each individual frame. That will give you your > > navigation from a specific frame. Just add a conditional in the > function to > > test for 'this' (I assume this would work).
> > On Mon, Mar 5, 2012 at 6:13 PM, Mark Laurel <junj...@gmail.com> wrote:
> >> Thanks for the feedback, admittedly after working on the site for > >> about a month I already want to change the design.
> >> It's lacking IMO- but I've already spent too much time on it > >> (especially when I was playing around with WP & > >> reverse engineering one of their themes so I can use it as CMS). Maybe > >> I'll just change the color schemes & bgImg.
> >> I digress, I'll check that auto rotate code when I redo the animation > >> & cut 18 frames from the animation, it's > >> @ 90 frames at the moment. I've noticed some lag on my machine & that > >> shouldn't happen (I would hate to see > >> how it behaves on slower machines). Interestingly, it stutters with > >> Safari on Windows7 but not on iPads.
> >> BTW: IDT the continuous rotation shouldn't interfere since that's an > >> onload event & doesn't get called again once the user interacts > >> with the object- at least in theory.
> >> One feature that I think would be cool to add is to allow users to > >> navigate from a specific frame, that's something I'd like to work on > >> if time allows.
> >> Mark
> >> On Mon, Mar 5, 2012 at 7:32 PM, Aryan Duntley <aryandunt...@gmail.com> > >> wrote: > >> > PS, you may want to have your thingy auto-rotate. Here is the code to > >> > allow > >> > for that:
> >> > I haven't played with it but you should only have to replace the > >> > original > >> > onload function with that below. The drag should still work, but the > >> > continuous rotation may interfere??? If so, you would have to stop > the > >> > setInterval when dragging and resume onRelease.
> >> > On Mon, Mar 5, 2012 at 4:38 PM, Mark Laurel <junj...@gmail.com> > wrote:
> >> >> Hi Aryan
> >> >> Wow! It took forever to get a response back from the community that I > >> >> didn't think my post was 'alive'. > >> >> I've been busy working on other stuff & hadn't thought much about it > >> >> some since posting.
> >> >> Some days ago, I viewed the code generated by the browser & saw > >> >> <div id="page_rotationViewer" class="rotationViewer > >> >> insetBorderColor"></div> stays "empty".
> >> >> So I thought about 'cheating' and simply add the text LOADING inside > >> >> the <div id="page_rotationViewer"> as a shortcut > >> >> but had refrained from doing so because the images I'm using are PNGs > >> >> with some transparency & wasn't sure how > >> >> it would look.
> >> >> You've been working harder on this more than I have, that I thought, > I > >> >> best try to see if my theory > >> >> works & sure enough, it does!
> >> >> On Mon, Mar 5, 2012 at 4:45 PM, Aryan Duntley < > aryandunt...@gmail.com> > >> >> wrote: > >> >> > Ok, I'm at a little bit of a loss. I know the information is there > >> >> > in > >> >> > the > >> >> > docs, but the docs are made more for seasoned javascripters. I'm > not > >> >> > that. > >> >> > I could use a little direction from anyone out there willing to > >> >> > explain > >> >> > a > >> >> > little. I am currently working with the 3d rotator, so that is my > >> >> > reference > >> >> > point. That bit of code begins with a module. I can only aliken > >> >> > this > >> >> > to a > >> >> > class. Then you place in required external classes (I know them as > >> >> > includes). Then you have your constructor method known here as the > >> >> > builder. The builder instantiates a variable to a page widget.
> >> >> > FIRST QUESTION: Do all functional widgets and Uize entities have > to > >> >> > be > >> >> > instantiated as well? or... Must I have only one page instance > and > >> >> > then > >> >> > create widgets as children of this page? or... Do each of those > have > >> >> > to > >> >> > be > >> >> > encapsulated in their own module class?
> >> >> > Now it seems that our constructor is all inclusive, there are no > >> >> > external > >> >> > classes, local to the Module class but out of scope to the builder. > >> >> > Inside > >> >> > the builder we declare our global variables. At this point we > create > >> >> > another variable which is assigned as a child of page and it is a > >> >> > "Drag" > >> >> > type of widget. The parameters are set forth here for cancelfade, > >> >> > releasetravel and the inner html of the div that will contain the > set > >> >> > of > >> >> > images to be rotated, assigning a frame number dynamically to the > >> >> > image > >> >> > url.
> >> >> > Finally, before we fire off the page instance with wireUi we have > two > >> >> > functions:
