dante-editor 0.0.15 → 0.1.0

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 (45) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile.lock +1 -1
  3. data/README.md +49 -10
  4. data/app/assets/fonts/dante/dante.eot +0 -0
  5. data/app/assets/fonts/dante/dante.svg +9 -5
  6. data/app/assets/fonts/dante/dante.ttf +0 -0
  7. data/app/assets/fonts/dante/dante.woff +0 -0
  8. data/app/assets/javascripts/dante/behavior.js.coffee +2 -0
  9. data/app/assets/javascripts/dante/behaviors/image.js.coffee +56 -0
  10. data/app/assets/javascripts/dante/behaviors/list.js.coffee +150 -0
  11. data/app/assets/javascripts/dante/behaviors/save.js.coffee +40 -0
  12. data/app/assets/javascripts/dante/behaviors/suggest.js.coffee +118 -0
  13. data/app/assets/javascripts/dante/editor.js.coffee +110 -228
  14. data/app/assets/javascripts/dante/popover.js.coffee +350 -11
  15. data/app/assets/javascripts/dante/tooltip_widgets/uploader.js.coffee +2 -2
  16. data/app/assets/javascripts/dante.js +5 -0
  17. data/app/assets/stylesheets/dante/_blame.scss +209 -0
  18. data/app/assets/stylesheets/dante/_caption.scss +14 -0
  19. data/app/assets/stylesheets/dante/_icons.scss +10 -5
  20. data/app/assets/stylesheets/dante/_menu.scss +7 -7
  21. data/app/assets/stylesheets/dante/_popover.scss +122 -44
  22. data/app/assets/stylesheets/dante/_utilities.scss +5 -1
  23. data/app/assets/stylesheets/dante/_variables.scss +7 -3
  24. data/app/assets/stylesheets/dante.scss +2 -0
  25. data/config.rb +5 -4
  26. data/dist/css/dante-editor.css +246 -44
  27. data/dist/fonts/dante/dante.eot +0 -0
  28. data/dist/fonts/dante/dante.svg +9 -5
  29. data/dist/fonts/dante/dante.ttf +0 -0
  30. data/dist/fonts/dante/dante.woff +0 -0
  31. data/dist/js/dante-editor.js +1015 -283
  32. data/lib/dante-editor/version.rb +1 -1
  33. data/source/api/cristian.json.erb +8 -0
  34. data/source/api/miguel.json.erb +8 -0
  35. data/source/api/resource.json.erb +8 -0
  36. data/source/api/save.json.erb +1 -0
  37. data/source/api/suggest.json.erb +22 -0
  38. data/source/assets/images/dante-demo.png +0 -0
  39. data/source/icons/image-center.svg +12 -0
  40. data/source/icons/image-fill.svg +11 -0
  41. data/source/icons/image-left.svg +15 -0
  42. data/source/icons/image-wide.svg +12 -0
  43. data/source/index.html.erb +6 -0
  44. data/source/partials/_readme.markdown +2 -2
  45. metadata +18 -2
@@ -8,7 +8,7 @@
8
8
  defaults: {
9
9
  image_placeholder: '../images/dante/media-loading-placeholder.png'
10
10
  },
11
- version: "0.0.15"
11
+ version: "0.1.0"
12
12
  };
13
13
 
14
14
  }).call(this);
@@ -474,15 +474,11 @@
474
474
  "mouseup": "handleMouseUp",
475
475
  "keydown": "handleKeyDown",
476
476
  "keyup": "handleKeyUp",
477
+ "keypress": "handleKeyPress",
477
478
  "paste": "handlePaste",
478
479
  "dblclick": "handleDblclick",
479
480
  "dragstart": "handleDrag",
480
481
  "drop": "handleDrag",
481
- "click .graf--figure .aspectRatioPlaceholder": "handleGrafFigureSelectImg",
482
- "click .graf--figure figcaption": "handleGrafFigureSelectCaption",
483
- "mouseover .graf--figure.graf--iframe": "handleGrafFigureSelectIframe",
484
- "mouseleave .graf--figure.graf--iframe": "handleGrafFigureUnSelectIframe",
485
- "keyup .graf--figure figcaption": "handleGrafCaptionTyping",
486
482
  "mouseover .markup--anchor": "displayPopOver",
487
483
  "mouseout .markup--anchor": "hidePopOver"
488
484
  };
@@ -504,21 +500,25 @@
504
500
  this.default_loading_placeholder = opts.default_loading_placeholder || Dante.defaults.image_placeholder;
505
501
  this.store_url = opts.store_url;
506
502
  this.store_method = opts.store_method || "POST";
503
+ this.store_success_handler = opts.store_success_handler;
507
504
  this.spell_check = opts.spellcheck || false;
508
505
  this.disable_title = opts.disable_title || false;
509
- this.store_interval = opts.store_interval || 15000;
506
+ this.store_interval = opts.store_interval || 1500;
510
507
  this.paste_element_id = "#dante-paste-div";
511
508
  this.tooltip_class = opts.tooltip_class || Dante.Editor.Tooltip;
509
+ this.suggest_url = opts.suggest_url || "/api/suggest.json";
510
+ this.suggest_query_param = opts.suggest_query_param || "q";
511
+ this.suggest_query_timeout = opts.suggest_query_timeout || 300;
512
+ this.suggest_handler = opts.suggest_handler || null;
513
+ this.suggest_resource_handler = opts.suggest_resource_handler || null;
512
514
  opts.base_widgets || (opts.base_widgets = ["uploader", "embed", "embed_extract"]);
515
+ opts.base_behaviors || (opts.base_behaviors = ["save", "image", "list", "suggest"]);
513
516
  this.widgets = [];
517
+ this.behaviors = [];
514
518
  window.debugMode = opts.debug || false;
515
519
  if (window.debugMode) {
516
520
  $(this.el).addClass("debug");
517
521
  }
518
- if (localStorage.getItem('contenteditable')) {
519
- $(this.el).html(localStorage.getItem('contenteditable'));
520
- }
521
- this.store();
522
522
  titleplaceholder = opts.title_placeholder || 'Title';
523
523
  this.title_placeholder = "<span class='defaultValue defaultValue--root'>" + titleplaceholder + "</span><br>";
524
524
  title = opts.title || '';
@@ -532,6 +532,50 @@
532
532
  return this.initializeWidgets(opts);
533
533
  };
534
534
 
535
+ Editor.prototype.initializeBehaviors = function(opts) {
536
+ var base_behaviors, self;
537
+ base_behaviors = opts.base_behaviors;
538
+ self = this;
539
+ if (base_behaviors.indexOf("suggest") >= 0) {
540
+ this.suggest_behavior = new Dante.View.Behavior.Suggest({
541
+ current_editor: this,
542
+ el: this.el
543
+ });
544
+ this.behaviors.push(this.suggest_behavior);
545
+ }
546
+ if (base_behaviors.indexOf("save") >= 0) {
547
+ this.save_behavior = new Dante.View.Behavior.Save({
548
+ current_editor: this,
549
+ el: this.el
550
+ });
551
+ this.behaviors.push(this.save_behavior);
552
+ }
553
+ if (base_behaviors.indexOf("image") >= 0) {
554
+ this.save_behavior = new Dante.View.Behavior.Image({
555
+ current_editor: this,
556
+ el: this.el
557
+ });
558
+ this.behaviors.push(this.save_behavior);
559
+ }
560
+ if (base_behaviors.indexOf("list") >= 0) {
561
+ this.save_behavior = new Dante.View.Behavior.List({
562
+ current_editor: this,
563
+ el: this.el
564
+ });
565
+ this.behaviors.push(this.save_behavior);
566
+ }
567
+ if (opts.extra_behaviors) {
568
+ return _.each(opts.extra_behaviors, (function(_this) {
569
+ return function(w) {
570
+ if (!w.current_editor) {
571
+ w.current_editor = self;
572
+ }
573
+ return _this.behaviors.push(w);
574
+ };
575
+ })(this));
576
+ }
577
+ };
578
+
535
579
  Editor.prototype.initializeWidgets = function(opts) {
536
580
  var base_widgets, self;
537
581
  base_widgets = opts.base_widgets;
@@ -566,43 +610,6 @@
566
610
  }
567
611
  };
568
612
 
569
- Editor.prototype.store = function() {
570
- if (!this.store_url) {
571
- return;
572
- }
573
- return setTimeout((function(_this) {
574
- return function() {
575
- return _this.checkforStore();
576
- };
577
- })(this), this.store_interval);
578
- };
579
-
580
- Editor.prototype.checkforStore = function() {
581
- if (this.content === this.getContent()) {
582
- utils.log("content not changed skip store");
583
- return this.store();
584
- } else {
585
- utils.log("content changed! update");
586
- this.content = this.getContent();
587
- return $.ajax({
588
- url: this.store_url,
589
- method: this.store_method,
590
- data: {
591
- body: this.getContent()
592
- },
593
- success: function(res) {
594
- utils.log("store!");
595
- return utils.log(res);
596
- },
597
- complete: (function(_this) {
598
- return function(jxhr) {
599
- return _this.store();
600
- };
601
- })(this)
602
- });
603
- }
604
- };
605
-
606
613
  Editor.prototype.getContent = function() {
607
614
  return $(this.el).find(".section-inner").html();
608
615
  };
