Cambiar el puerto 80 [XAMPP]

Bienvenidos a un nuevo tutorial, hoy aprenderemos a modificar el puerto que trae por defecto al instalar el XAMPP.
Sin expandirnos mucho y resumiendo, cuando instalamos el XAMMP [hablamos del componente APACHE para ser exactos], el puerto por defecto que trae es el 80.
De ahi que siempre que leemos tutoriales nos encontramos que para que la web "se vea" debemos de abrir nuestro puerto 80 tanto en nuestro firewall/router



¿Qué sucede? , como a ya muchos de ustedes les explique, abrir el puerto 80 del firewall es una tarea sencilla y no puede tener mayores dificultades (De hecho en nuestro sitio tenemos varios tutoriales de como hacerlo en diferentes kerneles [Sistema operativos])
El problema de puerto 80 es cuando tenemos un router,
¿Por qué es un problema?
Porque la mayoria de los routers usan su intefaz en el puerto 80.
¿Qué es la interfaz del router?
La interfaz del router es el acceso "visible" que tenemos al ingresar o tipiar nuestra puerta de enlace en cualquier navegador.

Interfaz del router Dlink

¿Cómo puedo saber si mi intefaz del router está ocupando el puerto 80?
De una manera muy sencilla, ingresamos en nuestro navegador la IP pública. Aqui pueden suceder dos cosas:
a)Se muestra la interfaz
b)No se muestra la intefaz (Tampoco implica que no este usando el puerto 80, puede que lo este usando sólo que tenemos configurada la interfaz de ingreso LAN únicamente)

Es por eso, que les daré un consejo de seguridad que es totalmente básico, nunca dejen que muestre la intefaz del router en modo público, por que asi como vos accesas con tu ip pública, otro tambien podría hacerlo. Si a eso le sumamos que tenes una configuración por default en cuanto y tanto nos referimos a los datos de acceso, cualquier persona podrá controlar tu conección a gusto, y eso pueda ocasionarles muchísimos problemas, sobre todo, dejarnos sin internet tantas veces como uno quiera o aun cosas peores...

1)Volvamos un poco al tema principal, hablamos que; el puerto 80 entonces lo ocupa nuestro router, como hay una variedad muy amplia de routers en el mercado y variadas marcas no puedo darle la solución a cada uno de ustedes. Entonces les planteo dos posibles alternativas:
a)Leer el manual de su router y buscar la forma de modificar el acceso a la interfaz gráfica, de modo tal que podamos cambiarle el puerto 80 al router por cualquier otro (Dicha modificación puede realizarse por telnet, intefaz, etc)
b)Cambiar el puerto 80 del XAMMP de modo tal que accesamos a nuestra web por otro puerto, ejemplo por el 81
Entonces, lo que haremos será optar por la opción b)
Lo primero que haremos será ingresar a la ruta en donde hemos instalado nuestro XAMPP, mi caso es el siguiente:
C:\xampp\apache\conf
Dentro de la carpeta buscamos el archivo httpd.conf y lo abrimos con el bloc de notas.

Archivo httpd

2)Apretamos simultáneamente CONTROL+B y escribimos en cuadro de diálogo "80"

Buscando la palabra 80

3)Luego aprentamos enter y nos llevará al siguiente ejemplo:
#Listen 12.34.56.78:80
Justo debajo, donde dice Listen 80, modificamos ese 80 por el 81 (o el puerto que deseen)
Ahora volvemos apretar CONTROL+B y seleccionamos la opción "Siguiente", este nos llevará a: ServerName localhost:80 lo que haremos será modificar el 80 por el puerto que pusimos arriba en el paso 2)

Modificando el 80 por 81

4)Guardamos nuestro archivo junto a sus cambios y reiniciamos nuestro XAMPP (Apretamos en el boton Stop y luego en el boton Start, sino sabes como reiniciarlo, entonces reinicia tu pc)
Simplemente lo que haremos ahora, será verificar los cambios.

Verificando los cambios en el navegador

