bgBanner
Banner Banner aktuelles POTMaktuelles POTM letztes POTMletztes POTM vorletztes POTMvorletztes POTM Banner
left right right

You are not logged in.

Dear visitor, welcome to RPG Studio - Make your World real. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

Pace

Ankömmling

  • "Pace" started this thread

Motto: Lass dir nie von Jemandem einreden, dass du etwas nicht kannst. Denn wenn jemand etwas nicht kann, dann versucht er dir einzureden, dass du es auch nicht kannst. Und wenn du etwas willst, dann mach es einfach.

  • Send private message

1

Wednesday, January 3rd 2018, 5:36pm

Andere Pixi.js-Filter hinzufügen

Hallo zusammen,

hab mich etwas mit Pixi beschäftigt und gesehen, dass ein paar Filter bereitgestellt sind wie z.B. der BlurFilter.
All diese Filter sind problemlos nutzbar, nur hätte ich gerne weitere Filter, wie z.B. den OutlineFilter.
Pixi stellt diese online bereit GitHub - pixijs/pixi-filters: A collection of filters for pixi.js v4.
Hab allerdings keine Ahnung wie man die nun hinzufügen soll. Als einfaches Plugin funktioniert das nämlich leider schon mal gar nicht.
Muss ja aber irgendwie möglich sein.
Hat irgendjemand AHnung davon oder eine Idee, wie man das anstellt?

Besten Dank im Voraus :)

Playm

RPG Studio Webmaster

  • Send private message

2

Thursday, January 4th 2018, 6:23am

Interessante Frage.
Gute Morgen, was hast Du denn schon ausprobiert? Kannst Du mal deinen bisherigen Code zeigen? Das wäre super.

Ich habe mich auch mal drangesetzt, aber irgendwas klappt bei der Bestimmung der Randpixel nicht.

Spoiler: Plugincode: Filename OutlineFilter.js

JavaScript Source code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
"use strict";
//=============================================================================
// OutlineFilter.js
//=============================================================================
 
 /*:
 * @plugindesc This applies an outline effect to your Characters on Map.
 * @author mishaa (original shader code), Playm (mv plugin)
 * 
 * @param Thickness
 * @desc Outline tickness
 * @default 8
 * 
 * @help This plugin does not provide plugin commands. Not compatible with other filters.
 */
 
 /**
 * OutlineFilter, originally by mishaa
 * http://www.html5gamedevs.com/topic/10640-outline-a-sprite-change-certain-colors/?p=69966
 * http://codepen.io/mishaa/pen/emGNRB
 *
 * @class PIXI.OutlineFilter
 * @extends PIXI.AbstractFilter
 * @param {number} [thickness=1] The tickness of the outline. Make it 2 times more for resolution 2
 * @param {number} [color=0x000000] The color of the outline.
 * @param {number} [quality=0.1] The quality of the outline from `0` to `1`, using a higher quality
 *        setting will result in slower performance and more accuracy.
 *
 * @example
 *   someSprite.filters = [ new OutlineFilter(9, 0xFF0000, 0.2) ];
 */
