✅ Add image embedding to notes

app/helpers/posts_helper.rb

@@ -5,13 +5,22 @@ def auto_link_regex
     Regexp.new('(?:\\@[_a-zA-Z0-9]{1,17})|(?:(?:(?:(?:http|https|irc)?:\\/\\/(?:(?:[!$&-.0-9;=?A-Z_a-z]|(?:\\%[a-fA-F0-9]{2}))+(?:\\:(?:[!$&-.0-9;=?A-Z_a-z]|(?:\\%[a-fA-F0-9]{2}))+)?\\@)?)?(?:(?:(?:[a-zA-Z0-9][-a-zA-Z0-9]*\\.)+(?:(?:aero|arpa|asia|a[cdefgilmnoqrstuwxz])|(?:biz|b[abdefghijmnorstvwyz])|(?:cat|com|coop|c[acdfghiklmnoruvxyz])|d[ejkmoz]|(?:edu|e[cegrstu])|f[ijkmor]|(?:gov|g[abdefghilmnpqrstuwy])|h[kmnrtu]|(?:info|int|i[delmnoqrst])|j[emop]|k[eghimnrwyz]|l[abcikrstuvy]|(?:mil|museum|m[acdeghklmnopqrstuvwxyz])|(?:name|net|n[acefgilopruz])|(?:org|om)|(?:pro|p[aefghklmnrstwy])|qa|r[eouw]|s[abcdeghijklmnortuvyz]|(?:tel|travel|t[cdfghjklmnoprtvwz])|u[agkmsyz]|v[aceginu]|w[fs]|y[etu]|z[amw]))|(?:(?:25[0-5]|2[0-4][0-9]|[0-1][0-9]{2}|[1-9][0-9]|[1-9])\\.(?:25[0-5]|2[0-4][0-9]|[0-1][0-9]{2}|[1-9][0-9]|[0-9])\\.(?:25[0-5]|2[0-4][0-9]|[0-1][0-9]{2}|[1-9][0-9]|[0-9])\\.(?:25[0-5]|2[0-4][0-9]|[0-1][0-9]{2}|[1-9][0-9]|[0-9])))(?:\\:\\d{1,5})?)(?:\\/(?:(?:[!#&-;=?-Z_a-z~])|(?:\\%[a-fA-F0-9]{2}))*)?)(?=\\b|\\s|$)', 'gi')
   end
 
+  def file_extension(url)
+    match = url.match(/\.\w*$/)
+    return match[0] if match
+  end
+
   def auto_link(content)
     addresses = content.scan(auto_link_regex)
     addresses.each do |address|
       uri = web_address_to_uri(address)
       display_text = address
+      extension = file_extension(uri)
 
-      if address[0] == "@"
+      if [".gif", ".jpg", ".jpeg", ".png", ".svg"].include?(extension)
+        display_text = ('<img src="' << address << '" />').html_safe
+        content.gsub!(address, autolink_tag(uri, display_text))
+      elsif address[0] == "@"
         content.gsub!(address, autolink_tag(uri, display_text, "h-x-username"))
       else
         display_text = strip_protocol(display_text)

spec/helpers/posts_helper_spec.rb

@@ -28,5 +28,10 @@
         expect(helper.auto_link("https://dragondrop.uk")).to eq '<a class="auto-link" href="https://dragondrop.uk">dragondrop.uk</a>'
       end
     end
+    context "gif" do
+      it "turns the link into an image" do
+        expect(helper.auto_link("https://media.giphy.com/media/giphy.gif")).to eq '<a class="auto-link" href="https://media.giphy.com/media/giphy.gif"><img src="https://media.giphy.com/media/giphy.gif" /></a>'
+      end
+    end
   end
 end