Bladeren bron

popover jquery removal. other fixes

Adam Shaw 8 jaren geleden
bovenliggende
commit
2a924d724c
5 gewijzigde bestanden met toevoegingen van 36 en 28 verwijderingen
  1. 4 3
      src/agenda/AgendaView.ts
  2. 4 3
      src/basic/BasicView.ts
  3. 2 2
      src/common/Popover.ts
  4. 22 16
      src/common/Scroller.ts
  5. 4 4
      src/list/ListView.ts

+ 4 - 3
src/agenda/AgendaView.ts

@@ -33,7 +33,7 @@ export default class AgendaView extends View {
   timeGrid: any // the main time-grid subcomponent of this view
   dayGrid: any // the "all-day" subcomponent. if all-day is turned off, this will be null
 
-  scroller: any
+  scroller: Scroller
   axisWidth: any // the width of the time axis running down the side
   usesMinMaxTime: boolean = true // indicates that minTime/maxTime affects rendering
 
@@ -84,7 +84,8 @@ export default class AgendaView extends View {
 
     this.scroller.render()
 
-    timeGridWrapEl = this.scroller.el.addClass('fc-time-grid-container')
+    timeGridWrapEl = this.scroller.el
+    timeGridWrapEl.classList.add('fc-time-grid-container')
     timeGridEl = $('<div class="fc-time-grid" />').appendTo(timeGridWrapEl)
 
     this.el.find('.fc-body > tr > td').append(timeGridWrapEl)
@@ -238,7 +239,7 @@ export default class AgendaView extends View {
   // given a desired total height of the view, returns what the height of the scroller should be
   computeScrollerHeight(totalHeight) {
     return totalHeight -
-      subtractInnerElHeight(this.el, this.scroller.el) // everything that's NOT the scroller
+      subtractInnerElHeight(this.el, $(this.scroller.el)) // everything that's NOT the scroller
   }
 
 

+ 4 - 3
src/basic/BasicView.ts

@@ -25,7 +25,7 @@ export default class BasicView extends View {
   dateProfileGeneratorClass: any
   dayGridClass: any // class the dayGrid will be instantiated from (overridable by subclasses)
 
-  scroller: any
+  scroller: Scroller
   dayGrid: any // the main subcomponent that does most of the heavy lifting
 
   weekNumberWidth: any // width of all the week-number cells running down the side
@@ -81,7 +81,8 @@ export default class BasicView extends View {
 
     this.scroller.render()
 
-    dayGridContainerEl = this.scroller.el.addClass('fc-day-grid-container')
+    dayGridContainerEl = this.scroller.el
+    dayGridContainerEl.classList.add('fc-day-grid-container')
     dayGridEl = $('<div class="fc-day-grid" />').appendTo(dayGridContainerEl)
 
     this.el.find('.fc-body > tr > td').append(dayGridContainerEl)
@@ -213,7 +214,7 @@ export default class BasicView extends View {
   // given a desired total height of the view, returns what the height of the scroller should be
   computeScrollerHeight(totalHeight) {
     return totalHeight -
-      subtractInnerElHeight(this.el, this.scroller.el) // everything that's NOT the scroller
+      subtractInnerElHeight(this.el, $(this.scroller.el)) // everything that's NOT the scroller
   }
 
 

+ 2 - 2
src/common/Popover.ts

@@ -88,8 +88,8 @@ export default class Popover {
     options.parentEl.appendChild(el)
 
     // when a click happens on anything inside with a 'fc-close' className, hide the popover
-    listenViaDelegation(el, 'click', 'fc-close', function(ev) {
-      el.style.display = 'none'
+    listenViaDelegation(el, 'click', 'fc-close', (ev) => {
+      this.hide()
     })
 
     if (options.autoHide) {

+ 22 - 16
src/common/Scroller.ts

@@ -7,8 +7,8 @@ Embodies a div that has potential scrollbars
 */
 export default class Scroller extends Class {
 
-  el: JQuery // the guaranteed outer element
-  scrollEl: JQuery // the element with the scrollbars
+  el: HTMLElement // the guaranteed outer element
+  scrollEl: HTMLElement // the element with the scrollbars
   overflowX: any
   overflowY: any
 
@@ -28,7 +28,10 @@ export default class Scroller extends Class {
 
 
   renderEl() {
-    return (this.scrollEl = $('<div class="fc-scroller"></div>'))
+    let scrollEl = document.createElement('div')
+    scrollEl.classList.add('fc-scroller')
+    this.scrollEl = scrollEl
+    return scrollEl
   }
 
 
@@ -49,10 +52,8 @@ export default class Scroller extends Class {
 
 
   applyOverflow() {
-    this.scrollEl.css({
-      'overflow-x': this.overflowX,
-      'overflow-y': this.overflowY
-    })
+    this.scrollEl.style.overflowX = this.overflowX
+    this.scrollEl.style.overflowY = this.overflowY
   }
 
 
@@ -60,6 +61,7 @@ export default class Scroller extends Class {
   // Useful for preserving scrollbar widths regardless of future resizes.
   // Can pass in scrollbarWidths for optimization.
   lockOverflow(scrollbarWidths) {
+    let { scrollEl } = this
     let overflowX = this.overflowX
     let overflowY = this.overflowY
 
@@ -69,7 +71,7 @@ export default class Scroller extends Class {
       overflowX = (
           scrollbarWidths.top || scrollbarWidths.bottom || // horizontal scrollbars?
           // OR scrolling pane with massless scrollbars?
-          this.scrollEl[0].scrollWidth - 1 > this.scrollEl[0].clientWidth
+          scrollEl.scrollWidth - 1 > scrollEl.clientWidth
             // subtract 1 because of IE off-by-one issue
         ) ? 'scroll' : 'hidden'
     }
@@ -78,12 +80,13 @@ export default class Scroller extends Class {
       overflowY = (
           scrollbarWidths.left || scrollbarWidths.right || // vertical scrollbars?
           // OR scrolling pane with massless scrollbars?
-          this.scrollEl[0].scrollHeight - 1 > this.scrollEl[0].clientHeight
+          scrollEl.scrollHeight - 1 > scrollEl.clientHeight
             // subtract 1 because of IE off-by-one issue
         ) ? 'scroll' : 'hidden'
     }
 
-    this.scrollEl.css({ 'overflow-x': overflowX, 'overflow-y': overflowY })
+    scrollEl.style.overflowX = overflowX
+    scrollEl.style.overflowY = overflowY
   }
 
 
@@ -92,32 +95,35 @@ export default class Scroller extends Class {
 
 
   setHeight(height) {
-    this.scrollEl.height(height)
+    this.scrollEl.style.height =
+      typeof height === 'number' ?
+        height + 'px' :
+        height
   }
 
 
   getScrollTop() {
-    return this.scrollEl.scrollTop()
+    return this.scrollEl.scrollTop
   }
 
 
   setScrollTop(top) {
-    this.scrollEl.scrollTop(top)
+    this.scrollEl.scrollTop = top
   }
 
 
   getClientWidth() {
-    return this.scrollEl[0].clientWidth
+    return this.scrollEl.clientWidth
   }
 
 
   getClientHeight() {
-    return this.scrollEl[0].clientHeight
+    return this.scrollEl.clientHeight
   }
 
 
   getScrollbarWidths() {
-    return getScrollbarWidths(this.scrollEl)
+    return getScrollbarWidths($(this.scrollEl))
   }
 
 }

+ 4 - 4
src/list/ListView.ts

@@ -17,7 +17,7 @@ export default class ListView extends View {
 
   segSelector: any = '.fc-list-item' // which elements accept event actions
 
-  scroller: any
+  scroller: Scroller
   contentEl: JQuery
 
   dayDates: any // localized ambig-time moment array
@@ -41,9 +41,9 @@ export default class ListView extends View {
     )
 
     this.scroller.render()
-    this.scroller.el.appendTo(this.el)
+    this.el.append(this.scroller.el)
 
-    this.contentEl = this.scroller.scrollEl // shortcut
+    this.contentEl = $(this.scroller.scrollEl) // shortcut
   }
 
 
@@ -65,7 +65,7 @@ export default class ListView extends View {
 
   computeScrollerHeight(totalHeight) {
     return totalHeight -
-      subtractInnerElHeight(this.el, this.scroller.el) // everything that's NOT the scroller
+      subtractInnerElHeight(this.el, $(this.scroller.el)) // everything that's NOT the scroller
   }