PIXI.OutlineFilter = function( thickness, color, quality )
{
    // super class constructor
    PIXI.AbstractFilter.call( this );
 
    this.thickness = thickness;
    var samples =  Math.max(
        quality * PIXI.OutlineFilter.MAX_SAMPLES,
        PIXI.OutlineFilter.MIN_SAMPLES
    );
 
    this.passes = [this];
 
    // set the uniforms
    this.uniforms.thickness    = {type: '2fv', value: new Float32Array([0, 0])};
    this.uniforms.outlineColor = {type: '4fv', value: new Float32Array([0, 0, 0, 1])};
    // set uniform color
    this.color = color;
 
    // fragment shader code as lines (later compiled by PIXI)
    this.fragmentSrc = [
        'precision mediump float;',
        'varying vec2 vTextureCoord;',
        'uniform sampler2D uSampler;',
 
        'uniform vec2 thickness;',
        'uniform vec4 outlineColor;',
        'uniform vec4 filterClamp;',
 
        'const float DOUBLE_PI = 3.14159265358979323846264 * 2.;',
 
        'void main(void) {',
        '    vec4 ownColor = texture2D(uSampler, vTextureCoord);',
        '    vec4 curColor;',
        '    float maxAlpha = 0.;',
        '    vec2 displaced;',
        '    for (float angle = 0.; angle <= DOUBLE_PI; angle += ' + (Math.PI * 2 / samples).toFixed(7) + ') {',
        '        displaced.x = vTextureCoord.x + thickness.x * cos(angle);',
        '        displaced.y = vTextureCoord.y + thickness.y * sin(angle);',
        '        curColor = texture2D(uSampler, clamp(displaced, filterClamp.xy, filterClamp.zw));',
        '        maxAlpha = max(maxAlpha, curColor.a);',
        '    }',
        '    float resultAlpha = max(maxAlpha, ownColor.a);',
        '    gl_FragColor = vec4((ownColor.rgb + outlineColor.rgb * (1. - ownColor.a)) * resultAlpha, resultAlpha);',
        '}'
    ];
};
 
PIXI.OutlineFilter.prototype = Object.create( PIXI.AbstractFilter.prototype );
PIXI.OutlineFilter.prototype.constructor = PIXI.OutlineFilter;
 
PIXI.OutlineFilter.prototype.apply = function(filterManager, input, output, clear) {
	this.uniforms.thickness.value[0] = this.thickness / input.size.width;
	this.uniforms.thickness.value[1] = this.thickness / input.size.height;
 
	filterManager.applyFilter(this, input, output, clear);
}
/**
* The color of the glow.
* @member {number}
* @default 0x000000
*/
Object.defineProperty(PIXI.OutlineFilter.prototype, 'color', {
    get: function() {
        return this.rgb2hex(this.uniforms.outlineColor.value);
    },
    set: function(value) {
        this.hex2rgb(value, this.uniforms.outlineColor.value);
    }
});
 
PIXI.OutlineFilter.prototype.hex2rgb = function(hex, out)
{
    out = out || [];
 
    out[0] = ((hex >> 16) & 0xFF) / 255;
    out[1] = ((hex >> 8) & 0xFF) / 255;
    out[2] = (hex & 0xFF) / 255;
 
    return out;
};
PIXI.OutlineFilter.prototype.rgb2hex = function(rgb)
{
    return (((rgb[0] * 255) << 16) + ((rgb[1] * 255) << 8) + (rgb[2] * 255 | 0));
}
 
PIXI.OutlineFilter.MIN_SAMPLES = 1;
PIXI.OutlineFilter.MAX_SAMPLES = 100;
/* ********************************************************
 *   MV Plugin Stuff
 * ***************************************************** */
(function() {
    var parameters = PluginManager.parameters('OutlineFilter');
    var thickness = Number(parameters['Thickness'] || 8);
    var _Sprite_Character_initialize = Sprite_Character.prototype.initialize;
 
    Sprite_Character.prototype.initialize = function(character) {
        _Sprite_Character_initialize.call(this, character);
	this.filters = [ new PIXI.OutlineFilter(thickness, 0xFF0000, 0.8) ];
    };
})();
highlight to read


Wenn Du in meinem Code in Zeile 74 das "curColor.a" durch ein "0.4" ersetzt, siehst Du, das er tatsächlich die Outline zeichnen würde (hier erkennt er dann alle freien Pixel als Randpixel), aber bei der Bestimmung der Randpixel irgendwas nicht funktioniert. Ich habe aber eigentlich den FragmentShader so übernommen, wie er auf GitHub stand.

Das Problem ist der neue Shader an sich. Die für den MV bereits implementierten Shader: RGBSplitFilter, CrossHatchFilter, DotScreenFilter, ColorStepFilter, TwistFilter, SepiaFilter, InvertFilter, BlurFilter, PixelateFilter, DisplacementFilter, GrayFilter, ColorMatrixFilter und AlphaFilter sollten alle funktionieren. Habe einmal SepiaFilter ausprobiert und der hat problemlos geklappt.
Vielleicht haben noch andere Ideen. Das Problem mit GLSL-Code ist, dass er ja so wahnsinnig schwer zu debuggen ist. :-/

