rafaels-wysihat-engine 0.1.8

data/.gitignore

@@ -0,0 +1,6 @@
+*.sw?
+.DS_Store
+.sass-cache
+coverage
+rdoc
+pkg

data/CHANGELOG

@@ -0,0 +1,50 @@
+0.1.8 (December 1st, 2009) - Jeff Kreeftmeijer
+* Merged in champierre's bugfix (bbe4163577f22bfae997c96bdc43eb3fd4497ec0)
+
+0.1.7 (November 6th, 2009) - Jeff Kreeftmeijer
+* Toolbar didn't show up in IE. Fixed :)
+
+0.1.7 (November 1st, 2009) - Jeff Kreeftmeijer
+* added the exclamation.png icon back in the generator.
+
+0.1.7 (October 28th, 2009) - Jeff Kreeftmeijer
+* fixed a bug in the generator; it copied "loading.gif" to "loading.png". Thanks Eric! 
+* two functions in the rakefile were called cssify. One should've been called sassify. fixed :)
+* added "render :layout => false" to WysihatFilesController#index
+* put the "exclamation.png" icon back. Was pretty useful after all.
+
+0.1.7 (October 27th, 2009) - Jeff Kreeftmeijer
+* put the facebox images & icons in a subdir
+* created sassify & cssify rake tasks (like the minify one)
+* removed the .sass_cache dir and added it to the .gitignore file.
+
+0.1.6 (October 21st, 2009) - Jeff Kreeftmeijer
+* fixed a bug that sanitized the output (onsumbit) rather than the input (on paste).
+
+0.1.5 (October 11th, 2009) - Jeff Kreeftmeijer
+* fixed a bug that occurred while submitting the form.
+
+0.1.4 (October 5th, 2009) - Jeff Kreeftmeijer
+* removed the :paste button, you can now just paste it in the editor. It will work ;)
+* added a destroy function for the wysihat_files
+* added a locales file to support i18n
+
+0.1.3 (October 5th, 2009) - Jeff Kreeftmeijer
+* added sass support
+
+0.1.2 (October 4th, 2009) - Jeff Kreeftmeijer
+
+* added a --no-stylesheet option to the generator
+* removed ResourceController as a dependency. Normal controller now :)
+* moved more javascript to wysihat_engine.js
+* added wysihat_engine_pack.js (all javascripts minfied & concatenated)
+
+0.1.1 (October 3rd, 2009) - Jeff Kreeftmeijer
+
+* Moved most of the javascript to the javascript folder (javascripts/wysihat_engine.js) instead of doing it inline.
+
+0.1.0 (October 3rd, 2009) - Jeff Kreeftmeijer
+
+* Made it a gem.
+* Created a generator to get rid of the ugly rake task.
+* Removed lots of files (like /public and /config). Everything is in a generator template now.

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright (c) 2009 80beans
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.textile

@@ -0,0 +1,19 @@
+h1. WysiHat Engine
+
+A Rails engine to help integrate the "37signals WysiHat rich text editor":http://github.com/josh/wysihat/ to your application.
+
+h2. Using the WysiHat Engine
+
+We've written an "Installation Guide":http://wiki.github.com/80beans/wysihat-engine/installation and some "Examples":http://wiki.github.com/80beans/wysihat-engine/examples to get you started. Any questions? Don't hesitate to "ask":http://github.com/inbox/new/jeffkreeftmeijer.
+
+h2. Demo
+
+There's a "demo rails app":http://github.com/80beans/wysihat-engine-demo so you can have a quick look around. 
+
+h2. Contributing
+
+Found an issue? Have a great idea? Want to help? Great! Please take a second to read the "Contributing Guide":http://wiki.github.com/80beans/wysihat-engine/contributing.
+
+h2. License
+
+Copyright (c) 2009 80beans, released under the MIT license 

data/Rakefile

