westarete-skylinecms 3.0.8.20100329

data/public/skyline/javascripts/src/draggable_files.js

@@ -0,0 +1,102 @@
+/*
+  Class: Skyline.DraggableFileList
+  Implements a basic draggable list that triggers events to do AJAX or other actions
+  
+  Parameters:
+    draggableSelector - css query rule for draggables
+    droppableSelector - css query rule for droppables.
+    
+  Events:
+    dropped - triggered when a dragged element is dropped into a droppable container with 2 
+              parameters. the draggable element and the droppable element.
+    
+*/
+Application.DraggableFileList = new Class({
+	Implements: [Events, Options],
+  options : {
+    draggableOpacity: 0.5
+  },
+  initialize : function(draggableSelector, droppableSelector,options){
+    this.setOptions(options);
+    this.draggableSelector = draggableSelector;
+    this.droppableSelector = droppableSelector;
+    
+    
+    this.draggables = $$(this.draggableSelector);
+    this.droppables = $$(this.droppableSelector);
+    
+    this.draggables.each(function(item){
+      item.addEvent('mousedown', this.startDrag.bindWithEvent(this,item));
+      item.addEvent('click',function(ev){ this.fireEvent("selected",[ev,item]); }.bindWithEvent(this));
+    }.bind(this));
+  },
+  startDrag : function(ev,item){
+    var event = new Event(ev);
+    
+    // Clone item to be dragged to keep the list intact also clones content and id of the 
+    // element.
+    var clone = item.clone(true,true).inject(document.body);
+    clone.addClass("draggableFile");
+    var dimen = item.getCoordinates();
+    clone.setStyles({
+      visibility : "hidden",
+      "float": "none", 
+      left: dimen.left, 
+      top: dimen.top, 
+      position: "absolute"});
+    
+    //Set up drag events
+    var fileDrag = new Drag.Move(clone, {
+      snap: 5,
+      droppables: this.droppables
+    });
+    fileDrag.dragEl = item;
+
+    fileDrag.fileList = this;
+    fileDrag.origOpacity = fileDrag.dragEl.get('opacity');
+    
+    fileDrag.addEvent("snap", function(){
+      event.stop();
+    });
+    
+    fileDrag.addEvents({
+      "snap": this._onSnap,
+      "drop": this._onDrop,
+      "enter": this._onEnterDroppable,
+      "leave": this._onLeaveDroppable,
+      "complete": this._onComplete,
+      "cancel": this._onComplete
+    });
+    
+    // Start the drag manually
+    fileDrag.start(ev);    
+  },
+  _onSnap : function(){
+    this.element.setStyle('visibility', 'visible');
+    this.dragEl.set("opacity",this.options.draggableOpacity);    
+  },
+  _onDrop : function(clone, droppable,event){
+    if (droppable) {
+      var event = new Event(event);      
+      event.stop();
+      this.fileList.fireEvent("dropped",[this.dragEl, droppable]);
+    } 
+  },
+  _onEnterDroppable : function(clone,droppable){
+    this.currentDrop = droppable;
+    this.currentDrop.addClass("droppable");
+    this.currentDrop.addClass("inside");    
+  },
+  _onLeaveDroppable : function(clone,droppable){
+    this.currentDrop.removeClass("droppable");
+    this.currentDrop.removeClass("inside");
+  },
+  _onComplete : function(clone){
+    clone.destroy();    
+    this.detach();
+    if(this.currentDrop){
+      this.currentDrop.removeClass("droppable");
+    }
+    this.dragEl.set("opacity",this.origOpacity);    
+  }
+});

data/public/skyline/javascripts/src/library_uploader.js