Pace

Ankömmling

  • "Pace" started this thread

Motto: Lass dir nie von Jemandem einreden, dass du etwas nicht kannst. Denn wenn jemand etwas nicht kann, dann versucht er dir einzureden, dass du es auch nicht kannst. Und wenn du etwas willst, dann mach es einfach.

  • Send private message

3

Friday, January 5th 2018, 4:39am

Also ich hab mal probiert den Code vom OutlineFilter direkt in die Pixi.js vom Maker einzusetzen und dementsprechend umzuformen wie die anderen schon vorhandenen Filter.
Und dann hab ich versucht mich im Internet schlau zu machen und hab den von mir umgeformten Code versucht in einer eigenen Plugin-js-Datei umzusetzen.
Das hat dann aber auch eher gar nicht geklappt. Zu viele Fehler, die ich nicht mehr zurückverfolgen konnte.

Spoiler

(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.PIXI = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){

/**
* OutlineFilter, originally by mishaa
* ?p=69966
* pixi outline shader<br>
* ![original](../tools/screenshots/dist/original.png)![filter](../tools/screenshots/dist/outline.png)
*
* @class
* @extends PIXI.Filter
* @memberof PIXI.filters
*
* @example
* someSprite.shader = new OutlineFilter(9, 0xFF0000);
*/

var OutlineFilter = function (_core$Filter) {
_inherits(OutlineFilter, _core$Filter);

/**
* @param {number} [thickness=1] The thickness of the outline. Make it 2 times more for resolution 2
* @param {number} The color of the outline
* @param {number} [quality=0.1] The quality of the outline from `0` to `1`, using a higher quality
* setting will result in slower performance and more accuracy.
*/

function OutlineFilter(thickness, color, quality) {
_classCallCheck(this, OutlineFilter);

var _this = _possibleConstructorReturn(this, _core$Filter.call(this));

const _samples = Math.max(quality * OutlineFilter.MAX_SAMPLES, OutlineFilter.MIN_SAMPLES);
const _angleStep = (Math.PI * 2 / _samples).toFixed(7);
super(vertex, fragment.replace(/\$\{_angleStep\}/, _angleStep));
_this.uniforms.thickness = new Float32Array([0, 0]);
/**
* The thickness of the outline.
* @member {number}
* @default 1
*/
_this.thickness = thickness || 1;
_this.uniforms.outlineColor = new Float32Array([0, 0, 0, 1]);
_this.color = color || 0x000000;
_this.quality = quality || 0.1;

return _this;
}

/**
* Applies the filter.
*
* @param {PIXI.FilterManager} filterManager - The manager.
* @param {PIXI.RenderTarget} input - The input target.
* @param {PIXI.RenderTarget} output - The output target.
* @param {PIXI.RenderTarget} clear - The clear target?
*/

OutlineFilter.prototype.apply = function apply(filterManager, input, output) { //,clear
this.uniforms.thickness[0] = this.thickness / input.size.width;
this.uniforms.thickness[1] = this.thickness / input.size.height;
filterManager.applyFilter(this, input, output); //,clear
};
/**
* The color of the outline.
* @member {number}
* @default 0x000000
*/
_createClass(OutlineFilter, [{
key: 'color',
get: function get() {
return PIXI.utils.rgb2hex(this.uniforms.outlineColor);
},
set: function set(value) {
PIXI.utils.hex2rgb(value, this.uniforms.outlineColor);
}
}, {

/**
* Sets the quality of outline.
*
* @member {number}
* @default 0.1
*/

key: 'quality',
get: function get() {
return this.quality;
},
set: function set(value) {
this.quality = value;
}
}]);
return OutlineFilter;
}(core.Filter);

/**
* The minimum number of samples for rendering outline.
* @static
* @member {number} MIN_SAMPLES
* @memberof PIXI.filters.OutlineFilter
* @default 1
*/
OutlineFilter.MIN_SAMPLES = 1;
/**
* The maximum number of samples for rendering outline.
* @static
* @member {number} MAX_SAMPLES
* @memberof PIXI.filters.OutlineFilter
* @default 100
*/
OutlineFilter.MAX_SAMPLES = 100;

exports.default = OutlineFilter;

},{}],16:[function(require,module,exports){ // "../../core":65,"path":25
//'use strict';

//exports.__esModule = true;



var _OutlineFilter = require('./outline/OutlineFilter');

Object.defineProperty(exports, 'OutlineFilter', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_OutlineFilter).default;
}
});

