I am trying to create a blog using movie clips and textfields created using actionscript with the data being loaded from XML. I need this data to be scrollable. I looked at the Kirupa tutorial on how to make a scrolling movie clip but I haven’t been able to apply the code correctly. Please Help ;(
for (i=1; i<(total+1); i++) {
_root["thumbs_"+i]._visible = true;
}
roll._visible = false;
//
var made:Number;
//var row:Number;
//row = -1;
var curImg:Number;
curImg = 0;
var showAmount:Number;
showAmount = 4;
myXML = new XML();
myXML.ignoreWhite = true;
receiverXML = new XML();
myXML.onLoad = function(success) {
myXML.contentType = "text/xml";
if (success) {
if (made != 1) {
this.loadThumbs();
made = 1;
trace("thumbs");
}
} else {
trace("Error loading XML file");
}
};
myIdentifier = Math.round(Math.random()*10000);
myXML.load("blog.xml");
// add [?uniq="+myIdentifier] when on server to prevent cache
receiverXML.onLoad = function() {
this.contentType = "text/xml";
this.loadThumbs();
};
XML.prototype.loadThumbs = function() {
total = this.firstChild.childNodes.length;
_root.contentX.totalTxt.text = total;
titleX = [];
description = [];
date = [];
time = [];
var firstItem = 1;
if (curImg == 0) {
previous._visible = false;
}
var lastItem = (firstItem+showAmount);
if (lastItem<=0) {
lastItem = 0;
next._visible = false;
}
for (i=0; i<total; i++) {
titleX* = this.firstChild.childNodes*.childNodes[0].firstChild.nodeValue;
description* = this.firstChild.childNodes*.childNodes[1].firstChild.nodeValue;
date* = this.firstChild.childNodes*.childNodes[2].firstChild.nodeValue;
time* = this.firstChild.childNodes*.childNodes[3].firstChild.nodeValue;
}
for (i=firstItem; i<lastItem; i++) {
var thumbs:MovieClip = _root.createEmptyMovieClip("thumbs_"+i, _root.getNextHighestDepth());
thumbs.iIndex = i;
thumbs.createEmptyMovieClip("box"+i, thumbs.getNextHighestDepth());
thumbs.createEmptyMovieClip("mask", thumbs.getNextHighestDepth());
thumbs.createEmptyMovieClip("line"+i, thumbs.getNextHighestDepth());
thumbs.createTextField("item"+i, thumbs.getNextHighestDepth(), 0, 0, 480, 160);
thumbs.createTextField("info"+i, thumbs.getNextHighestDepth(), 0, 0, 480, 30);
thumbs.createTextField("date"+i, thumbs.getNextHighestDepth(), 0, 0, 480, 30);
thumbs["box"+i].beginFill(0x333333, 100);
thumbs["box"+i].moveTo(10, 0);
thumbs["box"+i].lineTo(620, 0);
thumbs["box"+i].lineTo(620, 180);
thumbs["box"+i].lineTo(0, 180);
thumbs["box"+i].lineTo(0, 0);
thumbs["box"+i].endFill();
thumbs["box"+i]._y = ((i-1)%4*190)+108;
thumbs["box"+i]._x = 118;
thumbs.mask.beginFill(0xFFFFFFF, 10);
thumbs.mask.moveTo(10, 0);
thumbs.mask.lineTo(635, 0);
thumbs.mask.lineTo(635, 485);
thumbs.mask.lineTo(0, 485);
thumbs.mask.lineTo(0, 0);
thumbs.mask.endFill();
thumbs.mask._x = 108;
thumbs.mask._y = 99;
thumbs["line"+i].lineStyle(1, 0x666666);
thumbs["line"+i].lineTo(0, 160);
thumbs["line"+i]._x = (thumbs["box"+i]._x+500);
thumbs["line"+i]._y = thumbs["box"+i]._y+10;
thumbs.swapDepths(_root.transition);
thumbs["item"+i]._x = (thumbs["box"+i]._x+10);
thumbs["item"+i]._y = (thumbs["box"+i]._y+10);
thumbs["item"+i].html = true;
thumbs["item"+i].multiline = true;
thumbs["item"+i].htmlText = "<font face='Helvetica CY' size='18' color='#999999'>"+titleX[(i-1)]+"</font><br><br>";
thumbs["item"+i].htmlText += "<font face='Helvetica CY' size='15' color='#FFFFFF'>"+description[(i-1)]+"</font>";
//
thumbs["info"+i]._x = (thumbs["box"+i]._x+10);
thumbs["info"+i]._y = (thumbs["box"+i]._y+160);
thumbs["info"+i].html = true;
thumbs["info"+i].htmlText = "<font face='Helvetica CY' size='11' color='#999999'>"+time[(i-1)]+"</font>";
//
thumbs["date"+i]._x = (thumbs["box"+i]._x+510);
thumbs["date"+i]._y = (thumbs["box"+i]._y+10);
thumbs["date"+i].html = true;
thumbs["date"+i].htmlText = "<font face='Helvetica CY' size='11' color='#999999'>"+date[(i-1)]+"</font>";
//
thumbs.setMask(thumbs.mask);
//
scrolling = function (easing) {
var moveSpeed:Number = 1;
var easingSpeed:Number = 7;
var scrollHeight:Number = scrollbg._height;
// how much of the movie can be scrolled
var scrollable:Number = thumbs._height-thumbs.mask._height;
var initContentPos:Number = thumbs._y;
// the drag positions that are possible for the dragger
var left:Number = scrollbg._x;
var top:Number = scrollbg._y;
var right:Number = scrollbg._x;
var bottom:Number = scrollbg._height-dragger._height+scrollbg._y;
var mouseListener:Object = new Object();
var scrollWheelSpeed:Number = 20;
// before we do anything make sure the content is even scrollable, if it isn't hide everything and return
if (scrollable<0) {
dragger._visible = false;
scrollbg._alpha = 50;
return;
}
scrollbg.useHandCursor = dragger.useHandCursor=false;
// Updates the contents position
function updateContentPos() {
var percent_scrolled:Number = (dragger._y-top)/(scrollHeight-dragger._height);
// instead of setting the _y property directly, we simple set newY
// that way we can adjust how we handle the new Y coordinate we'd like to move to
thumbs.newY = Math.round(initContentPos-(percent_scrolled*scrollable));
}
// here we will just always adjust to the position that we would like to move to..
thumbs.onEnterFrame = function() {
if (!easing || easing == undefined) {
this._y = this.newY;
} else {
this._y += Math.round((this.newY-this._y)/easingSpeed);
}
};
scrollbg.onPress = function() {
if (this._parent._ymouse>this._y+this._height-dragger._height) {
dragger._y = this._parent._ymouse;
dragger._y = this._y+this._height-dragger._height;
} else {
dragger._y = this._parent._ymouse;
}
updateContentPos();
};
dragger.onPress = function() {
startDrag(this, false, left, top, right, bottom);
this.onMouseMove = function() {
updateContentPos();
updateAfterEvent();
};
};
dragger.onMouseUp = function() {
stopDrag();
delete this.onMouseMove;
};
// Create onMouseWheel function
mouseListener.onMouseWheel = function(delta:Number):Void {
var d:Number;
if (delta>1) {
delta = 1;
}
if (delta<-1) {
delta = -1;
}
d = -delta*scrollWheelSpeed;
trace(d);
if (d>0) {
dragger._y = Math.min(bottom, dragger._y+d);
}
if (d<0) {
dragger._y = Math.max(top, dragger._y+d);
}
updateContentPos();
};
// makes the first update to scroll in case the user offset the dragger
updateContentPos();
// Registering the listener
Mouse.addListener(mouseListener);
};
}scrolling();
};
prevGalBu.onRollOver = function() {
this.gotoAndPlay(2);
};
prevGalBu.onRollOut = function() {
this.gotoAndPlay(6);
};
nextGalBu.onRollOver = function() {
this.gotoAndPlay(2);
};
nextGalBu.onRollOut = function() {
this.gotoAndPlay(6);
};
