dante-editor 0.0.10 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +4 -0
  3. data/app/assets/javascripts/dante.js +4 -0
  4. data/app/assets/javascripts/dante/editor.js.coffee +56 -25
  5. data/app/assets/javascripts/dante/tooltip.js.coffee +14 -304
  6. data/app/assets/javascripts/dante/tooltip_widget.js.coffee +10 -0
  7. data/app/assets/javascripts/dante/tooltip_widgets/embed.js.coffee +60 -0
  8. data/app/assets/javascripts/dante/tooltip_widgets/extract.js.coffee +64 -0
  9. data/app/assets/javascripts/dante/tooltip_widgets/uploader.js.coffee +224 -0
  10. data/app/assets/javascripts/dante/view.js.coffee +46 -1
  11. data/app/assets/stylesheets/{dante.css.scss → dante.scss} +0 -0
  12. data/bower.json +1 -1
  13. data/config.rb +2 -2
  14. data/dist/{0.0.10/css → css}/dante-editor.css +0 -0
  15. data/dist/{0.0.10/fonts → fonts}/dante/dante.eot +0 -0
  16. data/dist/{0.0.10/fonts → fonts}/dante/dante.svg +0 -0
  17. data/dist/{0.0.10/fonts → fonts}/dante/dante.ttf +0 -0
  18. data/dist/{0.0.10/fonts → fonts}/dante/dante.woff +0 -0
  19. data/dist/{0.0.10/fonts → fonts}/dante/fontello.eot +0 -0
  20. data/dist/{0.0.10/fonts → fonts}/dante/fontello.svg +0 -0
  21. data/dist/{0.0.10/fonts → fonts}/dante/fontello.ttf +0 -0
  22. data/dist/{0.0.10/fonts → fonts}/dante/fontello.woff +0 -0
  23. data/dist/{0.0.10/images → images}/dante/media-loading-placeholder.png +0 -0
  24. data/dist/{0.0.10/js → js}/dante-editor.js +355 -138
  25. data/lib/dante-editor/version.rb +1 -1
  26. data/source/assets/javascripts/examples/custom_toolbar.js.coffee +30 -0
  27. data/source/custom_toolbar.erb +29 -0
  28. data/source/layouts/layout.erb +1 -1
  29. metadata +20 -47
  30. data/dist/0.0.7/css/dante-editor.css +0 -1077
  31. data/dist/0.0.7/fonts/dante/dante.eot +0 -0
  32. data/dist/0.0.7/fonts/dante/dante.svg +0 -14
  33. data/dist/0.0.7/fonts/dante/dante.ttf +0 -0
  34. data/dist/0.0.7/fonts/dante/dante.woff +0 -0
  35. data/dist/0.0.7/fonts/dante/fontello.eot +0 -0
  36. data/dist/0.0.7/fonts/dante/fontello.svg +0 -36
  37. data/dist/0.0.7/fonts/dante/fontello.ttf +0 -0
  38. data/dist/0.0.7/fonts/dante/fontello.woff +0 -0
  39. data/dist/0.0.7/images/dante/media-loading-placeholder.png +0 -0
  40. data/dist/0.0.7/js/dante-editor.js +0 -2610
  41. data/dist/0.0.8/css/dante-editor.css +0 -1116
  42. data/dist/0.0.8/fonts/dante/dante.eot +0 -0
  43. data/dist/0.0.8/fonts/dante/dante.svg +0 -14
  44. data/dist/0.0.8/fonts/dante/dante.ttf +0 -0
  45. data/dist/0.0.8/fonts/dante/dante.woff +0 -0
  46. data/dist/0.0.8/fonts/dante/fontello.eot +0 -0
  47. data/dist/0.0.8/fonts/dante/fontello.svg +0 -36
  48. data/dist/0.0.8/fonts/dante/fontello.ttf +0 -0
  49. data/dist/0.0.8/fonts/dante/fontello.woff +0 -0
  50. data/dist/0.0.8/images/dante/media-loading-placeholder.png +0 -0
  51. data/dist/0.0.8/js/dante-editor.js +0 -2532
  52. data/dist/0.0.9/css/dante-editor.css +0 -1116
  53. data/dist/0.0.9/fonts/dante/dante.eot +0 -0
  54. data/dist/0.0.9/fonts/dante/dante.svg +0 -14
  55. data/dist/0.0.9/fonts/dante/dante.ttf +0 -0
  56. data/dist/0.0.9/fonts/dante/dante.woff +0 -0
  57. data/dist/0.0.9/fonts/dante/fontello.eot +0 -0
  58. data/dist/0.0.9/fonts/dante/fontello.svg +0 -36
  59. data/dist/0.0.9/fonts/dante/fontello.ttf +0 -0
  60. data/dist/0.0.9/fonts/dante/fontello.woff +0 -0
  61. data/dist/0.0.9/images/dante/media-loading-placeholder.png +0 -0
  62. data/dist/0.0.9/js/dante-editor.js +0 -2575