var _core = require('../../core');

var core = _interopRequireWildcard(_core);

var _path = require('path');

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }


},{"./outline/OutlineFilter":8}]},{},[16])(16)
});
highlight to read


Das ist jetzt der Code von meinem Plugin. So ähnlich hatte ichs halt ins Pixi.js eingefügt.
Das ist aber großer Käse ^^
Und als ich es noch etwas ordentlicher im Pixi.js drinstehen hatte, kam kein Fehler, aber der Maker hat bei Spielstart nie geladen. War also die ganze Zeit Blackscreen.
Keine Ahnung, ob das jetzt näher an oder weiter weg von der Lösung war

Aber dein Lösungsansatz sieht ja auch echt interessant aus und sieht im Gegensatz zu meinem auch überragend gut aus xD
Hast auf jeden Fall schon mal mehr Ahnung als ich, so viel wie du umgeschrieben hast.
Deinen Code kriege ich bei mir aber irgendwie auch gar nicht zum laufen.
Da kommen erstmal viele Warnungen, dass der AbstractFilter in Filter umbenannt wurde.
Und dann kommt ein Pixi.js Error wegen der Shader-Initialisierung.

Playm

RPG Studio Webmaster

  • Send private message

4

Friday, January 5th 2018, 5:52am

Der Code von dir ist ziemlich unübersichtlich. Kannst Du den nochmal mit [code][/code] tags drumherum posten, damit die Einrückungen nicht verloren gehen?
Mit [code=JavaScript]alert("Hallo Welt");[/code] bekommst Du noch Syntaxhighlighting dazu.

Quoted

Das ist jetzt der Code von meinem Plugin. So ähnlich hatte ichs halt ins Pixi.js eingefügt.
Falls dich das Thema Plugin an sich noch interessiert; ich habe in diesem Post mal erklärt, wie man sich eigene Plugins schreibt, die man dann im PluginManager verwenden kann: :folder-open: Tutorial-Bereich » Eigene Plugins erstellen

Quoted

Deinen Code kriege ich bei mir aber irgendwie auch gar nicht zum laufen.
Hast Du eine neue Datei "OutlineFilter.js" im Pluginordner angelegt (wichtig ist die Dateiendung .js und nicht etwa .txt) und dort den Quellcode reinkopiert?

Quoted

Da kommen erstmal viele Warnungen, dass der AbstractFilter in Filter umbenannt wurde.
Und dann kommt ein Pixi.js Error wegen der Shader-Initialisierung.
Oh, welche Pixi-Version hast Du denn? Bei mir steht im Header:

Source code

1
2
3
4
5
 * pixi.js - v2.2.10
 * Copyright (c) 2012-2014, Mat Groves
 * http://goodboydigital.com/
 *
 * Compiled: 2016-01-31

Aber ich habe den Maker auch nicht über Steam also vielleicht habe ich ein paar Updates verpasst und der MV benutzt inzwischen eine andere Pixi-Version? Was steht denn bei dir?

Pace

Ankömmling

  • "Pace" started this thread

Motto: Lass dir nie von Jemandem einreden, dass du etwas nicht kannst. Denn wenn jemand etwas nicht kann, dann versucht er dir einzureden, dass du es auch nicht kannst. Und wenn du etwas willst, dann mach es einfach.

  • Send private message

5

Friday, January 5th 2018, 2:14pm

Quoted