@@ -633,6 +640,18 @@
633
640
  editor: this
634
641
  });
635
642
  this.pop_over.render().hide();
643
+ this.pop_over_typeahead = new Dante.Editor.PopOverTypeAhead({
644
+ editor: this
645
+ });
646
+ this.pop_over_typeahead.render().hide();
647
+ this.pop_over_card = new Dante.Editor.PopOverCard({
648
+ editor: this
649
+ });
650
+ this.pop_over_card.render().hide();
651
+ this.pop_over_align = new Dante.Editor.ImageTooltip({
652
+ editor: this
653
+ });
654
+ this.pop_over_align.render().hide();
636
655
  return this.tooltip_view.render().hide();
637
656
  };
638
657
 
@@ -650,7 +669,8 @@
650
669
  if (!_.isEmpty(this.initial_html.trim())) {
651
670
  this.appendInitialContent();
652
671
  }
653
- return this.parseInitialMess();
672
+ this.parseInitialMess();
673
+ return this.initializeBehaviors(this.editor_options);
654
674
  };
655
675
 
656
676
  Editor.prototype.restart = function() {
@@ -683,6 +703,16 @@
683
703
  }
684
704
  };
685
705
 
706
+ Editor.prototype.getSelectionStart = function() {
707
+ var node;
708
+ node = document.getSelection().anchorNode;
709
+ if (node.nodeType === 3) {
710
+ return node.parentNode;
711
+ } else {
712
+ return node;
713
+ }
714
+ };
715
+
686
716
  Editor.prototype.getRange = function() {
687
717
  var editor, range;
688
718
  editor = $(this.el)[0];
@@ -835,14 +865,6 @@
835
865
  return false;
836
866
  };
837
867
 
838
- Editor.prototype.handleGrafCaptionTyping = function(ev) {
839
- if (_.isEmpty(utils.getNode().textContent.trim())) {
840
- return $(this.getNode()).addClass("is-defaultValue");
841
- } else {
842
- return $(this.getNode()).removeClass("is-defaultValue");
843
- }
844
- };
845
-
846
868
  Editor.prototype.handleTextSelection = function(anchor_node) {
847
869
  var text;
848
870
  this.editor_menu.hide();
@@ -882,40 +904,6 @@
882
904
  return this.pop_over.hide(ev);
883
905
  };
884
906
 
885
- Editor.prototype.handleGrafFigureSelectImg = function(ev) {
886
- var element;
887
- utils.log("FIGURE SELECT");
888
- element = ev.currentTarget;
889
- this.markAsSelected(element);
890
- $(element).parent(".graf--figure").addClass("is-selected is-mediaFocused");
891
- return this.selection().removeAllRanges();
892
- };
893
-
894
- Editor.prototype.handleGrafFigureSelectIframe = function(ev) {
895
- var element;
896
- utils.log("FIGURE IFRAME SELECT");
897
- element = ev.currentTarget;
898
- this.iframeSelected = element;
899
- this.markAsSelected(element);
900
- $(element).addClass("is-selected is-mediaFocused");
901
- return this.selection().removeAllRanges();
902
- };
903
-
904
- Editor.prototype.handleGrafFigureUnSelectIframe = function(ev) {
905
- var element;
906
- utils.log("FIGURE IFRAME UNSELECT");
907
- element = ev.currentTarget;
908
- this.iframeSelected = null;
909
- return $(element).removeClass("is-selected is-mediaFocused");
910
- };
911
-
912
- Editor.prototype.handleGrafFigureSelectCaption = function(ev) {
913
- var element;
914
- utils.log("FIGCAPTION");
915
- element = ev.currentTarget;
916
- return $(element).parent(".graf--figure").removeClass("is-mediaFocused");
917
- };
918
-
919
907
  Editor.prototype.handleMouseUp = function(ev) {
920
908
  var anchor_node;
921
909
  utils.log("MOUSE UP");
@@ -1212,13 +1200,21 @@
1212
1200
  };
1213
1201
 
