|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
I have added a new module to the contrib. It is a small jQuery LightBox module. It requires 1.6x and above as it uses the JavaScript and CSS registration features for modules and module admin. CuyaLighBox is a basic module that makes it easy to add LighBoxes to your Cuyahoga site. Features: - Create multiple LighBoxes - Upload images to the selected LightBox - Automatic thumbnail creation - Basic editing of added LightBox and LightBoxImage data There are still some things that need to be added the biggest being that there is a limitation of one LightBox section per node at the moment. The JavaScripts need to be identified with the section instance and written to the page programatically. Also the LightBoxes that you create are visible in all nodes at the moment. So I will make these both site and node specific so they do not show up. I will do this soon along with cleaning up the code and css a bit. For now it should work for basic usage cases. I have it an example showing some of my 3D work here: http://www.novodevelopments.com/3d-graphics.aspxGet it here: https://cuyahogacontrib.svn.sourceforge.net/svnroot/cuyahogacontrib/Cuyahoga.Modules.CuyaLightBox/I will add a wiki page soon. I am going to add more jQuery plugin modules soon. I hope it is helpful. Thoughts, comments and ideas are welcome.
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
I have noticed something when viewing this link: http://www.novodevelopments.com/3d-graphics.aspxSome of the thumbnail images seem to be not loading. It seems to be my web host. Can anyone else see this issue?
|
|
Rank: Newbie Groups: Member
Joined: 6/15/2007 Posts: 9 Points: 27 Location: Helsingborg
|
Hi Nice renderings. I can see all the thumbnails alive and well. ( But, no offence, why not have a table or float layout of the thumbs? And spare me the blue frames around linked images  )
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
ztaff wrote:Hi Nice renderings. I can see all the thumbnails alive and well. ( But, no offence, why not have a table or float layout of the thumbs? And spare me the blue frames around linked images  ) Blue frames??? I see none in IE, FireFox or Chrome. I have not seen any other browser. The CSS was from the lightbox plugin with only colour changed. Can you post an image (or email) for reference? What I see:
|
|
Rank: Newbie Groups: Member
Joined: 6/15/2007 Posts: 9 Points: 27 Location: Helsingborg
|
Constructor wrote:ztaff wrote:Hi Nice renderings. I can see all the thumbnails alive and well. ( But, no offence, why not have a table or float layout of the thumbs? And spare me the blue frames around linked images  ) Blue frames??? I see none in IE, FireFox or Chrome. I have not seen any other browser. The CSS was from the lightbox plugin with only colour changed. Can you post an image (or email) for reference? sorry. It is not just any browser. It's the terrible IE 6 on XP Sp2. And yes it looks fine in FF, & safari Here's the image from ie6, not so cute at all, and YES I need to upgrade or change default browser to FF 
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
ztaff - Thanks for the info. It should be quite straight forward to fix.
I think it maybe the css selectors being used: div[id*='_pnlGallery']{}
As I mentioned earlier, this is only the first incarnation. The issues should be ealily ironed out.
The main ones at the moment being:
Make the module site, node and section specific. List only relevant LightBoxes for the current node. CSS Style issues.
Cheers for the information!
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
New updates added: * LightBoxes are now Site-Node specific: When editing LightBoxes only those created on the node show. Before hand all created LightBoxes were listed in the admin. * You can now have multiple lighboxes in a node. The js is added via 'RegisterClientScriptBlock()' Breaking change: I have Changed the tables and mappings for this so it will not work with previous version. Also as a note, I have added CSSControlAdapters to my Cuyahoga build. The 'edit' area will only style if CSSControlAdapters are added to the Cuyahoga build. If they are not the admin is completely unstyled. It looks like this when CSSControlAdapters are active (image has been resized):
|
|
Rank: Newbie Groups: Member
Joined: 6/15/2007 Posts: 9 Points: 27 Location: Helsingborg
|
Constructor wrote:ztaff - Thanks for the info. It should be quite straight forward to fix.
I think it maybe the css selectors being used: div[id*='_pnlGallery']{}
...
Cheers for the information! Cheers to U constructor for being so creative AND productive . and Yes I don't think IE 6 is so fond of selectors lik div[id*="_pnlGallery"] Mayby U just let JQuery do the job of styling in the jQuery lightBox plugin instead? again thanks Ztaff
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
ztaff wrote:Cheers to U constructor for being so creative AND productive .
and Yes I don't think IE 6 is so fond of selectors lik div[id*="_pnlGallery"] Mayby U just let JQuery do the job of styling in the jQuery lightBox plugin instead?
again thanks Ztaff Yeah, I will fix this. I am going to do the same with a few other jQuery plugins. jQuery UI Tabs: self explanitory jQuery Accordion: self explanitory jCrop: (for image cropping and resize after upload) Dynamic Drive: jQuery Multi Level CSS Menu (menu module for Cuyahoga) I have still a few more things to add to the LightBox soon. Like image dimensions for thumbnails and main image, also maybe delete files from server option when delete lightbox/lightbox item. Should be good
|
|
Rank: Advanced Member Groups: Member
Joined: 2/6/2009 Posts: 64 Points: 192
|
Dear John, I think this line should improve: string extension = System.IO.Path.GetExtension(ImageFileUpload.FileName);
If my file is Love.JPG, it does not work, but it is same with Love.jpg
|
|
Rank: Advanced Member Groups: Member
Joined: 2/6/2009 Posts: 64 Points: 192
|
Dear John, I have something like to suggest but I dont know what do you think of? - If i upload a large file, its have with bigger than screen size, like 1600 pixels. It is too big and not good for guest to view. - For this, we create new field in lightbox, that have max value of width for each image. After change this value or upload image, we create new file call thumb_big_(filename) I think it will match with screen size and have better look.
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
juanwoang wrote:Dear John, I have something like to suggest but I dont know what do you think of? - If i upload a large file, its have with bigger than screen size, like 1600 pixels. It is too big and not good for guest to view. - For this, we create new field in lightbox, that have max value of width for each image. After change this value or upload image, we create new file call thumb_big_(filename) I think it will match with screen size and have better look. Yes I agree! I was thinking of having options that appear when a file is selected for download. If the image is large then resize options appear like this. [dialogue] The image you are uploading is 3276 x 2412 pixels in size. Risize image to: Do not resize [ * ] (default selected) 600px wide [ ] 800px wide [ ] 1024px wide [ ] Custom: [_________] px wide [upload button] [/dialogue] This way there is no need to add a new field to the module. The image itself can be resized. I was going to add a few more options/improvements to the small modules (like ' jCrop' image cropping after upload) that I have added, but I am part way through a new articles module. So I will add the image resize options very soon. Do you think this way will solve the issue you have? Also, ' string extension = System.IO.Path.GetExtension(ImageFileUpload.FileName); ' is not good I agree as it does not take into account case sensitivity. I will fix that! Thanks for the information
|
|
Rank: Advanced Member Groups: Member
Joined: 2/6/2009 Posts: 64 Points: 192
|
Constructor wrote: Yes I agree!
I was thinking of having options that appear when a file is selected for download. If the image is large then resize options appear like this.
[dialogue] The image you are uploading is 3276 x 2412 pixels in size.
Risize image to:
Do not resize [ * ] (default selected) 600px wide [ ] 800px wide [ ] 1024px wide [ ]
Custom: [_________] px wide
[upload button]
[/dialogue]
Yes, your way is good. So I think the original image file is important, if you resize it but do not store original file is inconvenience.
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
juanwoang wrote: Yes, your way is good. So I think the original image file is important, if you resize it but do not store original file is inconvenience.
This is not a problem. I can put a checkbox option for keeping original image with also a download original sized image? Then you will have a thumbnail image (resized), lightboximage (resized), and original image as uploaded.
|
|
Rank: Member Groups: Member
Joined: 3/6/2007 Posts: 24 Points: 69
|
Sorry to all, I have some problem with this module: -I can view Automatic thumbnail creation when click an image. -js error  (document) is null -install/uninstall not active: i repair file install (MSSQL 2000) and it active: see attack file File Attachment(s):
install.sql (3kb) downloaded 4 time(s).
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
tuantmyb wrote:Sorry to all, I have some problem with this module: -I can view Automatic thumbnail creation when click an image. -js error  (document) is null -install/uninstall not active: i repair file install (MSSQL 2000) and it active: see attack file What version of Cuyahoga are you using? Are you using the trunk? The advised version to use is: https://cuyahogacontrib.svn.sourceforge.net/svnroot/cuyahogacontrib/Cuyahoga.Modules.CuyaLightBox/branches/1.6xThe modules I have made need V1.6 with CSS and Javascript registration to work.
|
|
Rank: Member Groups: Member
Joined: 3/6/2007 Posts: 24 Points: 69
|
Yes, i Use the truck, and Cuyahoga V1.6 and register js and css: RegisterJavaScript("jQuery", UrlHelper.GetApplicationPath() + "Modules/CuyaLightBox/JavaScript/jquery-1.3.2.min.js"  ; RegisterJavaScript("jQueryLightBoxMin", UrlHelper.GetApplicationPath() + "Modules/CuyaLightBox/JavaScript/jquery.lightbox-0.5.min.js"  ; RegisterJavaScript("jQueryLightBox", UrlHelper.GetApplicationPath() + "Modules/CuyaLightBox/JavaScript/jquery.lightbox-0.5.js"  ; RegisterStylesheet("jQueryLightBoxCss", UrlHelper.GetApplicationPath() + "Modules/CuyaLightBox/css/jquery.lightbox-0.5.css"  ; RegisterStylesheet("jQueryLightBoxCss2", UrlHelper.GetApplicationPath() + "Modules/CuyaLightBox/css/CuyaLightBox.ascx.css"  ; Please send me your running module at my email: tuantmyb@gmail.com. Thanks a lot!
|
|
Rank: Administration Groups: Administration
, Member
Joined: 10/7/2008 Posts: 505 Points: 1,515
|
The latest Cuyahoga V1.6 uses these methods to register CSS and Javascript: Code: RegisterAdminJavascript RegisterAdminStylesheet RegisterStylesheet RegisterJavascript
Notice the difference in case to the ones you supplied. Get the latest V.16 from the repository: https://cuyahoga.svn.sourceforge.net/svnroot/cuyahoga/branches/1.6.xand the latest module: https://cuyahogacontrib.svn.sourceforge.net/svnroot/cuyahogacontrib/Cuyahoga.Modules.CuyaLightBox/branches/1.6xI will send you a zip file. You still need to update you Cuyhoga build though I think.
|
|
Rank: Member Groups: Member
Joined: 3/6/2007 Posts: 24 Points: 69
|
Thanks! I will follow you with your direction above.
|
|
Rank: Member Groups: Member
Joined: 3/6/2007 Posts: 24 Points: 69
|
Ok, i run it successful. Thanks
|
|
Guest |