@@ -0,0 +1,226 @@
+//= require <uploader>
+
+/*
+  Class: Application.LibraryUploader
+  Implements the specific upload widget for Skyline.
+*/
+Application.LibraryUploader = new Class({
+  Extends: Skyline.Uploader,
+  options: {
+    path: "/skyline/javascripts/src/skyline/vendor/fancyupload/Swiff.Uploader.swf"
+  },
+  initialize : function(formId,options){
+    this.formEl = $(formId);
+    var fEl = this.formEl.getElement(".upload-files");
+    var pEl = this.formEl.getElement(".upload-progress");
+    
+    this.uploadBrowser = new Application.UploadBrowser(this,fEl);
+    this.uploadProgress = new Application.UploadProgress(this,pEl);  
+    
+    var options = options || {};
+    options.target = this.uploadBrowser.browseEl;
+    options.url = this.formEl.action;
+    options.fileClass= Application.UploadFile;
+    
+    this.addEvents({
+      "load" : this.onInit,
+      "updateStatus" : this.onUpdateStatus,
+      "start" : this.onStartUpload,
+      "completeSuccess" : this.onCompleteSuccess,
+      "completeFailure" : this.onCompleteFailure,      
+      "complete" : this.onCompleteUpload,
+      "fileStart" : this.onUpdateProgress,
+      "fileComplete" : this.onUpdateProgress,
+      "fileProgress" : this.onUpdateProgress
+    });    
+    this.parent(options);
+  },
+  // Events
+  onInit : function(){
+    this.uploadBrowser.show();
+    this.uploadProgress.hide();
+  },
+  onUpdateStatus : function(){
+    this.uploadBrowser.update();
+  },
+  onStartUpload : function(){
+    this.uploadBrowser.hide();
+    this.uploadProgress.show();  
+    this.uploadProgress.start();
+  },
+  onCompleteUpload : function(){
+    this.uploadBrowser.show();
+    this.uploadProgress.hide();
+    this.uploadBrowser.browseEl.destroy();
+    this.box.destroy();
+  },
+  onCompleteSuccess : function(){
+    this.uploadBrowser.setMessage(this.options.allUploadedMessage);
+  },
+  onCompleteFailure : function(){
+    this.uploadBrowser.setMessage(this.options.someUploadedMessage);          
+  },
+  onUpdateProgress : function(file){
+    this.uploadProgress.update(file);
+  }
+});
+
+Application.UploadBrowser = new Class({
+  initialize : function(base,containerEl){
+    var fEl = this.containerEl = $(containerEl);
+    this.base = base;
+    
+    this.listEl = fEl.getElement("ul.files");  // The file list
+    this.browseEl = fEl.getElement(".browse"); // The browse button
+    this.uploadEl = fEl.getElement(".upload"); // The upload button (starts upload)
+    
+    this.blankListEl = fEl.getElement(".blank"); // The blank slate element (OPTIONAL)
+    this.totalFilesEl = fEl.getElement(".total-files"); // The total files to upload indicator (OPTIONAL)
+    this.totalSizeEl = fEl.getElement(".total-size"); // The total size in kB to upload indicator (OPTIONAL)
+    this.messagesEl = fEl.getElement(".messages"); // The messages panel (OPTIONAL)
+    
+    this.uploadEl.addEvent("click",function(){
+      base.start();
+      return false;
+    });    
+  },
+  setMessage : function(msg){
+    if(this.messagesEl){
+      this.messagesEl.set("html",msg);
+    }
+  },
+  update : function(){
+    // Blank slate cleanup
+	  if(this.blankListEl){ 
+      if(this.base.size === 0){
+        this.blankListEl.removeClass("hide");
+      } else {
+        this.blankListEl.addClass("hide");
+      };	      	    
+	  }
+    
+    if(this.totalFilesEl){
+      this.totalFilesEl.set("html",this.base.fileList.length);
+    }
+    if(this.totalSizeEl){
+      this.totalSizeEl.set("html",Swiff.Uploader.formatUnit(this.base.size,"b"));
+    }    
+  },
+  hide : function(){
+    this.containerEl.addClass("hide");
+  },
+  show : function(){
+    this.containerEl.removeClass("hide");    
+  }
+});
+
+Application.UploadProgress = new Class({
+  initialize : function(base,containerEl){
+    var fEl = this.containerEl = $(containerEl);
+    this.base = base;
+    
+    this.setters.each(function(fun,fName){
+      var el = fEl.getElement(fun[0]);
+      
+      if(el){
+        this[fName] = fun[1].pass(el,this);
+      } else {
+        this[fName] = $empty;
+      }
+    },this);
+    
+    this.cancelEl = fEl.getElement(".cancel");
+    if(this.cancelEl){
+      this.cancelEl.addEvent("click",function(){
+        base.stop();
+      });
+    }
+    
+  },
+  start : function(){
+    this.updateTotalFiles();
+    this.updateTotalSize();    
+  },
+  update : function(file){
+    this.currentFile = file;
+    this.updateCurrentFile();
+    this.updateCurrentPercentage();
+    this.updateCurrentSize();
+    this.updateProgressBar();   
+  },
+  hide : function(){
+    this.containerEl.addClass("hide");
+  },
+  show : function(){
+    this.containerEl.removeClass("hide");    
+  },
+  
+  setters : $H({
+    updateTotalFiles  : [".total-files", function(el){ el.set("html",this.base.fileList.length); }],
+    updateTotalSize   : [".total-size" , function(el){ el.set("html",Swiff.Uploader.formatUnit(this.base.size,"b")); }],
+    updateCurrentFile : [".current-file", function(el){ el.set("html", this.base.fileList.indexOf(this.currentFile) + 1 );}],
+    updateCurrentPercentage : [".current-percentage", function(el){ el.set("html",this.base.percentLoaded + "%"); }],
+    updateCurrentSize : [".current-size", function(el){ el.set("html", Swiff.Uploader.formatUnit(this.base.bytesLoaded, 'b')); }],
+    updateProgressBar : [".progressbar .bar", function(el){ el.setStyle("width",this.base.percentLoaded + "%"); }]
+  })
+});
+
+Application.UploadFile = new Class({
+  Extends: Skyline.Uploader.File,
+  render : function(){
+		if (this.invalid) {
+			this.remove();
+			return;
+		}
+    
+		this.addEvents({
+      'success' : this.onSuccess,
+      'failure' : this.onFailure,
+      'stop' : this.onStop,
+      'remove': this.onRemoveFile // Don't call this onRemove (it conflicts with internal onRemove)
+		});    
+    
+    this.infoEl = new Element('span', {'class': 'info'});
+    this.removeEl =  new Element('a', {
+			'class': 'remove',
+			href: '#',
+			html: "X",
+			title: "X",
+			events: {
+				click: function() {
+					this.remove();
+					return false;
+				}.bind(this)
+			}
+		});
+		
+		this.element = new Element('li').adopt(
+		    new Element("span",{"class": "name", "html" : this.name}),
+  			new Element('span', {'class': 'size', 'html': " (" + Swiff.Uploader.formatUnit(this.size, 'b') + ") "}),
+  			this.removeEl,
+  			this.infoEl
+		).inject(this.base.uploadBrowser.listEl);
+  },
+  // Events
+  onFailure : function(){
+    this.element.removeClass("success");        
+    this.element.addClass("failed");
+    if(this.response.code == 422){
+      if(this.response.json && this.response.json.errors){
+        this.infoEl.set("html", this.response.json.errors["file"]);
+      }
+    } 
+    this.removeEl.destroy();          
+  },
+  onSuccess : function(){
+    this.element.removeClass("failed");
+    this.element.addClass("success");
+    this.removeEl.destroy();    
+  },
+  onStop : function(){
+    this.remove();
+  },
+	onRemoveFile: function() {
+	  this.element.destroy();
+	}  
+});

