PageRenderTime 19ms CodeModel.GetById 16ms app.highlight 1ms RepoModel.GetById 1ms app.codeStats 0ms

/pigeoncms/Modules/PigeonCms.Photogallery/views/Devchick.ascx

http://pigeoncms.googlecode.com/
ASP.NET | 95 lines | 74 code | 20 blank | 1 comment | 9 complexity | 1a19c3d101e653e3a421f2d046a8f381 MD5 | raw file
 1<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Devchick.ascx.cs" Inherits="Controls_Default" %>
 2
 3<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
 4<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="1" AssociatedUpdatePanelID="Upd1">
 5    <ProgressTemplate>
 6        <div class="loading"><%=PigeonCms.Utility.GetLabel("LblLoading", "loading") %></div>
 7    </ProgressTemplate>
 8</asp:UpdateProgress>
 9
10<asp:UpdatePanel ID="Upd1" runat="server">
11<ContentTemplate>
12
13    <div class='moduleBody modPhotogallery <%=BaseModule.CssClass %>'>
14        <%=HeaderText %>
15        <div class='gallery_box'>
16            <ul class='gallery_demo'>
17            <%=ImagesListString %>
18            </ul>
19            <p class='gallery_nav'><a href="#" onclick="$.galleria.prev(); return false;">previous</a> | <a href="#" onclick="$.galleria.next(); return false;">next</a></p>
20        </div>
21        <div class='modPhotogallery_pages <%=BaseModule.CssClass %>'>
22            <asp:Panel ID="PanelChildsList" runat="server"></asp:Panel>
23        </div>
24        <!--<div style="clear:both;">-->
25        <div id="main_image"></div>
26        <%=FooterText %><br />
27        <%=ErrorText %>
28    </div>
29    
30    <script type="text/javascript">
31        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
32
33        function EndRequestHandler(sender, args) {
34            if (args.get_error() == undefined) {
35                gallery();
36            }
37        }
38    </script>
39    
40</ContentTemplate>
41</asp:UpdatePanel>
42
43<script type="text/javascript">
44    gallery();
45
46    function gallery() {
47        $(document).ready(function() {
48
49            $('.gallery_demo_unstyled').addClass('gallery_demo'); // adds new class name to maintain degradability
50            $('.gallery_nav').css('display', 'none'); // hides the nav initially
51
52            $('ul.gallery_demo').galleria({
53                history: true, // activates the history object for bookmarking, back-button etc.
54                clickNext: true, // helper for making the image clickable
55                insert: '#main_image', // the containing selector for our main image
56                onImage: function(image, caption, thumb) { // let's add some image effects for demonstration purposes
57
58                    // fade in the image & caption
59                    image.css('display', 'none').fadeIn(1000);
60                    caption.css('display', 'none').fadeIn(1000);
61
62                    // fetch the thumbnail container
63                    var _li = thumb.parents('li');
64
65                    // fade out inactive thumbnail
66                    _li.siblings().children('img.selected').fadeTo(500, 0.3);
67
68                    // fade in active thumbnail
69                    thumb.fadeTo('fast', 1).addClass('selected');
70
71                    // add a title for the clickable image
72                    image.attr('title', 'Next image >>');
73                },
74                onThumb: function(thumb) { // thumbnail effects goes here
75
76                    // fetch the thumbnail container
77                    var _li = thumb.parents('li');
78
79                    // if thumbnail is active, fade all the way.
80                    var _fadeTo = _li.is('.active') ? '1' : '0.3';
81
82                    // fade in the thumbnail when finnished loading
83                    thumb.css({ display: 'none', opacity: _fadeTo }).fadeIn(1500);
84
85                    // hover effects
86                    thumb.hover(
87				function() { thumb.fadeTo('fast', 1); },
88				function() { _li.not('.active').children('img').fadeTo('fast', 0.3); } // don't fade out if the parent is active
89			)
90                }
91            });
92
93        });
94    }
95</script>