iruby 0.2.7 → 0.5.0

data/lib/iruby/input/checkbox.rb

@@ -0,0 +1,74 @@
+module IRuby
+  module Input
+    class Checkbox < Label
+      needs :options, :default
+
+      builder :checkbox do |*args, **params|
+        key = :checkbox
+        key, *args = args if args.first.is_a? Symbol
+
+        params[:key] = unique_key(key)
+        params[:options] = args
+
+        params[:default] = case params[:default]
+        when false, nil
+          []
+        when true
+          [*params[:options]]
+        else
+          [*params[:default]]
+        end
+
+        add_field Checkbox.new(**params)
+      end
+
+      def widget_css
+        <<-CSS
+          .iruby-checkbox.form-control { display: inline-table; }
+          .iruby-checkbox .checkbox-inline { margin: 0 15px 0 0; }
+        CSS
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-checkbox input').change(function(){
+            var parent = $(this).closest('.iruby-checkbox');
+            $(parent).data('iruby-value', []);
+
+            $(parent).find(':checked').each(function(){
+              $(parent).data('iruby-value').push($(this).val());
+            });
+
+            if ($(parent).data('iruby-value').length == 0) {
+              $(parent).data('iruby-value', null);
+            }
+          });
+
+          $('.iruby-checkbox input').trigger('change');
+        JS
+      end
+
+      def widget_html
+        params = {
+          :'data-iruby-key' => @key,
+          class: 'iruby-checkbox form-control'
+        }
+        widget_label do
+          div **params do
+            @options.each do |option|
+              label class: 'checkbox-inline' do
+                input(
+                  name: @key,
+                  value: option,
+                  type: 'checkbox',
+                  checked: @default.include?(option)
+                )
+                text option
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/iruby/input/date.rb

@@ -0,0 +1,37 @@
+module IRuby
+  module Input
+    class Date < Field
+      needs js_class: 'iruby-date', icon: '📅'
+
+      builder :date do |key='date', **params|
+        params[:default] ||= false
+        params[:key] = unique_key key
+
+        if params[:default].is_a? Time
+          params[:default] = params[:default].strftime('%m/%d/%Y')
+        end
+
+        add_field Date.new(**params)
+
+        process params[:key] do |result,key,value|
+          result[key.to_sym] = Time.strptime(value,'%m/%d/%Y')
+        end
+      end
+
+      def widget_css
+        '#ui-datepicker-div { z-index: 2000 !important; }'
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-date').datepicker({
+            dateFormat: 'mm/dd/yy',
+            onClose: function(date) {
+              $(this).data('iruby-value', date);
+            }
+          });
+        JS
+      end
+    end
+  end
+end

data/lib/iruby/input/field.rb

@@ -0,0 +1,31 @@
+module IRuby
+  module Input
+    class Field < Label
+      needs default: nil, type: 'text', js_class: 'iruby-field'
+
+      builder :input do |key='input', **params|
+        params[:key] = unique_key key
+        add_field Field.new(**params)
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-field').keyup(function() {
+            $(this).data('iruby-value', $(this).val());
+          });
+        JS
+      end
+
+      def widget_html
+        widget_label do
+          input(
+            type: @type,
+            :'data-iruby-key' => @key,
+            class: "form-control #{@js_class}",
+            value: @default
+          )
+        end
+      end
+    end
+  end
+end

data/lib/iruby/input/file.rb

@@ -0,0 +1,57 @@
+require 'data_uri'
+
+module IRuby
+  module Input
+    class File < Label
+      builder :file do |key='file', **params|
+        key = unique_key key
+        add_field File.new(key: key, **params)
+
+        # tell the builder to process files differently
+        process key do |result,key,value|
+          uri = URI::Data.new value['data']
+
+          # get rid of Chrome's silly path
+          name = value['name'].sub('C:\\fakepath\\','')
+
+          result[key.to_sym] = {
+            name: name,
+            data: uri.data,
+            content_type: uri.content_type
+          }
+        end
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-file').change(function() {
+            var input = $(this);
+
+            $.grep($(this).prop('files'), function(file) {
+              var reader = new FileReader();
+
+              reader.addEventListener("load", function(event) {
+                input.data('iruby-value', {
+                  name: input.val(),
+                  data: event.target.result
+                });
+              });
+
+              reader.readAsDataURL(file);
+            });
+          });
+        JS
+      end
+
+      def widget_html
+        widget_label do
+          input(
+            type: 'file',
+            :'data-iruby-key' => @key,
+            class: 'form-control iruby-file'
+          )
+        end
+      end
+    end
+  end
+end

data/lib/iruby/input/form.rb

@@ -0,0 +1,77 @@
+require 'securerandom'
+
+module IRuby
+  module Input
+    class InputForm < Widget
+      needs :fields, buttons: []
+
+      def widget_js
+        javascript = <<-JS
+          var remove = function () {
+            Jupyter.notebook.kernel.send_input_reply(
+              JSON.stringify({
+                '#{@id = SecureRandom.uuid}': null
+              })
+            );
+          };
+
+          $("#iruby-form").on("remove", remove);
+
+          $('#iruby-form').submit(function() {
+            var result = {};
+            $(this).off('remove', remove);
+
+            $('[data-iruby-key]').each(function() {
+              if ($(this).data('iruby-key')) {
+                var value = $(this).data('iruby-value');
+                if (value) {
+                  result[$(this).data('iruby-key')] = value;
+                }
+              }
+            });
+
+            Jupyter.notebook.kernel.send_input_reply(
+              JSON.stringify({'#{@id}': result})
+            );
+
+            $(this).remove();
+            return false;
+          });
+
+          $('#iruby-form').keydown(function(event) {
+            if (event.keyCode == 13 && !event.shiftKey) {
+              $('#iruby-form').submit();
+            } else if (event.keyCode == 27) {
+              $('#iruby-form').remove();
+            }
+          });
+        JS
+
+        widget_join :widget_js, javascript, *@fields, *@buttons
+      end
+
+      def widget_css
+        spacing = '#iruby-form > * { margin-bottom: 5px; }'
+        widget_join :widget_css, spacing, *@fields, *@buttons
+      end
+
+      def widget_html
+        form id: 'iruby-form', class: 'col-md-12' do
+          @fields.each {|field| widget field}
+        end
+        @buttons.each {|button| widget button}
+      end
+
+      def submit
+        result = MultiJson.load(Kernel.instance.session.recv_input)
+
+        unless result.has_key? @id
+          submit
+        else
+          Display.clear_output
+          result[@id]
+        end
+      end
+    end
+  end
+end