data/public/skyline/javascripts/src/messages.js

@@ -0,0 +1,61 @@
+Application.Message = new Class({
+  Implements : [Options],
+  options : {
+    area : "messageArea",
+    type: "success"
+  },
+  initialize : function(msg){
+    this.setOptions(arguments[1]);
+    this.areaEl = $(this.options.area);
+    this.message = msg;
+    if(!this.areaEl){
+      throw("Can't find options.area.");
+    }
+
+    this.add();
+    this.setupArea();
+    this.render();
+  },
+  add : function(){
+    Application.Message.all.push(this);    
+  },  
+  render : function(){
+    this.element = new Element("div", {"class" : this.options.type, "html" : this.message});
+    this.element.inject(this.containerEl,"bottom");
+    this.postRender();
+  },
+  
+  postRender : function(){
+    var l;
+    if(l = this.areaEl.retrieve("skyline.layout")){
+      l.parent.setup();
+    }    
+  },
+  
+  setupArea : function(){
+    if(this.areaEl){
+      this.containerEl = this.areaEl.getElement(".messages");
+      if(!this.containerEl){
+        this.containerEl = new Element("div", {"class": "messages"});
+        this.areaEl.adopt(this.containerEl);
+      }
+      
+    }
+  }
+});
+
+Application.Message.all = $A([]);
+
+Application.Notification = new Class({
+  Extends : Application.Message,
+  add : function(){
+    Application.Notification.all.push(this);
+    setTimeout(this.hide.bind(this),5000);
+  },
+  hide : function(){
+    this.element.dispose();
+    this.postRender();
+  }
+});
+
+Application.Notification.all = $A([]);