@@ -0,0 +1,78 @@
+require 'rake'
+require 'rake/testtask'
+require 'rake/rdoctask'
+
+desc 'Default: run unit tests.'
+task :default => :test
+
+desc 'Test the wysihat_engine plugin.'
+Rake::TestTask.new(:test) do |t|
+  t.libs << 'lib'
+  t.libs << 'test'
+  t.pattern = 'test/**/*_test.rb'
+  t.verbose = true
+end
+
+desc 'Generate documentation for the wysihat_engine plugin.'
+Rake::RDocTask.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'WysiHat Engine'
+  rdoc.options << '--line-numbers' << '--inline-source'
+  rdoc.rdoc_files.include('README')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+desc 'minify and concatenate the javascript files to make a pack'
+task :minify do
+  require "yui/compressor"
+
+  compressor = YUI::JavaScriptCompressor.new(:munge => true)
+  dir = 'generators/wysihat/templates/javascripts'
+  pack = File.new("#{dir}/wysihat_engine_pack.js", "w")
+
+  string = ''
+  files = ['facebox', 'wysihat', 'wysihat_engine']
+  files.each do |file|
+    file = open("#{dir}/#{file}.js")
+    string << file.read
+    file.close
+  end
+  
+  pack.write(compressor.compress(string))
+  pack.close
+end
+
+desc 'create css files from the sass files. It will overwrite files if they already exist.'
+task :cssify do
+  files = ['facebox', 'wysihat']
+  files.each do |file|
+    system "sass generators/wysihat/templates/sass/#{file}.sass generators/wysihat/templates/css/#{file}.css"
+  end
+end 
+
+desc 'create sass files from the css files. It will overwrite files if they already exist.'
+task :sassify do
+  files = ['facebox', 'wysihat']
+  files.each do |file|
+    system "css2sass generators/wysihat/templates/css/#{file}.css generators/wysihat/templates/sass/#{file}.sass"
+  end
+end 
+
+
+begin
+  require 'jeweler'
+  Jeweler::Tasks.new do |gem|
+    gem.name = "rafaels-wysihat-engine"
+    gem.summary = "A Rails engine to help integrate the 37signals WysiHat rich text editor to your application."
+    gem.description = "A Rails engine to help integrate the 37signals WysiHat rich text editor to your application."
+    gem.email = "jeff@80beans.com"
+    gem.homepage = "http://www.80beans.com/2009/10/01/wysihat-engine/"
+    gem.authors = ["Jeff Kreeftmeijer"]
+    gem.add_development_dependency "yui-compressor", ">= 0.9.1"
+    gem.add_dependency 'paperclip', ">= 2.3.1"
+  end
+rescue LoadError
+  puts "Jeweler not available. Install it with: sudo gem install technicalpickles-jeweler -s http://gems.github.com"
+end                                                                    
+
+Jeweler::GemcutterTasks.new

data/TODO

@@ -0,0 +1,4 @@
+* add a config.yml file and put some of the settings in there
+* use sprockets for javascripts, stylesheets and images
+* add font selection
+* figure out a way to do a "clean paste". (paste without any markup or styling)

data/VERSION

@@ -0,0 +1 @@
+0.1.8

data/app/controllers/wysihat_files_controller.rb

@@ -0,0 +1,30 @@
+class WysihatFilesController < ApplicationController
+  def index
+    @wysihat_file, @wysihat_files = WysihatFile.new, WysihatFile.all
+    render :layout => false
+  end
+  
+  def create
+    @wysihat_file = WysihatFile.new(params[:wysihat_file])
+    
+    responds_to_parent do
+      render :update do |page|
+        if(@wysihat_file.save)
+          page.insert_html :bottom, :wysihat_files, :partial => 'wysihat_file', :object => @wysihat_file  
+        end
+      end      
+    end
+  end
+  
+  def destroy
+    @wysihat_file = WysihatFile.find(params[:id])
+    respond_to do |wants|
+      wants.js {
+        render :update do |page|
+          page.remove "wysihat_file_#{@wysihat_file.id}"
+        end
+      }
+    end
+    @wysihat_file.destroy
+  end
+end

data/app/helpers/wysihat_files_helper.rb

@@ -0,0 +1,2 @@
+module WysihatFilesHelper
+end

