Improved slide size & detection

yhatt · May 21, 2016 · 8b463da · 8b463da
1 parent fd0022e
commit 8b463da
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 66 deletions.
diff --git a/coffee/slide.coffee b/coffee/slide.coffee
@@ -28,69 +28,67 @@ ipc.on 'currentPage', (e, page) ->
 ipc.on 'setClass', (e, classes) -> $('body').attr 'class', classes
 
 # Initialize
-$ ->
+$(window).on 'load', ->
+
   # Get slide size from css
-  sizeElm = $('<div id="slide-size">').hide()
-  $('body').append sizeElm
-
-  setTimeout () ->
-    slideSize = do ->
-      ret =
-        width: sizeElm.outerWidth()
-        height: sizeElm.outerHeight()
-        viewWidth: sizeElm.width()
-        viewHeight: sizeElm.height()
-
-      ret.ratio = ret.width / ret.height
-
-      sizeElm.remove()
-      ret
-
-    # Resizing
-    $(window).resize ->
-
-      # Client area size (excluding margin)
-      cSize =
-        width:  $(window).width() - (slideSize.width - slideSize.viewWidth)
-        height: $(window).height() - (slideSize.height - slideSize.viewHeight)
-
-      calcedWidth = cSize.height * slideSize.ratio
-
-      # Size for screen preview
-      sSize =
-        width:  if calcedWidth >= cSize.width then cSize.width else calcedWidth
-        height: if calcedWidth >= cSize.width then cSize.width / slideSize.ratio else cSize.height
-
-      # Size for list preview
-      lSize =
-        width:  cSize.width
-        height: cSize.width / slideSize.ratio
-
-      styleGen = (klass, size_obj) ->
-        """
-        body.slide-view.#{klass} .slide_wrapper {
-          width: #{size_obj.width}px;
-          height: #{size_obj.height}px;
-        }
-        body.slide-view.#{klass} .slide_wrapper > .slide {
-          transform: scale(#{size_obj.width / slideSize.width}) translateY(-50%) translateY(#{slideSize.height / 2}px);
-        }
-        """
-
-      previewStyle =
-        """
-        @media not print {
-          #{styleGen 'screen', sSize}
-          #{styleGen 'list', lSize}
-        }
-        """
-
-      psCss = $('#mds-previewStyle')
-      psCss = $('<style id="mds-previewStyle"></style>').appendTo('head') if psCss.length < 1
-      psCss.text previewStyle
-
-    .trigger('resize')
-
-    ipc.sendToHost 'initializedSlide'
-
-  , 0
+  slideSize = do ->
+    sizeElm = $('<div id="slide-size">').hide()
+    $('body').append sizeElm
+
+    ret =
+      width: sizeElm.outerWidth()
+      height: sizeElm.outerHeight()
+      viewWidth: sizeElm.width()
+      viewHeight: sizeElm.height()
+
+    ret.ratio = ret.width / ret.height
+
+    sizeElm.remove()
+    ret
+
+  # Resizing
+  $(window).resize ->
+
+    # Client area size (excluding margin)
+    cSize =
+      width:  $(window).width() - (slideSize.width - slideSize.viewWidth)
+      height: $(window).height() - (slideSize.height - slideSize.viewHeight)
+
+    calcedWidth = cSize.height * slideSize.ratio
+
+    # Size for screen preview
+    sSize =
+      width:  if calcedWidth >= cSize.width then cSize.width else calcedWidth
+      height: if calcedWidth >= cSize.width then cSize.width / slideSize.ratio else cSize.height
+
+    # Size for list preview
+    lSize =
+      width:  cSize.width
+      height: cSize.width / slideSize.ratio
+
+    styleGen = (klass, size_obj) ->
+      """
+      body.slide-view.#{klass} .slide_wrapper {
+        width: #{size_obj.width}px;
+        height: #{size_obj.height}px;
+      }
+      body.slide-view.#{klass} .slide_wrapper > .slide {
+        transform: scale(#{size_obj.width / slideSize.width}) translateY(-50%) translateY(#{slideSize.height / 2}px);
+      }
+      """
+
+    previewStyle =
+      """
+      @media not print {
+        #{styleGen 'screen', sSize}
+        #{styleGen 'list', lSize}
+      }
+      """
+
+    psCss = $('#mds-previewStyle')
+    psCss = $('<style id="mds-previewStyle"></style>').appendTo('head') if psCss.length < 1
+    psCss.text previewStyle
+
+  .trigger('resize')
+
+  ipc.sendToHost 'initializedSlide'
diff --git a/sass/themes/_slide.sass b/sass/themes/_slide.sass
@@ -21,7 +21,7 @@
 // ===== Slide CSS common =====
 
 $slideWidth: 297mm
-$slideHeight: 209.5mm
+$slideHeight: 210mm
 $previewMargin: 20px
 
 html, body