Lively Kernel canvas
ImageMorph.subclass("philmaker.foundation.ImageMorph", { // consider allowing attach/upload an image
initialize: function($super, rectangle, imagePath) {
$super(rectangle, imagePath);
this.rawNode.style.setProperty('opacity', '0.3');
this.setFillOpacity(0.0);
}
});
Morph.subclass("philmaker.foundation.RatingMorph", { // be able to customize the number of stars/bounds: maybe initially 1-20 max
// do an overlay perhaps 5 of 10
openForDragAndDrop: false, // investigate inspection by turnover = or maybe a drawer sliding out
styleClass: [], // idea - allow partial fill
initialize: function($super) {
var rectangle = new Rectangle(400, 400, 400, 40);
$super(new lively.scene.Rectangle(rectangle)); // how to set/reset this after calling super?
this.setMaximum(10);
var color = Color.hsb(0.0, 0.0, 0.5);
this.setFill(color);
this.setFillOpacity(0.8);
this.shapeRoundEdgesBy(20);
var x = 10;
var y = 6;
var maximum = this.getMaximum();
for (var i = 0; i < maximum; i++) {
var ratingStarMorph = new philmaker.foundation.RatingStarMorph(this, i);
ratingStarMorph.setPosition(pt(x, y));
if (i < 5) {
ratingStarMorph.setLit(true);
}
this.addMorph(ratingStarMorph);
x = x + 38;
}
},
setMaximum : function(maximum) {
this.maximum = maximum;
},
getMaximum : function() {
return this.maximum;
},
setValue : function(value) {
this.value = value;
this.submorphs.forEach(function(submorph) {
if (submorph.index < value) {
submorph.setLit(true);
} else {
submorph.setLit(false);
}
});
},
getValue : function() {
return this.value;
},
reshape: Functions.Null
});
Morph.subclass("philmaker.foundation.RatingStarMorph", {
suppressHandles : true,
openForDragAndDrop : false,
styleClass : [],
initialize: function($super, ratingMorph, index) {
this.ratingMorph = ratingMorph;
this.index = index;
var vertices = this.createVertices(14, pt(0, 0), 180); // fixme: should this angle 180 instead be a fraction?
$super(new lively.scene.Polygon(vertices));
this.setLit(false);
},
createVertices : function(radius, center, startAngle) {
var vertices = [];
var verticeCount = 10;
for (var i = 0; i <= verticeCount; i++) {
var a = startAngle + (2 * Math.PI / verticeCount * i);
var p = Point.polar(radius, a);
if (i % 2 == 0) {
p = p.scaleBy(0.45);
}
vertices.push(p.addPt(center));
}
return vertices;
},
setLit : function(lit) {
this.lit = lit;
if (this.lit) {
this.setFill(Color.yellow);
} else {
this.setFill(Color.white);
}
},
isLit : function() {
return this.lit;
},
reshape: Functions.Null,
onMouseOver: function($super, evt) {
console.log("mouse over: " + this.index);
this.ratingMorph.setValue(this.index + 1);
}
});
Morph.subclass("philmaker.foundation.InstantiationWidget", { // simple text field for making classes - it should list history (or initially just use up and down)
// make sure to use ... ? what?
openForDragAndDrop: false, // also float inside a shiny black round rect - actually use green for GO
styleClass: [], // use the word make in the widget
suppressHandles : true,
// pre-populate the history
initialize: function($super) {
// still place where the hand is - try to start drag
var rectangle = new Rectangle(150, 10, 500, 26); // or at least place somewhere non-covered
$super(new lively.scene.Rectangle(rectangle));
this.initializeHistory();
var color = Color.hsb(0.0, 0.0, 0.5);
color = Color.rgb(51, 212, 103);
this.setFill(color);
this.setFillOpacity(0.8);
this.shapeRoundEdgesBy(13);
this.label = new TextMorph(new Rectangle(0, 0, 50, 30), 'Create:');
this.label.beLabel();
this.label.setFontSize(16);
this.label.setTextColor(Color.white);
this.label.setFillOpacity(0.0);
this.label.setStrokeOpacity(0.0);
this.addMorph(this.label);
this.instantiationTextMorph = new philmaker.foundation.InstantiationTextMorph(this);
this.addMorph(this.instantiationTextMorph);
this.shouldCycleHistory = false;
},
initializeTransientState: function($super) {
$super();
this.initializeHistory();
},
initializePersistentState: function($super, shape) {
$super(shape);
this.initializeHistory();
},
initializeHistory : function() {
this.history = [
'philmaker.playground.ImageMorph',
'philmaker.playground.RatingMorph',
'philmaker.foundation.InstantiationWidget',
'philmaker.playground.StickyNote',
'philmaker.playground.CodeNote'
];
this.historyIndex = 0;
},
nextHistoryItem : function() {
if (this.historyIndex < (this.history.length - 1)) {
this.historyIndex++;
this.instantiationTextMorph.setTextString(this.history[this.historyIndex]);
}
},
previousHistoryItem : function() {
if (this.historyIndex > 0) {
this.historyIndex--;
this.instantiationTextMorph.setTextString(this.history[this.historyIndex]);
}
},
isHistoryItem : function(string) {
if (this.history.indexOf(string) > -1) {
return true;
} else {
return false;
}
},
addHistoryItem : function(string) {
if (this.isHistoryItem(string)) {
this.removeHistoryItem(string);
}
this.history.unshift(string);
this.historyIndex = 0;
},
removeHistoryItem : function(string) {
var sReturn = string;
var index = this.history.indexOf(string);
if (index > -1) {
var string = this.history[index];
this.history.splice(index, 1);
sReturn = string;
} else {
sReturn = null;
}
return sReturn;
},
instantiateClass : function(string) {
try {
string = 'WorldMorph.currentWorld.addMorph(new ' + string + '());';
eval(string);
} catch (e) {
console.log('class instantiation failed');
console.log(e);
}
},
reshape: Functions.Null
});
TextMorph.subclass("philmaker.foundation.InstantiationTextMorph", { // also use autocomplete
openForDragAndDrop: false,
styleClass: [],
suppressHandles : true,
initialize: function($super, instantiationWidget) {
this.instantiationWidget = instantiationWidget;
var rectangle = new Rectangle(70, 5, 420, 20);
$super(rectangle, this.instantiationWidget.history[0]);
this.setStrokeOpacity(0.0);
this.setFillOpacity(0.0);
this.setTextColor(Color.white);
this.setFontSize(16);
if (false) {
this.hasKeyboardFocus = false;
this.beInputLine(50);
this.autoAccept = true;
}
this.focusHaloBorderWidth = 0;
this.applyStyle({
borderWidth : 0,
fill : null,
wrapStyle : lively.Text.WrapStyle.None,
fontSize : 16,
padding : Rectangle.inset(0)
});
},
onKeyDown: function($super, event) {
var key = event.getKeyCode() || event.charCode;
if (key == Event.KEY_DOWN) {
this.instantiationWidget.nextHistoryItem();
event.stop();
} else if (key == Event.KEY_UP) {
this.instantiationWidget.previousHistoryItem();
event.stop();
} else if (key == Event.KEY_RETURN) {
var text = this.textString;
this.instantiationWidget.addHistoryItem(text);
this.instantiationWidget.instantiateClass(text);
event.stop();
} else {
$super(event);
}
},
reshape: Functions.Null
});
Morph.subclass("philmaker.foundation.RunTextField", {
initialize: function($super) {
$super();
}
});
ScrollPane.subclass('philmaker.foundation.WorldScrollPane', { // and hand scroll, (eventually maybe zoom too)
});
Morph.subclass('philmaker.foundation.CaretEnhancement', { // double-click drag
});
Morph.subclass("philmaker.foundation.Calendar", { // when the calendar grows, it shows more months - weeks are continuous
// use the calendar or clock to schedule actions
initialize: function($super) { // be able to see when morphs where created - go back in time as well maybe (difficult)
// double-click on a day to zoom in to hours
$super(); // don't just make another calendar - reinvent calendars
}
});
LinkMorph.subclass('philmaker.foundation.LinkMorph', {
// this code has been archived
});
function startup(worldMorph) {
new philmaker.playground.WorldInitializer();
}
Object.subclass("philmaker.playground.WorldInitializer", {
initialize : function() { // actually should just be a button (for when transfering to wiki - don't want it to happen at startup)
console.log("WorldInitializer.initialize");
var worldMorph = WorldMorph.currentWorld;
worldMorph.addMorph(new philmaker.foundation.InstantiationWidget());
}
});
philmaker.foundation.ImageMorph.subclass("philmaker.playground.ImageMorph", {
initialize: function($super) {
var rectangle = new Rectangle(100, 100, 300, 250);
var imagePath = "http://farm4.static.flickr.com/3228/2601103409_9b2817c6bf_o.png";
$super(rectangle, imagePath);
this.rawNode.style.setProperty('opacity', '0.8');
this.setFillOpacity(0.0);
}
});
philmaker.foundation.RatingMorph.subclass("philmaker.playground.RatingMorph", {
initialize: function($super) {
$super();
this.setPosition(pt(200, 400));
}
});
ImageMorph.subclass("philmaker.playground.Button", { // first check out any existing button functionality
initialize: function($super) {
$super();
}
});
TextMorph.subclass("philmaker.playground.StickyNote", { // need to be able to detect system fonts or the system
// and also offer alternatives
initialize: function($super) {
var rectangle = new Rectangle(200, 200, 300, 10);
$super(rectangle);
this.setFill(Color.rgb(255, 254, 164));
this.setBorderColor(Color.rgb(255, 240, 146));
this.setBorderWidth(1);
this.setFillOpacity(1.0);
this.setStrokeOpacity(1.0);
this.setTextColor(Color.rgb(127, 62, 0));
this.setFontFamily('Marker Felt');
this.setFontSize(18);
this.focusHaloBorderWidth = 0;
this.rotateBy(-0.05);
var text = '';
text = text + 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, ';
text = text + 'sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ';
text = text + 'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ';
text = text + 'Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. ';
text = text + 'Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.';
this.textString = text;
},
});
TextMorph.subclass("philmaker.playground.CodeNote", { // need to be able to detect system fonts or the system
// and also offer alternatives
initialize: function($super) {
var rectangle = new Rectangle(220, 220, 300, 10);
$super(rectangle);
this.setFill(Color.hsb(0.0, 0.0, 0.9));
this.setBorderColor(Color.hsb(0.0, 0.0, 0.8));
this.setBorderWidth(1);
this.setFillOpacity(1.0);
this.setStrokeOpacity(1.0);
this.setTextColor(Color.hsb(0.0, 0.0, 0.0));
if (true) {
this.setFontFamily('Monaco');
this.setFontSize(10);
this.emphasizeBoldItalic({
style : ''
});
} else {
this.setFontFamily('Verdana');
this.setFontSize(10);
this.emphasizeBoldItalic({
style : 'bold'
});
}
this.focusHaloBorderWidth = 0;
var text = '';
text = text + "console.log('Let's all go to the lobby...');" + "\n";
text = text + "console.log('Let's all go to the lobby...');" + "\n";
text = text + "console.log('Let's all go to the lobby...');" + "\n";
this.textString = text;
},
});
Object.subclass("philmaker.playground.ScatterStaggerAction", {
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.TakeSnapshot", {
initialize: function($super) {
$super();
}
});
ImageMorph.subclass("philmaker.playground.FadingImage", {
initialize: function($super, rectangle, imagePath) {
$super(rectangle, imagePath);
// use stepping to make it fade in and out
this.rawNode.style.setProperty('opacity', '0.3');
this.setFillOpacity(0.0);
}
});
Morph.subclass("philmaker.playground.VortexMorph", {
initialize: function($super) {
$super();
// learn how to draw a swirl
}
});
Morph.subclass("philmaker.playground.MorphNavigator", { // however, not every morph supports selection - so maybe I can just flash lighlight
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.Behavior", {
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.EditPreambleAction", { // make sure to open the window big
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.ViewChangeSetAction", { // make sure to open the window big
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.LockUnlockSelection", {
initialize: function($super) {
$super();
}
});
Morph.subclass("philmaker.playground.ImageGallery", { // for search
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.BlogPage", {
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.BlogEntry", {
initialize: function($super) {
$super();
}
});
Object.subclass("philmaker.playground.OverrideSystemMethod", {
initialize: function($super) {
$super();
}
});
Morph.subclass("philmaker.playground.LayoutTrial", {
initialize: function($super) {
$super();
}
});
Morph.subclass("philmaker.playground.Star", {
initialize: function($super) {
$super();
}
});
Morph.subclass("philmaker.playground.Polygon", { // work on inner etched border
initialize: function($super) {
$super();
}
});
null
NEWIDEAS+Scriptwindowwithtoolbarwithrunbuttonandheaderfieldsforparameters+allowdirectinspectionofImageMorph:url,mask,size,etc+forImageMorphdemowouldbecooltointegrateFlickrorGoogleImagesearch+scripttorepositionasetofimages
-0.05
18
11
0
230
false
270
null
null
null
CURRENTINTERESTS+horizontallyandverticallyscrollingworlds-alsofixthedefaultworldsize-itcanbeannoyingwhendraggingandselecting+ImageMorphinspection(srcandlinkhref)+starratingswidget+opacity,clipping,masking+LInkMorphUI(vortexswirl)+buttons:expandtoastickynote(needscrollingandmaybetitlebar)
-0.049999999200753306
18
12
0
133
false
346
null
null
null
null
ISSUES+scalingandrotationneverrestoreinitiallyonreload+subworldsaredisappearingafterreloading(TypeError:Nullvalue)+wishthatmorphswoulddeselectwhenclickingworldbg+usabilityissue:after"publishworldas":shouldredirecttonewpage?maybe?+double-clickdragtextselectiontoaccumulatewords(veryimportanttome)+isSafarialwayscrashingwhenlinkingtoanewanddifferentworldpage?(nah:wasjustahunch)+improvebehaviorof"followthislink?"
-0.049999999200753306
18
15
0
311
true
311
null
null
null
null
null
SIMPLEPROJECTS+starratingswidget+stickiestitlebarandscrollbar(vertandhoriz:horizforcode)+page-likebehaviors(verticalscrolling,textlinks,rollovers+dynamicinspectors(notsimple)+horizontalandverticalworldscrolling(handcursordragging)
-0.049999999200753306
18
0
38
false
0