data/lib/iruby/input/label.rb

@@ -0,0 +1,27 @@
+module IRuby
+  module Input
+    class Label < Widget
+      needs label: nil, icon: nil
+
+      def widget_label
+        div class: 'iruby-label input-group' do
+          span class: 'input-group-addon' do
+            text @label || to_label(@key)
+          end
+
+          yield
+
+          if @icon
+            span @icon, class: "input-group-addon"
+          end
+        end
+      end
+
+      private
+
+      def to_label label
+        label.to_s.tr('_',' ').capitalize
+      end
+    end
+  end
+end

data/lib/iruby/input/multiple.rb

@@ -0,0 +1,76 @@
+module IRuby
+  module Input
+    class Multiple < Label
+      needs :options, :default, size: nil
+
+      builder :multiple do |*args, **params|
+        key = :multiple
+        key, *args = args if args.first.is_a? Symbol
+
+        params[:key] = unique_key(key)
+        params[:options] = args
+
+        params[:default] = case params[:default]
+        when false, nil
+          []
+        when true
+          [*params[:options]]
+        else
+          [*params[:default]]
+        end
+
+        add_field Multiple.new(**params)
+      end
+
+      def widget_css
+        <<-CSS
+          .iruby-multiple {
+            display: table;
+            min-width: 25%;
+          }
+          .form-control.iruby-multiple-container {
+            display: table;
+          }
+        CSS
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-multiple').change(function(){
+            var multiple = $(this);
+            multiple.data('iruby-value', []);
+
+            multiple.find(':selected').each(function(){
+              multiple.data('iruby-value').push($(this).val());
+            });
+
+            if (multiple.data('iruby-value').length == 0) {
+              multiple.data('iruby-value', null);
+            }
+          });
+
+          $('.iruby-multiple').trigger('change');
+        JS
+      end
+
+      def widget_html
+        widget_label do
+          div class: 'form-control iruby-multiple-container' do
+            params = {
+              size: @size,
+              multiple: true,
+              class: 'iruby-multiple',
+              :'data-iruby-key' => @key
+            }
+
+            select **params do
+              @options.each do |o|
+                option o, selected: @default.include?(o)
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/iruby/input/popup.rb

@@ -0,0 +1,41 @@
+module IRuby
+  module Input
+    class Popup < Widget
+      needs :title, :form, buttons: []
+
+      def widget_css
+        style = '.modal-body { overflow: auto; }'
+        widget_join :widget_css, style, @form, *@buttons
+      end
+
+      def widget_js
+        js = <<-JS
+          require(['base/js/dialog'], function(dialog) {
+            var popup = dialog.modal({
+              title: '#{@title.gsub("'"){"\\'"}}',
+              body: '#{@form.to_html}',
+              destroy: true,
+              sanitize: false,
+              keyboard_manager: Jupyter.notebook.keyboard_manager,
+              open: function() {
+                #{widget_join :widget_js, @form, *@buttons}
+
+                var popup = $(this);
+
+                $('#iruby-form').submit(function() {
+                  popup.modal('hide');
+                });
+
+                Jupyter.notebook.keyboard_manager.disable();
+              }
+            });
+
+            popup.find('.modal-footer').each(function(e) {
+              $(this).append('#{@buttons.map(&:to_html).join}');
+            });
+          });
+        JS
+      end
+    end
+  end
+end

data/lib/iruby/input/radio.rb

@@ -0,0 +1,59 @@
+module IRuby
+  module Input
+    class Radio < Label
+      needs :options, :default
+
+      builder :radio do |*args, **params|
+        key = :radio
+        key, *args = args if args.first.is_a? Symbol
+
+        params[:key] = unique_key(key)
+        params[:options] = args
+        params[:default] ||= false
+        add_field Radio.new(**params)
+      end
+
+      def widget_css
+        <<-CSS
+          .iruby-radio.form-control { display: inline-table; }
+          .iruby-radio .radio-inline { margin: 0 15px 0 0; }
+        CSS
+      end
+
+      def widget_js
+        <<-JS
+          $('.iruby-radio input').change(function(){
+            var parent = $(this).closest('.iruby-radio');
+            $(parent).data('iruby-value',
+              $(parent).find(':checked').val()
+            );
+          });
+          $('.iruby-radio input').trigger('change');
+        JS
+      end
+
+      def widget_html
+        params = {
+          :'data-iruby-key' => @key,
+          :'data-iruby-value' => @options.first,
+          class: 'iruby-radio form-control'
+        }
+        widget_label do
+          div **params do
+            @options.each do |option|
+              label class: 'radio-inline' do
+                input(
+                  name: @key,
+                  value: option,
+                  type: 'radio',
+                  checked: @default == option
+                )
+                text option
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end