Switched the rest of whiteboard controls to react and united them with uploader menu

bigbluebutton-html5/app/client/views/whiteboard/WhiteboardControls.jsx

@@ -0,0 +1,69 @@
+WhiteboardControls = React.createClass ({
+  mixins: [ReactMeteorData],
+  getMeteorData() {
+    let currentPresentation, currentSlide, currentSlideNum, ref, ref1, totalSlideNum;
+    currentSlideNum = 0;
+    totalSlideNum = 0;
+    currentPresentation = Meteor.Presentations.findOne({
+      'presentation.current': true
+    });
+    if(currentPresentation != null) {
+      currentSlide = Meteor.Slides.findOne({
+        'presentationId': currentPresentation.presentation.id,
+        'slide.current': true
+    })
+      if(currentSlide != null) {
+        currentSlideNum = currentSlide.slide.num;
+      }
+      totalSlides = Meteor.Slides.find({ 'presentationId': currentPresentation.presentation.id });
+      if(totalSlides != null) {
+        totalSlideNum = totalSlides.count();
+      }
+    }
+    return {
+      currentSlideNum: currentSlideNum,
+      totalSlideNum: totalSlideNum
+    };
+  },
+
+  componentDidMount() {
+    setTimeout(scaleWhiteboard, 0);
+  },
+
+  componentWillUnmount () {
+    setTimeout(scaleWhiteboard, 0);
+  },
+
+  handlePrevious() {
+    BBB.goToPreviousPage();
+  },
+
+  handleNext() {
+    BBB.goToNextPage();
+  },
+
+  render() {
+    return (
+      <div id="whiteboard-controls">
+        <div className="whiteboard-buttons-left">
+          {/* TODO: Adjust the presenter uploader for mobile views on iOS devices
+              you cant upload PDFs, only images from camera/gallery */
+           !isMobile() ? 
+            <UploaderControls />
+          : null }
+        </div>
+        <div className="whiteboard-buttons-right">
+        </div>
+        <div className="whiteboard-buttons-center">
+          <div className="whiteboard-buttons-slide">
+            <Button onClick={this.handlePrevious} btn_class=" prev" i_class="ion-arrow-left-a" rel="tooltip" data_placement="top" title="Previous"/>
+            <span className="current">
+              {this.data.currentSlideNum + '/' + this.data.totalSlideNum}
+            </span>
+            <Button onClick={this.handleNext} btn_class=" next" i_class="ion-arrow-right-a" rel="tooltip" data_placement="top" title="Next"/>
+          </div>
+        </div>
+      </div>
+    )
+  }
+});