Observaciones finales: Si al ingresar su ip en el navegador no les funciona, es porque deben agregarle el :81, recuerden que como hemos modificado el puerto el mismo debe ser alterado para su ingreso.
Ejemplos:
Con no-ip: muonlinetutoriales.sytes.net:81
Con .com/net: muonlinetutoriales.com:81
Con ip lan: 192.168.1.32:81
Con localhost: localhost:81
Con ip pública: 201.14.157.11:81
Finalmente, debemos abrir el puerto 81 (o el que seleccionaron el paso número 3)tanto en nuestro firewall/router para que sea accesible fuera de nuestra RED (Si configuramos nuestro firewall por aplicación, no necesitan abrirlo, sólo configuran el router)

Dar resets al comenzar

Bienvenidos a un nuevo tutorial, hoy continuaremos con la segunda parte de dar puntos/resets a los personajes que recien comienzan.
En el anterior tutorial vimos dos formas diferentes de hacerlo con los puntos, ahora
veamos como hacerlo con los resets.



La tabla resets en muchas versiones es "ajena" al servidor (Mas que todo en versiones antiguas, y no tan antiguas...), lo que haremos será setear el valor por defecto de los resets desde el SQL.
Para esto haremos lo siguiente:
1)Ingresamos a nuestro SQL Server Enterprice Manager, buscamos la Base de Datos de MuOnline, luego buscamos en "Tablas" a la llamada "Character"

Tabla Character de la base de datos MuOnline

2)Hacemos un clic derecho sobre ella y seleccionamos la opción "Diseñar tabla"

Diseñando tabla character

3)Ahora, lo que haremos será buscar la columna llamada "Resets" y debajo, en donde dice "Valor predeterminado" modificamos el número por la cantidad de resets que queremos darle a un personaje cuando se inicia en nuestro servidor.
Por ejemplo: "5"

Modificando el valor predeterminado de la columna resets

4)Cuando nos pregunte si deseamos guardar los cambios en el SQL, seleccionamos la opción de "SI"

Aceptando el cuadro de diálogo para guardar los cambios

5)Finalmente, verificamos los cambios en el juego.

Verificando los cambios

Dar puntos al comenzar [WZ_CreateCharacter]

En el anterior tutorial vimos como agregar puntos a los personajes que recien comienzan. Ver Aqui
Como abran leido el procedure o procedimiento "CreateCharacter" no está presente en todas las bases de datos MuOnline, por lo que puede ser que nos encontremos en lugar de la mencionada con el procedimiento llamado WZ_CreateCharacter.



Entonces, si este es su caso deberás hacer lo siguiente:
1)Ingresamos al SQL Server Enterprice Manager y luego desplegamos las opciones de nuestra base de datos "MuOnline". En ella nos desplazamos hasta los procedimientos almacenados y del lado derecho buscamos el llamado "WZ_CreateCharacter"

Procedimiento createcharacter

2)Abrimos el procedimiento WZ_CreateCharacter (Nuevamente, es posible que tampoco lo encuentren con este nombre ni con el anterior, talvez lo encuentren con un nombre similar)

Accesando al procedimiento almacenado

3)Ahora nos desplazamos unas lineas hacia abajo, hasta encontranos con las instruciones "INSERT INTO", y continuando con la secuencia, modificamos el LevelUpPoint por el valor que deseamos darle a los personaje que se inician en el juego.

Modificando la variable LevelUpPoint

4)Recuerden nuevamente lo mencionado en el anterior tutorial, los valores deben se iguales en cuanto y tanto hablamos de la cantidad de tablas/valores sino, tendremos el siguiente error:

Error generado por la falta de datos

Lo que nos indica alli es que tenemos menos elementos que lo que vamos a insertar en las tablas, por lo cual produce una desconcordancia.

Dar puntos al comenzar

Bienvenidos a nuevo tutorial, hoy aprenderemos una alternativa a como dar puntos a los personajes que recien comienzan en el juego.
En el antiguo tutorial lo hemos hecho desde un JOB en SQL el cual funciona de una manera un poco "estructurada"
¿Qué quiere decir o a qué me refiero?, Al crear un Job o Sentencia SQL obliga a que cada personaje creado deba salir del juego para recibir el premio.
¿De qué forma podemos evitar eso?, simple; lo haremos modificando los valores del procedimiento encargado de crear el personaje dentro del juego.
Aclaración: Resets y Puntos son tablas totalmente diferentes que no tienen ninguna relación en sus valores (solo comparten coherencia), ya que muchos creen que agregarle a un personaje 2 o 3 resets implica que el personaje ya tenga puntos, stats , etc.
Pero, no, no es asi; un personaje puede tener 35 resets y cero stats, cero puntos para repartir. El punto de esto es que debemos tener bien claro que son tablas diferentes, resets son resets, puntos son puntos.
Terminada la explicación, vamos al tutorial.
1)Ingresamos al SQL Server Enterprice Manager y luego desplegamos las opciones de nuestra base de datos "MuOnline". En ella nos desplazamos hasta los procedimientos almacenados y del lado derecho buscamos el llamado "CreateCharacter" (No presente en todas las versiones y el nombre del proceso puede variar de acuerdo a la versión de MuOnline con la que estemos trabajando)