data/public/skyline/javascripts/src/mootools_on_rails.js

@@ -0,0 +1,53 @@
+if ('outerHTML' in document.documentElement) {
+  Element.HtmlToDom = function(element,content){
+    var div = new Element('div');
+    div.set("html",content);
+    return $A(div.childNodes);    
+  };
+} else {
+  Element.HtmlToDom = function(element,content) {
+    var range = element.ownerDocument.createRange();
+    range.selectNode(element);
+    return $A([range.createContextualFragment(content.stripScripts())]);
+  };  
+};
+
+Element.implement({
+	replace: function(content) {
+	  var scripts = "";
+	  var nc = content.stripScripts(function(s){ scripts = s; });
+	  
+    if ('outerHTML' in document.documentElement) {	  
+      this.outerHTML = nc;
+  	} else {
+  		var el = Element.HtmlToDom(this,nc)[0];
+  		this.parentNode.replaceChild(el, this);	  
+  	}
+  	$exec(scripts);
+	},
+	
+	replaceHTML: function(content) {		
+		this.set('html', content);
+		content.stripScripts(true);
+	},	
+	
+	append: function(position, content) {
+	  var scripts = "";
+	  var nc = content.stripScripts(function(s){ scripts = s; });
+    var els = Element.HtmlToDom(this,nc);
+    if (position == 'top' || position == 'after'){ els.reverse(); };
+    els.each(function(el){
+      Element.inject(el,this,position);
+    }.bind(this));
+    $exec(scripts);
+	},
+	
+	appendTop: function(content) { this.append('top', content); },
+	
+	appendBottom: function(content) { this.append('bottom', content); },
+	
+	appendAfter: function(content) { this.append('after', content); },
+	
+	appendBefore: function(content) { this.append('before', content); }	
+});	
+

data/public/skyline/javascripts/src/page_helper.js

@@ -0,0 +1,49 @@
+var DeleteHelper = {
+  /* ie: destroy('id') */
+  destroy : function(fieldId) {
+    var field = $(fieldId);    
+    field.getElement("input.delete").value = '1';
+    field.addClass('destroyed');
+  },
+  
+  /* ie: undelete('field', 2) or undelete('field_value', 3) */
+  unDestroy : function(fieldId) {
+    var field = $(fieldId);
+    field.getElement("input.delete").value = '0';
+    field.removeClass('destroyed');
+  }
+};
+
+var PageHelper = {
+  contentChanged : false,
+  currentVariantId : null,
+    
+  newVariantSelected : function(variantId) {
+    $('change_variant_form').submit();
+  },
+  
+  contentHasChanged : function() {
+    this.contentChanged = true;
+  },
+  
+  /* ie: destroy('id') */
+  destroy : function(fieldId) {
+    var field = $(fieldId);
+    this.contentHasChanged();
+    
+    var value = field.match(".identifier input").value;
+    if(value){
+      field.select(".undestroy .value").each(function(v){
+        v.update(value);
+      });
+    }
+    DeleteHelper.destroy(field);
+  },
+  
+  /* ie: undelete('field', 2) or undelete('field_value', 3) */
+  unDestroy : function(fieldId) {
+    var field = $(fieldId);
+    this.contentHasChanged();
+    DeleteHelper.unDestroy(field);
+  }
+};

data/public/skyline/javascripts/src/poller.js