Der Code von dir ist ziemlich unübersichtlich. Kannst Du den nochmal mit code][/code tags drumherum posten, damit die Einrückungen nicht verloren gehen?
Mit code=JavaScript]alert("Hallo Welt");[/code bekommst Du noch Syntaxhighlighting dazu.

Jo stimmt, hatte ich vergessen. War schon lange nicht mehr hier aktiv^^


Hier nochmal der Code:
Spoiler

JavaScript Source code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.PIXI = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
 
/**
 * OutlineFilter, originally by mishaa
 * http://www.html5gamedevs.com/topic/10640-outline-a-sprite-change-certain-colors/?p=69966
 * http://codepen.io/mishaa/pen/emGNRB<br>
 * ![original](../tools/screenshots/dist/original.png)![filter](../tools/screenshots/dist/outline.png)
 *
 * @class
 * @extends PIXI.Filter
 * @memberof PIXI.filters
 *
 * @example
 *  someSprite.shader = new OutlineFilter(9, 0xFF0000);
 */
 
var OutlineFilter = function (_core$Filter) {
    _inherits(OutlineFilter, _core$Filter);
 
	/**
	 * @param {number} [thickness=1] The thickness of the outline. Make it 2 times more for resolution 2
	 * @param {number} [color=0x000000] The color of the outline
	 * @param {number} [quality=0.1] The quality of the outline from `0` to `1`, using a higher quality
	 *        setting will result in slower performance and more accuracy.
	 */
 
	function OutlineFilter(thickness, color, quality) {
		_classCallCheck(this, OutlineFilter);
 
		var _this = _possibleConstructorReturn(this, _core$Filter.call(this));
 
        const _samples = Math.max(quality * OutlineFilter.MAX_SAMPLES, OutlineFilter.MIN_SAMPLES);
        const _angleStep = (Math.PI * 2 / _samples).toFixed(7);
        super(vertex, fragment.replace(/\$\{_angleStep\}/, _angleStep));
        _this.uniforms.thickness = new Float32Array([0, 0]);
        /**
         * The thickness of the outline.
         * @member {number}
         * @default 1
         */
        _this.thickness = thickness || 1;
        _this.uniforms.outlineColor = new Float32Array([0, 0, 0, 1]);
        _this.color = color || 0x000000;
        _this.quality = quality || 0.1;
 
		return _this;
	}
 
	/**
     * Applies the filter.
     *
     * @param {PIXI.FilterManager} filterManager - The manager.
     * @param {PIXI.RenderTarget} input - The input target.
     * @param {PIXI.RenderTarget} output - The output target.
	 * @param {PIXI.RenderTarget} clear - The clear target?
     */
 
    OutlineFilter.prototype.apply = function apply(filterManager, input, output) { //,clear
        this.uniforms.thickness[0] = this.thickness / input.size.width;
        this.uniforms.thickness[1] = this.thickness / input.size.height;
        filterManager.applyFilter(this, input, output); //,clear
    };
    /**
     * The color of the outline.
     * @member {number}
     * @default 0x000000
     */
	_createClass(OutlineFilter, [{
		key: 'color',
		get: function get() {
			return PIXI.utils.rgb2hex(this.uniforms.outlineColor);
		},
		set: function set(value) {
			PIXI.utils.hex2rgb(value, this.uniforms.outlineColor);
		}
	}, {
 
		/**
         * Sets the quality of outline.
         *
         * @member {number}
         * @default 0.1
         */
 
		key: 'quality',
		get: function get() {
			return this.quality;
		},
		set: function set(value) {
			this.quality = value;
		}
	}]);
	return OutlineFilter;
}(core.Filter);
 
/**
 * The minimum number of samples for rendering outline.
 * @static
 * @member {number} MIN_SAMPLES
 * @memberof PIXI.filters.OutlineFilter
 * @default 1
 */
OutlineFilter.MIN_SAMPLES = 1;
/**
 * The maximum number of samples for rendering outline.
 * @static
 * @member {number} MAX_SAMPLES
 * @memberof PIXI.filters.OutlineFilter
 * @default 100
 */
OutlineFilter.MAX_SAMPLES = 100;
 
exports.default = OutlineFilter;
 
},{}],16:[function(require,module,exports){ // "../../core":65,"path":25
//'use strict';
 
//exports.__esModule = true;
 
 
 
var _OutlineFilter = require('./outline/OutlineFilter');
 
Object.defineProperty(exports, 'OutlineFilter', {
  enumerable: true,
  get: function get() {
    return _interopRequireDefault(_OutlineFilter).default;
  }
});
 
var _core = require('../../core');
 
var core = _interopRequireWildcard(_core);
 
var _path = require('path');
 
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
 
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
 
},{"./outline/OutlineFilter":8}]},{},[16])(16)
});
highlight to read