Ingresando al procedimiento almacenado CreateCharacter

2)Este procedimiento es el que se ejecuta a la hora de crear un personaje, es decir, que dicho procedure consta de 3 partes importantes:
a)Declaración de variables
b)Insertado de variables
c)Valores de variables

Variables del proceso

a)Declaración de variables:
@AccountID varchar(10),
@Name nvarchar(10),
@cLevel smallint,
@LevelUpPoint int,
@Class tinyint,
@Experience int,
@Strength int,
@Dexterity int,
@Vitality int,
@Energy int,
@Money int,
@Life real,
@MaxLife real,
@Mana real,
@MaxMana real,
@MapNumber smallint,
@MapPosX smallint,
@MapPosY smallint,
@MapDir tinyint
Alli lo que hacemos es simplemente @[tabla][tipo],
De esta forma, estamos declarando una variable a la cual le asociamos un tipo de datos.
Tomemos el primer ejemplo AccountID-varchar, lo que estamos haciendo es que dicha tabla "AccountID" recibirá valores de tipo "varchar"

b)Insertado de variables:
Con esta instrucción lo que hacemos es agregar dichas variables en sus campos de la tabla character. Es importante destacar que la instrucción es INSERT INTO y no INSERT INTO Character. Esta última hace referencia a la tabla en donde insertaremos dichos datos.

c)Valores de variables:
Es bastante intuitivo, son los valores que le asignaremos a cada variable.
Lo importante de esta combinación de variables+valores es que se debe de respetar ambas cantidades.
¿Qué significa eso?, que si tenemos algo asi:
INSERT INTO Character
(tabla1, tabla2, tabla3)
VALUES
(@tabla1, @tabla2,)
Tendremos un error similar al siguiente:

Error por falta de datos

3)Entonces, de acuerdo al tutorial, lo que haremos será configurar la parte C) para alterar los valores que enviaremos al crear un personaje.
No hará falta decir que tabla corresponde a cada stats porque eso ya lo hemos visto infinitas veces.
Entonces simplemente lo que haré en esta demostración es darle 2000 puntos para repartir a cualquier nuevo personaje creado en el servidor.
Para eso en la sección C) buscamos la variable @LevelUpPoint y la modificamos por el valor que deseamos tener como puntos adicionales al crear un personaje, por ejemplo "2000" de modo tal que nos quede algo similar a lo siguiente.

Modificación de la columna LevelUpPoint

Luego hacemos un clic en aceptar, iniciamos el servidor y verificamos los cambios dentro del juego

4)Finalmente, al crear un nuevo personaje dentro del juego, nos aparece con 2000 puntos para repartir.

Verificando los cambios dentro del juego

Adicionalmente algo que también podemos hacer es declarar una variable y asignarle un valor:
declare @Point int
set @Point=2000
Luego como "VALUES" colocamos el @point directamente, de esta forma tomaría el valor del set anterior.
¿Para qué hacer eso?, de repente se me ocurrio que a ese código podemos adicionarle algunos condicionales, por ejemplo dependiendo la raza del personaje podemos dar X puntos o inventar un mod. vip que adicione puntos de acuerdo a un ON/OFF, realmente esto es creatividad y podemos hacer infinitas cosas.
CreateCharacter.sql [1 kb]

Efecto de opacidad

Bienvenidos a un nuevo tutorial, hoy aprenderemos a aplicar un efecto muy sencillo, el cual se denomina "Efecto de opacidad"
Veamos un ejemplo para saber de que se trata:



¿Cúal es el efecto y cómo lograrlo?, uno muy simple y sencillo, al apoyar el mouse la imagen cambia de color, para lograrlo usamos la combinación de los eventos onmouseover y onmouseout.
1)Lo primero que vamos a necesitar serán dos imágenes, una será para el estado activo y la otra que será para el estado inactivo/descanso.



En mi caso particular, lo que hago es tomar una imagen en su estado natural, y quitarle la "Saturación" de la misma.
Para eso abrimos la imagen con el Photoshop => Imagen => Ajustes => Tono y saturación [Control+U]

Tono y saturación de imagen en photoshop

2)Ahora, lo que haremos será quitar la "Saturación" de la imagen.
Para eso deslizamos la barra hacia la izquierda (-100), de esta forma, la imagen tomará tonalidades de matices grises.
Luego hacemos un clic en "OK", y guardamos la imagen con el nombre que deseamos.

Modificando los valores de tonos y saturación

3)Nuestro siguiente paso será abrir el index.php de nuestra web (o en el archivo en el que desean agregar la imagen) y pegar el siguiente código:
<a href="https://muonlinetutoriales.com"><img src="Imagen1.jpg" onmouseover="this.src='Imagen2.jpg';" onmouseout="this.src='Imagen3.jpg';"/></a>
a) Imagen1.jpg: En imagen1.jpg agregaremos el link de la imagen que queremos que se muestre sin apoyar el mouse.
b) Imagen2.jpg: En imagen2.jpg agregamos el link de la imagen que queremos que se muestre cuando apoyamos el mouse sobre ella.
c) Imagen3.jpg: En imagen3.jpg agregamos el link de la imagen que queremos que se muestre cuando soltamos o quitamos el mouse sobre dicha imagen (Para generar el efecto inicial, aqui colocamos el mismo link que el de la imagen1.jpg)

4)Cargando las diferentes imágenes, nuestro trabajo quedaría similar al siguiente:
Para modificar el enlace lo hacemos directamente desde el código en la linea siguiente: "<a href="aqui_la_url...", si no quieren que la imagen genera un enlace, quitamos del código "<a href="aqui_la_url..." y el "</a>" final

Cabe mencionar que existen muchísimas formas de lograr efectos similares, por ejemplo con .css, con librerias Javascript, etc...
En próximos tutoriales veremos un ejemplo de como emplearlos.

WZ_WriteModifyLog [0.97D]

Bienvenidos a un nuevo tutorial, el siguiente procedimiento corresponde a la versión 0.97D del MuOnline y se titula WZ_WriteModifyLog

Procedimiento WriteLog
--www.muonlinetutoriales.com
--by asd*

CREATE PROCEDURE WZ_WriteModifyLog

@MngID varchar(10),
@AccID varchar(10),
@GameID varchar(10),
@Server int,
@ip varchar(17),
@type varchar(17),
@text varchar(100)


AS
begin
INSERT INTO MngModifyLog (ManagerID,AccountID,GameID,servernumber,IP,LogType,LogText) valueS (@MngID,@AccID,@GameID,@Server,@ip,@type,@text)
end


GO

WZ_WriteLog [0.97D]

Bienvenidos a un nuevo tutorial, el siguiente procedimiento corresponde a la versión 0.97D del MuOnline y se titula WZ_WriteLog

Procedimiento almacenado writelog
--www.muonlinetutoriales.com
--by asd*

CREATE procedure WZ_WriteLog

@uid varchar(10),
@uip varchar(16),
@ud int,
@ust varchar(100)

as
begin

INSERT INTO Mnglog (ID, IP, LogType, LogText) valueS (@uid, @uip,@ud,@ust)
end

GO

Configurar WebShop con variables