data/app/models/wysihat_file.rb

@@ -0,0 +1,3 @@
+class WysihatFile < ActiveRecord::Base
+  has_attached_file :file
+end

data/app/views/wysihat_files/_form.html.erb

@@ -0,0 +1,13 @@
+<% form_for @wysihat_file, :html => { :multipart => true, :target => 'file_upload' } do |f| %>
+  
+  <p>
+    <%= f.label :file %><br/>
+    <%= f.file_field :file %>
+  </p>
+  <p>
+    <%= f.submit %>
+  </p>
+  
+<% end %>
+
+<iframe id='file_upload' name="file_upload" style="width:1px;height:1px;border:0px" src="about:blank"></iframe>

data/app/views/wysihat_files/_wysihat_file.html.erb

@@ -0,0 +1,4 @@
+<li id="wysihat_file_<%= wysihat_file.id %>">
+  <%= link_to_function(wysihat_file.file_file_name, "$$('iframe##{params[:editor]}')[0].insertImage(this.href); facebox.close();", :href => wysihat_file.file.url) %>
+  <%= link_to_remote t('wysihat_files.destroy.name'), :url => wysihat_file, :method => :delete, :confirm => t('wysihat_files.destroy.sure') %>
+</li>

data/app/views/wysihat_files/index.html.erb

@@ -0,0 +1,5 @@
+<ul id="wysihat_files" class="files">
+  <%= render @wysihat_files %>
+</ul>
+
+<%= render 'form' %>

data/app/views/wysihat_files/new.html.erb

@@ -0,0 +1 @@
+<%= render 'form' %>

data/config/locales/en.yml

@@ -0,0 +1,5 @@
+en:
+  wysihat_files:
+    destroy:
+      name: delete
+      sure: Are you sure you want to delete this file?

data/config/locales/pt-BR.yml

@@ -0,0 +1,5 @@
+pt-BR:
+  wysihat_files:
+    destroy:
+      name: deletar
+      sure: Você tem certeza que quer deletar este arquivo?

data/generators/wysihat/templates/css/facebox.css

@@ -0,0 +1,60 @@
+#facebox {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 100;
+  text-align: left; }
+  #facebox .b {
+    background: url(../images/facebox/b.png); }
+  #facebox .tl {
+    background: url(../images/facebox/tl.png); }
+  #facebox .tr {
+    background: url(../images/facebox/tr.png); }
+  #facebox .bl {
+    background: url(../images/facebox/bl.png); }
+  #facebox .br {
+    background: url(../images/facebox/br.png); }
+  #facebox .popup {
+    position: relative; }
+  #facebox table {
+    border-collapse: collapse; }
+  #facebox td {
+    border-bottom: 0;
+    padding: 0; }
+  #facebox .body {
+    padding: 10px;
+    background: #fff;
+    width: 370px; }
+  #facebox .loading, #facebox .image {
+    text-align: center; }
+  #facebox img {
+    border: 0;
+    margin: 0; }
+  #facebox .footer {
+    border-top: 1px solid #DDDDDD;
+    padding-top: 5px;
+    margin-top: 10px;
+    text-align: right; }
+  #facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
+    height: 10px;
+    width: 10px;
+    overflow: hidden;
+    padding: 0; }
+
+#facebox_overlay {
+  position: fixed;
+  top: 0px;
+  left: 0px;
+  height: 100%;
+  width: 100%; }
+
+.facebox_hide {
+  z-index: -100; }
+
+.facebox_overlayBG {
+  background-color: #000;
+  z-index: 99; }
+
+* html #facebox_overlay {
+  position: absolute;
+  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }

data/generators/wysihat/templates/css/wysihat.css

