https://www.qis.net/modules/mod_artwijmobluemenu/mod_artwijmobluem…/stuff/wijmo/jquery.wijmo.wijsuperpanel.js

1/*globals window document jQuery */
2
3/*
4
5 *
6
7 * Wijmo Library 1.0.0
8
9 * http://wijmo.com/
10
11 *
12
13 * Copyright(c) ComponentOne, LLC.  All rights reserved.
14
15 * 
16
17 * Dual licensed under the MIT or GPL Version 2 licenses.
18
19 * [email protected]
20
21 * http://www.wijmo.com/license
22
23 *
24
25 * * Wijmo SuperPanel widget.
26
27 * 
28
29 * Depends:
30
31 *	jquery.ui.core.js
32
33 *	jquery.ui.widget.js
34
35 *	jquery.ui.resizable.js
36
37 *	jquery.ui.draggable.js
38
39 *	jquery.effects.core.js
40
41 *	jquery.mousewheel.js
42
43 *
44
45 */
46
47"use strict";
48
49(function ($) {
50
51	var uiSuperPanelClasses = "wijmo-wijsuperpanel " + "ui-widget " + "ui-widget-content",
52
53		rounderClass = "ui-corner-all",
54
55		uiStateDisabled = "ui-state-disabled",
56
57		uiStateHover = "ui-state-hover",
58
59		uiStateActive = "ui-state-active",
60
61		uiStateDefault = "ui-state-default",
62
63		scrollerHandle = "wijmo-wijsuperpanel-handle",
64
65		hbarContainerCSS = "wijmo-wijsuperpanel-hbarcontainer",
66
67		vbarContainerCSS = "wijmo-wijsuperpanel-vbarcontainer",
68
69		innerElementHtml =
70
71				"<div class='wijmo-wijsuperpanel-statecontainer'>" +
72
73				"<div class='wijmo-wijsuperpanel-contentwrapper'>" +
74
75				"<div class='wijmo-wijsuperpanel-templateouterwrapper'></div>" +
76
77				"</div>" +
78
79				"</div>",
80
81		hbarHtml = "<div class='wijmo-wijsuperpanel-hbarcontainer ui-widget-header'>" +
82
83				"<div class='wijmo-wijsuperpanel-handle ui-state-default ui-corner-" +
84
85				"all'><span class='ui-icon ui-icon-grip-solid-vertical'></span></div>" +
86
87				"<div class='wijmo-wijsuperpanel-hbar-buttonleft ui-state-default " +
88
89				"ui-corner-bl'><span class='ui-icon ui-icon-triangle-1-w'></span></div>" +
90
91				"<div class='wijmo-wijsuperpanel-hbar-buttonright ui-state-default " +
92
93				"ui-corner-br'><span class='ui-icon ui-icon-triangle-1-e'></span></div>" +
94
95				"</div>",
96
97		vbarHtml = "<div class='wijmo-wijsuperpanel-vbarcontainer ui-widget-header'>" +
98
99				"<div class='wijmo-wijsuperpanel-handle ui-state-default ui-corner-all'" +
100
101				"><span class='ui-icon ui-icon-grip-solid-horizontal'></span></div>" +
102
103				"<div class='wijmo-wijsuperpanel-vbar-buttontop ui-state-default " +
104
105				"ui-corner-tr'><span class='ui-icon ui-icon-triangle-1-n'></span></div>" +
106
107				"<div class='wijmo-wijsuperpanel-vbar-buttonbottom ui-state-default " +
108
109				"ui-corner-br'><span class='ui-icon ui-icon-triangle-1-s'></span></div>" +
110
111				"</div>",
112
113		hButtons = "<div class='ui-state-default wijmo-wijsuperpanel-button " +
114
115				"wijmo-wijsuperpanel-buttonleft'><span class='ui-icon " +
116
117				"ui-icon-carat-1-w'></span></div><div class='ui-state-default" +
118
119				" wijmo-wijsuperpanel-button wijmo-wijsuperpanel-buttonright'>" +
120
121				"<span class='ui-icon ui-icon-carat-1-e'></span></div>",
122
123		vButtons = "<div class='ui-state-default wijmo-wijsuperpanel-button" +
124
125		" wijmo-wijsuperpanel-buttontop'><span class='ui-icon ui-icon-carat-1-n'>" +
126
127				"</span></div><div class='ui-state-default wijmo-wijsuperpanel-button" +
128
129				" wijmo-wijsuperpanel-buttonbottom'><span class='ui-icon" +
130
131				" ui-icon-carat-1-s'></span></div>";
132
133
134
135	$.widget("wijmo.wijsuperpanel", {
136
137		options: {
138
139			/// <summary>
140
141			/// This value determines whether the wijsuperpanel can be resized. 
142
143			/// Default: false.
144
145			/// Type: Boolean.
146
147			/// </summary>
148
149			allowResize: false,
150
151			/// <summary>
152
153			/// This value determines whether wijsuperpanel to automatically refresh 
154
155			/// when content size or wijsuperpanel size are changed.
156
157			/// Default: false.
158
159			/// Type: Boolean.
160
161			/// </summary>
162
163			autoRefresh: false,
164
165			/// <summary>
166
167			/// The animation properties of wijsuperpanel scrolling.
168
169			/// Type: Object.
170
171			/// </summary>
172
173			/// <remarks>
174
175			/// Set this options to null to disable animation.
176
177			/// </remarks>
178
179			animationOptions: {
180
181				/// <summary>
182
183				/// This value determines whether to queue animation operations.
184
185				/// Default: false.
186
187				/// Type: Boolean.
188
189				/// </summary>
190
191				queue: false,
192
193				/// <summary>
194
195				/// This value sets the animation duration of the scrolling animation.
196
197				/// Default: 250.
198
199				/// Type: Number.
200
201				/// </summary>
202
203				duration: 250,
204
205				/// <summary>
206
207				/// This value sets the animation easing of the scrolling animation.
208
209				/// Default: undefined.
210
211				/// Type: string.
212
213				/// </summary>
214
215				easing: undefined
216
217			},
218
219
220
221			/// <summary>
222
223			/// This function gets called when thumb buttons of scrollbars dragging stops.
224
225			/// Default: null.
226
227			/// Type: Function.
228
229			/// </summary>
230
231			dragstop: null,
232
233			/// <summary>
234
235			/// This function gets called after panel is painted.
236
237			/// Default: null.
238
239			/// Type: Function.
240
241			/// </summary>
242
243			painted: null,
244
245			/// <summary>
246
247			/// This option contains horizontal scroller settings.
248
249			/// </summary>
250
251			hScroller: {
252
253				/// <summary>
254
255				/// This value determines the position of the horizontal scroll bar. 
256
257				/// Default: "bottom".
258
259				/// Type: String.
260
261				/// </summary>
262
263				/// <remarks>
264
265				/// Possible options are "bottom" and "top".
266
267				/// "bottom" - The horizontal scroll bar is placed at the bottom of 
268
269				/// the content area.
270
271				/// "top" - The horizontal scroll bar is placed at the top of the 
272
273				///content area.
274
275				/// </remarks>
276
277				scrollBarPosition: "bottom",
278
279				/// <summary>
280
281				/// This value determines the visibility of the horizontal scroll bar.
282
283				/// Default: "auto".
284
285				/// Type: String
286
287				/// </summary>
288
289				/// <remarks>
290
291				/// Possible options are "auto", "visible" and "hidden".
292
293				/// "auto" - Shows the scroll when needed.
294
295				/// "visible" - Scroll bar will always be visible. It"s disabled 
296
297				/// when not needed.
298
299				/// "hidden" - Scroll bar will be hidden.
300
301				/// </remarks>
302
303				scrollBarVisibility: "auto",
304
305				/// <summary>
306
307				/// This value determines the scroll mode of horizontal scrolling. 
308
309				/// Default: "scrollbar".
310
311				/// Type: String.
312
313				/// </summary>
314
315				/// <remarks>
316
317				/// Possible options are "scrollbar", "buttons", "buttonshover" 
318
319				/// and "edge".
320
321				/// "scrollbar" - Scroll bars are used for scrolling.
322
323				/// "buttons" - Scroll buttons are used for scrolling. 
324
325				/// Scrolling occurs only when scroll buttons are clicked.
326
327				/// "buttonshover" - Scroll buttons are used for scrolling. 
328
329				/// Scrolling occurs only when scroll buttons are hovered.
330
331				/// "edge" - Scrolling occurs when the mouse is moving to the edge
332
333				/// of the content area.
334
335				/// Scroll modes can be combined with each other. 
336
337				/// For example, scrollMode: "scrollbar,scrollbuttons" will enable 
338
339				/// both a scrollbar and scroll buttons.
340
341				/// </remarks>
342
343				scrollMode: "scrollbar",
344
345				/// <summary>
346
347				/// This value determines the horizontal scrolling position of
348
349				/// wijsuperpanel.
350
351				/// Default: null.
352
353				/// Type: Number.
354
355				/// </summary>
356
357				scrollValue: null,
358
359				/// <summary>
360
361				/// This value sets the maximum value of horizontal scroller.
362
363				/// Default: 100.
364
365				/// Type: Number.
366
367				/// </summary>
368
369				scrollMax: 100,
370
371				/// <summary>
372
373				/// This value sets the minimum value of horizontal scroller.
374
375				/// Default: 0.
376
377				/// Type: Number.
378
379				/// </summary>
380
381				scrollMin: 0,
382
383				/// <summary>
384
385				/// This value sets the large change value of horizontal scroller.
386
387				/// Default: null.
388
389				/// Type: Number.
390
391				/// </summary>
392
393				/// <remarks>
394
395				/// wijsuperpanel will scroll a large change when a user clicks on the 
396
397				/// tracks of scroll bars or presses left or right arrow keys on the 
398
399				/// keyboard with the shift key down.
400
401				/// When scrollLargeChange is null, wijsuperpanel will scroll 
402
403				/// the width of content.
404
405				/// </remarks>
406
407				scrollLargeChange: null,
408
409				/// <summary>
410
411				/// This value sets the small change value of horizontal scroller.
412
413				/// Default: null. 
414
415				/// Type: Number.
416
417				/// </summary>
418
419				/// <remarks>
420
421				/// wijsuperpanel will scroll a small change when a user clicks on 
422
423				/// the arrows of scroll bars, clicks or hovers scroll buttons, 
424
425				/// presses left or right arrow keys on keyboard, 
426
427				/// and hovers on the edge of wijsuperpanel.
428
429				/// When scrollSmallChange is null, wijsuperpanel will scroll half of 
430
431				/// the width of content.
432
433				/// </remarks>
434
435				scrollSmallChange: null,
436
437				/// <summary>
438
439				/// This value sets the minimum length, in pixel, of the horizontal 
440
441				/// scroll bar thumb button.
442
443				/// Default: 6.
444
445				/// Type: Number.
446
447				/// </summary>
448
449				scrollMinDragLength: 6,
450
451				/// <summary>
452
453				/// This object determines the increase button position. 
454
455				/// Default: null.
456
457				/// Type: Object.
458
459				/// </summary>
460
461				/// <remarks>
462
463				/// Please look at the options for jquery.ui.position.js for more info.
464
465				/// </remarks>
466
467				increaseButtonPosition: null,
468
469				/// <summary>
470
471				/// This object determines the decrease button position.
472
473				/// Default: 0.
474
475				/// Type: Object.
476
477				/// </summary>
478
479				decreaseButtonPosition: null,
480
481				/// <summary>
482
483				/// This value sets the width of horizontal hovering edge 
484
485				/// which will trigger the horizontal scrolling.
486
487				/// Default: 20.
488
489				/// Type: Number.
490
491				/// </summary>
492
493				hoverEdgeSpan: 20,
494
495				/// <summary>
496
497				/// The number specifies the value to add to smallchange or large

497change
498
499				/// when scrolling the first step(scrolling from scrollMin).
500
501				/// Default: 0.
502
503				/// Type: Number.
504
505				/// </summary>
506
507				firstStepChangeFix: 0
508
509
510
511			},
512
513			/// <summary>
514
515			/// A value determins whether wijsuperpanel provides 
516
517			/// keyboard scrolling support.
518
519			/// Default: false.
520
521			/// Type: Boolean.
522
523			/// </summary>
524
525			keyboardSupport: false,
526
527			/// <summary>
528
529			/// This value determines the time interval to call the scrolling
530
531			/// function when doing continuous scrolling.
532
533			/// Default: 100.
534
535			/// Type: Number.
536
537			/// </summary>
538
539			keyDownInterval: 100,
540
541			/// <summary>
542
543			/// This value determines whether wijsuperpanel has mouse wheel support.
544
545			/// Default: true.
546
547			/// Type: Boolean.
548
549			/// </summary>
550
551			/// <remarks>
552
553			/// Mouse wheel plugin is needed to support this feature.
554
555			/// </remarks>
556
557			mouseWheelSupport: true,
558
559			/// <summary>
560
561			/// This value determines whether to fire the mouse wheel event 
562
563			/// when wijsuperpanel is scrolled to the end.
564
565			/// Default: true.
566
567			/// Type: Boolean.
568
569			/// </summary>
570
571			bubbleScrollingEvent: true,
572
573			/// <summary>
574
575			/// Resized event handler. A function gets called when resized event is fired.
576
577			/// Default: null.
578
579			/// Type: Function.
580
581			/// </summary>
582
583			resized: null,
584
585			/// <summary>
586
587			/// This option determines the behavior of resizable widget. 
588
589			/// See JQuery UI resizable options document.
590
591			/// Type: Object.
592
593			/// </summary>
594
595			resizableOptions: {
596
597				handles: "all",
598
599				helper: "ui-widget-content wijmo-wijsuperpanel-helper"
600
601			},
602
603			/// <summary>
604
605			/// Scrolling event handler. A function called before scrolling occurs.
606
607			/// Default: null.
608
609			/// Type: Function.
610
611			/// </summary>
612
613			/// <param name="e" type="EventObj">
614
615			/// EventObj relates to this event.
616
617			/// </param>
618
619			/// <param name="data" type="Object">
620
621			/// The data with this event.
622
623			/// data.oldValue: The scrollValue before scrolling occurs.
624
625			/// data.newValue: The scrollValue after scrolling occurs.
626
627			/// data.dir: The direction of the scrolling action. 
628
629			/// Possible values: "v"(vertical) and "h"(horizontal).
630
631			/// data.beforePosition: The position of content before scrolling occurs.
632
633			/// </param>
634
635			scrolling: null,
636
637			/// <summary>
638
639			/// Scrolled event handler.  A function called after scrolling occurs.
640
641			/// Default: null.
642
643			/// Type: Function.
644
645			/// </summary>
646
647			/// <param name="e" type="EventObj">
648
649			/// EventObj relates to this event.
650
651			/// </param>
652
653			/// <param name="data" type="Object">
654
655			/// The data with this event.
656
657			/// data.dir: The direction of the scrolling action. 
658
659			/// Possible values: "v"(vertical) and "h"(horizontal).
660
661			/// data.beforePosition: The position of content before scrolling occurs.
662
663			/// data.afterPosition: The position of content after scrolling occurs.
664
665			/// </param>
666
667			scrolled: null,
668
669			/// <summary>
670
671			/// This value determines whether to show the rounded corner of wijsuperpanel.
672
673			/// Default: true.
674
675			/// Type: Boolean.
676
677			/// </summary>
678
679			showRounder: true,
680
681			/// <summary>
682
683			/// This option contains vertical scroller settings.
684
685			/// </summary>
686
687			vScroller: {
688
689				/// <summary>
690
691				/// This value determines the position of vertical scroll bar. 
692
693				/// Default: "right".
694
695				/// Type: String.
696
697				/// </summary>
698
699				/// <remarks>
700
701				/// Possible options are: "left", "right".
702
703				/// "left" - The vertical scroll bar is placed at the 
704
705				/// left side of the content area.
706
707				/// "right" - The vertical scroll bar is placed at the 
708
709				/// right side of the content area.
710
711				/// </remarks>
712
713				scrollBarPosition: "right",
714
715				/// <summary>
716
717				/// This value determines the visibility of the vertical scroll bar.
718
719				/// Default.: "auto". 
720
721				/// Type: String.
722
723				/// </summary>
724
725				/// <remarks>
726
727				/// Possible options are "auto", "visible" and "hidden".
728
729				/// "auto" - Shows the scroll bar when needed.
730
731				/// "visible" - Scroll bar will always be visible. 
732

733				/// It"s disabled when not needed.
734
735				/// "hidden" - Scroll bar will be shown.
736
737				/// </remarks>
738
739				scrollBarVisibility: "auto",
740
741				/// <summary>
742
743				/// This value determines the scroll mode of vertical scrolling. 
744
745				/// Default: "scrollbar".
746
747				/// Type: String.
748
749				/// </summary>
750
751				/// <remarks>
752
753				/// Possible options are: "scrollbar", "buttons", 
754
755				/// "buttonshover" and "edge".
756
757				/// "scrollbar" - Scroll bars are used for scrolling.
758
759				/// "buttons" - Scroll buttons are used for scrolling. 
760
761				/// Scrolling occurs only when scroll buttons are clicked.
762
763				/// "buttonshover" - Scroll buttons are used for scrolling. 
764
765				/// Scrolling occurs only when scroll buttons are hovered.
766
767				/// "edge" - Scrolling occurs when the mouse is moving to 
768
769				/// the edge of the content area.
770
771				/// Scroll modes can be combined with each other. 
772
773				/// For example, vScrollMode: "scrollbar,scrollbuttons" will enable 
774
775				/// both a scrollbar and scroll buttons.
776
777				/// </remarks>
778
779				scrollMode: "scrollbar",
780
781				/// <summary>
782
783				/// This value determines the vertical scrolling position of
784
785				/// wijsuperpanel.
786
787				/// Default: null.
788
789				/// Type: Number.
790
791				/// </summary>
792
793				scrollValue: null,
794
795				/// <summary>
796
797				/// This value sets the maximum value of vertical scroller.
798
799				/// Default: 100.
800
801				/// Type: Number.
802
803				/// </summary>
804
805				scrollMax: 100,
806
807				/// <summary>
808
809				/// This value sets the minimum value of vertical scroller.
810
811				/// Default: 0.
812
813				/// Type: Number.
814
815				/// </summary>
816
817				scrollMin: 0,
818
819				/// <summary>
820
821				/// This value sets the large change value of vertical scroller. 
822
823				/// Default: null.
824
825				/// Type: Number.
826
827				/// </summary>
828
829				/// <remarks>
830
831				/// wijsuperpanel will scroll a large change when a user clicks 
832
833				/// on the tracks of scroll bars or presses left or right arrow keys 
834
835				/// on the keyboard with the shift key down.
836
837				/// When scrollLargeChange is null, wijsuperpanel 
838
839				/// will scroll the height of content.
840
841				/// </remarks>
842
843				scrollLargeChange: null,
844
845				/// <summary>
846
847				/// This value sets the small change value of vertical scroller. 
848
849				/// Default: null.
850
851				/// Type: Number.
852
853				/// </summary>
854
855				/// <remarks>
856
857				/// wijsuperpanel will scroll a small change when a user clicks on the 
858
859				/// arrows of scroll bars, clicks or hovers scroll buttons, presses left
860
861				/// or right arrow keys on keyboard, and hovers on the edge of 
862
863				/// wijsuperpanel.
864
865				/// When scrollSmallChange is null, wijsuperpanel will scroll half of 
866
867				/// the height of content.
868
869				/// </remarks>
870
871				scrollSmallChange: null,
872
873				/// <summary>
874
875				/// This value sets the minimum length, in pixel, of the vertical 
876
877				/// scroll bar thumb button.
878
879				/// Default: 6.
880
881				/// Type: Number
882
883				/// </summary>
884
885				scrollMinDragLength: 6,
886
887				/// <summary>
888
889				/// This object determines the increase button position. 
890
891				/// Default: null.
892
893				/// Type: Object.
894
895				/// </summary>
896
897				/// <remarks>
898
899				/// Please look at the options for jquery.ui.position.js for more info.
900
901				/// </remarks>
902
903				increaseButtonPosition: null,
904
905				/// <summary>
906
907				/// This object determines the decrease button position.
908
909				/// Default: 0.
910
911				/// Type: Object.
912
913				/// </summary>
914
915				/// <remarks>
916
917				/// Please look at the options for jquery.ui.position.js for more info.
918
919				/// </remarks>
920
921				decreaseButtonPosition: null,
922
923				/// <summary>
924
925				/// This value sets the width of horizontal hovering edge 
926
927				/// which will trigger the vertical scrolling.
928
929				/// Default: 20.
930
931				/// Type: Number.
932
933				/// </summary>
934
935				hoverEdgeSpan: 20,
936
937				/// <summary>
938
939				/// The value to add to small change or largechange when scrolling 
940
941				/// the first step(scrolling from value 0).
942
943				/// Default: 0.
944
945				/// Type: Number.
946
947				/// </summary>
948

949				firstStepChangeFix: 0
950
951			}
952
953		},
954
955
956
957		_setOption: function (key, value) {
958
959
960
961			var self = this,
962
963			o = self.options,
964
965			f = self._fields(),
966
967			hd = f.hbarDrag,
968
969			vd = f.vbarDrag,
970
971			r = f.resizer;
972
973
974
975			// override existing 
976
977			if (key === "animationOptions") {
978
979				value = $.extend(o.animationOptions, value);
980
981			}
982
983			else if (key === "hScroller") {
984
985				if (value.scrollLargeChange !== undefined && 
986
987				value.scrollLargeChange !== null) {
988
989					self._autoHLarge = false;
990
991				}
992
993				value = $.extend(o.hScroller, value);
994
995			}
996
997			else if (key === "vScroller") {
998
999				if (value.scrollLargeChange !== undefined && 
1000
1001				value.scrollLargeChange !== null) {
1002
1003					self._autoVLarge = false;
1004
1005				}
1006
1007				value = $.extend(o.vScroller, value);
1008
1009			}
1010
1011			else if (key === "resizableOptions") {
1012
1013				value = $.extend(self.resizableOptions, value);
1014
1015			}
1016
1017			$.Widget.prototype._setOption.apply(self, arguments);
1018
1019			switch (key) {
1020
1021			case "allowResize":
1022
1023				self._initResizer();
1024
1025				break;
1026
1027			case "disabled":
1028
1029				if (value) {
1030
1031					if (hd !== undefined) {
1032
1033						hd.draggable("disable");
1034
1035					}
1036
1037					if (vd !== undefined) {
1038
1039						vd.draggable("disable");
1040
1041					}
1042
1043					if (r !== undefined) {
1044
1045						r.resizable("disable");
1046
1047					}
1048
1049				}
1050
1051				else {
1052
1053					if (hd !== undefined) {
1054
1055						hd.draggable("enable");
1056
1057					}
1058
1059					if (vd !== undefined) {
1060
1061						vd.draggable("enable");
1062
1063					}
1064
1065					if (r !== undefined) {
1066
1067						r.resizable("enable");
1068
1069					}
1070
1071				}
1072
1073				break;
1074
1075			case "mouseWheelSupport":
1076
1077			case "keyboardSupport":
1078
1079				self._bindElementEvents(self, f, self.element, o);
1080
1081				break;
1082
1083			}
1084
1085			return self;
1086
1087		},
1088
1089
1090
1091		_create: function () {
1092
1093			var self = this, o = self.options;
1094
1095			o.vScroller.dir = "v";
1096
1097			o.hScroller.dir = "h";
1098
1099			self.paintPanel();
1100
1101			self._initResizer();
1102
1103			if (self.options.disabled) {
1104
1105				self.disable();
1106
1107			}
1108
1109			self._detectAutoRefresh();
1110
1111		},
1112
1113
1114
1115		_detectAutoRefresh: function () {
1116
1117			// register with auto fresh.
1118
1119			var self = this, panels = $.wijmo.wijsuperpanel.panels;
1120
1121			if (panels === undefined) {
1122
1123				panels = [];
1124
1125				$.wijmo.wijsuperpanel.panels = panels;
1126
1127			}
1128
1129			panels.push(self);
1130
1131			// start timer to monitor content.
1132
1133			if (self.options.autoRefresh) {
1134
1135				if (!$.wijmo.wijsuperpanel.setAutoRefreshInterval) {
1136
1137					$.wijmo.wijsuperpanel.setAutoRefreshInterval = 
1138
1139					self._setAutoRefreshInterval;
1140
1141					$.wijmo.wijsuperpanel.setAutoRefreshInterval();
1142
1143				}
1144
1145			}
1146
1147		},
1148
1149
1150
1151		_setAutoRefreshInterval: function () {
1152
1153			var interval = $.wijmo.wijsuperpanel.autoRereshInterval,
1154
1155			panels = $.wijmo.wijsuperpanel.panels,
1156
1157			intervalID = window.setInterval(function () {
1158
1159				window.clearInterval(intervalID);
1160
1161				var count = panels.length, toContinue = false, i, panel,
1162
1163				mainElement, autoRefresh, ele, mark;
1164
1165				for (i = 0; i < count; i++) {
1166
1167					panel = panels[i];
1168
1169					mainElement = panel.element[0];
1170
1171					autoRefresh = panel.options.autoRefresh;
1172
1173					if (autoRefresh) {
1174
1175						toContinue = true;
1176
1177					}
1178
1179					ele = panel.getContentElement();
1180
1181					mark = panel._paintedMark;
1182
1183					if (panel.options.autoRefresh && ele.is(":visible") &&
1184
1185					(mark === undefined ||
1186
1187					mark.width !== ele[0].offsetWidth || 
1188
1189					mark.height !== ele[0].offsetHeight ||
1190
1191					mark.mainWidth !== mainElement.offsetWidth || 
1192
1193					mark.mainHeight !== mainElement.offsetHeight)) {
1194
1195						panel.paintPanel();
1196
1197					}
1198
1199				}
1200
1201				if (toContinue) {
1202
1203					window.setTimeout($.wijmo.wijsuperpanel.setAutoRefreshInterval, 0);
1204
1205				}
1206
1207			}, interval === undefined ? 500 : interval);
1208
1209		},
1210
1211
1212
1213		destroy: function () {
1214
1215			/// <summary>
1216
1217			/// Destroys wijsuperpanel widget and reset the DOM element.
1218
1219			/// </summary>
1220
1221
1222
1223			var self = this, f = self._fields(), ele = self.element, 
1224
1225			buttons, templateWrapper;
1226
1227			// remove this widget from panels array.
1228
1229			$.wijmo.wijsuperpanel.panels = 
1230
1231			$.grep($.wijmo.wijsuperpanel.panels, function (value) {
1232
1233				return value !== self;
1234
1235			});
1236
1237			if (!f.initialized) {
1238
1239				return;
1240
1241			}
1242
1243			if (self._radiusKey) {
1244
1245				self.element.css(self._radiusKey, "");
1246
1247			}
1248
1249			if (f.intervalID !== undefined) {
1250
1251				window.clearInterval(f.intervalID);
1252
1253				f.intervalID = undefined;
1254
1255			}
1256
1257			// destory widgets
1258
1259			if (f.resizer !== undefined) {
1260
1261				f.resizer.resizable("destroy");
1262
1263			}
1264
1265			if (f.hbarContainer !== undefined) {
1266
1267				f.hbarDrag.remove();
1268
1269				f.hbarContainer.unbind("." + self.widgetName);
1270
1271			}
1272
1273			if (f.vbarContainer !== undefined) {
1274
1275				f.vbarDrag.remove();
1276
1277				f.vbarContainer.unbind("." + self.widgetName);
1278
1279			}
1280
1281			ele.unbind("." + self.widgetName);
1282
1283			f.contentWrapper.unbind("." + self.widgetName);
1284
1285			buttons = f.stateContainer.find(">.wijmo-wijsuperpanel-button");
1286
1287			buttons.unbind("." + self.widgetName);
1288
1289			templateWrapper = f.templateWrapper;
1290
1291			templateWrapper.contents().each(function (index, e) {
1292
1293				ele.append(e);
1294
1295			});
1296
1297			f.stateContainer.remove();
1298
1299			if (f.tabindex) {
1300
1301				ele.removeAttr("tabindex");
1302
1303			}
1304
1305			ele.removeClass(uiSuperPanelClasses + " " + rounderClass);
1306
1307			$.Widget.prototype.destroy.apply(self, arguments);
1308
1309		},
1310
1311
1312
1313		_fields: function () {
1314
1315			var self = this, ele = self.element, key = self.widgetName + "-fields",
1316
1317			d = self._fieldsStore;
1318
1319			if (d === undefined) {
1320
1321				d = {};
1322
1323				ele.data(key, d);
1324
1325				self._fieldsStore = d;
1326
1327			}
1328
1329			return d;
1330
1331		},
1332
1333
1334
1335		_hasMode: function (scroller, mode) {
1336
1337			var modes = scroller.scrollMode.split(",");
1338
1339			return $.inArray(mode, modes) > -1;
1340
1341		},
1342
1343
1344
1345		_bindElementEvents: function (self, f, ele, o) {
1346
1347			// mouse move only edge mode is used.
1348
1349			var hEdge = self._hasMode(o.hScroller, "edge"),
1350
1351			vEdge = self._hasMode(o.vScroller, "edge"),
1352
1353			wn = self.widgetName;
1354
1355
1356
1357			if (hEdge || vEdge) {
1358

1359				if (self._mousemoveBind === undefined) {
1360
1361					self._mousemoveBind = true;
1362
1363					ele.bind("mousemove." + wn, self, self._contentMouseMove);
1364
1365					ele.bind("mouseleave." + wn, null, function () {
1366
1367						self._clearInterval();
1368
1369					});
1370
1371				}
1372
1373			}
1374
1375			else {
1376
1377				ele.unbind("mousemove", self._contentMouseMove);
1378
1379				self._mousemoveBind = undefined;
1380
1381			}
1382
1383			if (o.mouseWheelSupport) {
1384
1385				if (self._mouseWheelBind === undefined) {
1386
1387					self._mouseWheelBind = true;
1388
1389					ele.bind("mousewheel." + wn, self, self._panelMouseWheel);
1390
1391				}
1392
1393			}
1394
1395			else {
1396
1397				self.element.unbind("mousewheel", self._panelMouseWheel);
1398
1399				self._mouseWheelBind = undefined;
1400
1401			}
1402
1403			if (o.keyboardSupport) {
1404
1405				if (self._keyboardBind === undefined) {
1406
1407					self._keyboardBind = true;
1408
1409					ele.bind("keydown." + wn, self, self._panelKeyDown);
1410
1411				}
1412
1413			}
1414
1415			else {
1416
1417				ele.unbind("keydown", self._panelKeyDown);
1418
1419				self._keyboardBind = undefined;
1420
1421			}
1422
1423		},
1424
1425
1426
1427		_dragStop: function (e, self, dir) {
1428
1429			// Handles mouse drag stop event of thumb button.
1430
1431
1432
1433			var data = {
1434
1435				dragHandle: dir
1436
1437			};
1438
1439			self._trigger("dragstop", e, data);
1440
1441		},
1442
1443
1444
1445		_contentMouseMove: function (e) {
1446
1447			// Handles mouse move event of content area.
1448
1449			// Edge hover scrolling is handled in this method.
1450
1451
1452
1453			var self = e.data, o = self.options, hScroller, vScroller, 
1454
1455			contentWrapper, f, hMode, vMode, mousePagePosition, off, left, top,
1456
1457			hEdge, vEdge, innerHeight, innerWidth, dir;
1458
1459			if (o.disabled) {
1460
1461				return;
1462
1463			}
1464
1465			hScroller = o.hScroller;
1466
1467			vScroller = o.vScroller;
1468
1469			contentWrapper = $(e.currentTarget);
1470
1471			f = self._fields();
1472
1473			hMode = self._hasMode(hScroller, "edge");
1474
1475			vMode = self._hasMode(vScroller, "edge");
1476
1477			self._clearInterval();
1478
1479			mousePagePosition = {
1480
1481				X: e.pageX,
1482
1483				Y: e.pageY
1484
1485			};
1486
1487			off = contentWrapper.offset();
1488
1489			left = off.left;
1490
1491			top = off.top;
1492
1493			left = mousePagePosition.X - left;
1494
1495			top = mousePagePosition.Y - top;
1496
1497			hEdge = hScroller.hoverEdgeSpan;
1498
1499			vEdge = vScroller.hoverEdgeSpan;
1500
1501			innerHeight = contentWrapper.innerHeight();
1502
1503			innerWidth = contentWrapper.innerWidth();
1504
1505			dir = "";
1506
1507			if (hMode) {
1508
1509				if (left < hEdge) {
1510
1511					dir = "left";
1512
1513				}
1514
1515				if (left > (innerWidth - hEdge)) {
1516
1517					dir = "right";
1518
1519				}
1520
1521			}
1522
1523			if (vMode) {
1524
1525				if (top < vEdge) {
1526
1527					dir = "top";
1528
1529				}
1530
1531				if (top > (innerHeight - vEdge)) {
1532
1533					dir = "bottom";
1534
1535				}
1536
1537			}
1538
1539			self._setScrollingInterval(f, dir, self, false);
1540
1541		},
1542
1543
1544
1545		_setScrollingInterval: function (f, dir, self, large) {
1546
1547			var o = self.options;
1548
1549			if (dir.length > 0) {
1550
1551				f.internalFuncID = window.setInterval(function () {
1552
1553					self._doScrolling(dir, self, large);
1554
1555				}, o.keyDownInterval);
1556
1557			}
1558
1559		},
1560
1561
1562
1563		_scrollButtonMouseOver: function (e) {
1564
1565			// Scroll buttons mouse over event handler.
1566
1567
1568
1569			var self = e.data, button;
1570
1571			if (self.options.disabled) {
1572
1573				return;
1574
1575			}
1576
1577			button = $(e.currentTarget);
1578
1579			if (!button.hasClass(uiStateDisabled)) {
1580
1581				button.bind("mouseout." + self.widgetName, self, self._buttonMouseOut)
1582
1583				.bind("mousedown." + self.widgetName, self, self._buttonMouseDown)
1584
1585				.bind("mouseup." + self.widgetName, self, self._buttonMouseUp)
1586
1587				.addClass(uiStateHover);
1588
1589				self._buttonScroll(button, self, "buttonshover");
1590
1591			}
1592
1593		},
1594
1595
1596
1597		_buttonScroll: function (button, self, mode) {
1598
1599			// Do button scroll.
1600
1601
1602
1603			var dir = "", o = self.options,
1604
1605			f = self._fields(),
1606
1607			hMode = self._hasMode(o.hScroller, mode),
1608
1609			vMode = self._hasMode(o.vScroller, mode);
1610
1611
1612
1613			if (button.hasClass("wijmo-wijsuperpanel-buttonleft") && hMode) {
1614
1615				dir = "left";
1616
1617			}
1618
1619			else if (button.hasClass("wijmo-wijsuperpanel-buttonright") && hMode) {
1620
1621				dir = "right";
1622
1623			}
1624
1625			else if (button.hasClass("wijmo-wijsuperpanel-buttontop") && vMode) {
1626
1627				dir = "top";
1628
1629			}
1630
1631			else if (button.hasClass("wijmo-wijsuperpanel-buttonbottom") && vMode) {
1632
1633				dir = "bottom";
1634
1635			}
1636
1637			if (dir.length > 0) {
1638
1639				self._clearInterval();
1640
1641				self._doScrolling(dir, self, true);
1642
1643				self._setScrollingInterval(f, dir, self, true);
1644
1645			}
1646
1647		},
1648
1649
1650
1651		_buttonMouseDown: function (e) {
1652
1653			var self = e.data, button;
1654
1655			if (self.options.disabled) {
1656
1657				return;
1658
1659			}
1660
1661			button = $(e.currentTarget);
1662
1663			if (!button.hasClass(uiStateDisabled)) {
1664
1665				button.addClass(uiStateActive);
1666
1667				self._buttonScroll(button, self, "buttons");
1668
1669			}
1670
1671		},
1672
1673
1674
1675		_buttonMouseUp: function (e) {
1676
1677			var self = e.data, button = $(e.currentTarget);
1678
1679			button.removeClass("ui-state-active");
1680
1681			self._clearInterval();
1682
1683		},
1684
1685
1686
1687		_buttonMouseOut: function (e) {
1688
1689			var self = e.data, button = $(e.currentTarget);
1690
1691			button.unbind("mouseout", self._buttonMouseOut)
1692
1693			.unbind("mousedown", self._buttonMouseDown)
1694
1695			.unbind("mouseup", self._buttonMouseUp)
1696
1697			.removeClass(uiStateHover)
1698
1699			.removeClass(uiStateActive);
1700
1701			self._clearInterval();
1702
1703		},
1704
1705
1706
1707		_panelKeyDown: function (e) {
1708
1709			// Key down handler.
1710
1711
1712
1713			var self = e.data, o = self.options, shift, keycode;
1714
1715			if (!o.keyboardSupport || o.disabled) {
1716
1717				return;
1718
1719			}
1720
1721			shift = e.shiftKey;
1722
1723			keycode = e.keyCode;
1724
1725			if (keycode === $.ui.keyCode.LEFT) {
1726
1727				self._doScrolling("left", self, shift);
1728
1729			}
1730
1731			else if (keycode === $.ui.keyCode.RIGHT) {
1732
1733				self._doScrolling("right", self, shift);
1734
1735			}
1736
1737			else if (keycode === $.ui.keyCode.UP) {
1738
1739				self._doScrolling("top", self, shift);
1740
1741			}
1742
1743			else if (keycode === $.ui.keyCode.DOWN) {
1744
1745				self._doScrolling("bottom", self, shift);
1746
1747			}
1748
1749			e.stopPropagation();
1750
1751			e.preventDefault();
1752
1753		},
1754
1755
1756
1757		_draggingInternal: function (self, scroller, originalElement) {
1758
1759			var dir = scroller.dir, h = dir === "h",
1760
1761			key = h ? "left" : "top",
1762
1763			left = parseFloat(originalElement[0].style[key].replace("px", "")) - 
1764

1765			self._getScrollContainerPadding(key),
1766
1767			track = self._getTrackLen(dir) - 
1768
1769			originalElement[h ? "outerWidth" : "outerHeight"](),
1770
1771			proportion = left / track,
1772
1773			topValue = (scroller.scrollMax - scroller.scrollLargeChange + 1),
1774
1775			v = proportion * topValue, data;
1776
1777			if (v < scroller.scrollMin) {
1778
1779				v = scroller.scrollMin;
1780
1781			}
1782
1783			if (v > topValue) {
1784
1785				v = topValue;
1786
1787			}
1788
1789			data = {
1790
1791				oldValue: scroller.scrollValue,
1792
1793				newValue: v,
1794
1795				dir: dir
1796
1797			};
1798
1799			if (!self._scrolling(true, self, data)) {
1800
1801				// event is canceled in scrolling.
1802
1803				return;
1804
1805			}
1806
1807			scroller.scrollValue = v;
1808
1809			self._setDragAndContentPosition(true, false, dir, "dragging");
1810
1811		},
1812
1813
1814
1815		_dragging: function (e, self) {
1816
1817			var o = self.options, originalElement = $(e.target),
1818
1819			p = originalElement.parent();
1820
1821			if (p.hasClass(hbarContainerCSS)) {
1822
1823				self._draggingInternal(self, o.hScroller, originalElement);
1824
1825			}
1826
1827			else {
1828
1829				self._draggingInternal(self, o.vScroller, originalElement);
1830
1831			}
1832
1833		},
1834
1835
1836
1837		_panelMouseWheel: function (e, delta) {
1838
1839			var self = e.data, o = self.options, originalElement, dir, onHbar,
1840
1841			hScroller, vScroller, scrollEnd;
1842
1843			if (!o.mouseWheelSupport || o.disabled) {
1844
1845				return;
1846
1847			}
1848
1849			//var f = self._fields();
1850
1851			//var scrollerWrapper = f.stateContainer;
1852
1853			//var hbarContainer = f.hbarContainer;
1854
1855			originalElement = $(e.srcElement || e.originalEvent.target);
1856
1857			dir = "";
1858
1859			onHbar = originalElement.closest("." + hbarContainerCSS, self.element)
1860
1861			.size() > 0;
1862
1863			hScroller = o.hScroller;
1864
1865			vScroller = o.vScroller;
1866
1867			if (delta > 0) {
1868
1869				dir = onHbar ? "left" : "top";
1870
1871			}
1872
1873			else {
1874
1875				dir = onHbar ? "right" : "bottom";
1876
1877			}
1878
1879
1880
1881			if (dir.length > 0) {
1882
1883				self._doScrolling(dir, self);
1884
1885			}
1886
1887			scrollEnd = false;
1888
1889			if (dir === "left") {
1890
1891				scrollEnd = !self.hNeedScrollBar || 
1892
1893				Math.abs(hScroller.scrollValue - hScroller.scrollMin) < 0.001;
1894
1895			}
1896
1897			if (dir === "right") {
1898
1899				scrollEnd = !self.hNeedScrollBar || Math.abs(hScroller.scrollValue - 
1900
1901				(hScroller.scrollMax - self._getHScrollBarLargeChange() + 1)) < 0.001;
1902
1903			}
1904
1905			if (dir === "top") {
1906
1907				scrollEnd = !self.vNeedScrollBar || 
1908
1909				Math.abs(vScroller.scrollValue - vScroller.scrollMin) < 0.001;
1910
1911			}
1912
1913			if (dir === "bottom") {
1914
1915				scrollEnd = !self.vNeedScrollBar || Math.abs(vScroller.scrollValue - 
1916
1917				(vScroller.scrollMax - self._getVScrollBarLargeChange() + 1)) < 0.001;
1918
1919			}
1920
1921			if (!scrollEnd || !o.bubbleScrollingEvent || dir === "left" ||
1922
1923			 dir === "right") {
1924
1925				e.stopPropagation();
1926
1927				e.preventDefault();
1928
1929			}
1930
1931		},
1932
1933
1934
1935		_documentMouseUp: function (e) {
1936
1937			var self = e.data.self, ele = e.data.ele;
1938
1939			ele.removeClass(uiStateActive);
1940
1941			self._clearInterval();
1942
1943			$(document).unbind("mouseup", self._documentMouseUp);
1944
1945		},
1946
1947
1948
1949		_scrollerMouseOver: function (e) {
1950
1951			var self = e.data, originalElement, ele, addhover;
1952
1953			if (self.options.disabled) {
1954
1955				return;
1956
1957			}
1958
1959			originalElement = $(e.srcElement || e.originalEvent.target);
1960
1961			ele = null;
1962
1963			addhover = false;
1964
1965
1966
1967			if (originalElement.hasClass(uiStateDefault)) {
1968
1969				ele = originalElement;
1970
1971				addhover = true;
1972
1973			}
1974
1975			else if (originalElement.parent().hasClass(uiStateDefault)) {
1976
1977				ele = originalElement.parent();
1978
1979				addhover = true;
1980
1981			}
1982
1983			else if (originalElement.hasClass(vbarContainerCSS) || 
1984
1985			originalElement.hasClass(hbarContainerCSS)) {
1986
1987				ele = originalElement;
1988
1989			}
1990
1991
1992
1993			if (ele !== undefined) {
1994
1995				if (addhover) {
1996
1997					ele.addClass(uiStateHover);
1998
1999				}
2000
2001				ele.bind("mouseout." + self.widgetName, self, self._elementMouseOut);
2002
2003				ele.bind("mousedown." + self.widgetName, self, self._elementMouseDown);
2004
2005				ele.bind("mouseup." + self.widgetName, self, self._elementMouseUp);
2006
2007			}
2008
2009		},
2010
2011
2012
2013		_elementMouseUp: function (e) {
2014
2015			var ele = $(e.currentTarget);
2016
2017			//var self = e.data;
2018
2019			ele.removeClass("ui-state-active");
2020
2021		},
2022
2023
2024
2025		_elementMouseDown: function (e) {
2026
2027			var ele = $(e.currentTarget), self = e.data, 
2028
2029			scrollDirection, large, active, hbarDrag, pos, vbarDrag, pos2, f;
2030
2031			if (self.options.disabled) {
2032
2033				return;
2034
2035			}
2036
2037			scrollDirection = "";
2038
2039			large = false;
2040
2041			active = false;
2042
2043			if (ele.hasClass("wijmo-wijsuperpanel-vbar-buttontop")) {
2044
2045				scrollDirection = "top";
2046
2047				active = true;
2048
2049			}
2050
2051			else if (ele.hasClass("wijmo-wijsuperpanel-vbar-buttonbottom")) {
2052
2053				scrollDirection = "bottom";
2054
2055				active = true;
2056
2057			}
2058
2059			else if (ele.hasClass("wijmo-wijsuperpanel-hbar-buttonleft")) {
2060
2061				scrollDirection = "left";
2062
2063				active = true;
2064
2065			}
2066
2067			else if (ele.hasClass("wijmo-wijsuperpanel-hbar-buttonright")) {
2068
2069				scrollDirection = "right";
2070
2071				active = true;
2072
2073			}
2074
2075			else if (ele.hasClass(scrollerHandle)) {
2076
2077				ele.addClass("ui-state-active");
2078
2079				return;
2080
2081			}
2082
2083			else if (ele.hasClass(hbarContainerCSS)) {
2084
2085				hbarDrag = ele.find("." + scrollerHandle);
2086
2087				pos = hbarDrag.offset();
2088
2089				if (e.pageX < pos.left) {
2090
2091					scrollDirection = "left";
2092
2093				}
2094
2095				else {
2096
2097					scrollDirection = "right";
2098
2099				}
2100
2101				large = true;
2102
2103			}
2104
2105			else if (ele.hasClass(vbarContainerCSS)) {
2106
2107				vbarDrag = ele.find("." + scrollerHandle);
2108
2109				pos2 = vbarDrag.offset();
2110
2111				if (e.pageY < pos2.top) {
2112
2113					scrollDirection = "top";
2114
2115				}
2116
2117				else {
2118
2119					scrollDirection = "bottom";
2120
2121				}
2122
2123				large = true;
2124
2125			}
2126
2127			self._clearInterval();
2128
2129			self._doScrolling(scrollDirection, self, large);
2130
2131			f = self._fields();
2132
2133			self._setScrollingInterval(f, scrollDirection, self, large);
2134
2135			if (active) {
2136
2137				ele.addClass("ui-state-active");
2138
2139			}
2140
2141			$(document).bind("mouseup." + self.widgetName, {
2142
2143				self: self,
2144
2145				ele: ele
2146
2147			}, self._documentMouseUp);
2148
2149		},
2150
2151
2152
2153		doScrolling: function (dir, large) {
2154
2155			/// <summary>
2156
2157			/// Do scrolling.
2158
2159			/// </summary>
2160
2161			/// <param name="dir" type="string">
2162
2163			///   Scrolling direction. Options are: "left", "right", "top" and "bottom".
2164
2165			/// </param>
2166
2167			/// <param name="large" type="Boolean">
2168
2169			/// Whether to scroll a large change.
2170
2171			/// </param>
2172
2173
2174
2175			this._doScrolling(dir, this, large);
2176
2177		},
2178
2179
2180
2181		_setScrollerValue: function (dir, scroller, smallChange, largeChange, 
2182
2183		isAdd, isLarge, self) {
2184
2185			//var o = self.options;
2186
2187			var vMin = scroller.scrollMin,
2188
2189			change = isLarge ? largeChange : smallChange,
2190

2191			value = scroller.scrollValue, t, vTopValue, firstStepChangeFix, data;
2192
2193			if (!value) {
2194
2195				value = vMin;
2196
2197			}
2198
2199			t = 0;
2200
2201			if (isAdd) {
2202
2203				vTopValue = scroller.scrollMax - largeChange + 1;
2204
2205				if (Math.abs(value - vTopValue) < 0.001) {
2206
2207					self._clearInterval();
2208
2209					return false;
2210
2211				}
2212
2213				firstStepChangeFix = scroller.firstStepChangeFix;
2214
2215				t = value + change;
2216
2217				if (!isLarge && Math.abs(value - vMin) < 0.0001 && 
2218
2219				!isNaN(firstStepChangeFix)) {
2220
2221					t += firstStepChangeFix;
2222
2223				}
2224
2225				if (t > vTopValue) {
2226
2227					t = vTopValue;
2228
2229				}
2230
2231			}
2232
2233			else {
2234
2235				if (Math.abs(value - vMin) < 0.001) {
2236
2237					self._clearInterval();
2238
2239					return false;
2240
2241				}
2242
2243				t = value - change;
2244
2245				if (t < 0) {
2246
2247					t = vMin;
2248
2249				}
2250
2251			}
2252
2253			data = {
2254
2255				oldValue: scroller.scrollValue,
2256
2257				newValue: t,
2258
2259				direction: dir,
2260
2261				dir: scroller.dir
2262
2263			};
2264
2265			if (!self._scrolling(true, self, data)) {
2266
2267				return false;
2268
2269			}
2270
2271			scroller.scrollValue = t;
2272
2273			return true;
2274
2275		},
2276
2277
2278
2279		_doScrolling: function (dir, self, large) {
2280
2281			// Does wijsuperpanel scrolling.
2282
2283			// <param name="dir" type="String">
2284
2285			// Scroll direction. 
2286
2287			// Options are: "left", "right", "top" and "bottom".
2288
2289			// </param>
2290
2291			// <param name="self" type="jQuery">
2292
2293			// Pointer to the wijsuperpanel widget instance.
2294
2295			// </param>
2296
2297			// <param name="large" type="Boolean">
2298
2299			// Whether to scroll a large change.
2300
2301			// </param>
2302
2303
2304
2305			var o = self.options,
2306
2307			vScroller = o.vScroller,
2308
2309			hScroller = o.hScroller,
2310
2311			vSmall = self._getVScrollBarSmallChange(),
2312
2313			vLarge = self._getVScrollBarLargeChange(),
2314
2315			hLarge = self._getHScrollBarLargeChange(),
2316
2317			hSmall = self._getHScrollBarSmallChange();
2318
2319
2320
2321			if (dir === "top" || dir === "bottom") {
2322
2323				if (!self._setScrollerValue(dir, vScroller, vSmall, vLarge, 
2324
2325				dir === "bottom", large, self)) {
2326
2327					return;
2328
2329				}
2330
2331				dir = "v";
2332
2333			}
2334
2335			else if (dir === "left" || dir === "right") {
2336
2337				if (!self._setScrollerValue(dir, hScroller, hSmall, hLarge, 
2338
2339				dir === "right", large, self)) {
2340
2341					return;
2342
2343				}
2344
2345				dir = "h";
2346
2347			}
2348
2349			self._setDragAndContentPosition(true, true, dir);
2350
2351		},
2352
2353
2354
2355		_disableButtonIfNeeded: function (self) {
2356
2357			// Disables scrolling buttons.
2358
2359
2360
2361			var f = self._fields(), o, buttonLeft, buttonRight, buttonTop, buttonBottom,
2362
2363			hLargeChange, hMax, hValue, hScrollMin, vLargeChange, vMax, vValue, 
2364
2365			vScrollMin;
2366
2367			if (f.intervalID > 0) {
2368
2369				window.clearInterval(f.intervalID);
2370
2371			}
2372
2373			o = self.options;
2374
2375			buttonLeft = f.buttonLeft;
2376
2377			buttonRight = f.buttonRight;
2378
2379			buttonTop = f.buttonTop;
2380
2381			buttonBottom = f.buttonBottom;
2382
2383
2384
2385			if (buttonLeft !== undefined) {
2386
2387				hLargeChange = self._getHScrollBarLargeChange();
2388
2389
2390
2391				hMax = o.hScroller.scrollMax - hLargeChange + 1;
2392
2393				hValue = o.hScroller.scrollValue;
2394
2395				hScrollMin = o.hScroller.scrollMin;
2396
2397
2398
2399				if (hValue === undefined) {
2400
2401					hValue = hScrollMin;
2402
2403				}
2404
2405				if (Math.abs(hValue - hScrollMin) < 0.001 || !f.hScrolling) {
2406
2407					buttonLeft.addClass(uiStateDisabled);
2408
2409				}
2410
2411				else {
2412
2413					buttonLeft.removeClass(uiStateDisabled);
2414
2415				}
2416
2417				if (Math.abs(hValue - hMax) < 0.001 || !f.hScrolling) {
2418
2419					buttonRight.addClass(uiStateDisabled);
2420
2421				}
2422
2423				else {
2424
2425					buttonRight.removeClass(uiStateDisabled);
2426
2427				}
2428
2429			}
2430
2431			if (buttonTop !== undefined) {
2432
2433				vLargeChange = self._getVScrollBarLargeChange();
2434
2435				vMax = o.vScroller.scrollMax - vLargeChange + 1;
2436
2437				vValue = o.vScroller.scrollValue;
2438
2439				vScrollMin = o.vScroller.scrollMin;
2440
2441				if (vValue === undefined) {
2442
2443					vValue = vScrollMin;
2444
2445				}
2446
2447				if (Math.abs(vValue - vScrollMin) < 0.001 || !f.vScrolling) {
2448
2449					buttonTop.addClass(uiStateDisabled);
2450
2451				}
2452
2453				else {
2454
2455					buttonTop.removeClass(uiStateDisabled);
2456
2457				}
2458
2459				if (Math.abs(vValue - vMax) < 0.001 || !f.vScrolling) {
2460
2461					buttonBottom.addClass(uiStateDisabled);
2462
2463				}
2464
2465				else {
2466
2467					buttonBottom.removeClass(uiStateDisabled);
2468
2469				}
2470
2471			}
2472
2473		},
2474
2475
2476
2477		_clearInterval: function () {
2478
2479			var f = this._fields(), intervalID = f.internalFuncID;
2480
2481			if (intervalID > 0) {
2482
2483				window.clearInterval(intervalID);
2484
2485				f.internalFuncID = -1;
2486
2487			}
2488
2489		},
2490
2491
2492
2493		_elementMouseOut: function (event) {
2494
2495			var ele = $(event.currentTarget), self = event.data;
2496
2497
2498
2499			ele.unbind("mouseout", self._elementMouseOut);
2500
2501			ele.unbind("mousedown", self._elementMouseDown);

2502
2503			ele.unbind("mouseup", self._elementMouseUp);
2504
2505
2506
2507			ele.removeClass(uiStateHover);
2508
2509		},
2510
2511
2512
2513		scrollChildIntoView: function (child1) {
2514
2515			/// <summary>
2516
2517			/// Scroll children DOM element to view. 
2518
2519			/// </summary>
2520
2521			/// <param name="child" type="DOMElement/JQueryObj">
2522
2523			/// The child to scroll to.
2524
2525			/// </param>
2526
2527
2528
2529			var child = $(child1), f, cWrapper, tempWrapper, left, top, 
2530
2531			childOffset, templateOffset, cWrapperOffset;
2532
2533
2534
2535			if (child.size() === 0) {
2536
2537				return;
2538
2539			}
2540
2541			f = this._fields();
2542
2543			cWrapper = f.contentWrapper;
2544
2545			tempWrapper = f.templateWrapper;
2546
2547			childOffset = child.offset();
2548
2549			templateOffset = tempWrapper.offset();
2550
2551
2552
2553			childOffset.leftWidth = childOffset.left + child.outerWidth();
2554
2555			childOffset.topHeight = childOffset.top + child.outerHeight();
2556
2557			cWrapperOffset = cWrapper.offset();
2558
2559			cWrapperOffset.leftWidth = cWrapperOffset.left + cWrapper.outerWidth();
2560
2561			cWrapperOffset.topHeight = cWrapperOffset.top + cWrapper.outerHeight();
2562
2563
2564
2565			if (childOffset.left < cWrapperOffset.left) {
2566
2567				left = childOffset.left - templateOffset.left;
2568
2569			}
2570
2571			else if (childOffset.leftWidth > cWrapperOffset.leftWidth) {
2572
2573				left = childOffset.leftWidth - templateOffset.left - 
2574
2575				cWrapper.innerWidth();
2576
2577			}
2578
2579			if (childOffset.top < cWrapperOffset.top) {
2580
2581				top = childOffset.top - templateOffset.top;
2582
2583			}
2584
2585			else if (childOffset.topHeight > cWrapperOffset.topHeight) {
2586
2587				top = childOffset.topHeight - templateOffset.top - 
2588
2589				cWrapper.innerHeight();
2590
2591			}
2592
2593			if (left !== undefined) {
2594
2595				this.hScrollTo(left);
2596
2597			}
2598
2599			if (top !== undefined) {
2600
2601				this.vScrollTo(top);
2602
2603			}
2604
2605		},
2606
2607
2608
2609		hScrollTo: function (x) {
2610
2611			/// <summary>
2612
2613			/// Scroll to horizontal position.
2614
2615			/// </summary>
2616
2617			/// <param name="x" type="Number">
2618
2619			/// The position to scroll to.
2620
2621			/// </param>
2622
2623			var o = this.options;
2624
2625			//var f = this._fields();
2626
2627			o.hScroller.scrollValue = this.scrollPxToValue(x, "h");
2628
2629			this._setDragAndContentPosition(false, true, "h", "nonestop");
2630
2631		},
2632
2633
2634
2635		vScrollTo: function (y) {
2636
2637			/// <summary>
2638
2639			/// Scroll to vertical position.
2640
2641			/// </summary>
2642
2643			/// <param name="y" type="Number">
2644
2645			/// The position to scroll to.
2646
2647			/// </param>
2648
2649
2650
2651			var o = this.options;
2652
2653			o.vScroller.scrollValue = this.scrollPxToValue(y, "v");
2654
2655			this._setDragAndContentPosition(false, true, "v", "nonestop");
2656
2657		},
2658
2659
2660
2661		scrollPxToValue: function (px, dir) {
2662
2663			/// <summary>
2664
2665			/// Convert pixel to scroll value.
2666
2667			/// For example, wijsuperpanel scrolled 50px 
2668
2669			///which is value 1 after conversion.
2670
2671			/// </summary>
2672
2673			/// <param name="px" type="Number">
2674
2675			/// Length of scrolling.
2676
2677			/// </param>
2678
2679			/// <param name="dir" type="String">
2680
2681			/// Scrolling direction. Options are: "h" and "v".
2682
2683			/// </param>
2684
2685
2686
2687			var o = this.options,
2688
2689			m = (dir === "h" ? "outerWidth" : "outerHeight"),
2690
2691			m1 = (dir === "h" ? "contentWidth" : "contentHeight"),
2692
2693			scroller = (dir === "h" ? "hScroller" : "vScroller"),
2694
2695			f = this._fields(),
2696
2697			cWrapper = f.contentWrapper,
2698
2699			//var tempWrapper = f.templateWrapper;
2700
2701			size = f[m1],
2702
2703			contentHeight = cWrapper[m](),
2704
2705
2706
2707			vMin = o[scroller].scrollMin,
2708
2709			vMax = o[scroller].scrollMax,
2710
2711			vRange = vMax - vMin,
2712
2713			vLargeChange = (dir === "h" ? 
2714
2715			this._getHScrollBarLargeChange() : this._getVScrollBarLargeChange()),
2716
2717			maxv = vRange - vLargeChange + 1,
2718
2719			ret = maxv * (px / (size - contentHeight));
2720
2721			if (ret < vMin) {
2722
2723				ret = vMin;
2724
2725			}
2726
2727			if (ret > maxv) {
2728
2729				ret = maxv;
2730
2731			}
2732
2733			return ret;
2734
2735		},
2736
2737
2738
2739		scrollTo: function (x, y) {
2740
2741			/// <summary>
2742
2743			/// Refreshes wijsuperpanel. 
2744
2745			/// Needs to be called after content being changed.
2746
2747			/// </summary>
2748
2749			/// <param name="x" type="Number">
2750
2751			/// Horizontal position to scroll to.	
2752
2753			/// </param>
2754
2755			/// <param name="y" type="Number">
2756
2757			/// Vertical position to scroll to.
2758
2759			/// </param>
2760
2761
2762
2763			this.hScrollTo(x);
2764
2765			this.vScrollTo(y);
2766
2767		},
2768
2769
2770
2771		paintPanel: function () {
2772
2773			/// <summary>
2774
2775			/// Refreshes wijsuperpanel. 
2776
2777			/// Needs to be called after content being changed.
2778
2779			/// </summary>
2780
2781			/// <returns type="Boolean">
2782
2783			/// Returns true if painting is successful, else returns false. 
2784
2785			/// </returns>
2786
2787			var self = this, ele = self.element, focused, o, f, templateWrapper;
2788
2789			if (ele.is(":visible")) {
2790
2791				focused = document.activeElement;
2792
2793				o = self.options;
2794
2795				f = self._fields();
2796
2797				if (!f.initialized) {
2798
2799					self._initialize(f, ele, self);
2800
2801				}
2802
2803				self._resetLargeChange(self, f, o);
2804
2805				self._bindElementEvents(self, f, ele, o);
2806
2807				templateWrapper = f.templateWrapper;
2808
2809				templateWrapper.css({ "float": "left", left: "0px", top: "0px",
2810
2811				width: "auto", height: "auto" });
2812
2813				// hide and show wrapper div to force the width to change
2814
2815				// for some browser.
2816
2817				templateWrapper.hide();
2818
2819				templateWrapper.show();
2820
2821				f.contentWidth = templateWrapper.width();
2822
2823				f.contentHeight = templateWrapper.height();
2824
2825				templateWrapper.css("float", "");
2826
2827				self._setRounder(self, ele);
2828
2829				self._setInnerElementsSize(f, ele);
2830
2831				self._testScroll(self, f, o);
2832
2833				self._initScrollBars(self, f, o);
2834
2835				self._initScrollButtons(self, f, o);
2836
2837				self._trigger("painted");
2838
2839
2840
2841				self._paintedMark = { date: new Date(), mainWidth: ele[0].offsetWidth, 
2842
2843				mainHeight: ele[0].offsetHeight, width: f.contentWidth, 
2844
2845				height: f.contentWidth };
2846
2847				if (focused !== undefined) {
2848
2849					$(focused).focus();
2850
2851				}
2852
2853				return true;
2854
2855			}
2856
2857			return false;
2858
2859		},
2860
2861
2862
2863		_resetLargeChange: function (self, f, o) {
2864
2865			if (self._autoVLarge) {
2866
2867				o.vScroller.scrollLargeChange = null;
2868
2869			}
2870
2871			if (self._autoHLarge) {
2872
2873				o.hScroller.scrollLargeChange = null;
2874
2875			}
2876
2877			f.vTrackLen = undefined;
2878
2879			f.hTrackLen = undefined;
2880
2881			if (f.vbarContainer) {
2882
2883				f.vbarContainer.remove();
2884
2885				f.vbarContainer = undefined;
2886
2887			}
2888
2889			if (f.hbarContainer) {
2890
2891				f.hbarContainer.remove();
2892
2893				f.hbarContainer = undefined;
2894
2895			}
2896
2897		},
2898
2899
2900
2901		_initialize: function (f, ele, self) {
2902
2903			f.initialized = true;
2904
2905			// ensure width and height
2906
2907			ele.addClass(uiSuperPanelClasses);
2908
2909			f.oldHeight = ele.css("height");
2910
2911			var old = ele.css("overflow");
2912
2913			ele.css("overflow", "");
2914
2915			// set height to element
2916
2917			ele.height(ele.height());
2918
2919			ele.css("overflow", old);
2920
2921
2922
2923			self._createAdditionalDom(self, f, ele);
2924
2925		},
2926
2927
2928
2929		getContentElement: function () {
2930
2931			/// <summary>
2932
2933			/// Gets the content element of wijsuperpanel.
2934
2935			/// </summary>
2936
2937			/// <returns type="JQueryObj" />
2938
2939
2940
2941			return this._fields().templateWrapper;
2942
2943		},
2944
2945
2946
2947		_setButtonPosition: function (self, o, scroller, dir, target, f, state) {
2948
2949			var h = dir === "h", mouseoverkey = "mouseover." + self.widgetName,
2950
2951			decKey = h ? "buttonLeft" : "buttonTop",
2952
2953			incKey = h ? "buttonRight" : "buttonBottom",
2954
2955			decButton = f[decKey],
2956
2957			incButton = f[incKey], html, buttons, defaultPosition;
2958
2959			if (self._hasMode(scroller, "buttons") || 
2960
2961			self._hasMode(scroller, "buttonshover")) {
2962
2963
2964
2965				html = h ? hButtons : vButtons;
2966
2967				if (decButton === undefined) {
2968
2969					buttons = $(html).appendTo(state);
2970
2971					buttons.bind(mouseoverkey, self, self._scrollButtonMouseOver);
2972
2973					f[decKey] = decButton = state.children(h ? 
2974
2975					".wijmo-wijsuperpanel-buttonleft" : ".wijmo-wijsuperpanel-buttontop");
2976
2977					f[incKey] = incButton = state.children(h ? 
2978
2979					".wijmo-wijsuperpanel-buttonright" : 
2980
2981					".wijmo-wijsuperpanel-buttonbottom");
2982
2983				}
2984
2985				defaultPosition = {
2986
2987					my: h ? "left" : "top",
2988
2989					of: target,
2990
2991					at: h ? "left" : "top",
2992
2993					collision: "none"
2994
2995				};
2996
2997				$.extend(defaultPosition, scroller.decreaseButtonPosition);
2998
2999				decButton.position(defaultPosition);
3000
3001				defaultPosition = {
3002
3003					my: h ? "right" : "bottom",
3004
3005					of: target,
3006
3007					at: h ? "right" : "bottom",
3008
3009					collision: "none"
3010
3011				};
3012
3013				$.extend(defaultPosition, scroller.increaseButtonPosition);
3014
3015				incButton.position(defaultPosition);
3016
3017			}
3018
3019			else if (decButton !== undefined) {
3020
3021				decButton.remove();
3022
3023				incButton.remove();
3024
3025				f[decKey] = f[incKey] = undefined;
3026
3027			}
3028
3029		},
3030
3031
3032
3033		_initScrollButtons: function (self, f, o) {
3034
3035			var a = f.contentWrapper,
3036
3037			state = f.stateContainer;
3038
3039			self._setButtonPosition(self, o, o.hScroller, "h", a, f, state);
3040
3041			self._setButtonPosition(self, o, o.vScroller, "v", a, f, state);
3042
3043		},
3044
3045
3046
3047		_getVScrollBarSmallChange: function () {
3048
3049			var o = this.options, va;
3050
3051			if (!o.vScroller.scrollSmallChange) {
3052
3053				va = this._getVScrollBarLargeChange();
3054
3055				o.vScroller.scrollSmallChange = va / 2;
3056
3057			}
3058
3059			return o.vScroller.scrollSmallChange;
3060
3061		},
3062
3063
3064
3065		_getVScrollBarLargeChange: function () {
3066
3067			return this._getLargeChange("v");
3068
3069		},
3070
3071
3072
3073		_getLargeChange: function (dir) {
3074
3075			var self = this,
3076
3077			o = self.options,
3078
3079			f = self._fields(),
3080
3081			v = dir === "v",
3082
3083			scroller = v ? o.vScroller : o.hScroller,
3084
3085			clientKey = v ? "clientHeight" : "clientWidth",
3086
3087			offsetKey = v ? "contentHeight" : "contentWidth",
3088
3089			autoKey = v ? "_autoVLarge" : "_autoHLarge",
3090