Bienvenidos a un nuevo tutorial, hoy aprenderemos a configurar nuestro WebShop con variables.
¿Qué significa eso y para que sirve?, muchos usuarios me consultan o nos envian mail`s a consultas@muonlinetutoriales.com sobre como modificar los precios de una WebShop sin necesidad de abrir cada .php que contiene la carpeta.
Una forma de hacerlo es trabajando con .php, de forma tal que creamos tantas variables como items en venta tengamos y le asignemos un valor.



Este valor "viajará" por .php con un simple llamado.
¿Qué nos permite esto y que ventajas tendremos?, este trabajo llevará un poco de tiempo pero lo que nos permitirá será modificar los valores de forma rápida y para aquellos que alojan su página web en un hosting web, esto le permitirá flexibilidad y eficacia a la hora de modificar cualquier precio.
1)Veamos un ejemplo más didáctico para entender mejor de que se trata todo esto, supongamos que tenemos un Webshop de estilo catálogo o muestrario como el siguiente:



2)Para modificar los valores o mejor dicho, para modificar los precios en esta webshop necesitamos editar el .php de cada sección [Sección DK, Sección ELFA, etc]
¿Qué sucede?, si tenemos alojado todo en un web hosting como habíamos dicho anteriormente, esto se transforma en un tema complicado, porque hay que descargar todos los .php editarlos y volver a subirlos nuevamente.
También para modificarlo requiere de al menos un software como Dreamweaver el cual nos permite tener una vista sobre la interfaz ya que desde un .txt nos podemos confundir al buscar los valores.
¿Qué podemos hacer?, simple, creamos tantas variables como items tengamos.
¿De qué forma?, de la siguiente forma, creamos un archivo .php llamado config y vamos a ir creando las variables y de igual modo asignamos un valor (el precio de venta). (Cuiden el nombre de las variables para evitar repeticiones)
<?
// Blade Knight //
$leather ="10,00";
$scale = "15,00";
$brass= "17,00";
$plate= "18,00"
?>
Webshop para muonline

3)Yo agregue 4 sets al azar, lo que esta con // son anotaciones para tener una organización. Lógicamente que ustedes deben completar todo el listado con todos los sets que tengan en venta.
Nuevamente, no pongan nombres de variables como $asdasd , porque luego no sabran a que items corresponde, pongan nombre en referencia al items que estan vendiendo.
Lo que haremos ahora, será ver como "imprimimos" esa variable.
Para eso necesitamos entrar al archivo .php de nuestra webshop, en este caso , para continuar con el ejemplo, necesito el archivo llamado dk.php [Contiene los valores de los sets de DK]
Una vez que lo abrimos, haremos un include al config.php para que podamos leer estas variables y asi poder imprimirlas, para hacer el include copiamos lo siguiente y lo pegamos en nuestro .php
<?php include('config.php');?>
Variables en dreamweaver

4)Nuestro útimo paso será imprimir la variable, ¿De qué forma? en el lugar en donde estaba el precio, hacemos un simple print o echo, la sintaxis sería la siguiente:
<? echo $leather ?>
Agregando include código php

5)Observen lo siguiente, ya no aparece más el precio como antes, sino que en su lugar aparece el símbolo "PHP",

Visualizando código php

6)Entonces para editar ahora los precios de nuestra webshop , no necesitamos más ingresar a dk.php, elfa.php etc..., sino que lo hacemos todo directamente desde el config.php, por ejemplo , para terminar modifiquemos el valor del set leather desde el config.php, guardemos los cambios y verifiquemos el WebShop

Visualizando variable impresa

Texto fusionado a una imagen

Bienvenidos a un nuevo tutorial, hoy trabajaremos con Photoshop, por entonces vamos a ver un tutorial en diseño.
¿De qué se trata?, simplemente lo que veremos hoy es como crear un texto fusionado a una imagen la cual contenga los datos de nuestro servidor.



Esta imagen la pueden usar como una intro, como un header o simple banner.
Lo que vamos a necesitar primero es la imagen con la que trabajarán, la imagen puede tener cualquier dimensión:
1)Abrimos el PS y cargamos la imagen (capa de fondo)

Imagen en photoshop

2)Seleccionamos la herramienta de "Réctangulo" => Capas de Forma => Rectángulo redondeado. (Podemos modificar los px del redondeado a gusto)
Luego mantenemos el clic derecho y aplicamos un rectángulo en donde deseamos

Cuadro sobre la imagen

3)Ahora lo que haremos será opacar un poco el cuadro para que contraste con nuestro fondo, para esto hacemos un clic derecho sobre la capa [Forma 1] y seteamos los valores a de acuerdo a nuestro gusto (Dependerá mucho de la gama de colores que tenga su imagen)

Configurando el estilo de capa

4)Finalmente con la herramienta de texto, agregamos una breve descripción con las características básicas de nuestro servidor:

Trabajo finalizado en photoshop

5)Finalmente guardamos la imagen con la extensión que necesitamos.

Visualizando trabajo terminado