Der Code sieht im Übrigen nur so aus wie er aussieht, weil ich den Code von Github 1:1 übernommen habe und so wie die Filter im Pixi.js geschrieben sind ungefähr angepasst habe.



Quoted

Falls dich das Thema Plugin an sich noch interessiert; ich habe in diesem Post mal erklärt, wie man sich eigene Plugins schreibt, die man dann im PluginManager verwenden kann:

Vielen Dank für den Tipp, aber ich hab hab schon viele eigene, auch teils komplexe, Plugins geschrieben, die alle einwandfrei laufen. Kenn mich damit also bestens aus :)



Quoted

Hast Du eine neue Datei "OutlineFilter.js" im Pluginordner angelegt (wichtig ist die Dateiendung .js und nicht etwa .txt) und dort den Quellcode reinkopiert?

Das erklärt sich dann ja nun auch von selbst ;)
Aber der Name ist ja grundsätzlich egal.


Quoted

pixi.js - v2.2.10

Lol, ok das erklärt wahrscheinlich einiges. Die akutelle Pixi.js-Version vom MV ist 4.5.4

Playm

RPG Studio Webmaster

  • Send private message

6

Saturday, January 6th 2018, 5:24am

Quoted

Lol, ok das erklärt wahrscheinlich einiges. Die akutelle Pixi.js-Version vom MV ist 4.5.4

Bild


Hm, vielleicht sollte ich mal auf MV 1.5.0 updaten. :-x
Weißt Du, ob es möglich ist mehrere MV-Versionen paralell auf einem Computer zu betreiben, zwecks Pluginsupport?

Quoted

Der Code sieht im Übrigen nur so aus wie er aussieht, weil ich den Code von Github 1:1 übernommen habe und so wie die Filter im Pixi.js geschrieben sind ungefähr angepasst habe.
Hast Du anschließend nochmal Babel drüberlaufen lassen? Der Code sieht irgendwie komisch generiert aus.
Verlink mal die exakte Github-URL, woher der Code stammt. Ich glaube ich habe meinen aus einem anderen Branch geholt.

Und wenn Du dabei bist - kannst Du mal deine pixi.js (ohne Modifikationen) hier anhängen?

Quoted

Aber der Name ist ja grundsätzlich egal.
In RMMV Version 1.4 diente der Dateiname noch als Schlüssel für Plugin-Variablen (also wenn ich im Pluginmanager die Thickness einstellen wollte). Weiß nicht, ob das in neueren Makerversionen jetzt anders gelöst ist.

Pace

Ankömmling

  • "Pace" started this thread

Motto: Lass dir nie von Jemandem einreden, dass du etwas nicht kannst. Denn wenn jemand etwas nicht kann, dann versucht er dir einzureden, dass du es auch nicht kannst. Und wenn du etwas willst, dann mach es einfach.

  • Send private message

7

Thursday, January 11th 2018, 9:58pm

Ich wollte schon viel früher antworten, hatte aber Probleme mich auf RPG-Studio anzumelden. Aber jetzt geht's ja wieder :)


Quoted

Weißt Du, ob es möglich ist mehrere MV-Versionen paralell auf einem Computer zu betreiben, zwecks Pluginsupport?
Hab leider keine Ahnung.


Quoted

Hast Du anschließend nochmal Babel drüberlaufen lassen? Der Code sieht irgendwie komisch generiert aus.
Verlink mal die exakte Github-URL, woher der Code stammt. Ich glaube ich habe meinen aus einem anderen Branch geholt.

