new image plugin for tinymce
This commit is contained in:
dinedine
parent
d5223e5c91
commit
2e4a15a511
@ -119,7 +119,7 @@ GEM
|
||||
growl-glue (1.0.7)
|
||||
haml (3.0.18)
|
||||
has_scope (0.5.0)
|
||||
heroku (1.9.14)
|
||||
heroku (1.10.2)
|
||||
json_pure (>= 1.2.0, < 1.5.0)
|
||||
launchy (~> 0.3.2)
|
||||
rest-client (~> 1.4.0)
|
||||
@ -139,7 +139,7 @@ GEM
|
||||
configuration (>= 0.0.5)
|
||||
rake (>= 0.8.1)
|
||||
linecache (0.43)
|
||||
mail (2.2.5)
|
||||
mail (2.2.6.1)
|
||||
activesupport (>= 2.3.6)
|
||||
mime-types
|
||||
treetop (>= 1.4.5)
|
||||
@ -230,7 +230,7 @@ GEM
|
||||
rack-test (>= 0.5.3)
|
||||
will_paginate (3.0.pre2)
|
||||
xml-simple (1.0.12)
|
||||
yard (0.6.0)
|
||||
yard (0.6.1)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
|
||||
51
app/controllers/admin/images_controller.rb
Normal file
51
app/controllers/admin/images_controller.rb
Normal file
@ -0,0 +1,51 @@
|
||||
module Admin
|
||||
class ImagesController < BaseController
|
||||
|
||||
include ActionView::Helpers::SanitizeHelper
|
||||
include ActionView::Helpers::TextHelper
|
||||
|
||||
defaults :collection_name => 'assets', :instance_name => 'asset'
|
||||
|
||||
respond_to :json, :only => [:index, :create, :destroy]
|
||||
|
||||
def index
|
||||
index! do |response|
|
||||
response.json do
|
||||
render :json => { :images => @assets.collect { |image| image_to_json(image) } }
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
def create
|
||||
params[:asset] = { :name => params[:name], :source => params[:file] } if params[:file]
|
||||
|
||||
create! do |success, failure|
|
||||
success.json do
|
||||
render :json => image_to_json(@asset)
|
||||
end
|
||||
failure.json { render :json => { :status => 'error' } }
|
||||
end
|
||||
end
|
||||
|
||||
protected
|
||||
|
||||
def collection
|
||||
@assets ||= begin_of_association_chain.assets
|
||||
end
|
||||
|
||||
def begin_of_association_chain
|
||||
@asset_collection ||= AssetCollection.find_or_create_internal(current_site)
|
||||
end
|
||||
|
||||
def image_to_json(image)
|
||||
{
|
||||
:status => 'success',
|
||||
:name => truncate(image.name, :length => 15),
|
||||
:url => image.source.url,
|
||||
:vignette_url => image.vignette_url,
|
||||
:destroy_url => admin_image_url(image, :json)
|
||||
}
|
||||
end
|
||||
|
||||
end
|
||||
end
|
||||
@ -3,9 +3,9 @@ class ApplicationController < ActionController::Base
|
||||
|
||||
protected
|
||||
|
||||
rescue_from Exception, :with => :render_error
|
||||
|
||||
def render_error
|
||||
render :template => "/admin/errors/500", :layout => 'admin/box', :status => 500
|
||||
end
|
||||
# rescue_from Exception, :with => :render_error
|
||||
#
|
||||
# def render_error
|
||||
# render :template => "/admin/errors/500", :layout => 'admin/box', :status => 500
|
||||
# end
|
||||
end
|
||||
|
||||
@ -5,6 +5,7 @@ class AssetCollection
|
||||
## fields ##
|
||||
field :name
|
||||
field :slug
|
||||
field :internal, :type => Boolean, :default => false
|
||||
|
||||
## associations ##
|
||||
referenced_in :site
|
||||
@ -22,6 +23,9 @@ class AssetCollection
|
||||
validates_presence_of :site, :name, :slug
|
||||
validates_uniqueness_of :slug, :scope => :site_id
|
||||
|
||||
## named scopes ##
|
||||
scope :internal, :where => { :internal => true }
|
||||
|
||||
## methods ##
|
||||
|
||||
def ordered_assets
|
||||
@ -36,6 +40,10 @@ class AssetCollection
|
||||
@assets_order = order
|
||||
end
|
||||
|
||||
def self.find_or_create_internal(site)
|
||||
site.asset_collections.internal.first || site.asset_collections.create(:name => t('.system_name'), :slug => 'system', :internal => true)
|
||||
end
|
||||
|
||||
protected
|
||||
|
||||
def normalize_slug
|
||||
|
||||
@ -28,7 +28,7 @@ fr:
|
||||
|
||||
domain_taken: "%{value} a été déjà pris"
|
||||
invalid_domain: "%{value} n'est pas valide"
|
||||
needs_admin_account: "Un minimum d'un scompte admin est requis"
|
||||
needs_admin_account: "Un minimum d'un compte admin est requis"
|
||||
protected_page: "Vous ne pouvez pas supprimer les pages index et 404"
|
||||
extname_changed: "Nouveau fichier n'a pas l'extension original"
|
||||
array_too_short: "est trop petit (le nombre minimum d'éléments est %{count})"
|
||||
|
||||
@ -35,6 +35,8 @@ Rails.application.routes.draw do
|
||||
|
||||
resources :assets, :path => 'asset_collections/:collection_id/assets'
|
||||
|
||||
resources :images
|
||||
|
||||
resources :content_types
|
||||
|
||||
resources :contents, :path => 'content_types/:slug/contents' do
|
||||
|
||||
BIN
public/images/admin/buttons/dark-gray-bg.png
Normal file
BIN
public/images/admin/buttons/dark-gray-bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 141 B |
@ -50,9 +50,9 @@ var TinyMceDefaultSettings = {
|
||||
script_url : '/javascripts/admin/plugins/tiny_mce/tiny_mce.js',
|
||||
theme : 'advanced',
|
||||
skin : 'cirkuit',
|
||||
plugins: 'safari,inlinepopups,advimage',
|
||||
theme_advanced_buttons1 : 'code,|,bold,italic,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,blockquote,|,link,unlink,|,image',
|
||||
theme_advanced_buttons2 : 'formatselect,fontselect,fontsizeselect',
|
||||
plugins: 'safari,inlinepopups,locoimage',
|
||||
theme_advanced_buttons1 : 'code,|,bold,italic,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,blockquote,|,link,unlink',
|
||||
theme_advanced_buttons2 : 'formatselect,fontselect,fontsizeselect,|,image',
|
||||
theme_advanced_buttons3 : '',
|
||||
theme_advanced_toolbar_location : "top",
|
||||
theme_advanced_toolbar_align : "left",
|
||||
|
||||
@ -125,6 +125,9 @@ var InlineEditorToolbar = {
|
||||
this.element.find('ul li a').click(function(e) {
|
||||
var classArray = $(this).parent().attr('class').split(' ');
|
||||
switch(classArray[1] || classArray[0]) {
|
||||
case 'home':
|
||||
window.location.href = $(this).attr('href'); break;
|
||||
|
||||
case 'edit': // passing in editing mode
|
||||
var url = window.location.href.replace(/\/$/, '/index').replace('#', '');
|
||||
window.location.href = url + '/edit'; break;
|
||||
|
||||
@ -77,10 +77,11 @@ $(document).ready(function() {
|
||||
}
|
||||
}, 2000);
|
||||
|
||||
$('a#image-picker-link').imagepicker({
|
||||
insertFn: function(link) {
|
||||
return "{{ theme_images." + link.attr('data-slug') + " }}";
|
||||
}
|
||||
});
|
||||
if (typeof $.fn.imagepicker != 'undefined')
|
||||
$('a#image-picker-link').imagepicker({
|
||||
insertFn: function(link) {
|
||||
return "{{ theme_images." + link.attr('data-slug') + " }}";
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
298
public/javascripts/admin/plugins/plupload/src/flash.js
Normal file
298
public/javascripts/admin/plugins/plupload/src/flash.js
Normal file
@ -0,0 +1,298 @@
|
||||
/**
|
||||
* plupload.flash.js
|
||||
*
|
||||
* Copyright 2009, Moxiecode Systems AB
|
||||
* Released under GPL License.
|
||||
*
|
||||
* License: http://www.plupload.com/license
|
||||
* Contributing: http://www.plupload.com/contributing
|
||||
*/
|
||||
|
||||
// JSLint defined globals
|
||||
/*global plupload:false, ActiveXObject:false, escape:false */
|
||||
|
||||
(function(plupload) {
|
||||
var uploadInstances = {};
|
||||
|
||||
function getFlashVersion() {
|
||||
var version;
|
||||
|
||||
try {
|
||||
version = navigator.plugins['Shockwave Flash'];
|
||||
version = version.description;
|
||||
} catch (e1) {
|
||||
try {
|
||||
version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash').GetVariable('$version');
|
||||
} catch (e2) {
|
||||
version = '0.0';
|
||||
}
|
||||
}
|
||||
|
||||
version = version.match(/\d+/g);
|
||||
|
||||
return parseFloat(version[0] + '.' + version[1]);
|
||||
}
|
||||
|
||||
plupload.flash = {
|
||||
/**
|
||||
* Will be executed by the Flash runtime when it sends out events.
|
||||
*
|
||||
* @param {String} id If for the upload instance.
|
||||
* @param {String} name Event name to trigger.
|
||||
* @param {Object} obj Parameters to be passed with event.
|
||||
*/
|
||||
trigger : function(id, name, obj) {
|
||||
// Detach the call so that error handling in the browser is presented correctly
|
||||
setTimeout(function() {
|
||||
var uploader = uploadInstances[id], i, args;
|
||||
|
||||
if (uploader) {
|
||||
uploader.trigger('Flash:' + name, obj);
|
||||
}
|
||||
}, 0);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* FlashRuntime implementation. This runtime supports these features: jpgresize, pngresize, chunks.
|
||||
*
|
||||
* @static
|
||||
* @class plupload.runtimes.Flash
|
||||
* @extends plupload.Runtime
|
||||
*/
|
||||
plupload.runtimes.Flash = plupload.addRuntime("flash", {
|
||||
/**
|
||||
* Returns a list of supported features for the runtime.
|
||||
*
|
||||
* @return {Object} Name/value object with supported features.
|
||||
*/
|
||||
getFeatures : function() {
|
||||
return {
|
||||
jpgresize: true,
|
||||
pngresize: true,
|
||||
chunks: true,
|
||||
progress: true,
|
||||
multipart: true
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Initializes the upload runtime. This method should add necessary items to the DOM and register events needed for operation.
|
||||
*
|
||||
* @method init
|
||||
* @param {plupload.Uploader} uploader Uploader instance that needs to be initialized.
|
||||
* @param {function} callback Callback to execute when the runtime initializes or fails to initialize. If it succeeds an object with a parameter name success will be set to true.
|
||||
*/
|
||||
init : function(uploader, callback) {
|
||||
var browseButton, flashContainer, flashVars, initialized, waitCount = 0, container = document.body;
|
||||
|
||||
if (getFlashVersion() < 10) {
|
||||
callback({success : false});
|
||||
return;
|
||||
}
|
||||
|
||||
uploadInstances[uploader.id] = uploader;
|
||||
|
||||
// Find browse button and set to to be relative
|
||||
browseButton = document.getElementById(uploader.settings.browse_button);
|
||||
|
||||
// Create flash container and insert it at an absolute position within the browse button
|
||||
flashContainer = document.createElement('div');
|
||||
flashContainer.id = uploader.id + '_flash_container';
|
||||
|
||||
plupload.extend(flashContainer.style, {
|
||||
position : 'absolute',
|
||||
top : '0px',
|
||||
background : uploader.settings.shim_bgcolor || 'transparent',
|
||||
zIndex : 99999,
|
||||
width : '100%',
|
||||
height : '100%'
|
||||
});
|
||||
|
||||
flashContainer.className = 'plupload flash';
|
||||
|
||||
if (uploader.settings.container) {
|
||||
container = document.getElementById(uploader.settings.container);
|
||||
container.style.position = 'relative';
|
||||
}
|
||||
|
||||
container.appendChild(flashContainer);
|
||||
|
||||
flashVars = 'id=' + escape(uploader.id);
|
||||
|
||||
// Insert the Flash inide the flash container
|
||||
flashContainer.innerHTML = '<object id="' + uploader.id + '_flash" width="100%" height="100%" style="outline:0" type="application/x-shockwave-flash" data="' + uploader.settings.flash_swf_url + '">' +
|
||||
'<param name="movie" value="' + uploader.settings.flash_swf_url + '" />' +
|
||||
'<param name="flashvars" value="' + flashVars + '" />' +
|
||||
'<param name="wmode" value="transparent" />' +
|
||||
'<param name="allowscriptaccess" value="always" /></object>';
|
||||
|
||||
function getFlashObj() {
|
||||
return document.getElementById(uploader.id + '_flash');
|
||||
}
|
||||
|
||||
function waitLoad() {
|
||||
// Wait for 5 sec
|
||||
if (waitCount++ > 5000) {
|
||||
callback({success : false});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!initialized) {
|
||||
setTimeout(waitLoad, 1);
|
||||
}
|
||||
}
|
||||
|
||||
waitLoad();
|
||||
|
||||
// Fix IE memory leaks
|
||||
browseButton = flashContainer = null;
|
||||
|
||||
// Wait for Flash to send init event
|
||||
uploader.bind("Flash:Init", function() {
|
||||
var lookup = {}, i, resize = uploader.settings.resize || {};
|
||||
|
||||
initialized = true;
|
||||
getFlashObj().setFileFilters(uploader.settings.filters, uploader.settings.multi_selection);
|
||||
|
||||
uploader.bind("UploadFile", function(up, file) {
|
||||
var settings = up.settings;
|
||||
|
||||
getFlashObj().uploadFile(lookup[file.id], plupload.buildUrl(settings.url, {name : file.target_name || file.name}), {
|
||||
chunk_size : settings.chunk_size,
|
||||
width : resize.width,
|
||||
height : resize.height,
|
||||
quality : resize.quality || 90,
|
||||
multipart : settings.multipart,
|
||||
multipart_params : settings.multipart_params,
|
||||
file_data_name : settings.file_data_name,
|
||||
format : /\.(jpg|jpeg)$/i.test(file.name) ? 'jpg' : 'png',
|
||||
headers : settings.headers,
|
||||
urlstream_upload : settings.urlstream_upload
|
||||
});
|
||||
});
|
||||
|
||||
uploader.bind("Flash:UploadProcess", function(up, flash_file) {
|
||||
var file = up.getFile(lookup[flash_file.id]);
|
||||
|
||||
if (file.status != plupload.FAILED) {
|
||||
file.loaded = flash_file.loaded;
|
||||
file.size = flash_file.size;
|
||||
|
||||
up.trigger('UploadProgress', file);
|
||||
}
|
||||
});
|
||||
|
||||
uploader.bind("Flash:UploadChunkComplete", function(up, info) {
|
||||
var chunkArgs, file = up.getFile(lookup[info.id]);
|
||||
|
||||
chunkArgs = {
|
||||
chunk : info.chunk,
|
||||
chunks : info.chunks,
|
||||
response : info.text
|
||||
};
|
||||
|
||||
up.trigger('ChunkUploaded', file, chunkArgs);
|
||||
|
||||
// Stop upload if file is maked as failed
|
||||
if (file.status != plupload.FAILED) {
|
||||
getFlashObj().uploadNextChunk();
|
||||
}
|
||||
|
||||
// Last chunk then dispatch FileUploaded event
|
||||
if (info.chunk == info.chunks - 1) {
|
||||
file.status = plupload.DONE;
|
||||
|
||||
up.trigger('FileUploaded', file, {
|
||||
response : info.text
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
uploader.bind("Flash:SelectFiles", function(up, selected_files) {
|
||||
var file, i, files = [], id;
|
||||
|
||||
// Add the selected files to the file queue
|
||||
for (i = 0; i < selected_files.length; i++) {
|
||||
file = selected_files[i];
|
||||
|
||||
// Store away flash ref internally
|
||||
id = plupload.guid();
|
||||
lookup[id] = file.id;
|
||||
lookup[file.id] = id;
|
||||
|
||||
files.push(new plupload.File(id, file.name, file.size));
|
||||
}
|
||||
|
||||
// Trigger FilesAdded event if we added any
|
||||
if (files.length) {
|
||||
uploader.trigger("FilesAdded", files);
|
||||
}
|
||||
});
|
||||
|
||||
uploader.bind("Flash:SecurityError", function(up, err) {
|
||||
uploader.trigger('Error', {
|
||||
code : plupload.SECURITY_ERROR,
|
||||
message : 'Security error.',
|
||||
details : err.message,
|
||||
file : uploader.getFile(lookup[err.id])
|
||||
});
|
||||
});
|
||||
|
||||
uploader.bind("Flash:GenericError", function(up, err) {
|
||||
uploader.trigger('Error', {
|
||||
code : plupload.GENERIC_ERROR,
|
||||
message : 'Generic error.',
|
||||
details : err.message,
|
||||
file : uploader.getFile(lookup[err.id])
|
||||
});
|
||||
});
|
||||
|
||||
uploader.bind("Flash:IOError", function(up, err) {
|
||||
uploader.trigger('Error', {
|
||||
code : plupload.IO_ERROR,
|
||||
message : 'IO error.',
|
||||
details : err.message,
|
||||
file : uploader.getFile(lookup[err.id])
|
||||
});
|
||||
});
|
||||
|
||||
uploader.bind("QueueChanged", function(up) {
|
||||
uploader.refresh();
|
||||
});
|
||||
|
||||
uploader.bind("FilesRemoved", function(up, files) {
|
||||
var i;
|
||||
|
||||
for (i = 0; i < files.length; i++) {
|
||||
getFlashObj().removeFile(lookup[files[i].id]);
|
||||
}
|
||||
});
|
||||
|
||||
uploader.bind("StateChanged", function(up) {
|
||||
uploader.refresh();
|
||||
});
|
||||
|
||||
uploader.bind("Refresh", function(up) {
|
||||
var browseButton, browsePos, browseSize;
|
||||
|
||||
// Set file filters incase it has been changed dynamically
|
||||
getFlashObj().setFileFilters(uploader.settings.filters, uploader.settings.multi_selection);
|
||||
|
||||
browseButton = document.getElementById(up.settings.browse_button);
|
||||
browsePos = plupload.getPos(browseButton, document.getElementById(up.settings.container));
|
||||
browseSize = plupload.getSize(browseButton);
|
||||
|
||||
plupload.extend(document.getElementById(up.id + '_flash_container').style, {
|
||||
top : browsePos.y + 'px',
|
||||
left : browsePos.x + 'px',
|
||||
width : browseSize.w + 'px',
|
||||
height : browseSize.h + 'px'
|
||||
});
|
||||
});
|
||||
|
||||
callback({success : true});
|
||||
});
|
||||
}
|
||||
});
|
||||
})(plupload);
|
||||
1333
public/javascripts/admin/plugins/plupload/src/plupload.js
Normal file
1333
public/javascripts/admin/plugins/plupload/src/plupload.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,13 +0,0 @@
|
||||
#src_list, #over_list, #out_list {width:280px;}
|
||||
.mceActionPanel {margin-top:7px;}
|
||||
.alignPreview {border:1px solid #000; width:140px; height:140px; overflow:hidden; padding:5px;}
|
||||
.checkbox {border:0;}
|
||||
.panel_wrapper div.current {height:305px;}
|
||||
#prev {margin:0; border:1px solid #000; width:428px; height:150px; overflow:auto;}
|
||||
#align, #classlist {width:150px;}
|
||||
#width, #height {vertical-align:middle; width:50px; text-align:center;}
|
||||
#vspace, #hspace, #border {vertical-align:middle; width:30px; text-align:center;}
|
||||
#class_list {width:180px;}
|
||||
input {width: 280px;}
|
||||
#constrain, #onmousemovecheck {width:auto;}
|
||||
#id, #dir, #lang, #usemap, #longdesc {width:200px;}
|
||||
@ -1 +0,0 @@
|
||||
(function(){tinymce.create("tinymce.plugins.AdvancedImagePlugin",{init:function(a,b){a.addCommand("mceAdvImage",function(){if(a.dom.getAttrib(a.selection.getNode(),"class").indexOf("mceItem")!=-1){return}a.windowManager.open({file:b+"/image.htm",width:480+parseInt(a.getLang("advimage.delta_width",0)),height:385+parseInt(a.getLang("advimage.delta_height",0)),inline:1},{plugin_url:b})});a.addButton("image",{title:"advimage.image_desc",cmd:"mceAdvImage"})},getInfo:function(){return{longname:"Advanced image",author:"Moxiecode Systems AB",authorurl:"http://tinymce.moxiecode.com",infourl:"http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/advimage",version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.PluginManager.add("advimage",tinymce.plugins.AdvancedImagePlugin)})();
|
||||
@ -1,50 +0,0 @@
|
||||
/**
|
||||
* editor_plugin_src.js
|
||||
*
|
||||
* Copyright 2009, Moxiecode Systems AB
|
||||
* Released under LGPL License.
|
||||
*
|
||||
* License: http://tinymce.moxiecode.com/license
|
||||
* Contributing: http://tinymce.moxiecode.com/contributing
|
||||
*/
|
||||
|
||||
(function() {
|
||||
tinymce.create('tinymce.plugins.AdvancedImagePlugin', {
|
||||
init : function(ed, url) {
|
||||
// Register commands
|
||||
ed.addCommand('mceAdvImage', function() {
|
||||
// Internal image object like a flash placeholder
|
||||
if (ed.dom.getAttrib(ed.selection.getNode(), 'class').indexOf('mceItem') != -1)
|
||||
return;
|
||||
|
||||
ed.windowManager.open({
|
||||
file : url + '/image.htm',
|
||||
width : 480 + parseInt(ed.getLang('advimage.delta_width', 0)),
|
||||
height : 385 + parseInt(ed.getLang('advimage.delta_height', 0)),
|
||||
inline : 1
|
||||
}, {
|
||||
plugin_url : url
|
||||
});
|
||||
});
|
||||
|
||||
// Register buttons
|
||||
ed.addButton('image', {
|
||||
title : 'advimage.image_desc',
|
||||
cmd : 'mceAdvImage'
|
||||
});
|
||||
},
|
||||
|
||||
getInfo : function() {
|
||||
return {
|
||||
longname : 'Advanced image',
|
||||
author : 'Moxiecode Systems AB',
|
||||
authorurl : 'http://tinymce.moxiecode.com',
|
||||
infourl : 'http://wiki.moxiecode.com/index.php/TinyMCE:Plugins/advimage',
|
||||
version : tinymce.majorVersion + "." + tinymce.minorVersion
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
// Register plugin
|
||||
tinymce.PluginManager.add('advimage', tinymce.plugins.AdvancedImagePlugin);
|
||||
})();
|
||||
@ -1,232 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>{#advimage_dlg.dialog_title}</title>
|
||||
<script type="text/javascript" src="../../tiny_mce_popup.js"></script>
|
||||
<script type="text/javascript" src="../../utils/mctabs.js"></script>
|
||||
<script type="text/javascript" src="../../utils/form_utils.js"></script>
|
||||
<script type="text/javascript" src="../../utils/validate.js"></script>
|
||||
<script type="text/javascript" src="../../utils/editable_selects.js"></script>
|
||||
<script type="text/javascript" src="js/image.js"></script>
|
||||
<link href="css/advimage.css" rel="stylesheet" type="text/css" />
|
||||
</head>
|
||||
<body id="advimage" style="display: none">
|
||||
<form onsubmit="ImageDialog.insert();return false;" action="#">
|
||||
<div class="tabs">
|
||||
<ul>
|
||||
<li id="general_tab" class="current"><span><a href="javascript:mcTabs.displayTab('general_tab','general_panel');" onmousedown="return false;">{#advimage_dlg.tab_general}</a></span></li>
|
||||
<li id="appearance_tab"><span><a href="javascript:mcTabs.displayTab('appearance_tab','appearance_panel');" onmousedown="return false;">{#advimage_dlg.tab_appearance}</a></span></li>
|
||||
<li id="advanced_tab"><span><a href="javascript:mcTabs.displayTab('advanced_tab','advanced_panel');" onmousedown="return false;">{#advimage_dlg.tab_advanced}</a></span></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="panel_wrapper">
|
||||
<div id="general_panel" class="panel current">
|
||||
<fieldset>
|
||||
<legend>{#advimage_dlg.general}</legend>
|
||||
|
||||
<table class="properties">
|
||||
<tr>
|
||||
<td class="column1"><label id="srclabel" for="src">{#advimage_dlg.src}</label></td>
|
||||
<td colspan="2"><table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td><input name="src" type="text" id="src" value="" class="mceFocus" onchange="ImageDialog.showPreviewImage(this.value);" /></td>
|
||||
<td id="srcbrowsercontainer"> </td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="src_list">{#advimage_dlg.image_list}</label></td>
|
||||
<td><select id="src_list" name="src_list" onchange="document.getElementById('src').value=this.options[this.selectedIndex].value;document.getElementById('alt').value=this.options[this.selectedIndex].text;document.getElementById('title').value=this.options[this.selectedIndex].text;ImageDialog.showPreviewImage(this.options[this.selectedIndex].value);"><option value=""></option></select></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="column1"><label id="altlabel" for="alt">{#advimage_dlg.alt}</label></td>
|
||||
<td colspan="2"><input id="alt" name="alt" type="text" value="" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="column1"><label id="titlelabel" for="title">{#advimage_dlg.title}</label></td>
|
||||
<td colspan="2"><input id="title" name="title" type="text" value="" /></td>
|
||||
</tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
|
||||
<fieldset>
|
||||
<legend>{#advimage_dlg.preview}</legend>
|
||||
<div id="prev"></div>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<div id="appearance_panel" class="panel">
|
||||
<fieldset>
|
||||
<legend>{#advimage_dlg.tab_appearance}</legend>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td class="column1"><label id="alignlabel" for="align">{#advimage_dlg.align}</label></td>
|
||||
<td><select id="align" name="align" onchange="ImageDialog.updateStyle('align');ImageDialog.changeAppearance();">
|
||||
<option value="">{#not_set}</option>
|
||||
<option value="baseline">{#advimage_dlg.align_baseline}</option>
|
||||
<option value="top">{#advimage_dlg.align_top}</option>
|
||||
<option value="middle">{#advimage_dlg.align_middle}</option>
|
||||
<option value="bottom">{#advimage_dlg.align_bottom}</option>
|
||||
<option value="text-top">{#advimage_dlg.align_texttop}</option>
|
||||
<option value="text-bottom">{#advimage_dlg.align_textbottom}</option>
|
||||
<option value="left">{#advimage_dlg.align_left}</option>
|
||||
<option value="right">{#advimage_dlg.align_right}</option>
|
||||
</select>
|
||||
</td>
|
||||
<td rowspan="6" valign="top">
|
||||
<div class="alignPreview">
|
||||
<img id="alignSampleImg" src="img/sample.gif" alt="{#advimage_dlg.example_img}" />
|
||||
Lorem ipsum, Dolor sit amet, consectetuer adipiscing loreum ipsum edipiscing elit, sed diam
|
||||
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.Loreum ipsum
|
||||
edipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam
|
||||
erat volutpat.
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="widthlabel" for="width">{#advimage_dlg.dimensions}</label></td>
|
||||
<td class="nowrap">
|
||||
<input name="width" type="text" id="width" value="" size="5" maxlength="5" class="size" onchange="ImageDialog.changeHeight();" /> x
|
||||
<input name="height" type="text" id="height" value="" size="5" maxlength="5" class="size" onchange="ImageDialog.changeWidth();" /> px
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td> </td>
|
||||
<td><table border="0" cellpadding="0" cellspacing="0">
|
||||
<tr>
|
||||
<td><input id="constrain" type="checkbox" name="constrain" class="checkbox" /></td>
|
||||
<td><label id="constrainlabel" for="constrain">{#advimage_dlg.constrain_proportions}</label></td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="vspacelabel" for="vspace">{#advimage_dlg.vspace}</label></td>
|
||||
<td><input name="vspace" type="text" id="vspace" value="" size="3" maxlength="3" class="number" onchange="ImageDialog.updateStyle('vspace');ImageDialog.changeAppearance();" onblur="ImageDialog.updateStyle('vspace');ImageDialog.changeAppearance();" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="hspacelabel" for="hspace">{#advimage_dlg.hspace}</label></td>
|
||||
<td><input name="hspace" type="text" id="hspace" value="" size="3" maxlength="3" class="number" onchange="ImageDialog.updateStyle('hspace');ImageDialog.changeAppearance();" onblur="ImageDialog.updateStyle('hspace');ImageDialog.changeAppearance();" /></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="borderlabel" for="border">{#advimage_dlg.border}</label></td>
|
||||
<td><input id="border" name="border" type="text" value="" size="3" maxlength="3" class="number" onchange="ImageDialog.updateStyle('border');ImageDialog.changeAppearance();" onblur="ImageDialog.updateStyle('border');ImageDialog.changeAppearance();" /></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td><label for="class_list">{#class_name}</label></td>
|
||||
<td colspan="2"><select id="class_list" name="class_list" class="mceEditableSelect"><option value=""></option></select></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="stylelabel" for="style">{#advimage_dlg.style}</label></td>
|
||||
<td colspan="2"><input id="style" name="style" type="text" value="" onchange="ImageDialog.changeAppearance();" /></td>
|
||||
</tr>
|
||||
|
||||
<!-- <tr>
|
||||
<td class="column1"><label id="classeslabel" for="classes">{#advimage_dlg.classes}</label></td>
|
||||
<td colspan="2"><input id="classes" name="classes" type="text" value="" onchange="selectByValue(this.form,'classlist',this.value,true);" /></td>
|
||||
</tr> -->
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<div id="advanced_panel" class="panel">
|
||||
<fieldset>
|
||||
<legend>{#advimage_dlg.swap_image}</legend>
|
||||
|
||||
<input type="checkbox" id="onmousemovecheck" name="onmousemovecheck" class="checkbox" onclick="ImageDialog.setSwapImage(this.checked);" />
|
||||
<label id="onmousemovechecklabel" for="onmousemovecheck">{#advimage_dlg.alt_image}</label>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0" width="100%">
|
||||
<tr>
|
||||
<td class="column1"><label id="onmouseoversrclabel" for="onmouseoversrc">{#advimage_dlg.mouseover}</label></td>
|
||||
<td><table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td><input id="onmouseoversrc" name="onmouseoversrc" type="text" value="" /></td>
|
||||
<td id="onmouseoversrccontainer"> </td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="over_list">{#advimage_dlg.image_list}</label></td>
|
||||
<td><select id="over_list" name="over_list" onchange="document.getElementById('onmouseoversrc').value=this.options[this.selectedIndex].value;"><option value=""></option></select></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="column1"><label id="onmouseoutsrclabel" for="onmouseoutsrc">{#advimage_dlg.mouseout}</label></td>
|
||||
<td class="column2"><table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td><input id="onmouseoutsrc" name="onmouseoutsrc" type="text" value="" /></td>
|
||||
<td id="onmouseoutsrccontainer"> </td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><label for="out_list">{#advimage_dlg.image_list}</label></td>
|
||||
<td><select id="out_list" name="out_list" onchange="document.getElementById('onmouseoutsrc').value=this.options[this.selectedIndex].value;"><option value=""></option></select></td>
|
||||
</tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
|
||||
<fieldset>
|
||||
<legend>{#advimage_dlg.misc}</legend>
|
||||
|
||||
<table border="0" cellpadding="4" cellspacing="0">
|
||||
<tr>
|
||||
<td class="column1"><label id="idlabel" for="id">{#advimage_dlg.id}</label></td>
|
||||
<td><input id="id" name="id" type="text" value="" /></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="dirlabel" for="dir">{#advimage_dlg.langdir}</label></td>
|
||||
<td>
|
||||
<select id="dir" name="dir" onchange="ImageDialog.changeAppearance();">
|
||||
<option value="">{#not_set}</option>
|
||||
<option value="ltr">{#advimage_dlg.ltr}</option>
|
||||
<option value="rtl">{#advimage_dlg.rtl}</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="langlabel" for="lang">{#advimage_dlg.langcode}</label></td>
|
||||
<td>
|
||||
<input id="lang" name="lang" type="text" value="" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="usemaplabel" for="usemap">{#advimage_dlg.map}</label></td>
|
||||
<td>
|
||||
<input id="usemap" name="usemap" type="text" value="" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td class="column1"><label id="longdesclabel" for="longdesc">{#advimage_dlg.long_desc}</label></td>
|
||||
<td><table border="0" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td><input id="longdesc" name="longdesc" type="text" value="" /></td>
|
||||
<td id="longdesccontainer"> </td>
|
||||
</tr>
|
||||
</table></td>
|
||||
</tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mceActionPanel">
|
||||
<input type="submit" id="insert" name="insert" value="{#insert}" />
|
||||
<input type="button" id="cancel" name="cancel" value="{#cancel}" onclick="tinyMCEPopup.close();" />
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,443 +0,0 @@
|
||||
var ImageDialog = {
|
||||
preInit : function() {
|
||||
var url;
|
||||
|
||||
tinyMCEPopup.requireLangPack();
|
||||
|
||||
if (url = tinyMCEPopup.getParam("external_image_list_url"))
|
||||
document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>');
|
||||
},
|
||||
|
||||
init : function(ed) {
|
||||
var f = document.forms[0], nl = f.elements, ed = tinyMCEPopup.editor, dom = ed.dom, n = ed.selection.getNode();
|
||||
|
||||
tinyMCEPopup.resizeToInnerSize();
|
||||
this.fillClassList('class_list');
|
||||
this.fillFileList('src_list', 'tinyMCEImageList');
|
||||
this.fillFileList('over_list', 'tinyMCEImageList');
|
||||
this.fillFileList('out_list', 'tinyMCEImageList');
|
||||
TinyMCE_EditableSelects.init();
|
||||
|
||||
if (n.nodeName == 'IMG') {
|
||||
nl.src.value = dom.getAttrib(n, 'src');
|
||||
nl.width.value = dom.getAttrib(n, 'width');
|
||||
nl.height.value = dom.getAttrib(n, 'height');
|
||||
nl.alt.value = dom.getAttrib(n, 'alt');
|
||||
nl.title.value = dom.getAttrib(n, 'title');
|
||||
nl.vspace.value = this.getAttrib(n, 'vspace');
|
||||
nl.hspace.value = this.getAttrib(n, 'hspace');
|
||||
nl.border.value = this.getAttrib(n, 'border');
|
||||
selectByValue(f, 'align', this.getAttrib(n, 'align'));
|
||||
selectByValue(f, 'class_list', dom.getAttrib(n, 'class'), true, true);
|
||||
nl.style.value = dom.getAttrib(n, 'style');
|
||||
nl.id.value = dom.getAttrib(n, 'id');
|
||||
nl.dir.value = dom.getAttrib(n, 'dir');
|
||||
nl.lang.value = dom.getAttrib(n, 'lang');
|
||||
nl.usemap.value = dom.getAttrib(n, 'usemap');
|
||||
nl.longdesc.value = dom.getAttrib(n, 'longdesc');
|
||||
nl.insert.value = ed.getLang('update');
|
||||
|
||||
if (/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/.test(dom.getAttrib(n, 'onmouseover')))
|
||||
nl.onmouseoversrc.value = dom.getAttrib(n, 'onmouseover').replace(/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/, '$1');
|
||||
|
||||
if (/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/.test(dom.getAttrib(n, 'onmouseout')))
|
||||
nl.onmouseoutsrc.value = dom.getAttrib(n, 'onmouseout').replace(/^\s*this.src\s*=\s*\'([^\']+)\';?\s*$/, '$1');
|
||||
|
||||
if (ed.settings.inline_styles) {
|
||||
// Move attribs to styles
|
||||
if (dom.getAttrib(n, 'align'))
|
||||
this.updateStyle('align');
|
||||
|
||||
if (dom.getAttrib(n, 'hspace'))
|
||||
this.updateStyle('hspace');
|
||||
|
||||
if (dom.getAttrib(n, 'border'))
|
||||
this.updateStyle('border');
|
||||
|
||||
if (dom.getAttrib(n, 'vspace'))
|
||||
this.updateStyle('vspace');
|
||||
}
|
||||
}
|
||||
|
||||
// Setup browse button
|
||||
document.getElementById('srcbrowsercontainer').innerHTML = getBrowserHTML('srcbrowser','src','image','theme_advanced_image');
|
||||
if (isVisible('srcbrowser'))
|
||||
document.getElementById('src').style.width = '260px';
|
||||
|
||||
// Setup browse button
|
||||
document.getElementById('onmouseoversrccontainer').innerHTML = getBrowserHTML('overbrowser','onmouseoversrc','image','theme_advanced_image');
|
||||
if (isVisible('overbrowser'))
|
||||
document.getElementById('onmouseoversrc').style.width = '260px';
|
||||
|
||||
// Setup browse button
|
||||
document.getElementById('onmouseoutsrccontainer').innerHTML = getBrowserHTML('outbrowser','onmouseoutsrc','image','theme_advanced_image');
|
||||
if (isVisible('outbrowser'))
|
||||
document.getElementById('onmouseoutsrc').style.width = '260px';
|
||||
|
||||
// If option enabled default contrain proportions to checked
|
||||
if (ed.getParam("advimage_constrain_proportions", true))
|
||||
f.constrain.checked = true;
|
||||
|
||||
// Check swap image if valid data
|
||||
if (nl.onmouseoversrc.value || nl.onmouseoutsrc.value)
|
||||
this.setSwapImage(true);
|
||||
else
|
||||
this.setSwapImage(false);
|
||||
|
||||
this.changeAppearance();
|
||||
this.showPreviewImage(nl.src.value, 1);
|
||||
},
|
||||
|
||||
insert : function(file, title) {
|
||||
var ed = tinyMCEPopup.editor, t = this, f = document.forms[0];
|
||||
|
||||
if (f.src.value === '') {
|
||||
if (ed.selection.getNode().nodeName == 'IMG') {
|
||||
ed.dom.remove(ed.selection.getNode());
|
||||
ed.execCommand('mceRepaint');
|
||||
}
|
||||
|
||||
tinyMCEPopup.close();
|
||||
return;
|
||||
}
|
||||
|
||||
if (tinyMCEPopup.getParam("accessibility_warnings", 1)) {
|
||||
if (!f.alt.value) {
|
||||
tinyMCEPopup.confirm(tinyMCEPopup.getLang('advimage_dlg.missing_alt'), function(s) {
|
||||
if (s)
|
||||
t.insertAndClose();
|
||||
});
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
t.insertAndClose();
|
||||
},
|
||||
|
||||
insertAndClose : function() {
|
||||
var ed = tinyMCEPopup.editor, f = document.forms[0], nl = f.elements, v, args = {}, el;
|
||||
|
||||
tinyMCEPopup.restoreSelection();
|
||||
|
||||
// Fixes crash in Safari
|
||||
if (tinymce.isWebKit)
|
||||
ed.getWin().focus();
|
||||
|
||||
if (!ed.settings.inline_styles) {
|
||||
args = {
|
||||
vspace : nl.vspace.value,
|
||||
hspace : nl.hspace.value,
|
||||
border : nl.border.value,
|
||||
align : getSelectValue(f, 'align')
|
||||
};
|
||||
} else {
|
||||
// Remove deprecated values
|
||||
args = {
|
||||
vspace : '',
|
||||
hspace : '',
|
||||
border : '',
|
||||
align : ''
|
||||
};
|
||||
}
|
||||
|
||||
tinymce.extend(args, {
|
||||
src : nl.src.value,
|
||||
width : nl.width.value,
|
||||
height : nl.height.value,
|
||||
alt : nl.alt.value,
|
||||
title : nl.title.value,
|
||||
'class' : getSelectValue(f, 'class_list'),
|
||||
style : nl.style.value,
|
||||
id : nl.id.value,
|
||||
dir : nl.dir.value,
|
||||
lang : nl.lang.value,
|
||||
usemap : nl.usemap.value,
|
||||
longdesc : nl.longdesc.value
|
||||
});
|
||||
|
||||
args.onmouseover = args.onmouseout = '';
|
||||
|
||||
if (f.onmousemovecheck.checked) {
|
||||
if (nl.onmouseoversrc.value)
|
||||
args.onmouseover = "this.src='" + nl.onmouseoversrc.value + "';";
|
||||
|
||||
if (nl.onmouseoutsrc.value)
|
||||
args.onmouseout = "this.src='" + nl.onmouseoutsrc.value + "';";
|
||||
}
|
||||
|
||||
el = ed.selection.getNode();
|
||||
|
||||
if (el && el.nodeName == 'IMG') {
|
||||
ed.dom.setAttribs(el, args);
|
||||
} else {
|
||||
ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" />', {skip_undo : 1});
|
||||
ed.dom.setAttribs('__mce_tmp', args);
|
||||
ed.dom.setAttrib('__mce_tmp', 'id', '');
|
||||
ed.undoManager.add();
|
||||
}
|
||||
|
||||
tinyMCEPopup.close();
|
||||
},
|
||||
|
||||
getAttrib : function(e, at) {
|
||||
var ed = tinyMCEPopup.editor, dom = ed.dom, v, v2;
|
||||
|
||||
if (ed.settings.inline_styles) {
|
||||
switch (at) {
|
||||
case 'align':
|
||||
if (v = dom.getStyle(e, 'float'))
|
||||
return v;
|
||||
|
||||
if (v = dom.getStyle(e, 'vertical-align'))
|
||||
return v;
|
||||
|
||||
break;
|
||||
|
||||
case 'hspace':
|
||||
v = dom.getStyle(e, 'margin-left')
|
||||
v2 = dom.getStyle(e, 'margin-right');
|
||||
|
||||
if (v && v == v2)
|
||||
return parseInt(v.replace(/[^0-9]/g, ''));
|
||||
|
||||
break;
|
||||
|
||||
case 'vspace':
|
||||
v = dom.getStyle(e, 'margin-top')
|
||||
v2 = dom.getStyle(e, 'margin-bottom');
|
||||
if (v && v == v2)
|
||||
return parseInt(v.replace(/[^0-9]/g, ''));
|
||||
|
||||
break;
|
||||
|
||||
case 'border':
|
||||
v = 0;
|
||||
|
||||
tinymce.each(['top', 'right', 'bottom', 'left'], function(sv) {
|
||||
sv = dom.getStyle(e, 'border-' + sv + '-width');
|
||||
|
||||
// False or not the same as prev
|
||||
if (!sv || (sv != v && v !== 0)) {
|
||||
v = 0;
|
||||
return false;
|
||||
}
|
||||
|
||||
if (sv)
|
||||
v = sv;
|
||||
});
|
||||
|
||||
if (v)
|
||||
return parseInt(v.replace(/[^0-9]/g, ''));
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (v = dom.getAttrib(e, at))
|
||||
return v;
|
||||
|
||||
return '';
|
||||
},
|
||||
|
||||
setSwapImage : function(st) {
|
||||
var f = document.forms[0];
|
||||
|
||||
f.onmousemovecheck.checked = st;
|
||||
setBrowserDisabled('overbrowser', !st);
|
||||
setBrowserDisabled('outbrowser', !st);
|
||||
|
||||
if (f.over_list)
|
||||
f.over_list.disabled = !st;
|
||||
|
||||
if (f.out_list)
|
||||
f.out_list.disabled = !st;
|
||||
|
||||
f.onmouseoversrc.disabled = !st;
|
||||
f.onmouseoutsrc.disabled = !st;
|
||||
},
|
||||
|
||||
fillClassList : function(id) {
|
||||
var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl;
|
||||
|
||||
if (v = tinyMCEPopup.getParam('theme_advanced_styles')) {
|
||||
cl = [];
|
||||
|
||||
tinymce.each(v.split(';'), function(v) {
|
||||
var p = v.split('=');
|
||||
|
||||
cl.push({'title' : p[0], 'class' : p[1]});
|
||||
});
|
||||
} else
|
||||
cl = tinyMCEPopup.editor.dom.getClasses();
|
||||
|
||||
if (cl.length > 0) {
|
||||
lst.options.length = 0;
|
||||
lst.options[lst.options.length] = new Option(tinyMCEPopup.getLang('not_set'), '');
|
||||
|
||||
tinymce.each(cl, function(o) {
|
||||
lst.options[lst.options.length] = new Option(o.title || o['class'], o['class']);
|
||||
});
|
||||
} else
|
||||
dom.remove(dom.getParent(id, 'tr'));
|
||||
},
|
||||
|
||||
fillFileList : function(id, l) {
|
||||
var dom = tinyMCEPopup.dom, lst = dom.get(id), v, cl;
|
||||
|
||||
l = window[l];
|
||||
lst.options.length = 0;
|
||||
|
||||
if (l && l.length > 0) {
|
||||
lst.options[lst.options.length] = new Option('', '');
|
||||
|
||||
tinymce.each(l, function(o) {
|
||||
lst.options[lst.options.length] = new Option(o[0], o[1]);
|
||||
});
|
||||
} else
|
||||
dom.remove(dom.getParent(id, 'tr'));
|
||||
},
|
||||
|
||||
resetImageData : function() {
|
||||
var f = document.forms[0];
|
||||
|
||||
f.elements.width.value = f.elements.height.value = '';
|
||||
},
|
||||
|
||||
updateImageData : function(img, st) {
|
||||
var f = document.forms[0];
|
||||
|
||||
if (!st) {
|
||||
f.elements.width.value = img.width;
|
||||
f.elements.height.value = img.height;
|
||||
}
|
||||
|
||||
this.preloadImg = img;
|
||||
},
|
||||
|
||||
changeAppearance : function() {
|
||||
var ed = tinyMCEPopup.editor, f = document.forms[0], img = document.getElementById('alignSampleImg');
|
||||
|
||||
if (img) {
|
||||
if (ed.getParam('inline_styles')) {
|
||||
ed.dom.setAttrib(img, 'style', f.style.value);
|
||||
} else {
|
||||
img.align = f.align.value;
|
||||
img.border = f.border.value;
|
||||
img.hspace = f.hspace.value;
|
||||
img.vspace = f.vspace.value;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
changeHeight : function() {
|
||||
var f = document.forms[0], tp, t = this;
|
||||
|
||||
if (!f.constrain.checked || !t.preloadImg) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (f.width.value == "" || f.height.value == "")
|
||||
return;
|
||||
|
||||
tp = (parseInt(f.width.value) / parseInt(t.preloadImg.width)) * t.preloadImg.height;
|
||||
f.height.value = tp.toFixed(0);
|
||||
},
|
||||
|
||||
changeWidth : function() {
|
||||
var f = document.forms[0], tp, t = this;
|
||||
|
||||
if (!f.constrain.checked || !t.preloadImg) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (f.width.value == "" || f.height.value == "")
|
||||
return;
|
||||
|
||||
tp = (parseInt(f.height.value) / parseInt(t.preloadImg.height)) * t.preloadImg.width;
|
||||
f.width.value = tp.toFixed(0);
|
||||
},
|
||||
|
||||
updateStyle : function(ty) {
|
||||
var dom = tinyMCEPopup.dom, st, v, f = document.forms[0], img = dom.create('img', {style : dom.get('style').value});
|
||||
|
||||
if (tinyMCEPopup.editor.settings.inline_styles) {
|
||||
// Handle align
|
||||
if (ty == 'align') {
|
||||
dom.setStyle(img, 'float', '');
|
||||
dom.setStyle(img, 'vertical-align', '');
|
||||
|
||||
v = getSelectValue(f, 'align');
|
||||
if (v) {
|
||||
if (v == 'left' || v == 'right')
|
||||
dom.setStyle(img, 'float', v);
|
||||
else
|
||||
img.style.verticalAlign = v;
|
||||
}
|
||||
}
|
||||
|
||||
// Handle border
|
||||
if (ty == 'border') {
|
||||
dom.setStyle(img, 'border', '');
|
||||
|
||||
v = f.border.value;
|
||||
if (v || v == '0') {
|
||||
if (v == '0')
|
||||
img.style.border = '0';
|
||||
else
|
||||
img.style.border = v + 'px solid black';
|
||||
}
|
||||
}
|
||||
|
||||
// Handle hspace
|
||||
if (ty == 'hspace') {
|
||||
dom.setStyle(img, 'marginLeft', '');
|
||||
dom.setStyle(img, 'marginRight', '');
|
||||
|
||||
v = f.hspace.value;
|
||||
if (v) {
|
||||
img.style.marginLeft = v + 'px';
|
||||
img.style.marginRight = v + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
// Handle vspace
|
||||
if (ty == 'vspace') {
|
||||
dom.setStyle(img, 'marginTop', '');
|
||||
dom.setStyle(img, 'marginBottom', '');
|
||||
|
||||
v = f.vspace.value;
|
||||
if (v) {
|
||||
img.style.marginTop = v + 'px';
|
||||
img.style.marginBottom = v + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
// Merge
|
||||
dom.get('style').value = dom.serializeStyle(dom.parseStyle(img.style.cssText), 'img');
|
||||
}
|
||||
},
|
||||
|
||||
changeMouseMove : function() {
|
||||
},
|
||||
|
||||
showPreviewImage : function(u, st) {
|
||||
if (!u) {
|
||||
tinyMCEPopup.dom.setHTML('prev', '');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!st && tinyMCEPopup.getParam("advimage_update_dimensions_onchange", true))
|
||||
this.resetImageData();
|
||||
|
||||
u = tinyMCEPopup.editor.documentBaseURI.toAbsolute(u);
|
||||
|
||||
if (!st)
|
||||
tinyMCEPopup.dom.setHTML('prev', '<img id="previewImg" src="' + u + '" border="0" onload="ImageDialog.updateImageData(this);" onerror="ImageDialog.resetImageData();" />');
|
||||
else
|
||||
tinyMCEPopup.dom.setHTML('prev', '<img id="previewImg" src="' + u + '" border="0" onload="ImageDialog.updateImageData(this, 1);" />');
|
||||
}
|
||||
};
|
||||
|
||||
ImageDialog.preInit();
|
||||
tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog);
|
||||
@ -1,43 +0,0 @@
|
||||
tinyMCE.addI18n('en.advimage_dlg',{
|
||||
tab_general:"General",
|
||||
tab_appearance:"Appearance",
|
||||
tab_advanced:"Advanced",
|
||||
general:"General",
|
||||
title:"Title",
|
||||
preview:"Preview",
|
||||
constrain_proportions:"Constrain proportions",
|
||||
langdir:"Language direction",
|
||||
langcode:"Language code",
|
||||
long_desc:"Long description link",
|
||||
style:"Style",
|
||||
classes:"Classes",
|
||||
ltr:"Left to right",
|
||||
rtl:"Right to left",
|
||||
id:"Id",
|
||||
map:"Image map",
|
||||
swap_image:"Swap image",
|
||||
alt_image:"Alternative image",
|
||||
mouseover:"for mouse over",
|
||||
mouseout:"for mouse out",
|
||||
misc:"Miscellaneous",
|
||||
example_img:"Appearance preview image",
|
||||
missing_alt:"Are you sure you want to continue without including an Image Description? Without it the image may not be accessible to some users with disabilities, or to those using a text browser, or browsing the Web with images turned off.",
|
||||
dialog_title:"Insert/edit image",
|
||||
src:"Image URL",
|
||||
alt:"Image description",
|
||||
list:"Image list",
|
||||
border:"Border",
|
||||
dimensions:"Dimensions",
|
||||
vspace:"Vertical space",
|
||||
hspace:"Horizontal space",
|
||||
align:"Alignment",
|
||||
align_baseline:"Baseline",
|
||||
align_top:"Top",
|
||||
align_middle:"Middle",
|
||||
align_bottom:"Bottom",
|
||||
align_texttop:"Text top",
|
||||
align_textbottom:"Text bottom",
|
||||
align_left:"Left",
|
||||
align_right:"Right",
|
||||
image_list:"Image list"
|
||||
});
|
||||
@ -33,7 +33,7 @@
|
||||
|
||||
/* Middle */
|
||||
.locomotive .mceMiddle { top: 0px; width: 100%; height: 100%; }
|
||||
.locomotive .mceMiddle span { top: 47px; position: relative; background: #fff; }
|
||||
.locomotive .mceMiddle span { top: 47px; position: relative; background: transparent; }
|
||||
|
||||
/* Bottom */
|
||||
.locomotive .mceBottom { bottom: 0px; width: 100%; height: 1px; background: #8b8d9a; }
|
||||
|
||||
110
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/css/locoimage.css
vendored
Normal file
110
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/css/locoimage.css
vendored
Normal file
@ -0,0 +1,110 @@
|
||||
/*#src_list, #over_list, #out_list {width:280px;}
|
||||
.mceActionPanel {margin-top:7px;}
|
||||
.alignPreview {border:1px solid #000; width:140px; height:140px; overflow:hidden; padding:5px;}
|
||||
.checkbox {border:0;}
|
||||
.panel_wrapper div.current {height:305px;}
|
||||
#prev {margin:0; border:1px solid #000; width:428px; height:150px; overflow:auto;}
|
||||
#align, #classlist {width:150px;}
|
||||
#width, #height {vertical-align:middle; width:50px; text-align:center;}
|
||||
#vspace, #hspace, #border {vertical-align:middle; width:30px; text-align:center;}
|
||||
#class_list {width:180px;}
|
||||
input {width: 280px;}
|
||||
#constrain, #onmousemovecheck {width:auto;}
|
||||
#id, #dir, #lang, #usemap, #longdesc {width:200px;}
|
||||
*/
|
||||
|
||||
body {
|
||||
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||
font-size: 1em;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
p.no-items {
|
||||
padding: 18px 0px;
|
||||
background: transparent url(/images/admin/list/none-small.png) no-repeat center 0;
|
||||
text-align: center;
|
||||
color: #9d8963 !important;
|
||||
font-size: 1.1em !important;
|
||||
}
|
||||
|
||||
.actions {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
ul.assets {
|
||||
overflow: auto;
|
||||
height: 571px;
|
||||
}
|
||||
|
||||
ul.assets li.asset h4 a {
|
||||
top: 9px;
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
ul.assets li.asset .image img {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
ul.assets li.asset div.actions {
|
||||
top: 7px;
|
||||
}
|
||||
|
||||
ul.assets li.new-asset {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#upload-link {
|
||||
float: left;
|
||||
display: block;
|
||||
background: transparent url("/images/admin/buttons/dark-gray-bg.png") repeat-x 0 0;
|
||||
outline: none;
|
||||
-moz-border-radius : 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
height: 20px;
|
||||
font-size: 0.8em;
|
||||
font-family: 'Lucida Grande';
|
||||
padding: 5px 12px 5px 12px;
|
||||
margin: 5px 0 0 14px;
|
||||
color: #fff !important;
|
||||
text-decoration: none;
|
||||
text-shadow: 1px 1px 1px #000;
|
||||
}
|
||||
|
||||
#spinner {
|
||||
position: fixed;
|
||||
top: 40%;
|
||||
left: 30%;
|
||||
height: 60px;
|
||||
width: 250px;
|
||||
background: transparent;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
#spinner .overlay, #spinner .text {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
-moz-border-radius : 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
}
|
||||
|
||||
#spinner .overlay {
|
||||
background: #000;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#spinner .text {
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
font-size: 1.1em;
|
||||
color: #fff;
|
||||
text-shadow: 1px 1px 1px #000;
|
||||
}
|
||||
|
||||
.mceActionPanel input {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
1
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/editor_plugin.js
vendored
Normal file
1
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/editor_plugin.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
(function(){tinymce.create('tinymce.plugins.LocoImagePlugin',{init:function(ed,url){ed.addCommand('locoImage',function(){ed.windowManager.open({file:url+'/image.htm?6',width:645,height:650,inline:1},{plugin_url:url})});ed.addButton('image',{title:'locoimage.image_desc',cmd:'locoImage'})},getInfo:function(){return{longname:'Locomotive image',author:'Locomotive Engine',authorurl:'http://www.locomotiveapp.org',infourl:'http://www.locomotiveapp.org',version:tinymce.majorVersion+"."+tinymce.minorVersion}}});tinymce.PluginManager.add('locoimage',tinymce.plugins.LocoImagePlugin)})();
|
||||
46
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/editor_plugin_src.js
vendored
Normal file
46
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/editor_plugin_src.js
vendored
Normal file
@ -0,0 +1,46 @@
|
||||
/**
|
||||
* editor_plugin_src.js
|
||||
*
|
||||
* Copyright 2009, Moxiecode Systems AB
|
||||
* Released under LGPL License.
|
||||
*
|
||||
* License: http://tinymce.moxiecode.com/license
|
||||
* Contributing: http://tinymce.moxiecode.com/contributing
|
||||
*/
|
||||
|
||||
(function() {
|
||||
tinymce.create('tinymce.plugins.LocoImagePlugin', {
|
||||
init : function(ed, url) {
|
||||
// Register commands
|
||||
ed.addCommand('locoImage', function() {
|
||||
ed.windowManager.open({
|
||||
file : url + '/image.htm',
|
||||
width : 645,
|
||||
height : 650,
|
||||
inline : 1
|
||||
}, {
|
||||
plugin_url : url
|
||||
});
|
||||
});
|
||||
|
||||
// Register buttons
|
||||
ed.addButton('image', {
|
||||
title : 'locoimage.image_desc',
|
||||
cmd : 'locoImage'
|
||||
});
|
||||
},
|
||||
|
||||
getInfo : function() {
|
||||
return {
|
||||
longname : 'Locomotive image',
|
||||
author : 'Locomotive Engine',
|
||||
authorurl : 'http://www.locomotiveapp.org',
|
||||
infourl : 'http://www.locomotiveapp.org',
|
||||
version : tinymce.majorVersion + "." + tinymce.minorVersion
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
// Register plugin
|
||||
tinymce.PluginManager.add('locoimage', tinymce.plugins.LocoImagePlugin);
|
||||
})();
|
||||
62
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/image.htm
vendored
Normal file
62
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/image.htm
vendored
Normal file
@ -0,0 +1,62 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>{#locoimage_dlg.dialog_title}</title>
|
||||
|
||||
<script type="text/javascript" src="../../tiny_mce_popup.js"></script>
|
||||
|
||||
<script type="text/javascript" src="/javascripts/admin/jquery.js"></script>
|
||||
<script type="text/javascript" src="/javascripts/admin/rails.js"></script>
|
||||
|
||||
<script src="/javascripts/admin/plugins/plupload/src/plupload.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/plupload.gears.min.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/src/flash.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/plupload.html4.min.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/plupload.html5.min.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/jquery.plupload.queue.min.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/plupload/jquery.plupload.queue.min.js" type="text/javascript"></script>
|
||||
<script src="/javascripts/admin/plugins/scrollTo.js" type="text/javascript"></script>
|
||||
|
||||
<script type="text/javascript" src="js/image.js?7"></script>
|
||||
|
||||
<link href="/stylesheets/admin/assets.css" rel="stylesheet" type="text/css" />
|
||||
<link href="css/locoimage.css?3" rel="stylesheet" type="text/css" />
|
||||
</head>
|
||||
<body id="locoimage" style="display: none">
|
||||
|
||||
<div id="spinner">
|
||||
<div class="overlay"></div>
|
||||
<div class="text loading">{#locoimage_dlg.loading}</div>
|
||||
<div class="text uploading" style="display: none">{#locoimage_dlg.uploading}</div>
|
||||
<div class="text destroying" style="display: none">{#locoimage_dlg.destroying}</div>
|
||||
</div>
|
||||
|
||||
<p class="no-items" style="display: none">{#locoimage_dlg.no_items}</p>
|
||||
|
||||
<form onsubmit="insertAction();return false;" action="#">
|
||||
<div id="images">
|
||||
<ul class="assets">
|
||||
<li class="new-asset">
|
||||
<h4><a href="#">NoName</a></h4>
|
||||
<div class="image">
|
||||
<div class="inside">
|
||||
<img src="/images/admin/icons/filetype/medium/CSS.png">
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<a href="#" class="remove" data-confirm="{#locoimage_dlg.confirm}" data-method="delete" rel="nofollow">
|
||||
<img src="/images/admin/list/icons/cross.png">
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
<li class="clear"></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="mceActionPanel">
|
||||
<a href="/admin/images.json" id="upload-link">{#locoimage_dlg.upload}</a>
|
||||
<input type="button" id="cancel" name="cancel" value="{#cancel}" onclick="tinyMCEPopup.close();" />
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
172
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/js/image.js
vendored
Normal file
172
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/js/image.js
vendored
Normal file
@ -0,0 +1,172 @@
|
||||
var ImageDialog = {
|
||||
formElement: null,
|
||||
|
||||
listElement: null,
|
||||
|
||||
preInit : function() {
|
||||
var url;
|
||||
|
||||
tinyMCEPopup.requireLangPack();
|
||||
|
||||
if (url = tinyMCEPopup.getParam("external_image_list_url"))
|
||||
document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>');
|
||||
},
|
||||
|
||||
init : function(ed) {
|
||||
var self = this;
|
||||
|
||||
formElement = $(document.forms[0]);
|
||||
|
||||
listElement = formElement.find('ul');
|
||||
|
||||
$.getJSON('/admin/images.json', function(data) {
|
||||
$(data.images).each(function() {
|
||||
self._addImage(this);
|
||||
});
|
||||
|
||||
self.setupUploader();
|
||||
|
||||
self.hideSpinner();
|
||||
|
||||
if ($('ul li.asset').length == 0) $('p.no-items').show();
|
||||
});
|
||||
},
|
||||
|
||||
hideSpinner: function() {
|
||||
$('#spinner').hide();
|
||||
},
|
||||
|
||||
showSpinner: function(msg) {
|
||||
$('#spinner .text').hide();
|
||||
$('#spinner .' + msg).show();
|
||||
$('#spinner').show();
|
||||
},
|
||||
|
||||
insert: function(url) {
|
||||
var ed = tinyMCEPopup.editor, f = document.forms[0], nl = f.elements, v, args = {}, el;
|
||||
|
||||
tinyMCEPopup.restoreSelection();
|
||||
|
||||
// Fixes crash in Safari
|
||||
if (tinymce.isWebKit) ed.getWin().focus();
|
||||
|
||||
tinymce.extend(args, { src : url });
|
||||
|
||||
el = ed.selection.getNode();
|
||||
|
||||
if (el && el.nodeName == 'IMG') {
|
||||
ed.dom.setAttribs(el, args);
|
||||
} else {
|
||||
ed.execCommand('mceInsertContent', false, '<img id="__mce_tmp" />', {skip_undo : 1});
|
||||
ed.dom.setAttribs('__mce_tmp', args);
|
||||
ed.dom.setAttrib('__mce_tmp', 'id', '');
|
||||
ed.undoManager.add();
|
||||
}
|
||||
|
||||
tinyMCEPopup.close();
|
||||
},
|
||||
|
||||
setupUploader: function() {
|
||||
var self = this;
|
||||
var multipartParams = {};
|
||||
|
||||
with(window.parent) {
|
||||
multipartParams[$('meta[name=csrf-param]').attr('content')] = $('meta[name=csrf-token]').attr('content');
|
||||
}
|
||||
|
||||
var uploader = new plupload.Uploader({
|
||||
runtimes : (jQuery.browser.webkit == true ? 'flash' : 'html5,flash'),
|
||||
// container: 'theme-images',
|
||||
browse_button : 'upload-link',
|
||||
max_file_size : '5mb',
|
||||
url : $('a#upload-link').attr('href'),
|
||||
flash_swf_url : '/javascripts/admin/plugins/plupload/plupload.flash.swf',
|
||||
multipart: true,
|
||||
multipart_params: multipartParams,
|
||||
filters : [
|
||||
{ title : "Image files", extensions : "jpg,gif,png" },
|
||||
]
|
||||
});
|
||||
|
||||
uploader.bind('QueueChanged', function() {
|
||||
self.showSpinner('uploading');
|
||||
uploader.start();
|
||||
});
|
||||
|
||||
uploader.bind('FileUploaded', function(up, file, response) {
|
||||
var json = JSON.parse(response.response);
|
||||
|
||||
if (json.status == 'success')
|
||||
self._addImage(json);
|
||||
|
||||
self.hideSpinner();
|
||||
});
|
||||
|
||||
uploader.init();
|
||||
},
|
||||
|
||||
_addImage: function(data) {
|
||||
var self = this;
|
||||
|
||||
var asset = $('ul li.new-asset')
|
||||
.clone()
|
||||
.insertBefore($('ul li.clear'))
|
||||
.addClass('asset');
|
||||
|
||||
asset.find('h4 a').attr('href', data.url)
|
||||
.html(data.name)
|
||||
.bind('click', function(e) {
|
||||
self.insert(data.url);
|
||||
e.stopPropagation(); e.preventDefault();
|
||||
});
|
||||
|
||||
asset.find('.image .inside img')
|
||||
.attr('src', data.vignette_url)
|
||||
.bind('click', function(e) {
|
||||
self.insert(data.url);
|
||||
});
|
||||
|
||||
asset.find('.actions a')
|
||||
.attr('href', data.destroy_url)
|
||||
.bind('click', function(e) {
|
||||
if (confirm($(this).attr('data-confirm'))) {
|
||||
self.showSpinner('destroying');
|
||||
$(this).callRemote();
|
||||
}
|
||||
e.preventDefault(); e.stopPropagation();
|
||||
})
|
||||
.bind('ajax:success', function(event, data) {
|
||||
self._destroyImage(asset);
|
||||
});
|
||||
|
||||
if ($('ul li.asset').length % 4 == 0)
|
||||
asset.addClass('last');
|
||||
|
||||
asset.removeClass('new-asset');
|
||||
|
||||
$('p.no-items').hide();
|
||||
|
||||
$('ul').scrollTo($('li.asset:last'), 400);
|
||||
},
|
||||
|
||||
_destroyImage: function(asset) {
|
||||
asset.remove();
|
||||
|
||||
if ($('ul li.asset').length == 0) {
|
||||
$('p.no-items').show();
|
||||
} else {
|
||||
$('ul li.asset').each(function(index) {
|
||||
if ((index + 1) % 4 == 0)
|
||||
$(this).addClass('last');
|
||||
else
|
||||
$(this).removeClass('last');
|
||||
});
|
||||
}
|
||||
|
||||
this.hideSpinner();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
ImageDialog.preInit();
|
||||
tinyMCEPopup.onInit.add(ImageDialog.init, ImageDialog);
|
||||
9
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/langs/en_dlg.js
vendored
Normal file
9
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/langs/en_dlg.js
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
tinyMCE.addI18n('en.locoimage_dlg',{
|
||||
dialog_title: 'Insert image',
|
||||
upload: 'Upload image',
|
||||
loading: 'Loading...',
|
||||
uploading: 'Uploading...',
|
||||
destroying: 'Destroying...',
|
||||
confirm: 'Are you sure ?',
|
||||
no_items: 'There are no images for now.'
|
||||
});
|
||||
9
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/langs/fr_dlg.js
vendored
Normal file
9
public/javascripts/admin/plugins/tiny_mce/plugins/locoimage/langs/fr_dlg.js
vendored
Normal file
@ -0,0 +1,9 @@
|
||||
tinyMCE.addI18n('fr.locoimage_dlg',{
|
||||
dialog_title: 'Insérer une image',
|
||||
upload: 'Uploader image',
|
||||
loading: 'Chargement...',
|
||||
uploading: 'Uploading...',
|
||||
destroying: 'Suppression...',
|
||||
confirm: 'Êtes-vous sûr(e) ?',
|
||||
no_items: 'Il n\'y a aucune image pour l\'instant'
|
||||
});
|
||||
@ -5,7 +5,7 @@ body {
|
||||
/* font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;*/
|
||||
background: #fff;
|
||||
padding:0;
|
||||
margin:8px 8px 0 8px;
|
||||
margin: 8px 10px 0 10px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
|
||||
@ -27,6 +27,10 @@ body {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.mceMiddle span {
|
||||
background: red !important;
|
||||
}
|
||||
|
||||
.mceActionPanel input {
|
||||
color: #787A89;
|
||||
text-shadow: 1px 1px 1px #fff;
|
||||
@ -35,10 +39,9 @@ body {
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 1px 1px 1px #333;
|
||||
padding: 8px 9px;
|
||||
margin-right: 20px;
|
||||
padding: 6px 9px 8px;
|
||||
margin: 5px 20px 0 0;
|
||||
font-size: 1em;
|
||||
font-family: 'Lucida Grande';
|
||||
border: 0px;
|
||||
background-image: -webkit-gradient(
|
||||
linear,
|
||||
@ -54,6 +57,7 @@ body {
|
||||
rgb(235,237,244) 47%,
|
||||
rgb(235,237,244) 70%
|
||||
);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
@import url(/stylesheets/admin/assets.css);
|
||||
|
||||
/* ___ application messages ___ */
|
||||
|
||||
div.notice {
|
||||
@ -96,63 +98,6 @@ ul.list li span.handle {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
/* ___ assets ___ */
|
||||
|
||||
ul.assets {
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
ul.assets li.asset {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 139px;
|
||||
height: 140px;
|
||||
background: transparent url(/images/admin/list/thumb.png) no-repeat 0 0;
|
||||
margin: 0 17px 17px 0;
|
||||
}
|
||||
|
||||
ul.assets li.asset.last {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
ul.assets li.asset h4 { margin: 0px; height: 30px; border-bottom: 1px solid #ccced7; position: relative; }
|
||||
|
||||
ul.assets li.asset h4 a {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 12px;
|
||||
font-weight: bold;
|
||||
font-size: 0.6em;
|
||||
color: #1f82bc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
ul.assets li.asset h4 a:hover { text-decoration: underline; }
|
||||
|
||||
ul.assets li.asset div.image {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border: 4px solid #fff;
|
||||
margin: 10px 0 0 24px;
|
||||
background: transparent url(/images/admin/list/empty.png) repeat 0 0;
|
||||
}
|
||||
|
||||
ul.assets li.asset div.image div.inside {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
ul.assets li.asset div.actions {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
/* ___ asset collections ___ */
|
||||
|
||||
div#asset-uploader { display: inline-block; margin-left: 10px; }
|
||||
|
||||
54
public/stylesheets/admin/assets.css
Normal file
54
public/stylesheets/admin/assets.css
Normal file
@ -0,0 +1,54 @@
|
||||
ul.assets {
|
||||
list-style: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
ul.assets li.asset {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 139px;
|
||||
height: 140px;
|
||||
background: transparent url(/images/admin/list/thumb.png) no-repeat 0 0;
|
||||
margin: 0 17px 17px 0;
|
||||
}
|
||||
|
||||
ul.assets li.asset.last {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
ul.assets li.asset h4 { margin: 0px; height: 30px; border-bottom: 1px solid #ccced7; position: relative; }
|
||||
|
||||
ul.assets li.asset h4 a {
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
left: 12px;
|
||||
font-weight: bold;
|
||||
font-size: 0.6em;
|
||||
color: #1f82bc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
ul.assets li.asset h4 a:hover { text-decoration: underline; }
|
||||
|
||||
ul.assets li.asset div.image {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border: 4px solid #fff;
|
||||
margin: 10px 0 0 24px;
|
||||
background: transparent url(/images/admin/list/empty.png) repeat 0 0;
|
||||
}
|
||||
|
||||
ul.assets li.asset div.image div.inside {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
ul.assets li.asset div.actions {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 12px;
|
||||
}
|
||||
@ -41,13 +41,11 @@
|
||||
outline: none;
|
||||
-moz-border-radius : 10px;
|
||||
-webkit-border-radius: 10px;
|
||||
color: #787a89;
|
||||
height: 20px;
|
||||
font-size: 0.7em;
|
||||
padding: 0px 12px 0px 12px;
|
||||
color: #8B8D9A !important;
|
||||
text-decoration: none;
|
||||
color: #8B8D9A;
|
||||
text-shadow: 1px 1px 1px #fff;
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user