@@ -0,0 +1,44 @@
+div.editor_toolbar a {
+  float: left;
+  width: 16px;
+  height: 16px;
+  margin: 5px;
+  background-repeat: no-repeat; }
+div.editor_toolbar span {
+  display: none; }
+
+.editor_toolbar .button {
+  background-image: url('../images/icons/exclamation.png'); }
+.editor_toolbar .bold {
+  background-image: url('../images/icons/text_bold.png'); }
+.editor_toolbar .italic {
+  background-image: url('../images/icons/text_italic.png'); }
+.editor_toolbar .underline {
+  background-image: url('../images/icons/text_underline.png'); }
+.editor_toolbar .strikethrough {
+  background-image: url('../images/icons/text_strikethrough.png'); }
+.editor_toolbar .justifyleft {
+  background-image: url('../images/icons/text_align_left.png'); }
+.editor_toolbar .justifycenter {
+  background-image: url('../images/icons/text_align_center.png'); }
+.editor_toolbar .justifyright {
+  background-image: url('../images/icons/text_align_right.png'); }
+.editor_toolbar .undo {
+  background-image: url('../images/icons/arrow_undo.png'); }
+.editor_toolbar .redo {
+  background-image: url('../images/icons/arrow_redo.png'); }
+.editor_toolbar .insertorderedlist {
+  background-image: url('../images/icons/text_list_numbers.png'); }
+.editor_toolbar .insertunorderedlist {
+  background-image: url('../images/icons/text_list_bullets.png'); }
+.editor_toolbar .link {
+  background-image: url('../images/icons/link.png'); }
+.editor_toolbar .image {
+  background-image: url('../images/icons/image.png'); }
+.editor_toolbar .html {
+  background-image: url('../images/icons/page_code.png'); }
+
+iframe.editor {
+  border: 1px solid #999;
+  height: 400px;
+  width: 100%; }

data/generators/wysihat/templates/javascripts/facebox.js