Und wenn Du dabei bist - kannst Du mal deine pixi.js (ohne Modifikationen) hier anhängen?
xD nein kein Babel.
Hier der Link zur OutlineFilter.js, die ich genutzt hab: OutlineFilter.js
Meine pixi.js ist angehängt. Da sollten keine Veränderungen enthalten sein.


Quoted

In RMMV Version 1.4 diente der Dateiname noch als Schlüssel für Plugin-Variablen (also wenn ich im Pluginmanager die Thickness einstellen wollte). Weiß nicht, ob das in neueren Makerversionen jetzt anders gelöst ist.
Also bei mir nicht. Hab schon von Anfang an meine Dateien benannt, wie ich wollte. Hab auf nichts geachtet, außer dass der Name für mich entsprechend Sinn macht.
Und auf Plugin-Variablen zuzugreifen hat ja nichts mit dem Dateinamen zu tun.
Du musst dafür einfach nur entsprechende Sachen in einen Kommentar am Anfang der Datei verfassen:
Spoiler

Source code

1
2
3
4
5
/*:
 * @param bespielVariable
 * @desc Dieser Parameter beeinflusst nichts.
 * @default 42
 */
highlight to read
Pace has attached the following file:
  • pixi.js (1.34 MB - 9 times downloaded - latest: Feb 20th 2019, 1:21pm)

Playm

RPG Studio Webmaster

  • Send private message

8

Thursday, January 11th 2018, 10:33pm

Quoted

hatte aber Probleme mich auf RPG-Studio anzumelden. Aber jetzt geht's ja wieder :)

Hab die Mail bekommen. :3

Quoted

Und auf Plugin-Variablen zuzugreifen hat ja nichts mit dem Dateinamen zu tun.
Du musst dafür einfach nur entsprechende Sachen in einen Kommentar am Anfang der Datei verfassen
Und wie greifst Du dann im Code auf diesen Parameter zu?

Quoted

Meine pixi.js ist angehängt.
Hm, ja die sieht schon ein bisschen anders aus. Vom kurzen Draufschauen, sollte sich der Filter-Code aber relativ einfach in 4.5-kompatible umschreiben lassen. Ich muss mal gucken, wann ich die Tage dafür Zeit finde.

Pace

Ankömmling

  • "Pace" started this thread

Motto: Lass dir nie von Jemandem einreden, dass du etwas nicht kannst. Denn wenn jemand etwas nicht kann, dann versucht er dir einzureden, dass du es auch nicht kannst. Und wenn du etwas willst, dann mach es einfach.

  • Send private message

9

Saturday, January 13th 2018, 11:55pm

Quoted

Hab die Mail bekommen. :3
Ohh, cool. Danke :)
Hab schon nicht mehr dran geglaubt, dass die Mail angekommen ist^^


Quoted

Und wie greifst Du dann im Code auf diesen Parameter zu?
Ah, jetzt weiß ich was du meinst, glaub ich.
Also so greifst du darauf zu:
Spoiler

JavaScript Source code

1
2
var parameters = PluginManager.parameters('BeispielName');
var beispielVariable = toNumber(parameters['beispielVariable'], 42);
highlight to read
In der ersten Zeile muss man den Namen der Datei hinschreiben. Also in dem Fall "BeispielName". Die Datei müsste dann dementsprechend "BeispielName.js" heißen. Aber dennoch kannst du die Datei ja benennen wie du willst, musst es dann nur in der Datei selbst passend umändern, falls du die Parametereingabe vom Maker nutzt.


Quoted

Hm, ja die sieht schon ein bisschen anders aus. Vom kurzen Draufschauen, sollte sich der Filter-Code aber relativ einfach in 4.5-kompatible umschreiben lassen. Ich muss mal gucken, wann ich die Tage dafür Zeit finde.
Ja, kein Stress. Ich hab Zeit :)
Danke schon mal herzlichst für deine Mühe.

Used tags

Filter, Pixi, Pixi.js, Plugin

Social bookmarks

bottom bottom bottom