1214
1202
  Editor.prototype.handleKeyDown = function(e) {
1215
- var anchor_node, eventHandled, li, parent, utils_anchor_node;
1203
+ var anchor_node, eventHandled, parent, utils_anchor_node;
1216
1204
  utils.log("KEYDOWN");
1217
1205
  anchor_node = this.getNode();
1218
1206
  parent = $(anchor_node);
1219
1207
  if (anchor_node) {
1220
1208
  this.markAsSelected(anchor_node);
1221
1209
  }
1210
+ utils.log("HANDLING Behavior KEYDOWN");
1211
+ _.each(this.behaviors, (function(_this) {
1212
+ return function(b) {
1213
+ if (b.handleKeyDown) {
1214
+ return b.handleKeyDown(e, parent);
1215
+ }
1216
+ };
1217
+ })(this));
1222
1218
  if (e.which === TAB) {
1223
1219
  this.handleTab(anchor_node);
1224
1220
  return false;
@@ -1226,14 +1222,6 @@
1226
1222
  if (e.which === ENTER) {
1227
1223
  $(this.el).find(".is-selected").removeClass("is-selected");
1228
1224
  utils.log(this.isLastChar());
1229
- if (parent.hasClass("graf--p")) {
1230
- li = this.handleSmartList(parent, e);
1231
- if (li) {
1232
- anchor_node = li;
1233
- }
1234
- } else if (parent.hasClass("graf--li")) {
1235
- this.handleListLineBreak(parent, e);
1236
- }
1237
1225
  utils.log("HANDLING WIDGET KEYDOWNS");
1238
1226
  _.each(this.widgets, (function(_this) {
1239
1227
  return function(w) {
@@ -1318,9 +1306,6 @@
1318
1306
  utils.log("SCAPE FROM BACKSPACE HANDLER");
1319
1307
  return false;
1320
1308
  }
1321
- if (parent.hasClass("graf--li") && this.getCharacterPrecedingCaret().length === 0) {
1322
- return this.handleListBackspace(parent, e);
1323
- }
1324
1309
  if ($(anchor_node).hasClass("graf--p") && this.isFirstChar()) {
1325
1310
  if ($(anchor_node).prev().hasClass("graf--figure") && this.getSelectedText().length === 0) {
1326
1311
  e.preventDefault();
@@ -1353,12 +1338,6 @@
1353
1338
  }
1354
1339
  }
1355
1340
  }
1356
- if (e.which === SPACEBAR) {
1357
- utils.log("SPACEBAR");
1358
- if (parent.hasClass("graf--p")) {
1359
- this.handleSmartList(parent, e);
1360
- }
1361
- }
1362
1341
  if (_.contains([UPARROW, DOWNARROW], e.which)) {
1363
1342
  utils.log(e.which);
1364
1343
  this.handleArrowForKeyDown(e);
@@ -1383,17 +1362,20 @@
1383
1362
  utils.log("SKIP KEYUP");
1384
1363
  return false;
1385
1364
  }
1386
- utils.log("KEYUP");
1365
+ utils.log("ENTER KEYUP");
1387
1366
  this.editor_menu.hide();
1388
1367
  this.reachedTop = false;
1389
1368
  anchor_node = this.getNode();
1390
1369
  utils_anchor_node = utils.getNode();
1391
1370
  this.handleTextSelection(anchor_node);
1392
- if (_.contains([BACKSPACE, SPACEBAR, ENTER], e.which)) {
1393
- if ($(anchor_node).hasClass("graf--li")) {
1394
- this.removeSpanTag($(anchor_node));
1395
- }
1396
- }
1371
+ utils.log("HANDLING Behavior KEYUPS");
1372
+ _.each(this.behaviors, (function(_this) {
1373
+ return function(b) {
1374
+ if (b.handleKeyUp) {
1375
+ return b.handleKeyUp(e);
1376
+ }
1377
+ };
1378
+ })(this));
1397
1379
  if (e.which === BACKSPACE) {
1398
1380
  if ($(utils_anchor_node).hasClass("postField--body")) {
1399
1381
  utils.log("ALL GONE from UP");
@@ -1435,6 +1417,20 @@
1435
1417
  }
1436
1418
  };
1437
1419
 
1420
+ Editor.prototype.handleKeyPress = function(e, node) {
1421
+ var anchor_node, parent;
1422
+ anchor_node = this.getNode();
1423
+ parent = $(anchor_node);
1424
+ utils.log("HANDLING Behavior KEYPRESS");
1425
+ return _.each(this.behaviors, (function(_this) {
1426
+ return function(b) {
1427
+ if (b.handleKeyPress) {
1428
+ return b.handleKeyPress(e, parent);
1429
+ }
1430
+ };
1431
+ })(this));
1432
+ };
1433
+
1438
1434
  Editor.prototype.handleLineBreakWith = function(element_type, from_element) {
1439
1435
  var new_paragraph;
1440
1436
  new_paragraph = $("<" + element_type + " class='graf graf--" + element_type + " graf--empty is-selected'><br/></" + element_type + ">");
@@ -1583,8 +1579,6 @@
1583
1579
 
1584
1580
  Editor.prototype.cleanContents = function(element) {
1585
1581
  var paste_div, s;
1586
- utils.log("ti");
1587
- utils.log(element);
1588
1582
  if (_.isUndefined(element)) {
1589
1583
  element = $(this.el).find('.section-inner');
1590
1584
  } else {
@@ -1595,7 +1589,7 @@
1595
1589
  elements: ['strong', 'img', 'em', 'br', 'a', 'blockquote', 'b', 'u', 'i', 'pre', 'p', 'h1', 'h2', 'h3', 'h4', 'ul', 'ol', 'li'],
1596
1590
  attributes: {
1597
1591
  '__ALL__': ['class'],
1598
- a: ['href', 'title', 'target'],
1592
+ a: ['href', 'title', 'target', 'data-id', 'data-type', 'data-href', 'data-avatar'],
1599
1593
  img: ['src']
1600
1594
  },
1601
1595
  protocols: {
@@ -1701,9 +1695,11 @@
1701
1695
  Editor.prototype.setupLink = function(n) {
1702
1696
  var href, parent_name;
1703
1697
  parent_name = $(n).parent().prop("tagName").toLowerCase();
1704
- $(n).addClass("markup--anchor markup--" + parent_name + "-anchor");
1705
- href = $(n).attr("href");
1706
- return $(n).attr("data-href", href);
1698
+ if ($(n).data("type") !== "user") {
1699
+ $(n).addClass("markup--anchor markup--" + parent_name + "-anchor");
1700
+ href = $(n).attr("href");
1701
+ return $(n).attr("data-href", href);
1702
+ }
1707
1703
  };
1708
1704
 
1709
1705
  Editor.prototype.preCleanNode = function(element) {
@@ -1747,113 +1743,6 @@
1747
1743
  return $(element).attr("name", utils.generateUniqueName());
1748
1744
  };
1749
1745
 
1750
- Editor.prototype.listify = function($paragraph, listType, regex) {
1751
- var $li, $list, content;
1752
- utils.log("LISTIFY PARAGRAPH");
1753
- this.removeSpanTag($paragraph);
1754
- content = $paragraph.html().replace(/&nbsp;/g, " ").replace(regex, "");
1755
- switch (listType) {
1756
- case "ul":
1757
- $list = $("<ul></ul>");
1758
- break;
1759
- case "ol":
1760
- $list = $("<ol></ol>");
1761
- break;
1762
- default:
1763
- return false;
1764
- }
1765
- this.addClassesToElement($list[0]);
1766
- this.replaceWith("li", $paragraph);
1767
- $li = $(".is-selected");
1768
- this.setElementName($li[0]);
1769
- $li.html(content).wrap($list);
1770
- if ($li.find("br").length === 0) {
1771
- $li.append("<br/>");
1772
- }
1773
- this.setRangeAt($li[0]);
1774
- return $li[0];
1775
- };
1776
-
1777
- Editor.prototype.handleSmartList = function($item, e) {
1778
- var $li, chars, match, regex;
1779
- utils.log("HANDLE A SMART LIST");
1780
- chars = this.getCharacterPrecedingCaret();
1781
- match = chars.match(/^\s*(\-|\*)\s*$/);
1782
- if (match) {
1783
- utils.log("CREATING LIST ITEM");
1784
- e.preventDefault();
1785
- regex = new RegExp(/\s*(\-|\*)\s*/);
1786
- $li = this.listify($item, "ul", regex);
1787
- } else {
1788
- match = chars.match(/^\s*1(\.|\))\s*$/);
1789
- if (match) {
1790
- utils.log("CREATING LIST ITEM");
1791
- e.preventDefault();
1792
- regex = new RegExp(/\s*1(\.|\))\s*/);
1793
- $li = this.listify($item, "ol", regex);
1794
- }
1795
- }
1796
- return $li;
1797
- };
1798
-
1799
- Editor.prototype.handleListLineBreak = function($li, e) {
1800
- var $list, $paragraph, content;
1801
- utils.log("LIST LINE BREAK");
1802
- this.tooltip_view.hide();
1803
- $list = $li.parent("ol, ul");
1804
- $paragraph = $("<p></p>");
1805
- utils.log($li.prev());
1806
- if ($list.children().length === 1 && $li.text() === "") {
1807
- this.replaceWith("p", $list);
1808
- } else if ($li.text() === "" && ($li.next().length !== 0)) {
1809
- e.preventDefault();
1810
- } else if ($li.next().length === 0) {
1811
- if ($li.text() === "") {
1812
- e.preventDefault();
1813
- utils.log("BREAK FROM LIST");
1814
- $list.after($paragraph);
1815
- $li.addClass("graf--removed").remove();
1816
- } else if ($li.prev().length !== 0 && $li.prev().text() === "" && this.getCharacterPrecedingCaret() === "") {
1817
- e.preventDefault();
1818
- utils.log("PREV IS EMPTY");
1819
- content = $li.html();
1820
- $list.after($paragraph);
1821
- $li.prev().remove();
1822
- $li.addClass("graf--removed").remove();
1823
- $paragraph.html(content);
1824
- }
1825
- }
1826
- if ($list && $list.children().length === 0) {
1827
- $list.remove();
1828
- }
1829
- utils.log($li);
1830
- if ($li.hasClass("graf--removed")) {
1831
- utils.log("ELEMENT REMOVED");
1832
- this.addClassesToElement($paragraph[0]);
1833
- this.setRangeAt($paragraph[0]);
1834
- this.markAsSelected($paragraph[0]);
1835
- return this.scrollTo($paragraph);
1836
- }
1837
- };
1838
-
1839
- Editor.prototype.handleListBackspace = function($li, e) {
1840
- var $list, $paragraph, content;
1841
- $list = $li.parent("ol, ul");
1842
- utils.log("LIST BACKSPACE");
1843
- if ($li.prev().length === 0) {
1844
- e.preventDefault();
1845
- $list.before($li);
1846
- content = $li.html();
1847
- this.replaceWith("p", $li);
1848
- $paragraph = $(".is-selected");
1849
- $paragraph.removeClass("graf--empty").html(content).attr("name", utils.generateUniqueName());
1850
- if ($list.children().length === 0) {
1851
- $list.remove();
1852
- }
1853
- return this.setupFirstAndLast();
1854
- }
1855
- };
1856
-
1857
1746
  Editor.prototype.removeSpanTag = function($item) {
1858
1747
  var $spans, span, _i, _len;
1859
1748
  $spans = $item.find("span");
@@ -1872,79 +1761,599 @@
1872
1761
 
1873
1762
  }).call(this);
1874
1763
  (function() {
1875
- var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
1876
- __hasProp = {}.hasOwnProperty,
1764
+ var __hasProp = {}.hasOwnProperty,
1877
1765
  __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; };
1878
1766
 
1879
- Dante.View.TooltipWidget = (function(_super) {
1880
- __extends(TooltipWidget, _super);
1767
+ Dante.View.Behavior = (function(_super) {
1768
+ __extends(Behavior, _super);
1881
1769
 
1882
- function TooltipWidget() {
1883
- this.hide = __bind(this.hide, this);
1884
- return TooltipWidget.__super__.constructor.apply(this, arguments);
1770
+ function Behavior() {
1771
+ return Behavior.__super__.constructor.apply(this, arguments);
1885
1772
  }
1886
1773
 
1887
- TooltipWidget.prototype.initialize = function(opts) {
1888
- if (opts == null) {
1889
- opts = {};
1890
- }
1891
- this.icon = opts.icon;
1892
- this.title = opts.title;
1893
- return this.actionEvent = opts.title;
1894
- };
1895
-
1896
- TooltipWidget.prototype.hide = function() {
1897
- return this.current_editor.tooltip_view.hide();
1898
- };
1899
-
1900
- return TooltipWidget;
1774
+ return Behavior;
1901
1775
 
1902
1776
  })(Dante.View);
1903
1777
 
1904
1778
  }).call(this);
1905
1779
  (function() {
1906
1780
  var utils,
1907
- __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
1908
1781
  __hasProp = {}.hasOwnProperty,
1909
1782
  __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; };
1910
1783
 
1911
1784
  utils = Dante.utils;
1912
1785
 
1913
- Dante.View.TooltipWidget.Uploader = (function(_super) {
1914
- __extends(Uploader, _super);
1786
+ Dante.View.Behavior.Suggest = (function(_super) {
1787
+ __extends(Suggest, _super);
1915
1788
 
1916
- function Uploader() {
1917
- this.handleBackspaceKey = __bind(this.handleBackspaceKey, this);
1918
- this.uploadCompleted = __bind(this.uploadCompleted, this);
1919
- this.updateProgressBar = __bind(this.updateProgressBar, this);
1920
- this.uploadFile = __bind(this.uploadFile, this);
1921
- this.uploadFiles = __bind(this.uploadFiles, this);
1922
- return Uploader.__super__.constructor.apply(this, arguments);
1789
+ function Suggest() {
1790
+ return Suggest.__super__.constructor.apply(this, arguments);
1923
1791
  }
1924
1792
 
1925
- Uploader.prototype.initialize = function(opts) {
1793
+ Suggest.prototype.initialize = function(opts) {
1926
1794
  if (opts == null) {
1927
1795
  opts = {};
1928
1796
  }
1929
- this.icon = opts.icon || "icon-image";
1930
- this.title = opts.title || "Add an image";
1931
- this.action = opts.action || "menu-image";
1932
- return this.current_editor = opts.current_editor;
1797
+ this.actionEvent = opts.title;
1798
+ this.editor = opts.current_editor;
1799
+ this._name = null;
1800
+ return this.fetch_results = [];
1933
1801
  };
1934
1802
 
1935
- Uploader.prototype.handleClick = function(ev) {
1936
- return this.imageSelect(ev);
1803
+ Suggest.prototype.displayPopOver = function(ev) {
1804
+ return this.editor.pop_over_typeahead.displayAt(this.editor.getSelectionStart());
1937
1805
  };
1938
1806
 
1939
- Uploader.prototype.insertTemplate = function() {
1940
- 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>";
1807
+ Suggest.prototype.hidePopOver = function(ev) {
1808
+ console.log("display popover from typeahead");
1809
+ return this.editor.pop_over_typeahead.displayAt(ev);
1941
1810
  };
1942
1811
 
1943
- Uploader.prototype.uploadExistentImage = function(image_element, opts) {
1944
- var i, n, node, tmpl, _i, _ref, _results;
1945
- if (opts == null) {
1946
- opts = {};
1947
- }
1812
+ Suggest.prototype.desintegratePopOver = function(e) {
1813
+ $(this.editor.getSelectionStart()).remove();
1814
+ return this.pasteHtmlAtCaret(this.editor.getSelectionStart().textContent, false);
1815
+ };
1816
+
1817
+ Suggest.prototype.handleKeyPress = function(e) {
1818
+ if (!this.insideQuery()) {
1819
+ if (e.keyCode === 64) {
1820
+ e.preventDefault();
1821
+ return this.pasteHtmlAtCaret(this.wrapperTemplate("@"), false);
1822
+ }
1823
+ } else {
1824
+ console.log("ok let's search");
1825
+ return this.getResults((function(_this) {
1826
+ return function(e) {
1827
+ return _this.fetchResults(e);
1828
+ };
1829
+ })(this));
1830
+ }
1831
+ };
1832
+
1833
+ Suggest.prototype.handleKeyUp = function(e) {
1834
+ if (this.insideQuery()) {
1835
+ return this.fetchResults(e);
1836
+ }
1837
+ };
1838
+
1839
+ Suggest.prototype.fetchResults = function(e) {
1840
+ if (this.getResults.length < 1) {
1841
+ this.desintegratePopOver(e);
1842
+ }
1843
+ if (this.json_request) {
1844
+ this.json_request.abort();
1845
+ }
1846
+ return this.getResults((function(_this) {
1847
+ return function(e) {
1848
+ _this.displayPopOver(e);
1849
+ return _this.editor.pop_over_typeahead.appendData(_this.fetch_results);
1850
+ };
1851
+ })(this));
1852
+ };
1853
+
1854
+ Suggest.prototype.getResults = function(cb, e) {
1855
+ var q;
1856
+ q = this.editor.getSelectionStart().textContent.replace("@", "");
1857
+ clearTimeout(this.timeout);
1858
+ return this.timeout = setTimeout((function(_this) {
1859
+ return function() {
1860
+ return _this.json_request = $.ajax({
1861
+ url: "" + _this.editor.suggest_url + "?" + _this.editor.suggest_query_param + "=" + q,
1862
+ method: "get",
1863
+ dataType: "json"
1864
+ }).success(function(data) {
1865
+ if (_this.editor.suggest_handler) {
1866
+ _this.fetch_results = _this.editor.suggest_handler(data);
1867
+ } else {
1868
+ _this.fetch_results = data;
1869
+ }
1870
+ if (cb) {
1871
+ return cb(e);
1872
+ }
1873
+ }).error(function(data, err) {
1874
+ return console.log("error fetching results");
1875
+ });
1876
+ };
1877
+ })(this), this.editor.suggest_query_timeout);
1878
+ };
1879
+
1880
+ Suggest.prototype.insideQuery = function() {
1881
+ return $(this.editor.getSelectionStart()).hasClass("markup--query");
1882
+ };
1883
+
1884
+ Suggest.prototype.wrapperTemplate = function(name) {
1885
+ return "<span class='markup--query'>" + name + "</span>";
1886
+ };
1887
+
1888
+ Suggest.prototype.pasteHtmlAtCaret = function(html, selectPastedContent) {
1889
+ var el, firstNode, frag, lastNode, node, originalRange, range, sel;
1890
+ sel = void 0;
1891
+ range = void 0;
1892
+ if (window.getSelection) {
1893
+ sel = window.getSelection();
1894
+ if (sel.getRangeAt && sel.rangeCount) {
1895
+ range = sel.getRangeAt(0);
1896
+ range.deleteContents();
1897
+ el = document.createElement('div');
1898
+ el.innerHTML = html;
1899
+ frag = document.createDocumentFragment();
1900
+ node = void 0;
1901
+ lastNode = void 0;
1902
+ while (node = el.firstChild) {
1903
+ lastNode = frag.appendChild(node);
1904
+ }
1905
+ firstNode = frag.firstChild;
1906
+ range.insertNode(frag);
1907
+ if (lastNode) {
1908
+ range = range.cloneRange();
1909
+ range.setStartAfter(lastNode);
1910
+ if (selectPastedContent) {
1911
+ range.setStartBefore(firstNode);
1912
+ } else {
1913
+ range.collapse(true);
1914
+ }
1915
+ sel.removeAllRanges();
1916
+ sel.addRange(range);
1917
+ }
1918
+ }
1919
+ } else if ((sel = document.selection) && sel.type !== 'Control') {
1920
+ originalRange = sel.createRange();
1921
+ originalRange.collapse(true);
1922
+ sel.createRange().pasteHTML(html);
1923
+ if (selectPastedContent) {
1924
+ range = sel.createRange();
1925
+ range.setEndPoint('StartToStart', originalRange);
1926
+ range.select();
1927
+ }
1928
+ }
1929
+ };
1930
+
1931
+ return Suggest;
1932
+
1933
+ })(Dante.View.Behavior);
1934
+
1935
+ }).call(this);
1936
+ (function() {
1937
+ var utils,
1938
+ __hasProp = {}.hasOwnProperty,
1939
+ __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; };
1940
+
1941
+ utils = Dante.utils;
1942
+
1943
+ Dante.View.Behavior.Image = (function(_super) {
1944
+ __extends(Image, _super);
1945
+
1946
+ function Image() {
1947
+ return Image.__super__.constructor.apply(this, arguments);
1948
+ }
1949
+
1950
+ Image.prototype.events = {
1951
+ "click .graf--figure .aspectRatioPlaceholder": "handleGrafFigureSelectImg",
1952
+ "click .graf--figure figcaption": "handleGrafFigureSelectCaption",
1953
+ "keyup .graf--figure figcaption": "handleGrafCaptionTyping",
1954
+ "mouseover .graf--figure.graf--iframe": "handleGrafFigureSelectIframe",
1955
+ "mouseleave .graf--figure.graf--iframe": "handleGrafFigureUnSelectIframe"
1956
+ };
1957
+
1958
+ Image.prototype.initialize = function(opts) {
1959
+ if (opts == null) {
1960
+ opts = {};
1961
+ }
1962
+ return this.editor = opts.current_editor;
1963
+ };
1964
+
1965
+ Image.prototype.handleGrafFigureSelectImg = function(ev) {
1966
+ var element;
1967
+ utils.log("FIGURE SELECT");
1968
+ element = ev.currentTarget;
1969
+ this.editor.markAsSelected(element);
1970
+ $(element).parent(".graf--figure").addClass("is-selected is-mediaFocused");
1971
+ this.editor.selection().removeAllRanges();
1972
+ return this.showAlignPopover(ev);
1973
+ };
1974
+
1975
+ Image.prototype.showAlignPopover = function(ev) {
1976
+ var target;
1977
+ target = $(ev.currentTarget);
1978
+ if (!$(".popover--Aligntooltip").hasClass('is-active')) {
1979
+ return this.editor.pop_over_align.positionPopOver(target);
1980
+ }
1981
+ };
1982
+
1983
+ Image.prototype.handleGrafFigureSelectCaption = function(ev) {
1984
+ var element;
1985
+ utils.log("FIGCAPTION");
1986
+ element = ev.currentTarget;
1987
+ return $(element).parent(".graf--figure").removeClass("is-mediaFocused");
1988
+ };
1989
+
1990
+ Image.prototype.handleGrafCaptionTyping = function(ev) {
1991
+ if (_.isEmpty(utils.getNode().textContent.trim())) {
1992
+ return $(this.editor.getNode()).addClass("is-defaultValue");
1993
+ } else {
1994
+ return $(this.editor.getNode()).removeClass("is-defaultValue");
1995
+ }
1996
+ };
1997
+
1998
+ Image.prototype.handleGrafFigureSelectIframe = function(ev) {
1999
+ var element;
2000
+ utils.log("FIGURE IFRAME SELECT");
2001
+ element = ev.currentTarget;
2002
+ this.iframeSelected = element;
2003
+ this.editor.markAsSelected(element);
2004
+ $(element).addClass("is-selected is-mediaFocused");
2005
+ return this.editor.selection().removeAllRanges();
2006
+ };
2007
+
2008
+ Image.prototype.handleGrafFigureUnSelectIframe = function(ev) {
2009
+ var element;
2010
+ utils.log("FIGURE IFRAME UNSELECT");
2011
+ element = ev.currentTarget;
2012
+ this.iframeSelected = null;
2013
+ return $(element).removeClass("is-selected is-mediaFocused");
2014
+ };
2015
+
2016
+ return Image;
2017
+
2018
+ })(Dante.View.Behavior);
2019
+
2020
+ }).call(this);
2021
+ (function() {
2022
+ var utils,
2023
+ __hasProp = {}.hasOwnProperty,
2024
+ __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; };
2025
+
2026
+ utils = Dante.utils;
2027
+
2028
+ Dante.View.Behavior.List = (function(_super) {
2029
+ var BACKSPACE, DOWNARROW, ENTER, LEFTARROW, RIGHTARROW, SPACEBAR, TAB, UPARROW;
2030
+
2031
+ __extends(List, _super);
2032
+
2033
+ function List() {
2034
+ return List.__super__.constructor.apply(this, arguments);
2035
+ }
2036
+
2037
+ BACKSPACE = 8;
2038
+
2039
+ TAB = 9;
2040
+
2041
+ ENTER = 13;
2042
+
2043
+ SPACEBAR = 32;
2044
+
2045
+ LEFTARROW = 37;
2046
+
2047
+ UPARROW = 38;
2048
+
2049
+ RIGHTARROW = 39;
2050
+
2051
+ DOWNARROW = 40;
2052
+
2053
+ List.prototype.initialize = function(opts) {
2054
+ if (opts == null) {
2055
+ opts = {};
2056
+ }
2057
+ return this.editor = opts.current_editor;
2058
+ };
2059
+
2060
+ List.prototype.handleKeyDown = function(e, parent) {
2061
+ var anchor_node, li;
2062
+ if (e.which === ENTER) {
2063
+ if (parent.hasClass("graf--p")) {
2064
+ li = this.handleSmartList(parent, e);
2065
+ if (li) {
2066
+ anchor_node = li;
2067
+ }
2068
+ } else if (parent.hasClass("graf--li")) {
2069
+ this.handleListLineBreak(parent, e);
2070
+ }
2071
+ }
2072
+ if (e.which === SPACEBAR) {
2073
+ utils.log("SPACEBAR");
2074
+ if (parent.hasClass("graf--p")) {
2075
+ this.handleSmartList(parent, e);
2076
+ }
2077
+ }
2078
+ if (e.which === BACKSPACE) {
2079
+ if (parent.hasClass("graf--li") && this.editor.getCharacterPrecedingCaret().length === 0) {
2080
+ return this.handleListBackspace(parent, e);
2081
+ }
2082
+ }
2083
+ };
2084
+
2085
+ List.prototype.handleKeyUp = function(e) {
2086
+ var anchor_node;
2087
+ anchor_node = this.editor.getNode();
2088
+ if (_.contains([BACKSPACE, SPACEBAR, ENTER], e.which)) {
2089
+ if ($(anchor_node).hasClass("graf--li")) {
2090
+ return this.editor.removeSpanTag($(anchor_node));
2091
+ }
2092
+ }
2093
+ };
2094
+
2095
+ List.prototype.buildList = function($paragraph, listType, regex) {
2096
+ var $li, $list, content;
2097
+ utils.log("LISTIFY PARAGRAPH");
2098
+ this.editor.removeSpanTag($paragraph);
2099
+ content = $paragraph.html().replace(/&nbsp;/g, " ").replace(regex, "");
2100
+ switch (listType) {
2101
+ case "ul":
2102
+ $list = $("<ul></ul>");
2103
+ break;
2104
+ case "ol":
2105
+ $list = $("<ol></ol>");
2106
+ break;
2107
+ default:
2108
+ return false;
2109
+ }
2110
+ this.editor.addClassesToElement($list[0]);
2111
+ this.editor.replaceWith("li", $paragraph);
2112
+ $li = $(".is-selected");
2113
+ this.editor.setElementName($li[0]);
2114
+ $li.html(content).wrap($list);
2115
+ if ($li.find("br").length === 0) {
2116
+ $li.append("<br/>");
2117
+ }
2118
+ this.editor.setRangeAt($li[0]);
2119
+ return $li[0];
2120
+ };
2121
+
2122
+ List.prototype.handleSmartList = function($item, e) {
2123
+ var $li, chars, match, regex;
2124
+ utils.log("HANDLE A SMART LIST");
2125
+ chars = this.editor.getCharacterPrecedingCaret();
2126
+ match = chars.match(/^\s*(\-|\*)\s*$/);
2127
+ if (match) {
2128
+ utils.log("CREATING LIST ITEM");
2129
+ e.preventDefault();
2130
+ regex = new RegExp(/\s*(\-|\*)\s*/);
2131
+ $li = this.buildList($item, "ul", regex);
2132
+ } else {
2133
+ match = chars.match(/^\s*1(\.|\))\s*$/);
2134
+ if (match) {
2135
+ utils.log("CREATING LIST ITEM");
2136
+ e.preventDefault();
2137
+ regex = new RegExp(/\s*1(\.|\))\s*/);
2138
+ $li = this.buildList($item, "ol", regex);
2139
+ }
2140
+ }
2141
+ return $li;
2142
+ };
2143
+
2144
+ List.prototype.handleListLineBreak = function($li, e) {
2145
+ var $list, $paragraph, content;
2146
+ utils.log("LIST LINE BREAK");
2147
+ this.editor.tooltip_view.hide();
2148
+ $list = $li.parent("ol, ul");
2149
+ $paragraph = $("<p></p>");
2150
+ utils.log($li.prev());
2151
+ if ($list.children().length === 1 && $li.text() === "") {
2152
+ this.editor.replaceWith("p", $list);
2153
+ } else if ($li.text() === "" && ($li.next().length !== 0)) {
2154
+ e.preventDefault();
2155
+ } else if ($li.next().length === 0) {
2156
+ if ($li.text() === "") {
2157
+ e.preventDefault();
2158
+ utils.log("BREAK FROM LIST");
2159
+ $list.after($paragraph);
2160
+ $li.addClass("graf--removed").remove();
2161
+ } else if ($li.prev().length !== 0 && $li.prev().text() === "" && this.getCharacterPrecedingCaret() === "") {
2162
+ e.preventDefault();
2163
+ utils.log("PREV IS EMPTY");
2164
+ content = $li.html();
2165
+ $list.after($paragraph);
2166
+ $li.prev().remove();
2167
+ $li.addClass("graf--removed").remove();
2168
+ $paragraph.html(content);
2169
+ }
2170
+ }
2171
+ if ($list && $list.children().length === 0) {
2172
+ $list.remove();
2173
+ }
2174
+ utils.log($li);
2175
+ if ($li.hasClass("graf--removed")) {
2176
+ utils.log("ELEMENT REMOVED");
2177
+ this.editor.addClassesToElement($paragraph[0]);
2178
+ this.editor.setRangeAt($paragraph[0]);
2179
+ this.editor.markAsSelected($paragraph[0]);
2180
+ return this.editor.scrollTo($paragraph);
2181
+ }
2182
+ };
2183
+
2184
+ List.prototype.handleListBackspace = function($li, e) {
2185
+ var $list, $paragraph, content;
2186
+ $list = $li.parent("ol, ul");
2187
+ utils.log("LIST BACKSPACE");
2188
+ if ($li.prev().length === 0) {
2189
+ e.preventDefault();
2190
+ $list.before($li);
2191
+ content = $li.html();
2192
+ this.editor.replaceWith("p", $li);
2193
+ $paragraph = $(".is-selected");
2194
+ $paragraph.removeClass("graf--empty").html(content).attr("name", utils.generateUniqueName());
2195
+ if ($list.children().length === 0) {
2196
+ $list.remove();
2197
+ }
2198
+ return this.editor.setupFirstAndLast();
2199
+ }
2200
+ };
2201
+
2202
+ return List;
2203
+
2204
+ })(Dante.View.Behavior);
2205
+
2206
+ }).call(this);
2207
+ (function() {
2208
+ var utils,
2209
+ __hasProp = {}.hasOwnProperty,
2210
+ __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; };
2211
+
2212
+ utils = Dante.utils;
2213
+
2214
+ Dante.View.Behavior.Save = (function(_super) {
2215
+ __extends(Save, _super);
2216
+
2217
+ function Save() {
2218
+ return Save.__super__.constructor.apply(this, arguments);
2219
+ }
2220
+
2221
+ Save.prototype.events = {
2222
+ "input": "handleStore"
2223
+ };
2224
+
2225
+ Save.prototype.initialize = function(opts) {
2226
+ if (opts == null) {
2227
+ opts = {};
2228
+ }
2229
+ this.actionEvent = opts.title;
2230
+ this.editor = opts.current_editor;
2231
+ return this.content = this.editor.getContent();
2232
+ };
2233
+
2234
+ Save.prototype.handleStore = function(ev) {
2235
+ return this.store();
2236
+ };
2237
+
2238
+ Save.prototype.store = function() {
2239
+ if (!this.editor.store_url) {
2240
+ return;
2241
+ }
2242
+ utils.log("HANDLE DATA STORE");
2243
+ clearTimeout(this.timeout);
2244
+ return this.timeout = setTimeout((function(_this) {
2245
+ return function() {
2246
+ return _this.checkforStore();
2247
+ };
2248
+ })(this), this.editor.store_interval);
2249
+ };
2250
+
2251
+ Save.prototype.checkforStore = function() {
2252
+ utils.log("ENTER DATA STORE");
2253
+ if (this.content === this.editor.getContent()) {
2254
+ utils.log("content not changed skip store");
2255
+ return this.store();
2256
+ } else {
2257
+ utils.log("content changed! update");
2258
+ this.content = this.editor.getContent();
2259
+ return $.ajax({
2260
+ url: this.editor.store_url,
2261
+ method: this.editor.store_method,
2262
+ dataType: "json",
2263
+ data: {
2264
+ body: this.editor.getContent()
2265
+ },
2266
+ success: (function(_this) {
2267
+ return function(res) {
2268
+ utils.log("STORING CONTENT");
2269
+ if (_this.editor.store_success_handler) {
2270
+ return _this.editor.store_success_handler(res);
2271
+ }
2272
+ };
2273
+ })(this)
2274
+ });
2275
+ }
2276
+ };
2277
+
2278
+ return Save;
2279
+
2280
+ })(Dante.View.Behavior);
2281
+
2282
+ }).call(this);
2283
+ (function() {
2284
+ var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
2285
+ __hasProp = {}.hasOwnProperty,
2286
+ __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; };
2287
+
2288
+ Dante.View.TooltipWidget = (function(_super) {
2289
+ __extends(TooltipWidget, _super);
2290
+
2291
+ function TooltipWidget() {
2292
+ this.hide = __bind(this.hide, this);
2293
+ return TooltipWidget.__super__.constructor.apply(this, arguments);
2294
+ }
2295
+
2296
+ TooltipWidget.prototype.initialize = function(opts) {
2297
+ if (opts == null) {
2298
+ opts = {};
2299
+ }
2300
+ this.icon = opts.icon;
2301
+ this.title = opts.title;
2302
+ return this.actionEvent = opts.title;
2303
+ };
2304
+
2305
+ TooltipWidget.prototype.hide = function() {
2306
+ return this.current_editor.tooltip_view.hide();
2307
+ };
2308
+
2309
+ return TooltipWidget;
2310
+
2311
+ })(Dante.View);
2312
+
2313
+ }).call(this);
2314
+ (function() {
2315
+ var utils,
2316
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
2317
+ __hasProp = {}.hasOwnProperty,
2318
+ __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; };
2319
+
2320
+ utils = Dante.utils;
2321
+
2322
+ Dante.View.TooltipWidget.Uploader = (function(_super) {
2323
+ __extends(Uploader, _super);
2324
+
2325
+ function Uploader() {
2326
+ this.handleBackspaceKey = __bind(this.handleBackspaceKey, this);
2327
+ this.uploadCompleted = __bind(this.uploadCompleted, this);
2328
+ this.updateProgressBar = __bind(this.updateProgressBar, this);
2329
+ this.uploadFile = __bind(this.uploadFile, this);
2330
+ this.uploadFiles = __bind(this.uploadFiles, this);
2331
+ return Uploader.__super__.constructor.apply(this, arguments);
2332
+ }
2333
+
2334
+ Uploader.prototype.initialize = function(opts) {
2335
+ if (opts == null) {
2336
+ opts = {};
2337
+ }
2338
+ this.icon = opts.icon || "icon-image";
2339
+ this.title = opts.title || "Add an image";
2340
+ this.action = opts.action || "menu-image";
2341
+ return this.current_editor = opts.current_editor;
2342
+ };
2343
+
2344
+ Uploader.prototype.handleClick = function(ev) {
2345
+ return this.imageSelect(ev);
2346
+ };
2347
+
2348
+ Uploader.prototype.insertTemplate = function() {
2349
+ 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>";
2350
+ };
2351
+
2352
+ Uploader.prototype.uploadExistentImage = function(image_element, opts) {
2353
+ var i, n, node, tmpl, _i, _ref, _results;
2354
+ if (opts == null) {
2355
+ opts = {};
2356
+ }
1948
2357
  utils.log("process image here!");
1949
2358
  tmpl = $(this.insertTemplate());
1950
2359
  tmpl.find("img").attr('src', this.current_editor.default_loading_placeholder);
@@ -2507,8 +2916,8 @@
2507
2916
  PopOver.prototype.el = "body";
2508
2917
 
2509
2918
  PopOver.prototype.events = {
2510
- "mouseover .popover": "cancelHide",
2511
- "mouseout .popover": "hide"
2919
+ "mouseover .popover--tooltip": "cancelHide",
2920
+ "mouseout .popover--tooltip": "hide"
2512
2921
  };
2513
2922
 
2514
2923
  PopOver.prototype.initialize = function(opts) {
@@ -2516,6 +2925,7 @@
2516
2925
  opts = {};
2517
2926
  }
2518
2927
  utils.log("initialized popover");
2928
+ this.pop_over_element = ".popover--tooltip";
2519
2929
  this.editor = opts.editor;
2520
2930
  this.hideTimeout;
2521
2931
  return this.settings = {
@@ -2524,7 +2934,7 @@
2524
2934
  };
2525
2935
 
2526
2936
  PopOver.prototype.template = function() {
2527
- return "<div class='popover popover--tooltip popover--Linktooltip popover--bottom is-active'> <div class='popover-inner'> <a href='#' target='_blank'> Link </a> </div> <div class='popover-arrow'> </div> </div>";
2937
+ return "<div class='dante-popover popover--tooltip popover--Linktooltip popover--bottom is-active'> <div class='popover-inner'> <a href='#' target='_blank'> Link </a> </div> <div class='popover-arrow'> </div> </div>";
2528
2938
  };
2529
2939
 
2530
2940
  PopOver.prototype.positionAt = function(ev) {
@@ -2534,10 +2944,10 @@
2534
2944
  target_offset = target.offset();
2535
2945
  target_width = target.outerWidth();
2536
2946
  target_height = target.outerHeight();
2537
- popover_width = $(this.el).find(".popover").outerWidth();
2947
+ popover_width = this.findElement().outerWidth();
2538
2948
  top_value = target_positions.top + target_height;
2539
2949
  left_value = target_offset.left + (target_width / 2) - (popover_width / 2);
2540
- $(this.el).find(".popover").css("top", top_value).css("left", left_value).show();
2950
+ this.findElement().css("top", top_value).css("left", left_value).show();
2541
2951
  return this.handleDirection(target);
2542
2952
  };
2543
2953
 
@@ -2545,9 +2955,9 @@
2545
2955
  var target;
2546
2956
  this.cancelHide();
2547
2957
  target = $(ev.currentTarget);
2548
- $(this.el).find(".popover-inner a").text(target.attr('href')).attr('href', target.attr("href"));
2958
+ this.findElement().find(".popover-inner a").text(target.attr('href')).attr('href', target.attr("href"));
2549
2959
  this.positionAt(ev);
2550
- $(this.el).find(".popover--tooltip").css("pointer-events", "auto");
2960
+ this.findElement().css("pointer-events", "auto");
2551
2961
  return $(this.el).show();
2552
2962
  };
2553
2963
 
@@ -2560,7 +2970,7 @@
2560
2970
  this.cancelHide();
2561
2971
  return this.hideTimeout = setTimeout((function(_this) {
2562
2972
  return function() {
2563
- return $(_this.el).find(".popover").hide();
2973
+ return _this.findElement().hide();
2564
2974
  };
2565
2975
  })(this), this.settings.timeout);
2566
2976
  };
@@ -2575,12 +2985,16 @@
2575
2985
 
2576
2986
  PopOver.prototype.handleDirection = function(target) {
2577
2987
  if (target.parents(".graf--mixtapeEmbed").exists()) {
2578
- return $(this.el).find(".popover").removeClass("popover--bottom").addClass("popover--top");
2988
+ return this.findElement().removeClass("popover--bottom").addClass("popover--top");
2579
2989
  } else {
2580
- return $(this.el).find(".popover").removeClass("popover--top").addClass("popover--bottom");
2990
+ return this.findElement().removeClass("popover--top").addClass("popover--bottom");
2581
2991
  }
2582
2992
  };
2583
2993
 
2994
+ PopOver.prototype.findElement = function() {
2995
+ return $(this.el).find(this.pop_over_element);
2996
+ };
2997
+
2584
2998
  PopOver.prototype.render = function() {
2585
2999
  return $(this.template()).insertAfter(this.editor.$el);
2586
3000
  };
@@ -2589,6 +3003,319 @@
2589
3003
 
2590
3004
  })(Dante.View);
2591
3005
 
3006
+ Dante.Editor.PopOverTypeAhead = (function(_super) {
3007
+ __extends(PopOverTypeAhead, _super);
3008
+
3009
+ function PopOverTypeAhead() {
3010
+ return PopOverTypeAhead.__super__.constructor.apply(this, arguments);
3011
+ }
3012
+
3013
+ PopOverTypeAhead.prototype.el = "body";
3014
+
3015
+ PopOverTypeAhead.prototype.events = {
3016
+ "mouseover .popover--typeahead": "cancelHide",
3017
+ "mouseout .popover--typeahead": "hide",
3018
+ "click .typeahead-item": "handleOptionSelection"
3019
+ };
3020
+
3021
+ PopOverTypeAhead.prototype.initialize = function(opts) {
3022
+ if (opts == null) {
3023
+ opts = {};
3024
+ }
3025
+ this.pop_over_element = "popover--typeahead";
3026
+ utils.log("initialized popover");
3027
+ this.editor = opts.editor;
3028
+ this.hideTimeout;
3029
+ this.settings = {
3030
+ timeout: 300
3031
+ };
3032
+ return this.typeaheadStyles();
3033
+ };
3034
+
3035
+ PopOverTypeAhead.prototype.template = function() {
3036
+ return "<div class='dante-popover popover--typeahead js-popover typeahead typeahead--mention popover--maxWidth360 popover--bottom is-active'> <div class='popover-inner js-popover-inner'> <ul></ul> </div> <div class='popover-arrow' style='left: 297px;'></div> </div>";
3037
+ };
3038
+
3039
+ PopOverTypeAhead.prototype.popoverItem = function(item) {
3040
+ return "<li class='typeahead-item' data-action-value='" + item.text + "' data-action='typeahead-populate' data-id='" + item.id + "' data-type='" + item.type + "' data-href='" + item.href + "'> <div class='dante-avatar'> <img src='" + item.avatar + "' class='avatar-image avatar-image--icon' alt='" + item.text + "'> <span class='avatar-text'>" + item.text + "</span> <em class='avatar-description'>" + item.description + "</em> </div> </li>";
3041
+ };
3042
+
3043
+ PopOverTypeAhead.prototype.typeaheadStyles = function() {
3044
+ return this.classesForCurrent = "typeahead typeahead--mention popover--maxWidth360";
3045
+ };
3046
+
3047
+ PopOverTypeAhead.prototype.handleOptionSelection = function(ev) {
3048
+ var data;
3049
+ ev.preventDefault;
3050
+ console.log("Select option here!");
3051
+ data = $(ev.currentTarget).data();
3052
+ $(".markup--query").replaceWith(this.linkTemplate(data));
3053
+ return this.hide(0);
3054
+ };
3055
+
3056
+ PopOverTypeAhead.prototype.linkTemplate = function(data) {
3057
+ return "<a href='#' data-type='" + data.type + "' data-href='" + data.href + "' data-id='" + data.id + "' class='markup--user markup--p-user'> " + data.actionValue + " </a>";
3058
+ };
3059
+
3060
+ PopOverTypeAhead.prototype.positionAt = function(target) {
3061
+ var left_value, popover_width, target_height, target_offset, target_positions, target_width, top_value;
3062
+ target = $(target);
3063
+ target_positions = this.resolveTargetPosition(target);
3064
+ target_offset = target.offset();
3065
+ target_width = target.outerWidth();
3066
+ target_height = target.outerHeight();
3067
+ popover_width = this.findElement().outerWidth();
3068
+ top_value = target_positions.top + target_height;
3069
+ left_value = target_offset.left + (target_width / 2) - (popover_width / 2);
3070
+ this.findElement().css("top", top_value).css("left", left_value).show();
3071
+ return this.handleDirection(target);
3072
+ };
3073
+
3074
+ PopOverTypeAhead.prototype.displayAt = function(ev) {
3075
+ this.cancelHide();
3076
+ return this.positionAt(ev);
3077
+ };
3078
+
3079
+ PopOverTypeAhead.prototype.cancelHide = function() {
3080
+ utils.log("Cancel Hide");
3081
+ return clearTimeout(this.hideTimeout);
3082
+ };
3083
+
3084
+ PopOverTypeAhead.prototype.findElement = function() {
3085
+ return $(this.el).find("." + this.pop_over_element);
3086
+ };
3087
+
3088
+ PopOverTypeAhead.prototype.hide = function(ev, timeout) {
3089
+ if (timeout == null) {
3090
+ timeout = this.settings.timeout;
3091
+ }
3092
+ this.cancelHide();
3093
+ return this.hideTimeout = setTimeout((function(_this) {
3094
+ return function() {
3095
+ return _this.findElement().hide();
3096
+ };
3097
+ })(this), timeout);
3098
+ };
3099
+
3100
+ PopOverTypeAhead.prototype.appendData = function(data) {
3101
+ this.findElement().find(".popover-inner ul").html("");
3102
+ return _.each(data, (function(_this) {
3103
+ return function(item) {
3104
+ return _this.findElement().find(".popover-inner ul").append(_this.popoverItem(item));
3105
+ };
3106
+ })(this));
3107
+ };
3108
+
3109
+ PopOverTypeAhead.prototype.resolveTargetPosition = function(target) {
3110
+ if (target.parents(".graf--mixtapeEmbed").exists()) {
3111
+ return target.parents(".graf--mixtapeEmbed").position();
3112
+ } else {
3113
+ return target.position();
3114
+ }
3115
+ };
3116
+
3117
+ PopOverTypeAhead.prototype.handleDirection = function(target) {
3118
+ if (target.parents(".graf--mixtapeEmbed").exists()) {
3119
+ return this.findElement().removeClass("popover--bottom").addClass("popover--top");
3120
+ } else {
3121
+ return this.findElement().removeClass("popover--top").addClass("popover--bottom");
3122
+ }
3123
+ };
3124
+
3125
+ PopOverTypeAhead.prototype.render = function() {
3126
+ return $(this.template()).insertAfter(this.editor.$el);
3127
+ };
3128
+
3129
+ return PopOverTypeAhead;
3130
+
3131
+ })(Dante.Editor.PopOver);
3132
+
3133
+ Dante.Editor.PopOverCard = (function(_super) {
3134
+ __extends(PopOverCard, _super);
3135
+
3136
+ function PopOverCard() {
3137
+ return PopOverCard.__super__.constructor.apply(this, arguments);
3138
+ }
3139
+
3140
+ PopOverCard.prototype.el = "body";
3141
+
3142
+ PopOverCard.prototype.events = {
3143
+ "mouseover .popover--card": "cancelHide",
3144
+ "mouseout .popover--card": "hide",
3145
+ "mouseover .markup--user": "displayPopOver",
3146
+ "mouseout .markup--user": "hidePopOver"
3147
+ };
3148
+
3149
+ PopOverCard.prototype.initialize = function(opts) {
3150
+ if (opts == null) {
3151
+ opts = {};
3152
+ }
3153
+ this.pop_over_element = ".popover--card";
3154
+ utils.log("initialized popover");
3155
+ this.editor = opts.editor;
3156
+ this.hideTimeout;
3157
+ this.settings = {
3158
+ timeout: 300
3159
+ };
3160
+ return this.card_data = {};
3161
+ };
3162
+
3163
+ PopOverCard.prototype.template = function() {
3164
+ return "<div class='dante-popover popover--card js-popover popover--animated popover--flexible popover--top is-active'> <div class='popover-inner js-popover-inner'> </div> </div>";
3165
+ };
3166
+
3167
+ PopOverCard.prototype.cardTemplate = function() {
3168
+ return "<div class='popoverCard'> <div class='u-clearfix'> <div class='u-floatLeft popoverCard-meta'> <h4 class='popoverCard-title'> <a class='link u-baseColor--link' href='" + this.card_data.href + "' title='" + this.card_data.text + "' aria-label='" + this.card_data.text + "' data-user-id='" + this.card_data.id + "' dir='auto'> " + this.card_data.text + " </a> </h4> <div class='popoverCard-description'> " + this.card_data.description + " </div> </div> <div class='u-floatRight popoverCard-avatar'> <a class='link dante-avatar u-baseColor--link' href='" + this.card_data.href + "' title='" + this.card_data.text + "' aria-label='" + this.card_data.text + "' data-user-id='" + this.card_data.id + "' dir='auto'> <img src='" + this.card_data.avatar + "' class='avatar-image avatar-image--small' alt='" + this.card_data.text + "'> </a> </div> </div> " + (this.footerTemplate()) + " <div class='popover-arrow'></div> </div>";
3169
+ };
3170
+
3171
+ PopOverCard.prototype.footerTemplate = function() {
3172
+ return "";
3173
+
3174
+ /*
3175
+ "<div class='popoverCard-actions u-clearfix'>
3176
+ <div class='u-floatLeft popoverCard-stats'>
3177
+ <span class='popoverCard-stat'>
3178
+ Following
3179
+ <span class='popoverCard-count js-userFollowingCount'>124</span>
3180
+ </span>
3181
+ <span class='popoverCard-stat'>
3182
+ Followers
3183
+ <span class='popoverCard-count js-userFollowersCount'>79</span>
3184
+ </span>
3185
+ </div>
3186
+ </div>"
3187
+ */
3188
+ };
3189
+
3190
+ PopOverCard.prototype.displayPopOver = function(ev) {
3191
+ return this.displayAt(ev);
3192
+ };
3193
+
3194
+ PopOverCard.prototype.displayAt = function(ev) {
3195
+ this.cancelHide();
3196
+ return $.getJSON($(ev.currentTarget).data().href).success((function(_this) {
3197
+ return function(data) {
3198
+ if (_this.editor.suggest_resource_handler) {
3199
+ _this.card_data = _this.editor.suggest_resource_handler(data);
3200
+ } else {
3201
+ _this.card_data = data;
3202
+ }
3203
+ _this.refreshTemplate();
3204
+ return _this.positionAt(ev);
3205
+ };
3206
+ })(this));
3207
+ };
3208
+
3209
+ PopOverCard.prototype.hidePopOver = function(ev) {
3210
+ return this.hide(ev);
3211
+ };
3212
+
3213
+ PopOverCard.prototype.refreshTemplate = function() {
3214
+ return $(".popover--card .popover-inner").html(this.cardTemplate());
3215
+ };
3216
+
3217
+ return PopOverCard;
3218
+
3219
+ })(Dante.Editor.PopOver);
3220
+
3221
+ Dante.Editor.ImageTooltip = (function(_super) {
3222
+ __extends(ImageTooltip, _super);
3223
+
3224
+ function ImageTooltip() {
3225
+ return ImageTooltip.__super__.constructor.apply(this, arguments);
3226
+ }
3227
+
3228
+ ImageTooltip.prototype.el = "body";
3229
+
3230
+ ImageTooltip.prototype.events = {
3231
+ "click .graf": "handleHide",
3232
+ "click .dante-menu-button.align-left": "alignLeft",
3233
+ "click .dante-menu-button.align-center": "alignCenter"
3234
+ };
3235
+
3236
+ ImageTooltip.prototype.initialize = function(opts) {
3237
+ if (opts == null) {
3238
+ opts = {};
3239
+ }
3240
+ utils.log("initialized popover");
3241
+ this.pop_over_element = ".popover--Aligntooltip";
3242
+ this.editor = opts.editor;
3243
+ this.hideTimeout;
3244
+ return this.settings = {
3245
+ timeout: 300
3246
+ };
3247
+ };
3248
+
3249
+ ImageTooltip.prototype.alignLeft = function(ev) {
3250
+ this.activateLink($(ev.currentTarget));
3251
+ return this.findSelectedImage().addClass("graf--layoutOutsetLeft");
3252
+ };
3253
+
3254
+ ImageTooltip.prototype.handleHide = function(ev) {
3255
+ var target;
3256
+ target = $(ev.currentTarget);
3257
+ if (!(target.hasClass("graf--figure") && target.hasClass("is-mediaFocused"))) {
3258
+ return this.hide(ev);
3259
+ }
3260
+ };
3261
+
3262
+ ImageTooltip.prototype.alignCenter = function(ev) {
3263
+ this.activateLink($(ev.currentTarget));
3264
+ this.findSelectedImage().removeClass("graf--layoutOutsetLeft");
3265
+ return this.repositionWithActiveImage();
3266
+ };
3267
+
3268
+ ImageTooltip.prototype.activateLink = function(element) {
3269
+ this.findElement().find(".dante-menu-button").removeClass("active");
3270
+ element.addClass("active");
3271
+ return setTimeout((function(_this) {
3272
+ return function() {
3273
+ return _this.repositionWithActiveImage();
3274
+ };
3275
+ })(this), 20);
3276
+ };
3277
+
3278
+ ImageTooltip.prototype.repositionWithActiveImage = function() {
3279
+ return this.positionPopOver(this.findSelectedImage());
3280
+ };
3281
+
3282
+ ImageTooltip.prototype.template = function() {
3283
+ return "<div class='dante-popover popover--Aligntooltip popover--top'> <div class='popover-inner'> <ul class='dante-menu-buttons'> <li class='dante-menu-button align-left'> <span class='tooltip-icon icon-image-left'></span> </li> <li class='dante-menu-button align-wide hidden'> <span class='tooltip-icon icon-image-wide'></span> </li> <li class='dante-menu-button align-fill hidden'> <span class='tooltip-icon icon-image-fill'></span> </li> <li class='dante-menu-button align-center active'> <span class='tooltip-icon icon-image-center'></span> </li> </ul> </div> <div class='popover-arrow'> </div> </div>";
3284
+ };
3285
+
3286
+ ImageTooltip.prototype.positionPopOver = function(target) {
3287
+ var left_value, pad_top, popover_width, target_height, target_offset, target_width, top_value;
3288
+ target_offset = target.offset();
3289
+ target_width = target.outerWidth();
3290
+ target_height = target.outerHeight();
3291
+ popover_width = this.findElement().outerWidth();
3292
+ pad_top = this.findSelectedImage().hasClass("graf--layoutOutsetLeft") ? -30 : 30;
3293
+ top_value = target_offset.top - target_height - pad_top;
3294
+ left_value = target_offset.left + (target_width / 2) - (popover_width / 2);
3295
+ return this.findElement().css("top", top_value).css("left", left_value).show().addClass("is-active");
3296
+ };
3297
+
3298
+ ImageTooltip.prototype.hide = function(ev) {
3299
+ this.cancelHide();
3300
+ return this.hideTimeout = setTimeout((function(_this) {
3301
+ return function() {
3302
+ return _this.findElement().hide().removeClass("is-active");
3303
+ };
3304
+ })(this), this.settings.timeout);
3305
+ };
3306
+
3307
+ ImageTooltip.prototype.findSelectedImage = function() {
3308
+ return $(".graf--figure").addClass("is-selected is-mediaFocused");
3309
+ };
3310
+
3311
+ ImageTooltip.prototype.render = function() {
3312
+ return $(this.template()).insertAfter(this.editor.$el);
3313
+ };
3314
+
3315
+ return ImageTooltip;
3316
+
3317
+ })(Dante.Editor.PopOver);
3318
+
2592
3319
  }).call(this);
2593
3320
  (function() {
2594
3321
  var utils,
@@ -2885,4 +3612,9 @@
2885
3612
 
2886
3613
 
2887
3614
 
3615
+
3616
+
3617
+
3618
+
3619
+
2888
3620
  ;