@@ -0,0 +1,51 @@
+/* 
+  Class: Application.Poller
+  The poller periodically sends requests to the server to verify that the current
+  user is still editing this page. It also handles takeover actions when another
+  user takes over editing.
+  
+  Only ONE instance of Application.Poller can be active. Only the first
+  instance will be registered into Application.Poller.current.
+  
+  Parameters:
+  url - The URL to poll.
+*/
+Application.Poller = new Class({
+  initialize : function(url){
+    if(!url || Application.Poller.current){ return; }
+    
+    this.url = url;
+    
+    Application.Poller.current = this;
+    this.poller = this.poll.periodical(5000,this);
+  },
+  poll : function(){
+    var request = new Request.JSON({url: this.url });
+    request.addEvent("success",this.handlePollResponse.bind(this));
+    request.get();
+  },
+  handlePollResponse : function(response,text){
+    if(!response.current_editor){
+      $clear(this.poller);
+      var d  = new Skyline.Dialog();
+      d.setContent(response.message);
+      if(response.title){
+        d.setTitle(response.title);
+      }
+      d.show();
+    }
+  },
+  handleTakeOverAction : function(){
+    var action = $('takeoverAction_ignore').get("checked") ? "ignore" : "new";
+    var newVariantName = $('takeoverActionNewVariantName').get("value");
+    
+    if(action == "ignore"){
+      window.location = window.location;
+    } else {
+      $('clone_variant').set("value","1");
+      $('page_variants_attributes_1_name').set("value",newVariantName);
+      $('page_form').submit();
+    }
+  }  
+});
+Application.Poller.current = null;

data/public/skyline/javascripts/src/sections.js

@@ -0,0 +1,70 @@
+/*
+  Class: Application.Sections
+  Class to create section lists that are sortable.
+*/
+Application.Sections = new Class({
+  Implements : [Options],
+  options : {
+    scrollParent : null
+  },
+  initialize : function(sectionsEl){
+    this.element = $(sectionsEl);
+    this.setOptions(arguments[1]);
+    
+    this.element.store("application.sections",this);
+    
+    if(!this.options.scrollParent){
+      this.options.scrollParent = this.element.getOffsetParent();
+    }
+    
+    this._initSortable();
+  },
+  
+  addSection : function(section){
+    this.sortable.addItem(section);
+  },
+  
+  // Privates methods
+  _initSortable : function(){
+    this.sortable = new Skyline.Sortable(this.element,{handle: "span.dragSection", clone: this._fakeSection, revert: true});
+    this.contentScroller = new Scroller(this.options.scrollParent);
+    this.sortable.addEvents({
+      "start" : function(){ this.contentScroller.start(); }.bind(this),
+      "stop" : function(){ this.contentScroller.stop(); this.contentScroller.detach(); }.bind(this),
+      "beforeDrop" : function(el){
+        if(ed = el.retrieve("skyline.editor")){
+          ed.element.setStyles({height: ed.editor.skyline_editor_height - 1, visibility: "hidden"});
+          ed.clear();
+        }              
+      },
+      "afterDrop" : function(el){
+        if(ed = el.retrieve("skyline.editor")){
+          ed.element.setStyles({height: 5, visibility: "visible"});
+          ed.render();
+        }                            
+      }
+    });    
+  },
+  _fakeSection : function(event,element,parent){
+    var section = element.getElement("div.section"), sectionSize, clone, tools;
+    sectionSize = section.getSize();
+
+    clone = new Element("li",{"class" : "clone"}).setStyles({
+      margin: '0px',
+      position: 'absolute',
+      visibility: 'hidden'
+    });
+    var es = clone.adopt(new Element("div",{"class" : "section"}).setStyles({"width": sectionSize.x, "height": sectionSize.y, opacity: 0.5}));
+    
+    if(tools = element.getElement("ul.sectiontools")){
+      clone.adopt(tools.clone(true));
+    }
+    
+    var op = element.getOffsetParent();
+    var p = element.getPosition(op);
+    var s = op.getScroll();
+    p.x = p.x + s.x;
+    p.y = p.y + s.y;    
+    return clone.inject(parent).setPosition(p);
+  }  
+});