@@ -0,0 +1,180 @@
+/* Facebox for Prototype
+ *
+ * This is a slightly updated version of jeffkreeftmeijer's branch of facebox-for-prototype
+ * (http://github.com/jeffkreeftmeijer/facebox-for-prototype). The image locations are 
+ * changed -- from /images/ to /images/facebox/ -- to keep the engine nice and tidy.
+ *
+ */
+
+var Facebox = Class.create({
+	initialize	: function(extra_set){
+		this.settings = {
+			loading_image	: '/images/facebox/loading.gif',
+			close_image		: '/images/facebox/closelabel.gif',
+			image_types		: new RegExp('\.' + ['png', 'jpg', 'jpeg', 'gif'].join('|') + '$', 'i'),
+			inited				: true,	
+			facebox_html	: '\
+	  <div id="facebox" style="display:none;"> \
+	    <div class="popup"> \
+	      <table id="facebox_table"> \
+	        <tbody> \
+	          <tr> \
+	            <td class="tl"/><td class="b"/><td class="tr"/> \
+	          </tr> \
+	          <tr> \
+	            <td class="b"/> \
+	            <td class="body"> \
+	              <div class="content"> \
+	              </div> \
+	              <div class="footer"> \
+	                <a href="#" class="close"> \
+	                  <img src="/images/facebox/closelabel.gif" title="close" class="close_image" /> \
+	                </a> \
+	              </div> \
+	            </td> \
+	            <td class="b"/> \
+	          </tr> \
+	          <tr> \
+	            <td class="bl"/><td class="b"/><td class="br"/> \
+	          </tr> \
+	        </tbody> \
+	      </table> \
+	    </div> \
+	  </div>'
+		};
+		if (extra_set) Object.extend(this.settings, extra_set);
+		$(document.body).insert({bottom: this.settings.facebox_html});
+		
+		this.preload = [ new Image(), new Image() ];
+		this.preload[0].src = this.settings.close_image;
+		this.preload[1].src = this.settings.loading_image;
+		
+		f = this;
+		$$('#facebox .b:first, #facebox .bl, #facebox .br, #facebox .tl, #facebox .tr').each(function(elem){
+			f.preload.push(new Image());
+			f.preload.slice(-1).src = elem.getStyle('background-image').replace(/url\((.+)\)/, '$1');
+		});
+		
+		this.facebox = $('facebox');
+    this.keyPressListener = this.watchKeyPress.bindAsEventListener(this);
+		
+		this.watchClickEvents();
+		fb = this;
+		Event.observe($$('#facebox .close').first(), 'click', function(e){
+			Event.stop(e);
+			fb.close()
+		});
+		Event.observe($$('#facebox .close_image').first(), 'click', function(e){
+			Event.stop(e);
+			fb.close()
+		});
+	},
+	
+  watchKeyPress : function(e){
+    // Close if espace is pressed or if there's a click outside of the facebox
+    if (e.keyCode == 27 || !Event.element(e).descendantOf(this.facebox)) this.close();
+  },
+	
+	watchClickEvents	: function(e){
+		var f = this;
+		$$('a[rel=facebox]').each(function(elem,i){
+			Event.observe(elem, 'click', function(e){
+				Event.stop(e);
+				f.click_handler(elem, e);
+			});
+		});
+	},
+	
+	loading	: function() {
+		if ($$('#facebox .loading').length == 1) return true;
+		
+		contentWrapper = $$('#facebox .content').first();
+		contentWrapper.childElements().each(function(elem, i){
+			elem.remove();
+		});
+		contentWrapper.insert({bottom: '<div class="loading"><img src="'+this.settings.loading_image+'"/></div>'});
+		
+		var pageScroll = document.viewport.getScrollOffsets();
+		this.facebox.setStyle({
+			'top': pageScroll.top + (document.viewport.getHeight() / 10) + 'px',
+			'left': document.viewport.getWidth() / 2 - (this.facebox.getWidth() / 2) + 'px'
+		});
+		
+    Event.observe(document, 'keypress', this.keyPressListener);
+    Event.observe(document, 'click', this.keyPressListener);
+	},
+	
+	reveal	: function(data, klass){
+		this.loading();
+		load = $$('#facebox .loading').first();
+		if(load) load.remove();
+		
+		contentWrapper = $$('#facebox .content').first();
+		if (klass) contentWrapper.addClassName(klass);
+		//contentWrapper.insert({bottom: data});
+		contentWrapper.update(data);
+		
+    $$('#facebox .body').first().childElements().each(function(elem,i){
+     elem.show();
+    });
+    		
+		if(!this.facebox.visible()) new Effect.Appear(this.facebox, {duration: .3});
+		this.facebox.setStyle({
+			'left': document.viewport.getWidth() / 2 - (this.facebox.getWidth() / 2) + 'px'
+		});
+		
+    Event.observe(document, 'keypress', this.keyPressListener);
+    Event.observe(document, 'click', this.keyPressListener);
+	},
+	
+	close		: function(){
+		 new Effect.Fade('facebox', {duration: .3});
+	},
+	
+	click_handler	: function(elem, e){
+	  this.loading();
+		Event.stop(e);
+		
+		// support for rel="facebox[.inline_popup]" syntax, to add a class
+		var klass = elem.rel.match(/facebox\[\.(\w+)\]/);
+		if (klass) klass = klass[1];
+		
+		new Effect.Appear(this.facebox, {duration: .3});
+		
+		if (elem.href.match(/#/)){
+			var url			= window.location.href.split('#')[0];
+			var target	= elem.href.replace(url+'#','');
+			// var data			= $$(target).first();
+			var d			  = $(target);
+			// create a new element so as to not delete the original on close()
+			var data = new Element(d.tagName);
+			data.innerHTML = d.innerHTML;
+			this.reveal(data, klass);
+		} else if (elem.href.match(this.settings.image_types)) {
+			var image = new Image();
+			fb = this;
+			image.onload = function() {
+				fb.reveal('<div class="image"><img src="' + image.src + '" /></div>', klass)
+			}
+			image.src = elem.href;
+		} else {
+			var fb  = this;
+			var url = elem.href;
+			new Ajax.Request(url, {
+				method		: 'get',
+				onFailure	: function(transport){
+					fb.reveal(transport.responseText, klass);
+				},
+				onSuccess	: function(transport){
+					fb.reveal(transport.responseText, klass);
+				}
+			});
+			
+		}
+	}
+});
+
+var facebox;
+document.observe('dom:loaded', function(){
+	facebox = new Facebox();
+});