@@ -8,7 +8,7 @@
8
8
  defaults: {
9
9
  image_placeholder: '../images/dante/media-loading-placeholder.png'
10
10
  },
11
- version: "0.0.10"
11
+ version: "0.0.11"
12
12
  };
13
13
 
14
14
  }).call(this);
@@ -317,6 +317,8 @@
317
317
 
318
318
  }).call(this);
319
319
  (function() {
320
+ var extend;
321
+
320
322
  Dante.View = (function() {
321
323
  function View(opts) {
322
324
  if (opts == null) {
@@ -394,6 +396,32 @@
394
396
 
395
397
  })();
396
398
 
399
+ extend = function(protoProps, staticProps) {
400
+ var Surrogate, child, parent;
401
+ parent = this;
402
+ child = void 0;
403
+ if (protoProps && _.has(protoProps, 'constructor')) {
404
+ child = protoProps.constructor;
405
+ } else {
406
+ child = function() {
407
+ return parent.apply(this, arguments);
408
+ };
409
+ }
410
+ _.extend(child, parent, staticProps);
411
+ Surrogate = function() {
412
+ this.constructor = child;
413
+ };
414
+ Surrogate.prototype = parent.prototype;
415
+ child.prototype = new Surrogate;
416
+ if (protoProps) {
417
+ _.extend(child.prototype, protoProps);
418
+ }
419
+ child.__super__ = parent.prototype;
420
+ return child;
421
+ };
422
+
423
+ Dante.View.extend = extend;
424
+
397
425
  }).call(this);
398
426
  (function() {
399
427
  var utils,
@@ -461,6 +489,9 @@
461
489
  this.disable_title = opts.disable_title || false;
462
490
  this.store_interval = opts.store_interval || 15000;
463
491
  this.paste_element_id = "#dante-paste-div";
492
+ this.tooltip_class = opts.tooltip_class || Dante.Editor.Tooltip;
493
+ opts.base_widgets || (opts.base_widgets = ["uploader", "embed", "embed_extract"]);
494
+ this.widgets = [];
464
495
  window.debugMode = opts.debug || false;
465
496
  if (window.debugMode) {
466
497
  $(this.el).addClass("debug");
@@ -476,7 +507,38 @@
476
507
  embedplaceholder = opts.embed_placeholder || 'Paste a YouTube, Vine, Vimeo, or other video link, and press Enter';
477
508
  this.embed_placeholder = "<span class='defaultValue defaultValue--root'>" + embedplaceholder + "</span><br>";
478
509
  extractplaceholder = opts.extract_placeholder || "Paste a link to embed content from another site (e.g. Twitter) and press Enter";
479
- return this.extract_placeholder = "<span class='defaultValue defaultValue--root'>" + extractplaceholder + "</span><br>";
510
+ this.extract_placeholder = "<span class='defaultValue defaultValue--root'>" + extractplaceholder + "</span><br>";
511
+ return this.initializeWidgets(opts);
512
+ };
513
+
514
+ Editor.prototype.initializeWidgets = function(opts) {
515
+ var base_widgets;
516
+ base_widgets = opts.base_widgets;
517
+ if (base_widgets.indexOf("uploader") >= 0) {
518
+ this.uploader_widget = new Dante.View.TooltipWidget.Uploader({
519
+ current_editor: this
520
+ });
521
+ this.widgets.push(this.uploader_widget);
522
+ }
523
+ if (base_widgets.indexOf("embed") >= 0) {
524
+ this.embed_widget = new Dante.View.TooltipWidget.Embed({
525
+ current_editor: this
526
+ });
527
+ this.widgets.push(this.embed_widget);
528
+ }
529
+ if (base_widgets.indexOf("embed_extract") >= 0) {
530
+ this.embed_extract_widget = new Dante.View.TooltipWidget.EmbedExtract({
531
+ current_editor: this
532
+ });
533
+ this.widgets.push(this.embed_extract_widget);
534
+ }
535
+ if (opts.extra_tooltip_widgets) {
536
+ return _.each(opts.extra_tooltip_widgets, (function(_this) {
537
+ return function(w) {
538
+ return _this.widgets.push(w);
539
+ };
540
+ })(this));
541
+ }
480
542
  };
481
543
 
482
544
  Editor.prototype.store = function() {
@@ -536,8 +598,9 @@
536
598
  this.editor_menu = new Dante.Editor.Menu({
537
599
  editor: this
538
600
  });
539
- this.tooltip_view = new Dante.Editor.Tooltip({
540
- editor: this
601
+ this.tooltip_view = new this.tooltip_class({
602
+ editor: this,
603
+ widgets: this.widgets
541
604
  });
542
605
  this.pop_over = new Dante.Editor.PopOver({
543
606
  editor: this
@@ -1017,7 +1080,7 @@
1017
1080
  return _.each(elements.find("img"), (function(_this) {
1018
1081
  return function(image) {
1019
1082
  utils.log("process image here!");
1020
- return _this.tooltip_view.uploadExistentImage(image);
1083
+ return _this.uploader_widget.uploadExistentImage(image);
1021
1084
  };
1022
1085
  })(this));
1023
1086
  };
@@ -1119,10 +1182,10 @@
1119
1182
  };
1120
1183
 
1121
1184
  Editor.prototype.handleKeyDown = function(e) {
1122
- var $node, anchor_node, li, parent, utils_anchor_node;
1185
+ var anchor_node, li, parent, utils_anchor_node;
1123
1186
  utils.log("KEYDOWN");
1124
1187
  anchor_node = this.getNode();
1125
- $node = $(anchor_node);
1188
+ parent = $(anchor_node);
1126
1189
  if (anchor_node) {
1127
1190
  this.markAsSelected(anchor_node);
1128
1191
  }
@@ -1132,21 +1195,23 @@
1132
1195
  }
1133
1196
  if (e.which === 13) {
1134
1197
  $(this.el).find(".is-selected").removeClass("is-selected");
1135
- parent = $(anchor_node);
1136
1198
  utils.log(this.isLastChar());
1137
- if ($node.hasClass("graf--p")) {
1138
- li = this.handleSmartList($node, e);
1199
+ if (parent.hasClass("graf--p")) {
1200
+ li = this.handleSmartList(parent, e);
1139
1201
  if (li) {
1140
1202
  anchor_node = li;
1141
1203
  }
1142
- } else if ($node.hasClass("graf--li")) {
1143
- this.handleListLineBreak($node, e);
1144
- }
1145
- if (parent.hasClass("is-embedable")) {
1146
- this.tooltip_view.getEmbedFromNode($(anchor_node));
1147
- } else if (parent.hasClass("is-extractable")) {
1148
- this.tooltip_view.getExtractFromNode($(anchor_node));
1204
+ } else if (parent.hasClass("graf--li")) {
1205
+ this.handleListLineBreak(parent, e);
1149
1206
  }
1207
+ utils.log("HANDLING WIDGET KEYDOWNS");
1208
+ _.each(this.widgets, (function(_this) {
1209
+ return function(w) {
1210
+ if (w.handleEnterKey) {
1211
+ return w.handleEnterKey(e, parent);
1212
+ }
1213
+ };
1214
+ })(this));
1150
1215
  if (parent.hasClass("graf--mixtapeEmbed") || parent.hasClass("graf--iframe") || parent.hasClass("graf--figure")) {
1151
1216
  utils.log("supress linebreak from embed !(last char)");
1152
1217
  if (!this.isLastChar()) {
@@ -1206,8 +1271,8 @@
1206
1271
  utils.log("pass initial validations");
1207
1272
  anchor_node = this.getNode();
1208
1273
  utils_anchor_node = utils.getNode();
1209
- if ($node.hasClass("graf--li") && this.getCharacterPrecedingCaret().length === 0) {
1210
- return this.handleListBackspace($node, e);
1274
+ if (parent.hasClass("graf--li") && this.getCharacterPrecedingCaret().length === 0) {
1275
+ return this.handleListBackspace(parent, e);
1211
1276
  }
1212
1277
  if ($(utils_anchor_node).hasClass("section-content") || $(utils_anchor_node).hasClass("graf--first")) {
1213
1278
  utils.log("SECTION DETECTED FROM KEYDOWN " + (_.isEmpty($(utils_anchor_node).text())));
@@ -1241,8 +1306,8 @@
1241
1306
  }
1242
1307
  if (e.which === 32) {
1243
1308
  utils.log("SPACEBAR");
1244
- if ($node.hasClass("graf--p")) {
1245
- this.handleSmartList($node, e);
1309
+ if (parent.hasClass("graf--p")) {
1310
+ this.handleSmartList(parent, e);
1246
1311
  }
1247
1312
  }
1248
1313
  if (_.contains([38, 40], e.which)) {
@@ -1415,7 +1480,7 @@
1415
1480
  break;
1416
1481
  case "img":
1417
1482
  utils.log("images");
1418
- this.tooltip_view.uploadExistentImage(n);
1483
+ this.uploader_widget.uploadExistentImage(n);
1419
1484
  break;
1420
1485
  case "a":
1421
1486
  case 'strong':
@@ -1751,131 +1816,74 @@
1751
1816
 
1752
1817
  }).call(this);
1753
1818
  (function() {
1754
- var utils,
1755
- __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
1819
+ var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
1756
1820
  __hasProp = {}.hasOwnProperty,
1757
1821
  __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
1758
1822
 
1759
- utils = Dante.utils;
1760
-
1761
- Dante.Editor.Tooltip = (function(_super) {
1762
- __extends(Tooltip, _super);
1823
+ Dante.View.TooltipWidget = (function(_super) {
1824
+ __extends(TooltipWidget, _super);
1763
1825
 
1764
- function Tooltip() {
1826
+ function TooltipWidget() {
1765
1827
  this.hide = __bind(this.hide, this);
1766
- this.getExtract = __bind(this.getExtract, this);
1767
- this.getExtractFromNode = __bind(this.getExtractFromNode, this);
1768
- this.getEmbedFromNode = __bind(this.getEmbedFromNode, this);
1769
- this.uploadCompleted = __bind(this.uploadCompleted, this);
1770
- this.updateProgressBar = __bind(this.updateProgressBar, this);
1771
- this.uploadFile = __bind(this.uploadFile, this);
1772
- this.uploadFiles = __bind(this.uploadFiles, this);
1773
- this.toggleOptions = __bind(this.toggleOptions, this);
1774
- this.render = __bind(this.render, this);
1775
- this.initialize = __bind(this.initialize, this);
1776
- return Tooltip.__super__.constructor.apply(this, arguments);
1828
+ return TooltipWidget.__super__.constructor.apply(this, arguments);
1777
1829
  }
1778
1830
 
1779
- Tooltip.prototype.el = ".inlineTooltip";
1780
-
1781
- Tooltip.prototype.events = {
1782
- "click .inlineTooltip-button.control": "toggleOptions",
1783
- "click .inlineTooltip-menu button": "handleClick"
1784
- };
1785
-
1786
- Tooltip.prototype.initialize = function(opts) {
1831
+ TooltipWidget.prototype.initialize = function(opts) {
1787
1832
  if (opts == null) {
1788
1833
  opts = {};
1789
1834
  }
1790
- this.current_editor = opts.editor;
1791
- return this.buttons = [
1792
- {
1793
- icon: "icon-image",
1794
- title: "Add an image",
1795
- action: "image"
1796
- }, {
1797
- icon: "icon-video",
1798
- title: "Add a video",
1799
- action: "embed"
1800
- }, {
1801
- icon: "icon-embed",
1802
- title: "Add an embed",
1803
- action: "embed-extract"
1804
- }
1805
- ];
1835
+ this.icon = opts.icon;
1836
+ this.title = opts.title;
1837
+ return this.actionEvent = opts.title;
1806
1838
  };
1807
1839
 
1808
- Tooltip.prototype.template = function() {
1809
- var menu;
1810
- menu = "";
1811
- _.each(this.buttons, function(b) {
1812
- var data_action_value;
1813
- data_action_value = b.action_value ? "data-action-value='" + b.action_value + "'" : "";
1814
- return menu += "<button class='inlineTooltip-button scale' title='" + b.title + "' data-action='inline-menu-" + b.action + "' " + data_action_value + "> <span class='tooltip-icon " + b.icon + "'></span> </button>";
1815
- });
1816
- return "<button class='inlineTooltip-button control' title='Close Menu' data-action='inline-menu'> <span class='tooltip-icon icon-plus'></span> </button> <div class='inlineTooltip-menu'> " + menu + " </div>";
1840
+ TooltipWidget.prototype.hide = function() {
1841
+ return this.current_editor.tooltip_view.hide();
1817
1842
  };
1818
1843
 
1819
- Tooltip.prototype.insertTemplate = function() {
1820
- return "<figure contenteditable='false' class='graf graf--figure is-defaultValue' name='" + (utils.generateUniqueName()) + "' tabindex='0'> <div style='' class='aspectRatioPlaceholder is-locked'> <div style='padding-bottom: 100%;' class='aspect-ratio-fill'></div> <img src='' data-height='' data-width='' data-image-id='' class='graf-image' data-delayed-src=''> </div> <figcaption contenteditable='true' data-default-value='Type caption for image (optional)' class='imageCaption'> <span class='defaultValue'>Type caption for image (optional)</span> <br> </figcaption> </figure>";
1821
- };
1844
+ return TooltipWidget;
1822
1845
 
1823
- Tooltip.prototype.extractTemplate = function() {
1824
- return "<div class='graf graf--mixtapeEmbed is-selected' name=''> <a target='_blank' data-media-id='' class='js-mixtapeImage mixtapeImage mixtapeImage--empty u-ignoreBlock' href=''> </a> <a data-tooltip-type='link' data-tooltip-position='bottom' data-tooltip='' title='' class='markup--anchor markup--mixtapeEmbed-anchor' data-href='' href='' target='_blank'> <strong class='markup--strong markup--mixtapeEmbed-strong'></strong> <em class='markup--em markup--mixtapeEmbed-em'></em> </a> </div>";
1825
- };
1846
+ })(Dante.View);
1826
1847
 
1827
- Tooltip.prototype.embedTemplate = function() {
1828
- return "<figure contenteditable='false' class='graf--figure graf--iframe graf--first' name='504e' tabindex='0'> <div class='iframeContainer'> <iframe frameborder='0' width='700' height='393' data-media-id='' src='' data-height='480' data-width='854'> </iframe> </div> <figcaption contenteditable='true' data-default-value='Type caption for embed (optional)' class='imageCaption'> <a rel='nofollow' class='markup--anchor markup--figure-anchor' data-href='' href='' target='_blank'> </a> </figcaption> </figure>";
1829
- };
1848
+ }).call(this);
1849
+ (function() {
1850
+ var utils,
1851
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
1852
+ __hasProp = {}.hasOwnProperty,
1853
+ __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
1830
1854
 
1831
- Tooltip.prototype.render = function() {
1832
- $(this.el).html(this.template());
1833
- $(this.el).addClass("is-active");
1834
- return this;
1835
- };
1855
+ utils = Dante.utils;
1836
1856
 
1837
- Tooltip.prototype.toggleOptions = function() {
1838
- utils.log("Toggle Options!!");
1839
- $(this.el).toggleClass("is-scaled");
1840
- return false;
1857
+ Dante.View.TooltipWidget.Uploader = (function(_super) {
1858
+ __extends(Uploader, _super);
1859
+
1860
+ function Uploader() {
1861
+ this.uploadCompleted = __bind(this.uploadCompleted, this);
1862
+ this.updateProgressBar = __bind(this.updateProgressBar, this);
1863
+ this.uploadFile = __bind(this.uploadFile, this);
1864
+ this.uploadFiles = __bind(this.uploadFiles, this);
1865
+ return Uploader.__super__.constructor.apply(this, arguments);
1866
+ }
1867
+
1868
+ Uploader.prototype.initialize = function(opts) {
1869
+ if (opts == null) {
1870
+ opts = {};
1871
+ }
1872
+ this.icon = opts.icon || "icon-image";
1873
+ this.title = opts.title || "Add an image";
1874
+ this.action = opts.action || "menu-image";
1875
+ return this.current_editor = opts.current_editor;
1841
1876
  };
1842
1877
 
1843
- Tooltip.prototype.move = function(coords) {
1844
- var control_spacing, control_width, coord_left, coord_top, pull_size, tooltip;
1845
- tooltip = $(this.el);
1846
- control_width = tooltip.find(".control").css("width");
1847
- control_spacing = tooltip.find(".inlineTooltip-menu").css("padding-left");
1848
- pull_size = parseInt(control_width.replace(/px/, "")) + parseInt(control_spacing.replace(/px/, ""));
1849
- coord_left = coords.left - pull_size;
1850
- coord_top = coords.top;
1851
- return $(this.el).offset({
1852
- top: coord_top,
1853
- left: coord_left
1854
- });
1878
+ Uploader.prototype.handleClick = function(ev) {
1879
+ return this.imageSelect(ev);
1855
1880
  };
1856
1881
 
1857
- Tooltip.prototype.handleClick = function(ev) {
1858
- var name;
1859
- name = $(ev.currentTarget).data('action');
1860
- utils.log(name);
1861
- switch (name) {
1862
- case "inline-menu-image":
1863
- this.placeholder = "<p>PLACEHOLDER</p>";
1864
- this.imageSelect(ev);
1865
- break;
1866
- case "inline-menu-embed":
1867
- this.displayEmbedPlaceHolder();
1868
- break;
1869
- case "inline-menu-embed-extract":
1870
- this.displayExtractPlaceHolder();
1871
- break;
1872
- case "inline-menu-hr":
1873
- this.splitSection();
1874
- }
1875
- return false;
1882
+ Uploader.prototype.insertTemplate = function() {
1883
+ return "<figure contenteditable='false' class='graf graf--figure is-defaultValue' name='" + (utils.generateUniqueName()) + "' tabindex='0'> <div style='' class='aspectRatioPlaceholder is-locked'> <div style='padding-bottom: 100%;' class='aspect-ratio-fill'></div> <img src='' data-height='' data-width='' data-image-id='' class='graf-image' data-delayed-src=''> </div> <figcaption contenteditable='true' data-default-value='Type caption for image (optional)' class='imageCaption'> <span class='defaultValue'>Type caption for image (optional)</span> <br> </figcaption> </figure>";
1876
1884
  };
1877
1885
 
1878
- Tooltip.prototype.uploadExistentImage = function(image_element, opts) {
1886
+ Uploader.prototype.uploadExistentImage = function(image_element, opts) {
1879
1887
  var i, img, n, node, tmpl, _i, _ref;
1880
1888
  if (opts == null) {
1881
1889
  opts = {};
@@ -1910,7 +1918,7 @@
1910
1918
  return utils.log("FIG");
1911
1919
  };
1912
1920
 
1913
- Tooltip.prototype.replaceImg = function(image_element, figure) {
1921
+ Uploader.prototype.replaceImg = function(image_element, figure) {
1914
1922
  var img, self;
1915
1923
  utils.log(figure.attr("name"));
1916
1924
  utils.log(figure);
@@ -1939,11 +1947,11 @@
1939
1947
  };
1940
1948
  };
1941
1949
 
1942
- Tooltip.prototype.displayAndUploadImages = function(file) {
1950
+ Uploader.prototype.displayAndUploadImages = function(file) {
1943
1951
  return this.displayCachedImage(file);
1944
1952
  };
1945
1953
 
1946
- Tooltip.prototype.imageSelect = function(ev) {
1954
+ Uploader.prototype.imageSelect = function(ev) {
1947
1955
  var $selectFile, self;
1948
1956
  $selectFile = $('<input type="file" multiple="multiple">').click();
1949
1957
  self = this;
@@ -1954,7 +1962,7 @@
1954
1962
  });
1955
1963
  };
1956
1964
 
1957
- Tooltip.prototype.displayCachedImage = function(file) {
1965
+ Uploader.prototype.displayCachedImage = function(file) {
1958
1966
  var reader;
1959
1967
  this.current_editor.tooltip_view.hide();
1960
1968
  reader = new FileReader();
@@ -1992,7 +2000,7 @@
1992
2000
  return reader.readAsDataURL(file);
1993
2001
  };
1994
2002
 
1995
- Tooltip.prototype.getAspectRatio = function(w, h) {
2003
+ Uploader.prototype.getAspectRatio = function(w, h) {
1996
2004
  var fill_ratio, height, maxHeight, maxWidth, ratio, result, width;
1997
2005
  maxWidth = 700;
1998
2006
  maxHeight = 700;
@@ -2018,14 +2026,14 @@
2018
2026
  return result;
2019
2027
  };
2020
2028
 
2021
- Tooltip.prototype.formatData = function(file) {
2029
+ Uploader.prototype.formatData = function(file) {
2022
2030
  var formData;
2023
2031
  formData = new FormData();
2024
2032
  formData.append('file', file);
2025
2033
  return formData;
2026
2034
  };
2027
2035
 
2028
- Tooltip.prototype.uploadFiles = function(files) {
2036
+ Uploader.prototype.uploadFiles = function(files) {
2029
2037
  var acceptedTypes, file, i, _results;
2030
2038
  acceptedTypes = {
2031
2039
  "image/png": true,
@@ -2045,7 +2053,7 @@
2045
2053
  return _results;
2046
2054
  };
2047
2055
 
2048
- Tooltip.prototype.uploadFile = function(file, node) {
2056
+ Uploader.prototype.uploadFile = function(file, node) {
2049
2057
  var handleUp, n;
2050
2058
  n = node;
2051
2059
  handleUp = (function(_this) {
@@ -2084,7 +2092,7 @@
2084
2092
  });
2085
2093
  };
2086
2094
 
2087
- Tooltip.prototype.updateProgressBar = function(e) {
2095
+ Uploader.prototype.updateProgressBar = function(e) {
2088
2096
  var $progress, complete;
2089
2097
  $progress = $('.progress:first', this.$el);
2090
2098
  complete = "";
@@ -2098,11 +2106,56 @@
2098
2106
  }
2099
2107
  };
2100
2108
 
2101
- Tooltip.prototype.uploadCompleted = function(url, node) {
2109
+ Uploader.prototype.uploadCompleted = function(url, node) {
2102
2110
  return node.find("img").attr("src", url);
2103
2111
  };
2104
2112
 
2105
- Tooltip.prototype.displayEmbedPlaceHolder = function() {
2113
+ return Uploader;
2114
+
2115
+ })(Dante.View.TooltipWidget);
2116
+
2117
+ }).call(this);
2118
+ (function() {
2119
+ var utils,
2120
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
2121
+ __hasProp = {}.hasOwnProperty,
2122
+ __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
2123
+
2124
+ utils = Dante.utils;
2125
+
2126
+ Dante.View.TooltipWidget.Embed = (function(_super) {
2127
+ __extends(Embed, _super);
2128
+
2129
+ function Embed() {
2130
+ this.getEmbedFromNode = __bind(this.getEmbedFromNode, this);
2131
+ return Embed.__super__.constructor.apply(this, arguments);
2132
+ }
2133
+
2134
+ Embed.prototype.initialize = function(opts) {
2135
+ if (opts == null) {
2136
+ opts = {};
2137
+ }
2138
+ this.icon = opts.icon || "icon-video";
2139
+ this.title = opts.title || "Add a video";
2140
+ this.action = opts.action || "embed";
2141
+ return this.current_editor = opts.current_editor;
2142
+ };
2143
+
2144
+ Embed.prototype.handleClick = function(ev) {
2145
+ return this.displayEmbedPlaceHolder(ev);
2146
+ };
2147
+
2148
+ Embed.prototype.handleEnterKey = function(ev, $node) {
2149
+ if ($node.hasClass("is-embedable")) {
2150
+ return this.getEmbedFromNode($node);
2151
+ }
2152
+ };
2153
+
2154
+ Embed.prototype.embedTemplate = function() {
2155
+ return "<figure contenteditable='false' class='graf--figure graf--iframe graf--first' name='504e' tabindex='0'> <div class='iframeContainer'> <iframe frameborder='0' width='700' height='393' data-media-id='' src='' data-height='480' data-width='854'> </iframe> </div> <figcaption contenteditable='true' data-default-value='Type caption for embed (optional)' class='imageCaption'> <a rel='nofollow' class='markup--anchor markup--figure-anchor' data-href='' href='' target='_blank'> </a> </figcaption> </figure>";
2156
+ };
2157
+
2158
+ Embed.prototype.displayEmbedPlaceHolder = function() {
2106
2159
  var ph;
2107
2160
  ph = this.current_editor.embed_placeholder;
2108
2161
  this.node = this.current_editor.getNode();
@@ -2112,7 +2165,7 @@
2112
2165
  return false;
2113
2166
  };
2114
2167
 
2115
- Tooltip.prototype.getEmbedFromNode = function(node) {
2168
+ Embed.prototype.getEmbedFromNode = function(node) {
2116
2169
  this.node = $(node);
2117
2170
  this.node_name = this.node.attr("name");
2118
2171
  this.node.addClass("spinner");
@@ -2131,10 +2184,60 @@
2131
2184
  replaced_node.find(".markup--anchor").attr("href", url).text(url);
2132
2185
  return _this.hide();
2133
2186
  };
2187
+ })(this)).error((function(_this) {
2188
+ return function(res) {
2189
+ return _this.node.removeClass("spinner");
2190
+ };
2134
2191
  })(this));
2135
2192
  };
2136
2193
 
2137
- Tooltip.prototype.displayExtractPlaceHolder = function() {
2194
+ return Embed;
2195
+
2196
+ })(Dante.View.TooltipWidget);
2197
+
2198
+ }).call(this);
2199
+ (function() {
2200
+ var utils,
2201
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
2202
+ __hasProp = {}.hasOwnProperty,
2203
+ __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
2204
+
2205
+ utils = Dante.utils;
2206
+
2207
+ Dante.View.TooltipWidget.EmbedExtract = (function(_super) {
2208
+ __extends(EmbedExtract, _super);
2209
+
2210
+ function EmbedExtract() {
2211
+ this.getExtract = __bind(this.getExtract, this);
2212
+ this.getExtractFromNode = __bind(this.getExtractFromNode, this);
2213
+ return EmbedExtract.__super__.constructor.apply(this, arguments);
2214
+ }
2215
+
2216
+ EmbedExtract.prototype.initialize = function(opts) {
2217
+ if (opts == null) {
2218
+ opts = {};
2219
+ }
2220
+ this.icon = opts.icon || "icon-embed";
2221
+ this.title = opts.title || "Add an embed";
2222
+ this.action = opts.action || "embed-extract";
2223
+ return this.current_editor = opts.current_editor;
2224
+ };
2225
+
2226
+ EmbedExtract.prototype.handleClick = function(ev) {
2227
+ return this.displayExtractPlaceHolder(ev);
2228
+ };
2229
+
2230
+ EmbedExtract.prototype.handleEnterKey = function(ev, $node) {
2231
+ if ($node.hasClass("is-extractable")) {
2232
+ return this.getExtractFromNode($node);
2233
+ }
2234
+ };
2235
+
2236
+ EmbedExtract.prototype.extractTemplate = function() {
2237
+ return "<div class='graf graf--mixtapeEmbed is-selected' name=''> <a target='_blank' data-media-id='' class='js-mixtapeImage mixtapeImage mixtapeImage--empty u-ignoreBlock' href=''> </a> <a data-tooltip-type='link' data-tooltip-position='bottom' data-tooltip='' title='' class='markup--anchor markup--mixtapeEmbed-anchor' data-href='' href='' target='_blank'> <strong class='markup--strong markup--mixtapeEmbed-strong'></strong> <em class='markup--em markup--mixtapeEmbed-em'></em> </a> </div>";
2238
+ };
2239
+
2240
+ EmbedExtract.prototype.displayExtractPlaceHolder = function() {
2138
2241
  var ph;
2139
2242
  ph = this.current_editor.extract_placeholder;
2140
2243
  this.node = this.current_editor.getNode();
@@ -2144,7 +2247,7 @@
2144
2247
  return false;
2145
2248
  };
2146
2249
 
2147
- Tooltip.prototype.getExtractFromNode = function(node) {
2250
+ EmbedExtract.prototype.getExtractFromNode = function(node) {
2148
2251
  this.node = $(node);
2149
2252
  this.node_name = this.node.attr("name");
2150
2253
  this.node.addClass("spinner");
@@ -2168,15 +2271,125 @@
2168
2271
  }
2169
2272
  return _this.hide();
2170
2273
  };
2274
+ })(this)).error((function(_this) {
2275
+ return function(data) {
2276
+ return _this.node.removeClass("spinner");
2277
+ };
2171
2278
  })(this));
2172
2279
  };
2173
2280
 
2174
- Tooltip.prototype.getExtract = function(url) {
2281
+ EmbedExtract.prototype.getExtract = function(url) {
2175
2282
  return $.getJSON("" + this.current_editor.extract_url + url).done(function(data) {
2176
2283
  return utils.log(data);
2177
2284
  });
2178
2285
  };
2179
2286
 
2287
+ return EmbedExtract;
2288
+
2289
+ })(Dante.View.TooltipWidget);
2290
+
2291
+ }).call(this);
2292
+ (function() {
2293
+ var utils,
2294
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
2295
+ __hasProp = {}.hasOwnProperty,
2296
+ __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
2297
+
2298
+ utils = Dante.utils;
2299
+
2300
+ Dante.Editor.Tooltip = (function(_super) {
2301
+ __extends(Tooltip, _super);
2302
+
2303
+ function Tooltip() {
2304
+ this.hide = __bind(this.hide, this);
2305
+ this.toggleOptions = __bind(this.toggleOptions, this);
2306
+ this.render = __bind(this.render, this);
2307
+ this.initialize = __bind(this.initialize, this);
2308
+ return Tooltip.__super__.constructor.apply(this, arguments);
2309
+ }
2310
+
2311
+ Tooltip.prototype.el = ".inlineTooltip";
2312
+
2313
+ Tooltip.prototype.events = {
2314
+ "click .inlineTooltip-button.control": "toggleOptions",
2315
+ "click .inlineTooltip-menu button": "handleClick"
2316
+ };
2317
+
2318
+ Tooltip.prototype.initialize = function(opts) {
2319
+ if (opts == null) {
2320
+ opts = {};
2321
+ }
2322
+ this.current_editor = opts.editor;
2323
+ return this.widgets = opts.widgets;
2324
+ };
2325
+
2326
+ Tooltip.prototype.template = function() {
2327
+ var menu;
2328
+ menu = "";
2329
+ _.each(this.widgets, function(b) {
2330
+ var data_action_value;
2331
+ data_action_value = b.action_value ? "data-action-value='" + b.action_value + "'" : "";
2332
+ return menu += "<button class='inlineTooltip-button scale' title='" + b.title + "' data-action='inline-menu-" + b.action + "' " + data_action_value + "> <span class='tooltip-icon " + b.icon + "'></span> </button>";
2333
+ });
2334
+ return "<button class='inlineTooltip-button control' title='Close Menu' data-action='inline-menu'> <span class='tooltip-icon icon-plus'></span> </button> <div class='inlineTooltip-menu'> " + menu + " </div>";
2335
+ };
2336
+
2337
+ Tooltip.prototype.findWidgetByAction = function(name) {
2338
+ return _.find(this.widgets, function(e) {
2339
+ return e.action === name;
2340
+ });
2341
+ };
2342
+
2343
+ Tooltip.prototype.render = function() {
2344
+ $(this.el).html(this.template());
2345
+ $(this.el).addClass("is-active");
2346
+ return this;
2347
+ };
2348
+
2349
+ Tooltip.prototype.toggleOptions = function() {
2350
+ utils.log("Toggle Options!!");
2351
+ $(this.el).toggleClass("is-scaled");
2352
+ return false;
2353
+ };
2354
+
2355
+ Tooltip.prototype.move = function(coords) {
2356
+ var control_spacing, control_width, coord_left, coord_top, pull_size, tooltip;
2357
+ tooltip = $(this.el);
2358
+ control_width = tooltip.find(".control").css("width");
2359
+ control_spacing = tooltip.find(".inlineTooltip-menu").css("padding-left");
2360
+ pull_size = parseInt(control_width.replace(/px/, "")) + parseInt(control_spacing.replace(/px/, ""));
2361
+ coord_left = coords.left - pull_size;
2362
+ coord_top = coords.top;
2363
+ return $(this.el).offset({
2364
+ top: coord_top,
2365
+ left: coord_left
2366
+ });
2367
+ };
2368
+
2369
+ Tooltip.prototype.handleClick = function(ev) {
2370
+ var detected_widget, name, sub_name;
2371
+ name = $(ev.currentTarget).data('action');
2372
+ utils.log(name);
2373
+
2374
+ /*
2375
+ switch name
2376
+ when "inline-menu-image"
2377
+ @placeholder = "<p>PLACEHOLDER</p>"
2378
+ @imageSelect(ev)
2379
+ when "inline-menu-embed"
2380
+ @displayEmbedPlaceHolder()
2381
+ when "inline-menu-embed-extract"
2382
+ @displayExtractPlaceHolder()
2383
+ when "inline-menu-hr"
2384
+ @splitSection()
2385
+ */
2386
+ sub_name = name.replace("inline-menu-", "");
2387
+ if (detected_widget = this.findWidgetByAction(sub_name)) {
2388
+ detected_widget.handleClick(ev);
2389
+ }
2390
+ return false;
2391
+ };
2392
+
2180
2393
  Tooltip.prototype.cleanOperationClasses = function(node) {
2181
2394
  return node.removeClass("is-embedable is-extractable");
2182
2395
  };
@@ -2581,4 +2794,8 @@
2581
2794
 
2582
2795
 
2583
2796
 
2797
+
2798
+
2799
+
2800
+
2584
2801
  ;